@charset "utf-8";
/* CSS Document */
/* color */
body,.txt_color_nomal{color: #232323;}
.txt_white{color: white;}
.txt_red{color: red;}
.txt_color1{color: #e89802} /* メインカラー */
.txt_color2{color: #FAF0E6} /* サブカラー */
.txt_color3{color: #FAF0E6} /* アクセントカラー1 */
.txt_color4{color: #e4e4e4} /* アクセントカラー2 */

/* background-color */
.bg_white{background-color: white} /* 白背景 */
.bg_black{background-color: black} /* 黒背景 */
.bg_color1{background-color: #A4C6FF} /* メインカラー */
.bg_color2{background-color: #FAF0E6} /* サブカラー */
.bg_color3{background-color: #FAF0E6} /* アクセントカラー1 */
.bg_color4{background-color: #e4e4e4} /* アクセントカラー2 */

.bg_color_clear{background-color: transparent!important}


/* border-color ※!important */
.border_color1{border-color: #4ae}
.border_color2{border-color: #d4baa1}
.border_color3{border-color: #f6f4eb}
.border_color4{border-color: #e4e4e4}


/* hover ---------------------------------------------------------------------------------------------*/
/* color */
.hvr_txt_color_nomal:hover{color: #232323;}
.hvr_txt_white:hover{color: white;}
.hvr_txt_red:hover{color: red;}
.hvr_txt_color1:hover{color: #4ae} /* メインカラー */
.hvr_txt_color2:hover{color: #d4baa1} /* サブカラー */
.hvr_txt_color3:hover{color: #f6f4eb} /* アクセントカラー1 */
.hvr_txt_color4:hover{color: #e4e4e4} /* アクセントカラー2 */

/* background-color */
.hvr_bg_white:hover{background-color: white} /* 白背景 */
.hvr_bg_black:hover{background-color: black} /* 黒背景 */
.hvr_bg_color1:hover{background-color: #4ae} /* メインカラー */
.hvr_bg_color2:hover{background-color: #d4baa1} /* サブカラー */
.hvr_bg_color3:hover{background-color: #f6f4eb} /* アクセントカラー1 */
.hvr_bg_color4:hover{background-color: #e4e4e4} /* アクセントカラー2 */

.hvr_bg_color_clear:hover{background-color: transparent!important}


/* border-color ※!important */
.hvr_border_color1:hover{border-color: #4ae}
.hvr_border_color2:hover{border-color: #d4baa1}
.hvr_border_color3:hover{border-color: #f6f4eb}
.hvr_border_color4:hover{border-color: #e4e4e4}


#foot_banner {
    font-size: 16px;
    text-align: center;
    padding-top: 33px;
    box-sizing: border-box;
    max-width: 287px;
    z-index: 1;
    bottom: 5px;
    right: 190px;
    width: 29%;
    top: 89%;
}

.sample1 {
    vertical-align: bottom;
    width: 21%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 4;
    /* right: -140%; */
    left: 80%;
    top: 24%;
    background-repeat: no-repeat;
}

.sample2{
    vertical-align: bottom;
    width: 21%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 4;
    /* right: -140%; */
    left: 7%;
    top: 83%;
    background-repeat: no-repeat;
}

#attach h2{
    font-family: 'Kiwi Maru';
    font-weight: bold;
}

#page-top {
    background-color: #e89802;
}

.catch {
    z-index: 4;
    bottom: -4%;
    right: 13%;
    width: 40%;
    max-width: 500px;
    filter: drop-shadow(1px 3px 0px rgba(255,255,255,0.5));
}

@media screen and (max-width: 375px){
.catch {
    z-index: 4;
    bottom: -4%;
    right: 2%;
    width: 69%;
    max-width: 500px;
    filter: drop-shadow(1px 3px 0px rgba(255,255,255,0.5));
}
    
.sample1 {
    vertical-align: bottom;
    width: 21%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 4;
    /* right: -140%; */
    left: 80%;
    top: 14%;
    background-repeat: no-repeat;
}
.sample2 {
    vertical-align: bottom;
    width: 21%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 4;
    /* right: -140%; */
    left: 7%;
    top: 78%;
    background-repeat: no-repeat;
} 

h1 img{
    display: none;
}

.rogo3_sp{
    width: 111px;
}

.fixbnr {
    z-index: 2;
    right: 89px;
    bottom: 48px;
    width: 150px;
}
    
}

@media screen and (max-width: 414px){
.catch {
    z-index: 4;
    bottom: -4%;
    right: 2%;
    width: 69%;
    max-width: 500px;
    filter: drop-shadow(1px 3px 0px rgba(255,255,255,0.5));
}

.sample1 {
    vertical-align: bottom;
    width: 21%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 4;
    /* right: -140%; */
    left: 80%;
    top: 14%;
    background-repeat: no-repeat;
}

.sample2 {
    vertical-align: bottom;
    width: 21%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 4;
    /* right: -140%; */
    left: 7%;
    top: 79%;
    background-repeat: no-repeat;
}

h1 img{
    display: none;
}

 .rogo3_sp{
    width: 111px;
}

}

@media screen and (max-width: 820px){
    .rogo3_sp{
   display: none;
}
    
    
.sample2 {
    vertical-align: bottom;
    width: 21%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 4;
    /* right: -140%; */
    left: 7%;
    top: 78%;
    background-repeat: no-repeat;
}

.sample1 {
    vertical-align: bottom;
    width: 21%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 4;
    /* right: -140%; */
    left: 80%;
    top: 4%;
    background-repeat: no-repeat;
}



}

#mainwrap{
    background-color: #e6f0ff;
} 

.linkStyle{
    color:#c52e8f;
}

.fixbnr {
    z-index: 2;
    right: 89px;
    bottom: 2px;
    width: 150px;
}

#page03 #cms_6-a .box_item{
    padding-left: 50px;
}
#page03 #cms_6-a .box_item.pd-l_clear {
    padding-left: 0px;
}
@media screen and (max-width: 414px){

    
.sample2 {
    vertical-align: bottom;
    width: 21%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 4;
    /* right: -140%; */
    left: 7%;
    top: 79%;
    background-repeat: no-repeat;
}
.fixbnr {
    z-index: 2;
    right: 89px;
    bottom: 2px;
    width: 123px;
}

.sample1 {
    
    top: 4%;
   
}

}

@media screen and (max-width: 375px){

.sample2 {
    vertical-align: bottom;
    width: 21%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 4;
    /* right: -140%; */
    left: 7%;
    top: 78%;
    background-repeat: no-repeat;
}
.fixbnr {
    z-index: 2;
    right: 89px;
    bottom: 2px;
    width: 123px;
}
}

.menu_stick {
    color: #d4baa1;
}

.QR {
    width: 60%;
    /* z-index: 3; */
    /* padding-top: 0%; */
}

@media screen and (max-width: 375px){
.QR{
    padding-left: 19%;
}}

@media screen and (max-width: 414px){
.QR{
    padding-left: 20%;
}}

#page03 .box_title1 {
    font-size: 24px;
}



@media screen and (max-width: 667px){
#page03 .box_title1 {
    font-size: 14px;
}

}

#page03 p{
    font-size: 18px;
}

@media screen and (max-width: 667px){
    
#page03 p {
    font-size: 14px;
}
#page03 #cms_6-a .box_item {
    padding-left: 0px;
}    
       
}

.info_txt_wrap .txt_color1 {
    font-size: 40px;
}

.footer_txt  {
    margin-bottom: -4px;
}

.info_txt_wrap {
    margin-top: 0px;
    margin-bottom: 3px;
}

#page03 .cate_box {
    /*text-align: center;*/
}

#page03 h3 {
    background-color: #4ae;
}

@media screen and (max-width: 667px){
#page03 p {
    font-size: 12px;
}}

/* PC */
.icon1{
    vertical-align: bottom;
    width: 7%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 62%;
    /* left: -17%; */
    top: 102vh;
    background-repeat: no-repeat;
}

.icon2 {
    vertical-align: bottom;
    width: 7%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 62%;
    /* left: -17%; */
    top: 130vh;
    background-repeat: no-repeat;
}

.icon3 {
    vertical-align: bottom;
    width: 7%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 62%;
    /* left: -17%; */
    top: 152vh;
    background-repeat: no-repeat;
}

.icon4 {
    vertical-align: bottom;
    width: 7%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 62%;
    /* left: -17%; */
    top: 171vh;
    background-repeat: no-repeat;
}

.icon5{
    vertical-align: bottom;
    width: 7%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 62%;
    /* left: -17%; */
    top: 190vh;
    background-repeat: no-repeat;
}

.icon6 {
    vertical-align: bottom;
    width: 7%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 62%;
    /* left: -17%; */
    top: 212vh;
    background-repeat: no-repeat;
}

#cms_6-a .pd_20px {
    padding: 28px;
}


@media screen and (max-width: 768px){

    
    
.icon1{
    vertical-align: bottom;
    width: 18%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 72%;
    /* left: -17%; */
    top: 86vh;
    background-repeat: no-repeat;
}

.icon2 {
    vertical-align: bottom;
    width: 18%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 72%;
    /* left: -17%; */
    top: 111vh;
    background-repeat: no-repeat;
}

.icon3 {
    vertical-align: bottom;
    width: 18%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 72%;
    /* left: -17%; */
    top: 132vh;
    background-repeat: no-repeat;
}

.icon4 {
    vertical-align: bottom;
    width: 18%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 72%;
    /* left: -17%; */
    top: 150vh;
    background-repeat: no-repeat;
}

.icon5 {
    vertical-align: bottom;
    width: 18%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 72%;
    /* left: -17%; */
    top: 167vh;
    background-repeat: no-repeat;
}

.icon6{
    vertical-align: bottom;
    width: 18%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 72%;
    /* left: -17%; */
    top: 189vh;
    background-repeat: no-repeat;
}

#cms_6-a .width_80per {
    padding-left: 39px;
}

}

















@media screen and (max-width: 667px){
#page03 p {
    font-size: 11px;
}
    
 .icon1 {
    vertical-align: bottom;
    width: 17%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 72%;
    /* left: -17%; */
    top: 102vh;
    background-repeat: no-repeat;
}

.icon2 {
    vertical-align: bottom;
    width: 17%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 72%;
    /* left: -17%; */
    top: 128vh;
    background-repeat: no-repeat;
}

.icon3  {
    vertical-align: bottom;
    width: 17%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 72%;
    /* left: -17%; */
    top: 155vh;
    background-repeat: no-repeat;
}

.icon4  {
    vertical-align: bottom;
    width: 17%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 72%;
    /* left: -17%; */
    top: 176vh;
    background-repeat: no-repeat;
}

.icon5  {
    vertical-align: bottom;
    width: 17%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 72%;
    /* left: -17%; */
    top: 198vh;
    background-repeat: no-repeat;
}

.icon6 {
    vertical-align: bottom;
    width: 18%;
    height: auto;
    position: relative;
    position: absolute;
    z-index: 1;
    right: 72%;
    /* left: -17%; */
    top: 235vh;
    background-repeat: no-repeat;
}
#cms_6-a .width_80per {
    padding-left: 2px;
    text-align: center;
}

#cms_6-a #cate1 .pd_20px {
    padding: 7px;
}

#cms_6-a #cate0 .pd_20px {
    padding: 23px;
}

}

/*.width_80per {*/
/*    padding-left: 80px;*/
/*}*/