@charset "utf-8";
abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{margin: 0;padding: 0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:0 0}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}a{margin: 0;padding: 0;font-size:100%;vertical-align:baseline;background:0 0}ins{background-color:#ff9;color:#000;text-decoration:none}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:700}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}li{list-style:none}img{vertical-align:bottom;flex-shrink:0;margin: 0;padding: 0;line-height:1}ul{list-style-type:none;margin-block-start:0;margin-block-end:0;margin-inline-start:0;margin-inline-end:0;padding-inline-start:0}
input:-webkit-autofill, input:-webkit-autofill:active, input:-webkit-autofill:focus, input:-webkit-autofill:hover {animation-name: onAutoFillStart;transition: background-color 50ms ease-in-out 0;background:#fff;}
input:-internal-autofill-selected {background:#fff;}
button, input, select, textarea {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background: transparent;
border: 0;
border-radius: 0;
font: inherit;
outline:0;
}
textarea {resize:vertical}
button, input[type=button], input[type=submit], label, select {cursor:pointer}
select::-ms-expand {display:none}
form{
padding: 0;
margin: 0;
border: 0;
outline: 0;
display: -webkit-flex;
display: flex;
flex-wrap:wrap;
}
input[type=text] {vertical-align:center}
button, input[type=submit] {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border: 0;
outline:0;
margin: 0;
padding: 0;
}
input[type=submit] {-webkit-appearance: none;border-radius:0;}
html{margin: 0;padding: 0;background:#fff;}
h1, h2, h3, h4, h5, h5, h6{font-weight: normal;}
a{text-decoration: none;}
a:visited{text-decoration: none;}
a:hover{text-decoration: none;}
body {
width: 100%;
overflow-x: hidden;
margin: 0;
padding: 0;
font-family:"Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif;
/*DNP Shuei Gothic Kin Std*/
font-family: dnp-shuei-gothic-kin-std, sans-serif;
font-weight: 500;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
font-size: 16px;
color:#404040;
-moz-font-feature-settings: "pkna" 1;
-webkit-font-feature-settings: "pkna" 1;
font-feature-settings: "pkna" 1;
letter-spacing: 0.0em;
line-break: strict;
overflow-wrap: break-word;
word-wrap: break-word;
overflow-x: hidden;
-webkit-text-size-adjust: 100%;
}

#trig_sp_zentai{
width: 100%;
height: 1px;
}



/*ロゴ　any FAM x iSU COORING*/
.logo_double {
position: fixed;
z-index: 9999;
bottom: 0;
left: 0;
opacity: 1;
}





/*フォント指定*/
.FMJ_SHITEI{
/*DNP Shuei Gothic Kin Std Regular*/
font-family: dnp-shuei-gothic-kin-std, sans-serif;
font-weight: 500;
font-style: normal;


/*DNP Shuei Gothic Kin Std BOLD*/
font-family: dnp-shuei-gothic-kin-std, sans-serif;
font-weight: 600;
font-style: normal;

/*Omnes Narrow Regular*/
font-family: omnes-narrow, sans-serif;
font-weight: 400;
font-style: normal;
}


.fmj-text-slow{
position: relative;
display: block;
transition: all 2.5s ease;
-webkit-transition: all 2.5s ease;
}



#trig01, #trig02, #trig03, #trig04, #trig05, #trig06, #trig07, #trig08, #trig09{
position: relative;
z-index: 3;
width: 100%;
margin: 0;
padding: 0;
height: auto;
background: #fff;
}

::selection{
color: #fff;
background: #ccb2d3;
}


#trig01 img, #trig02 img, #trig03 img, #trig04 img, #trig05 img, #trig06 img, #trig07 img, #trig08 img, #trig09 img{
user-select: none;
-webkit-touch-callout: none; /* iOS Safari */
-webkit-user-select: none; /* Safari */
}




.pc_show{
display: none;
}

.sp_show{
display: inline-block;
}



/*320px以上*/
.sp_small_show{
display: none;
}
/*320px以下*/
@media screen and (max-width:320px) {
.sp_small_show{
display: inline-block;
}
}





/*sp*/
.nav_right_pc{
display: block;
visibility: visible;
opacity: 0;
position: fixed;
bottom: 10px;
right: 10px;
margin: 0;
z-index: 3;
width: calc( 100vw - 20px );
width: -webkit-calc( 100vw - 20px );
height: 40px;
text-align: left;
}

.nav_right_pc .bg_color{
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%;
background: #f6f0f7;/*f7e7e7*//*f6f0f7*/
opacity: 1.0;
z-index: 1;
border-radius: 20px;
}

.nav_right_pc ul{
position: relative;
z-index: 2;
margin: 0 auto;
text-align: center;
height: 40px;
/*全体 */
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
}

.nav_right_pc ul li{
position: relative;
flex-grow: 1;
margin: 8px 0px 0 0px;
/*Omnes Narrow Regular*/
font-size: 12px;
font-family: "omnes-narrow", sans-serif;
font-weight: 400;
font-style: normal;
text-align: center;
}



/*選択時*/
.nav_right_pc ul li.selected a{
color: #000;
}



/*01*/
.nav_right_pc ul li:first-child::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #e5b9d1;

opacity: 0;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}

.nav_right_pc ul li:first-child.selected::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #e5b9d1;

opacity: 1;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}



/*02*/
.nav_right_pc ul li:nth-child(2)::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #a8a3c6;

opacity: 0;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}


.nav_right_pc ul li:nth-child(2).selected::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #a8a3c6;

opacity: 1;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}




/*03*/
.nav_right_pc ul li:nth-child(3)::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #77c7e0;

opacity: 0;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}

.nav_right_pc ul li:nth-child(3).selected::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #77c7e0;

opacity: 1;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}




/*04*/
.nav_right_pc ul li:nth-child(4)::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #ffd542;

opacity: 0;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}


.nav_right_pc ul li:nth-child(4).selected::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #ffd542;

opacity: 1;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}



/*05*/
.nav_right_pc ul li:nth-child(5)::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #7dd389;

opacity: 0;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}

.nav_right_pc ul li:nth-child(5).selected::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #7dd389;

opacity: 1;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}





.nav_right_pc ul li a{
color: #686868;
}

.nav_right_pc ul li .japanese a{
color: #686868;
}


.nav_right_pc ul li .japanese{
margin: 4px 0 0 0;
font-size: 9px;
/*DNP ShueiGoKinStd M*/
font-family: "dnp-shuei-gothic-kin-std", sans-serif;
font-weight: 500;
font-style: normal;
}

#wrapper{
position: relative;
width: 100%;
overflow-x: hidden;
}


/*重要*/
.wrapper{
position: relative;
width: 100%;
overflow-x: hidden;
overflow: hidden;
user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none; /* リンク長押しのポップアップを無効化 */
-webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
padding: 0;
margin: 0;
}






/*ファーストビュー*/
/*グラデ*/
#grad{
position: relative;
z-index: 100;
width: 100%;
height: calc( 85vh + 6vw );
height: -webkit-calc( 85vh + 6vw );
height: calc( 85svh + 6vw );
height: -webkit-calc( 85svh + 6vw );

max-height:calc( 100vw / 980 * 1540 + 6vw );
max-height:-webkit-calc( 100vw / 980 * 1540 + 6vw );


background: linear-gradient(to bottom right, #ffdfff, #ffffe4, #bae5c0, #c9d9ff, #e1d2eb);
}

.logo_sp{
position: absolute;
z-index: 9;
top: 2.5vw;
left: 2.5vw;
}


.main_visual{
position: relative;
top: 3vw;
margin: 0 auto;
z-index: 6;
width: 94vw;
height: 85vh;
height: 85svh;
max-height:calc( 100vw / 980 * 1540 );
max-height:-webkit-calc( 100vw / 980 * 1540 );

overflow: hidden;
background: url(../img/main_sp.jpg) no-repeat top center;
background-size: cover;
background-color: #fff;
}



/*メインタイトル*/
.main_visual .catch{
opacity: 1;
position: absolute;
z-index: 999;
width: 88vw;
bottom: 2.0vw;
left: 3vw;
}

.main_visual .catch img{
width: 100%;
height: auto;
}


/*COPY*/
.copy_disney {
position: relative;
width: calc( 100% - 10px );
width: -webkit-calc( 100% - 10px );
margin: 5px 10px 0 0;
text-align: right;
}


/*LOOP スマホ
-----------------------------------------------------------------*/
#trig00 .h-wrap{
position: relative;
z-index: 2;
width: 96vw;

margin: 0 auto;
padding: 0;
/*全体 */
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
}


#trig00 .heart_slider{
position: relative;
text-align: center;
flex-basis: 28vw;
margin: 0 2vw 0 2vw;
}

#trig00 .heart_slider img{
position: relative;
margin: 4px 0 0 0;
width: calc( 28vw - 8px );
width: -webkit-calc( 28vw - 8px );
height: auto;

user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none; /* リンク長押しのポップアップを無効化 */
-webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
}


#trig00 .heart_slider .text_area{
position: absolute;
z-index: 9;
top: 0;

top: 50%;
-webkit-transform: translate(0%, -50%); /* Safari用 */
transform: translate(0%, -50%);

width: calc( 28vw - 8px );
width: -webkit-calc( 28vw - 8px );
width: 100%;
margin: 0 auto;

text-align: center;

font-size: 13px;
line-height: 1.4;
/*DNP Shuei Gothic Kin Std BOLD*/
font-family: dnp-shuei-gothic-kin-std, sans-serif;
font-weight: 600;
font-style: normal;
}

#trig00 .heart_slider .text_area div{
font-size: 9px;
}


#trig00 .heart_slider .photo_area{
position: relative;
width: 100%;
height: 100%;
}


#trig00 .heart_slider a{
color: #fff;
opacity: 1.0;
transition: all .3s;
-webkit-transition: all .3s;
}



#trig00 .heart_slider.fourth{
flex-basis: 28vw;
margin: 0 2vw 0 18vw;
}

#trig00 .heart_slider.fifth{
flex-basis: 28vw;
margin: 0 18vw 0 2vw;
}








/*INDEX*/
#trig00 h2{
width: 100%;
text-align: center;
margin: 50px 0 24px 0;
}

/*リード
------------------------------------------------------------------------------*/
.lead_area{
position: relative;
z-index: 5;
font-size: 14px;
line-height: 2.0;
text-align: left;
width: 88%;
margin: 50px auto 20px auto;
color: #404040;
/*フォント句読点、約物は詰めない*/
-moz-font-feature-settings: "pkna" 1;
-webkit-font-feature-settings: "pkna" 1;
font-feature-settings: "pkna" 1;
letter-spacing: 0.06em;
}
.lead_area p{
margin: 0;
}




h2.cathc_copy{
width: auto;
height: auto;
}
h2.cathc_copy img{
width: auto;
height: auto;
}







/*01
------------------------------------------------------------------------------*/
#trig01{
position: relative;
z-index: 1;
width: 100%;
margin:-30px 0 10px 0;
padding: 0;
}

.sec01{
width: 100%;
margin: 0;
padding: 90px 0 60px 0;
background: linear-gradient(to bottom right, #ece8ff, #ffffff, #ece8ff, #ffffff, #ece8ff);/*グラデ紫*/
}

.sec01 h2.cathc_copy{
width: 100%;
text-align: center;
margin: 0 auto;
padding: 0;
}

.sec01 h2.cathc_copy img{
width: 100%;
height: auto;
}

.sec01 h3.cathc_copy{
width: 100%;
text-align: center;
margin: 15px auto 0 auto;
padding: 0;
font-size: 13px;
}



/*01_01*/
.sec01_01{
width: 100%;
margin: 0;
padding: 0;
}

.sec01_01 .photo_area{
position: relative;
width: 100%;
margin: 20px 0 0 0;
padding: 0;
}


.sec01_01 .photo_area .photo{
border-radius: 20px;
position: relative;
z-index: 1;
padding: 0;
margin: 0 auto;
width: 90vw;
height: calc( 90vw / 1600 * 2200 );
height: -webkit-calc( 90vw / 1600 * 2200 );
background: url(../img/p01_01.jpg) no-repeat center bottom;
background-size: cover;
}

.sec01_01 .photo_area .photo img{
width: 100%;
height: auto;
}

.sec01_01 .text_area{
width: 90%;
margin: 40px auto 0 auto;
padding: 0;
}

.sec01_01 .photo_area .copy_disney{
position: absolute;
z-index: 2;
bottom: 12px;
left: 12px;
text-align: left;
}

.sec01_01 .photo_area .copy_disney img{
width: auto;
height: auto;
}



.base{
position: relative;
z-index: 1;
width: 90vw;
height: 200px;
background: #fff;
border-radius: 20px;
}

.base.first{
margin: 90px auto 0 auto;
}

.base.second{
margin: 90px auto 0 auto;
}

.base.third{
margin: 90px auto 0 auto;
}

.base::before{
content: '';
position: absolute;
z-index: 2;
width: 90vw;
height: 200px;
border: 1px solid #8c8c8c;
border-radius: 20px;
top: -5px;
left: -5px;
}

.base .icon_layout{
position: absolute;
z-index: 3;
top: 0px;
left: 0;
right: 0;
margin: -45px auto 0 auto;
width: 100%;
text-align: center;
height: 90px;
}

.base .icon_layout img{
height: 100%;
width: auto;
}

.base h4{
position: relative;
padding: 70px 0 20px 0;
margin: 0;
width: 100%;
font-size: 18px;
text-align: center;
}

.base .text_area_content{
position: relative;
left: 0;
right: 0;
width: 88%;
margin: 0 auto;
z-index: 3;
font-size: 13px;
line-height: 1.642;
color: #666;
padding: 0;
}

.base .text_area_content.third{
width: 160px;
}





.base.third{
height: 220px;
}
.base.third::before{
height: 220px;
}




.tyui_content{
position: absolute;
bottom: 14px;
width: 100%;
margin: 0 auto;
text-align: center;
font-size: 11px;
line-height: 1.5;
}


.base h4 .number{
margin: 0 7px 0 0;
}

.base h4 .tyui.blue_color{
color: #6596dd;
}

.base h4 .tyui.pink_color{
color: #f78ba8;
}

.base h4 .tyui.purple_color{
color: #b291d7;
}











/*02
------------------------------------------------------------------------------*/
#trig02{
width: 100%;
margin: 0;
padding: 50px 0 0 0;
}

.sec02{
width: 100%;
margin: 0;
padding: 0;
}

.sec02 h2.cathc_copy{
width: 100%;
text-align: center;
margin: 0 auto;
padding: 0;
}

.sec02 h2.cathc_copy img{
width: 100%;
height: auto;
}

.sec02 h3.cathc_copy{
width: 100%;
text-align: center;
margin: 15px auto 0 auto;
padding: 0;
font-size: 13px;
}

.sec02 .description_text{
width: 84%;
padding: 30px 0 0 0;
margin: 0 auto 0 auto;
text-align: left;
font-size: 14px;
color: #4d4d4d;
line-height: 1.7857;
}




/*02_01*/
.sec02_01{
width: 100%;
margin: 0;
padding: 0;
}


.mySwiper_layout{
width: 100%;
padding: 55px 0 0 0;
}



.mySwiper{
position: relative;
width: 100%;
padding: 0;
margin: 0;
height: 100%;
overflow: hidden;
}



.mySwiper .swiper-slide{
padding: 0 5px 0 5px;
-webkit-box-sizing: border-box;
box-sizing: border-box;

opacity: 1.0;
transition: opacity 0.4s ease-out;
-webkit-transition: opacity 0.4s ease-out;

user-select: none;
-webkit-user-select: none;
}

/*一番メイン*/
.mySwiper .swiper-slide.swiper-slide-active{

}

/*一番左　消すやつ*/
.mySwiper .swiper-slide.swiper-slide-prev{
opacity: 1.0;
transition: opacity 0.4s ease-out;
-webkit-transition: opacity 0.4s ease-out;
}


.sec02-carousel-cell{
width: 100%;
}

.sec02-carousel-cell .photo_area{
width: 100%;
}

.sec02-carousel-cell .text_area{
margin: 20px 0 90px 0;
font-size: 13px;
line-height: 1.6;
color: #404040;
width: 100%;
text-align: center;
}

.sec02-carousel-cell .photo_area img{
border: 4px solid #fff;
-webkit-box-sizing: border-box;
box-sizing: border-box;

border-radius: 50%;
display: block;
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
object-fit: cover;
object-position: center;
}


/*上書き*/
.swiper-button-next:after, .swiper-button-prev:after{
content: none;
}

/*前に戻る*/
.mySwiper .swiper-button-prev{
position: absolute;
top: auto;
bottom: 0;
left: auto;
right: calc( 4vw + 50px );
right: -webkit-calc( 4vw + 50px );
left: auto;

z-index: 9999;
background: #ccb2d3;
border: none;
color: #fff;

width: 40px;
height: 40px;
border-radius: 50%;
transform: translateY(-50%);
}

.mySwiper .swiper-button-prev::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_prev.svg) center center no-repeat;
}


/*次に*/
.mySwiper .swiper-button-next{
position: absolute;
top: auto;
left: auto;
right: 4vw;
bottom: 0;


z-index: 9999;
background: #ccb2d3;
border: none;
color: #fff;

width: 40px;
height: 40px;
border-radius: 50%;
transform: translateY(-50%);
}

.mySwiper .swiper-button-next::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_next.svg) center center no-repeat;
}

/*スクロールバー*/
.mySwiper .swiper-scrollbar{
top: auto;
bottom: 75px;
left:0;
right: 0;
margin: 0 auto;
width: 92vw;
height: 2px;
background: #e5e5e5;
}

.mySwiper .swiper-scrollbar-drag{
background: linear-gradient(to bottom right, #b2b8ff, #e1bbeb);
}





/*重要*/
.wrapper_first{
position: relative;
width: 100vw;
height: calc( 66vw + 100px );
height: -webkit-calc( 66vw + 100px );
margin: 0;
padding: 55px 0 0 0;
overflow: hidden;
cursor: pointer;
user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none; /* リンク長押しのポップアップを無効化 */
-webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
}


/*LOOP スマホ
-----------------------------------------------------------------*/
.b-slider.marquee-slider{
position: relative;
width: 100%;
height: calc( 66vw + 100px );
height: -webkit-calc( 66vw + 100px );
outline: 0;
margin: 0 auto;
padding: 0;
}

.b-slider.marquee-slider .b-slider__slide{
position: relative;
text-align: center;
width: 66vw;
height: calc( 66vw + 100px );
height: -webkit-calc( 66vw + 100px );
margin: 0 3.5vw 0 0;
}


.marquee-slider .b-slider__slide .sec02-carousel-cell .photo_area img{
border: 4px solid #fff;
-webkit-box-sizing: border-box;
box-sizing: border-box;

border-radius: 50%;
display: block;
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
object-fit: cover;
object-position: center;

user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none; /* リンク長押しのポップアップを無効化 */
-webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
}


.marquee-slider .b-slider__slide .sec02-carousel-cell .text_area{
position: relative;
margin: 20px 0 45px 0;
font-size: 13px;
line-height: 1.6;
color: #404040;
width: 100%;
text-align: center;
}








.sec02_02{
width: 100%;
margin: 25px 0 0 0;
padding: 0;
}

.sec02_02 h2{
width: 100%;
text-align: center;
margin: 0 0 30px 0;
}


/*サムネイル*/
.mySwiper02-thumbnail-layout{
position: relative;
width: 84vw;
margin: 0 auto;
}

.mySwiper02-thumbnail{
position: relative;
z-index: 9999;
width: 82vw;
margin: 0 auto;
}


/*サムネイル*/
.mySwiper02-thumbnail .swiper-slide.first{
position: relative;
width: calc( 61vw / 322 * 98 ) !important;
width: -webkit-calc( 61vw / 322 * 98 ) !important;
margin: 0;
padding: 0;
}

.mySwiper02-thumbnail .swiper-slide.first .thunb_btn{
width: calc( 61vw / 322 * 98 );
width: -webkit-calc( 61vw / 322 * 98 );

text-align: center;
cursor: pointer;
margin: 0;
padding: 0;
}

.mySwiper02-thumbnail .swiper-slide.first .thunb_btn img{
width: 100%;
height: auto;
margin: 0;
padding: 0 0 5px 0;
}


.mySwiper02-thumbnail .swiper-slide.second{
position: relative;
width: calc( ( 61vw / 322 * 156 ) + 21vw ) !important;
width: -webkit-calc( ( 61vw / 322 * 156 ) + 21vw ) !important;
margin: 0 0 20px 0;
padding: 0;
}

.mySwiper02-thumbnail .swiper-slide.second .thunb_btn{

width: calc( 61vw / 322 * 156 );
width: -webkit-calc( 61vw / 322 * 156 );

text-align: center;
cursor: pointer;
margin: 0 auto;
padding: 0;
}


.mySwiper02-thumbnail .swiper-slide.second .thunb_btn img{
width: 100%;
height: auto;
margin: 0;
padding: 0 0 5px 0;
}

/*03*/
.mySwiper02-thumbnail .swiper-slide.third{
position: relative;
width: calc( 61vw / 322 * 68 ) !important;
width: -webkit-calc( 61vw / 322 * 68 ) !important;
margin: 0;
padding: 0;
}

.mySwiper02-thumbnail .swiper-slide.third .thunb_btn{
width: calc( 61vw / 322 * 68 );
width: -webkit-calc( 61vw / 322 * 68 );

text-align: center;
cursor: pointer;
margin: 0;
padding: 0;
}


.mySwiper02-thumbnail .swiper-slide.third .thunb_btn img{
width: 100%;
height: auto;
margin: 0;
padding: 0 0 5px 0;
}


/*01*/
.mySwiper02-thumbnail .swiper-slide.first .thunb_btn::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
border-top: 2px solid #ccc;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
}

.mySwiper02-thumbnail .swiper-slide.first.swiper-slide-thumb-active .thunb_btn::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
border-top: 2px solid #ddb1b1;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
}


/*02*/
.mySwiper02-thumbnail .swiper-slide.second .thunb_btn::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: calc( 61vw / 322 * 156 );
width: -webkit-calc( 61vw / 322 * 156 );
height: 1px;
border-top: 2px solid #ccc;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
}

.mySwiper02-thumbnail .swiper-slide.second.swiper-slide-thumb-active .thunb_btn::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: calc( 61vw / 322 * 156 );
width: -webkit-calc( 61vw / 322 * 156 );
height: 1px;
border-top: 2px solid #ffab5e;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
}


/*03*/
.mySwiper02-thumbnail .swiper-slide.third .thunb_btn::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
border-top: 2px solid #ccc;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
}


.mySwiper02-thumbnail .swiper-slide.third.swiper-slide-thumb-active .thunb_btn::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
border-top: 2px solid #84bfd1;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
}



.mySwiper_layout02{
position: relative;
width: 100vw;
margin: 0 auto;
padding:0 0 0 0;
}

.mySwiper_layout02 .description{
position: absolute;
z-index: 99;
top: 55px;
left: 4vw;
width: 92vw;
text-align: center;
font-size: 12px;
line-height: 1.7;
color: #404040;
text-align: center;
padding: 40px 0 40px 0;
}


.mySwiper02{
position: relative;
width: 100vw;
padding: 90px 0 40px 0;
border-radius: 0px;
background: linear-gradient(to bottom right, #ece8ff, #ffffff, #ece8ff, #ffffff, #ece8ff);/*グラデ紫*/
}

/*上書き*/
.mySwiper02 .swiper-pagination {
position: absolute;
bottom: -30px;
}

:root {
--swiper-theme-color: linear-gradient(to bottom right, #b2b8ff, #e1bbeb);/*グラデ紫*/
}


.swiper, .swiper-container {
overflow: visible;
}

.sec02_02-carousel-cell{
width: 100vw;
margin: 0 auto;
}

.sec02_02-carousel-cell ul{
width: 100vw;
margin: 0 auto 10px auto;
/*全体 */
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
}


.sec02_02-carousel-cell ul li{
flex-basis: 38vw;
height: auto;
margin: 0 8vw 0 4vw;
padding: 0;
}

.sec02_02-carousel-cell ul li:nth-child(2n+1){
margin: 0 4vw 0 8vw;
}



.sec02_02-carousel-cell ul li .photo{
width: 100%;
}

.sec02_02-carousel-cell ul li .photo img{
width: 100%;
height: auto;
border-radius: 20px;
border: 2px solid #fff;
/*ボーダーボックス*/
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

.sec02_02-carousel-cell ul li .text{
margin: 15px 0 27px 0;
width: 100%;
font-size: 11px;
line-height: 1.5;
color: #666;
text-align: center;
}



/*上書き*/
.swiper-button-next:after, .swiper-button-prev:after{
content: none;
}

/*前に戻る*/
.mySwiper02 .swiper-button-prev{
position: absolute;
top: auto;
bottom: 20px;
right: auto
left: calc( 50vw - 45px );
left: -webkit-calc( 50vw - 45px );

z-index: 9999;
background: #ccb2d3;
border: none;
color: #fff;

width: 40px;
height: 40px;
border-radius: 50%;
}

.mySwiper02 .swiper-button-prev::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_prev.svg) center center no-repeat;
}

/*次に*/
.mySwiper02 .swiper-button-next{
position: absolute;
top: auto;
bottom: 20px;
right: calc( 50vw - 45px );
right: -webkit-calc( 50vw - 45px );
left: auto;

z-index: 9999;
background: #ccb2d3;
border: none;
color: #fff;

width: 40px;
height: 40px;
border-radius: 50%;
}

.mySwiper02 .swiper-button-next::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_next.svg) center center no-repeat;
}




/*03
------------------------------------------------------------------------------*/
#trig03{
width: 100%;
margin: 0;
padding: 60px 0 0 0;
}

.sec03{
width: 100%;
margin: 0;
padding: 0;
}

.sec03 h2.cathc_copy{
width: 100%;
text-align: center;
margin: 0 auto;
padding: 0;
}


.sec03 h2.cathc_copy img{
width: 100%;
height: auto;
}


.sec03 h3.cathc_copy{
width: 92%;
text-align: center;
margin: 15px auto 0 auto;
padding: 0;
font-size: 13px;
}


.sec03 .description_text{
width: 90%;
padding: 30px 0 30px 0;
margin: 0 auto 0 auto;
text-align: center;
font-size: 14px;
color: #4d4d4d;
line-height: 1.7857;
}













.sec03_01{
position: relative;
width: 100%;
margin: 0;
padding: 0;
}

/*背景*/
.sec03_01 .bg{
position: absolute;
z-index: -1;
top: 0;
left: 0;
width: 100%;
height: 120px;
background: linear-gradient(to bottom right, #ece8ff, #ffffff, #ece8ff, #ffffff, #ece8ff);/*グラデ紫*/
}


/*S-L 3列*/
.sec03_01 .sanretu{
width: 92vw;
margin: 0 auto 0 auto;
padding: 50px 0 30px 0;
/*全体 */
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
/*天地下に揃える */
-webkit-align-items: flex-end;
align-items:flex-end;
}



.sec03_01 .size_s{
position: relative;
flex-basis: 24vw;
margin: 0;
padding: 0;
}

h3.size_title{
position: absolute;
z-index: 3;
top: -30px;
left: 0px;
}

h3.size_title img{

}

.sec03_01 img.space{
width: auto;
height: 8px;
margin: 0 auto;
}


.sec03_01 .size_s .photo_area{
width: 100%;
border-radius: 40px;
}


.sec03_01 .size_s .photo_area img{
border: 2px solid #fff;
/*ボーダーボックス*/
-webkit-box-sizing: border-box;
box-sizing: border-box;

border-radius: 20px;
display: block;
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
object-fit: cover;
object-position: center;
}

.sec03_01 .size_s h4{
width: 24vw;
text-align: center;
margin: 10px auto 15px auto;
}

.sec03_01 .size_s h4 img{
width: 100%;
height: auto;
}

.sec03_01 .size_s .description_text_size{
margin: 0;
width: 100%;
text-align: center;
font-size: 10px;
color: #666;
line-height: 1.5;
}



.sec03_01 .size_m{
position: relative;
flex-basis: 26vw;
margin: 0 6vw 0 6vw;
padding: 0;
}

.sec03_01 .size_m .photo_area{
width: 100%;
}
.sec03_01 .size_m .photo_area img{
border: 2px solid #fff;
/*ボーダーボックス*/
-webkit-box-sizing: border-box;
box-sizing: border-box;

border-radius: 20px;
display: block;
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
object-fit: cover;
object-position: center;
}

.sec03_01 .size_m h4{
width: 24vw;
text-align: center;
margin: 10px auto 15px auto;
}

.sec03_01 .size_m h4 img{
width: 100%;
height: auto;
}

.sec03_01 .size_m .description_text_size{
margin: 0;
width: 100%;
text-align: center;
font-size: 10px;
color: #666;
line-height: 1.5;
}


.sec03_01 .size_l{
position: relative;
flex-basis: 30vw;
margin: 0;
padding: 0;
}

.sec03_01 .size_l .photo_area{
width: 100%;
}

.sec03_01 .size_l .photo_area img{
border: 2px solid #fff;
/*ボーダーボックス*/
-webkit-box-sizing: border-box;
box-sizing: border-box;

border-radius: 20px;
display: block;
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
object-fit: cover;
object-position: center;
}




.sec03_01 .size_l h4{
width: 24vw;
text-align: center;
margin: 10px auto 15px auto;
}

.sec03_01 .size_l h4 img{
width: 100%;
height: auto;
}

.sec03_01 .size_l .description_text_size{
margin: 0;
width: 100%;
text-align: center;
font-size: 10px;
color: #666;
line-height: 1.5;
}







/*02*/
.sec03_02{
width: 100%;
margin: 0;
padding: 0;
background: linear-gradient(to bottom right, #ece8ff, #ffffff, #ece8ff, #ffffff, #ece8ff);/*グラデ紫*/
}

.sec03_02 h2.cathc_copy{
width: 92%;
text-align: center;
margin: 0 auto;
padding: 40px 0 0 0;
}
.sec03_02 h2.cathc_copy img{
width: 41vw;
height: auto;
}





.mySwiper_layout03{
width: 100%;
margin: 0 auto;
padding: 20px 0 30px 0;
}


.mySwiper03{
position: relative;
width: 100%;
margin: 0 auto;
padding: 0;
height: 100%;
overflow: hidden;
}

.mySwiper03 .swiper-slide{
padding: 0 10px 0 10px;
-webkit-box-sizing: border-box;
box-sizing: border-box;

opacity: 1.0;
transition: opacity 0.4s ease-out;
-webkit-transition: opacity 0.4s ease-out;

user-select: none;
-webkit-user-select: none;
}


/*一番メイン*/
.mySwiper03 .swiper-slide.swiper-slide-active{
opacity: 1.0;
}

.mySwiper03 .swiper-slide.swiper-slide-next{
opacity: 1.0;
}

/*一番左　消すやつ*/
.mySwiper03 .swiper-slide.swiper-slide-prev{
opacity: 1.0;
transition: opacity 0.4s ease-out;
-webkit-transition: opacity 0.4s ease-out;
}

.sec03-carousel-cell{
width: 100%;
}

.sec03-carousel-cell .photo_area{
width: 100%;
margin: 0;
padding: 0;
}

.sec03-carousel-cell .text_area{
margin: 20px 0 115px 0;
font-size: 12px;
line-height: 1.6;
color: #666666;
width: 100%;
text-align: center;
}

.sec03-carousel-cell .photo_area img{
border: 4px solid #fff;
-webkit-box-sizing: border-box;
box-sizing: border-box;

border-radius: 20px;
display: block;
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
object-fit: cover;
object-position: center;
}


/*上書き*/
.swiper-button-next:after, .swiper-button-prev:after{
content: none;
}

/*前に戻る*/
.mySwiper03 .swiper-button-prev{
position: absolute;
top: auto;
bottom: 0;
left: auto;
right: calc( 4vw + 50px );
right: -webkit-calc( 4vw + 50px );

z-index: 9999;
background: #ccb2d3;
border: none;
color: #fff;

width: 40px;
height: 40px;
border-radius: 50%;
transform: translateY(-50%);/*自分のサイズの半分上へ*/
}

.mySwiper03 .swiper-button-prev::before{
content: '';
position: absolute;
top: auto;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_prev.svg) center center no-repeat;
}



/*次に*/
.mySwiper03 .swiper-button-next{
position: absolute;
top: auto;
bottom: 0;
left: auto;
right: 4vw;

z-index: 9999;
background: #ccb2d3;
border: none;
color: #fff;

width: 40px;
height: 40px;
border-radius: 50%;
transform: translateY(-50%);
}

.mySwiper03 .swiper-button-next::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_next.svg) center center no-repeat;
}


/*スクロールバー*/
.mySwiper03 .swiper-scrollbar{
top: auto;
bottom: 75px;
left:0;
right: 0;
margin: 0 auto;
width: 92vw;
height: 2px;
background: #fff;
}

.mySwiper03 .swiper-scrollbar-drag{
z-index: 99;
background: linear-gradient(to bottom right, #b2b8ff, #e1bbeb);
}












/*04
------------------------------------------------------------------------------*/
#trig04{
width: 100%;
margin: 0;
padding: 60px 0 50px 0;
}

.sec04{
width: 100%;
margin: 0;
padding: 0;
}

.sec04 h2.cathc_copy{
width: 92%;
text-align: center;
margin: 0 auto;
padding: 0;
}

.sec04 h2.cathc_copy img{
width: 100%;
height: auto;
}


.sec04 h3.cathc_copy{
width: 92%;
text-align: center;
margin: 15px auto 0 auto;
font-size: 13px;
}

.sec04 .description_text{
margin: 30px auto 30px auto;
width: 92%;
text-align: center;
font-size: 13px;
color: #404040;
line-height: 2.0;
letter-spacing: 0.04em;
}




.sec04_01{

}



/*ステップ01*/
.sec04_01 .step01{
position: relative;
margin: 0 auto;
width: 90vw;
height: 190px;
border-radius: 20px;
background: linear-gradient(to bottom right, #ece8ff, #ffffff, #ece8ff, #ffffff, #ece8ff);/*グラデ紫*/

/*全体 */
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
/*天地中央揃える */
-webkit-align-items: center;
align-items:center;
}



.sec04_01 .step01 .text_area{
flex-basis: 57%;
margin: 0 4% 0 6%;
}


.sec04_01 .step01 .photo_area{
flex-basis: 33%;
margin: 0;
text-align: center;
}

.sec04_01 .step01 .photo_area img{
width: 100%;
height: auto;
}

.sec04_01 .step01 h2{
position: relative;
margin: 0 0 20px 0;
}

.sec04_01 .step01 p{
margin: 0;
width: 100%;
font-size: 14px;
line-height: 1.61;
text-align: left;
color: #404040;
}


/*アップダウン*/
.sec04_01 .up_down{
width: 100%;
text-align: center;
margin: 25px 0;
}


/*ステップ02*/
.sec04_01 .step02{
position: relative;
margin: 0 auto;
width: 90vw;
height: 190px;
border-radius: 20px;
background: linear-gradient(to bottom right, #f6f0f7, #ffffff, #f6f0f7, #ffffff, #f6f0f7);/*グラデ ピンク*/

/*全体 */
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
/*天地中央揃える */
-webkit-align-items: center;
align-items:center;
}


.sec04_01 .step02 .text_area{
flex-basis: 57%;
margin: 0 4% 0 6%;
}


.sec04_01 .step02 .photo_area{
flex-basis: 33%;
margin: 0;
}

.sec04_01 .step02 .photo_area img{
width: 100%;
height: auto;
}


.sec04_01 .step02 h2{
position: relative;
margin: 0 0 20px 0;
}

.sec04_01 .step02 p{
margin: 0;
width: 100%;
font-size: 14px;
line-height: 1.61;
text-align: left;
color: #404040;
}


.sec04_01 .tyui{
margin: 22px auto 0 auto;
width: 90%;
font-size: 12px;
line-height: 1.6;
text-align: center;
color: #404040;
}














/*05
------------------------------------------------------------------------------*/
#trig05{
width: 100%;
margin: 0;
padding: 50px 0 50px 0;
}

.sec05{
width: 100%;
margin: 0 auto;
padding: 0;

}

.sec05 h2.cathc_copy{
width: 100%;
text-align: center;
margin: 0 auto;
padding: 0;
}

.sec05 h2.cathc_copy img{
width: 100%;
height: auto;
}

.sec05 h3.cathc_copy{
position: relative;
text-align: center;
width: 100%;
height: auto;
font-size: 13px;
margin: 20px 0 20px 0;
}

/*01*/
.sec05_01{
position: relative;
width: 100%;
margin: 0;
padding: 0 0 50px 0;
background: linear-gradient(to bottom right, #ece8ff, #ffffff, #ece8ff, #ffffff, #ece8ff);/*グラデ紫*/
}

.sec05_01 .niretu{
width: 100%;
padding: 40px 0 60px 0;
}


/*スマホの幅、145px*2 px*/
.sec05_01 .niretu .photo_area{
position: relative;
width: 100%;
margin: 0;
padding: 0;
}


/*スマホのイラスト枠*/
.sec05_01 .niretu .photo_area .waku{
position: absolute;
z-index: 2;
top: 0%;
left: 50%;
transform: translateX(-50%);

width: 66vw;
height: calc(66vw / 290 * 489);/*578*/
height: -webkit-calc(66vw / 290 * 489);/*578*/

user-drag: none;
-webkit-user-drag: none;
-moz-user-select: none;
user-select: none;
}

.sec05_01 .niretu .photo_area .waku img{
width: 100%;
height: auto;
user-drag: none;
-webkit-user-drag: none;
-moz-user-select: none;
user-select: none;
}


.sec05_01 .niretu .photo_area .illust_sp{

}

.sec05_01 .niretu .text_area{
margin: 0;
padding: 0;
}






.sec05-carousel{
padding: 0;
}


/*上書き*/
.sec05-carousel .flickity-button {
position: absolute;
z-index: 9999;
background: #ccb2d3;
border: none;
color: #fff;
}


.sec05-carousel .flickity-prev-next-button {
top: calc( 50% + 85px );
top: -webkit-calc( 50% + 85px );
width: 40px;
height: 40px;
border-radius: 50%;
transform: translateY(-50%);
}

/*矢印　2種類*/
.sec05-carousel .flickity-button-icon{
display: none;
}



/*前に戻る*/
.sec05-carousel .flickity-button.previous{
top: auto;
right: auto;
left: calc( 50vw - 45px );
bottom: -80px;
}

.sec05-carousel .flickity-button.previous::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_prev.svg) center center no-repeat;
}



/*次に*/
.sec05-carousel .flickity-button.next{
top: auto;
left: auto;
right: calc( 50vw - 45px );
bottom: -80px;
}

.sec05-carousel .flickity-button.next::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_next.svg) center center no-repeat;
}


.sec05-carousel-cell{
position: relative;
width: 66vw;
height: calc(66vw / 290 * 578);
height: -webkit-calc(66vw / 290 * 578);

height: calc(66vw / 290 * 489);/*578*/
height: -webkit-calc(66vw / 290 * 489);/*578*/

margin: 0;
/*
background: #fff;
border-radius: 30px;
border: 1px solid #d9d9d9;
*/
/*ボーダーボックス*/
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

/*基本*/
.sec05-carousel-cell .layout{
transform: scale(0.82);
z-index: 9;

width: 66vw;
height: calc(66vw / 290 * 578);
height: -webkit-calc(66vw / 290 * 578);




height: calc(66vw / 290 * 489);/*578*/
height: -webkit-calc(66vw / 290 * 489);/*578*/


border-radius: 30px;
background: #fff;
border: 1px solid #d9d9d9;
/*ボーダーボックス*/
-webkit-box-sizing: border-box;
box-sizing: border-box;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;

display: flex;
justify-content: center;
align-items: center;
}


/* 選択！*/
.sec05-carousel-cell.is-selected .layout{
transform: scale(1);
z-index: 9;

width: 66vw;
height: calc(66vw / 290 * 578);
height: -webkit-calc(66vw / 290 * 578);


height: calc(66vw / 290 * 489);/*578*/
height: -webkit-calc(66vw / 290 * 489);/*578*/


border-radius: 30px;
background: #fff;
border: 1px solid #fff;
/*ボーダーボックス*/
-webkit-box-sizing: border-box;
box-sizing: border-box;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
}

.layout_center{
width: 100%;
}


.sec05-carousel-cell .icon_area{
position: relative;
padding: 0;
width: 100%;
text-align: center;
}

.sec05-carousel-cell .icon_area img{
width:24vw;
height: auto;
}

.sec05-carousel-cell .comment_area{
width: 84%;
margin: 20px auto 0 auto;
text-align: left;

font-size: 13px;
line-height: 1.84;
color: #404040;

/*DNP Shuei Gothic Kin Std BOLD*/
font-family: dnp-shuei-gothic-kin-std, sans-serif;
font-weight: 600;
font-style: normal;
}



.sec05-carousel-cell .name_area{
margin: 20px 0 30px 0;
width: 100%;
text-align: center;
font-size: 13px;
color: #666;
}


.star_area{
position: absolute;
width: 100%;
text-align: center;
left: 0;
bottom: 15px;
}

.star_area img{
height: 15px;
width: auto;
}
















/*最後のCheck all item（スマホ）
---------------------------------------------------------------*/
.more-btn{
position: relative;
overflow: visible;
margin: 50px auto 0 auto;
padding: 0;
top: 0px;
left: 0px;
width: 90vw;
height: 65px;
line-height: 65px;

background: #ccb2d3;/*色*/

border-radius: 6px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-ms-box-sizing: border-box;

-webkit-transition-delay: .1s;
transition-delay: .1s;
-webkit-transition: all .2s;
transition: all .2s;
cursor: pointer;

opacity: 1;

-webkit-transition: all .6s ease .0s;
transition: all .6s ease .0s;
}

.more-btn:hover{
opacity: 0.8;
-webkit-transition: all .6s ease .0s;
transition: all .6s ease .0s;
}

/*テキスト*/
.more-btn .text_area{
position: absolute;
top: 0;
left: 0;
width: 100%;
text-align: center;
height: 100px;

-webkit-transition: opacity .6s ease .0s;
transition: opacity .6s ease .0s;
}

/*矢印*/
.more-btn .arrow{
position: absolute;
bottom: 0px;
right: 10px;
-webkit-transition: opacity .6s ease .0s;
transition: opacity .6s ease .0s;
}

.more-btn .arrow img{
height: auto;
width: auto;
}

.more-btn a{
position: absolute;
top: 0;
left: 0;
z-index: 12;
width: 100%;
height:100%;
}






/*フッター
--------------------------------------------------------------------------------*/
.footer_area{
position: relative;
z-index: 5;
width: 100%;
margin: 0;
padding: 0;
background: #fff;
}


/*シェアとスタッフ名*/
.share_staff{
overflow-x: hidden;
width: 92%;
margin: 60px auto 0 auto;
}


/*シェア*/
h4.sns_title{
width: 100%;
margin: 0 auto 60px auto;
padding: 0;
display: flex;
align-items: center;
}


h4.sns_title:before,
h4.sns_title:after {
    content: "";
    height: 1px;
    flex-grow: 1;
    background-color: #B2B2B2;
}

h4.sns_title:before {
    margin-right: 1rem;
}

h4.sns_title:after {
    margin-left: 1rem;
}



ul.sns{
width: 100%;
height: 23px;
margin: 0 auto 0 auto;
padding: 0;
height: auto;
display: flex;
justify-content:center;
}

ul.sns li{
width: auto;
height: 23px;
margin: 0;
padding: 0;
}

ul.sns li img{
height: 100%;
width: auto;
}

ul.sns li a{
margin: 0;
padding: 0;
}


ul.sns li:first-child{
display: inline-block;
width: 86px;
flex-grow: 1;
margin: 0;
text-align: left;
}

ul.sns li:nth-child(2){
width: 108px;
flex-grow: 1;
margin: 0;
text-align: center;
}

ul.sns li:nth-child(3){
width: 72px;
flex-grow: 1;
margin: 0;
text-align: right;
}



ul.sns li a{
transition:opacity 0.3s ease;
}

ul.sns li img{
vertical-align:middle;
}

ul.sns li a:hover{
opacity:0.5;
}







.follow_us{
width: 92%;
margin: 50px auto 0 auto;
padding: 0 0 50px 0;
border-bottom: 1px solid #B2B2B2;
}

.follow_us h3{
display: flex;
align-items: center;
}

.follow_us h3:before,
.follow_us h3:after{
content: "";
height: 1px;
flex-grow: 1;
background-color: #B2B2B2;
}

.follow_us h3:before{
margin-right: 27px;
}

.follow_us h3:after{
margin-left: 27px;
}

.follow_us .niretu{
width: 90%;
margin: 55px auto 0 auto;
}


/*公式*/
.follow_us .niretu .official{
width: 30vw;
margin: 0 auto 60px auto;
text-align: center;
}

.follow_us .niretu .official img{
width: 100%;
height: auto;
}


.follow_us .niretu .official a{
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}

.follow_us .niretu .official a:hover{
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
opacity: 0.5;
}


.follow_us .niretu .sns_link{
width: 100%;
}



.follow_us .niretu .sns_link ul{

/*全体 */
display: -webkit-flex;
display: flex;
flex-wrap: wrap;

width: 111px;
height: auto;
margin: 0 auto;
padding: 0;
}

.sns_link ul li{
flex-basis:33px;
margin: 0;
padding: 0;
}

.sns_link ul li a{
margin: 0;
padding: 0;
}

.sns_link ul li img{
width: 100%;
height: auto;
}
.sns_link ul li:first-child{
margin: 0 45px 0 0;
padding: 0;
text-align: left;
}

.sns_link ul li:nth-child(2){
margin: 0;
padding: 0;
text-align: center;
}



.sns_link ul li a{
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}


.sns_link ul li a:hover{
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
opacity: 0.6;
}





/*ECリンク*/
.link_ec{
width: 90%;
margin: 40px auto 0 auto;
padding: 0;
}

.link_ec ul{
width: 100%;
margin: 0 auto;
padding: 0;
text-align: center;
list-style:none;
font-size:0;
}

.link_ec ul li{
display: inline-block;
width: 48%;
height: calc( 48vw / 164 * 82);
height: -webkit-calc( 48vw / 164 * 82);
background: #ccb2d3;
border-radius: 6px;

margin: 0 4% 20px 0;
padding: 0;
font-size: 0px;

text-align: center;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}

.link_ec ul li a img.sp_show{
height: 80%;
width: auto;
margin: 0;
padding: 0;
}

.link_ec ul li:nth-child(2n){
display: inline-block;
margin: 0 0 20px 0;
}

.link_ec ul li a{
display: block;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
display: flex;
justify-content:center;/*画像センター*/
align-items: flex-end;/*画像下揃え*/
}

.link_ec ul li:hover{
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
opacity: 0.7;
}



/*最後の注意書き*/
.last_message{
width: 90%;
margin: 20px auto 0 auto;
padding: 0;
}

.last_message p{
width: 100%;
margin: 0 auto 10px auto;

text-align: left;
font-size: 12px;
line-height: 1.75;
color: #737373;
}


/*ロゴ ONWARD*/
.logo_onward_crosset{
width: 34vw;
height: auto;
margin: 60px auto 0 auto;
}

.logo_onward_crosset img{
width: 100%;
height: auto;
}



/*Insta Onward*/
.insta_onward_crosset{
width: 32px;
height: auto;
margin: 30px auto 0 auto;
}

.insta_onward_crosset img{
width: 100%;
height: auto;
}




.copy{
width: 100%;
text-align: center;
margin: 30px auto 0 auto;
padding: 0 0 20px 0;
}
.copy img{
width: 60vw;
height: auto;
}



#pagetop{
position: fixed;
z-index: 99;
right: 15px;
bottom: 65px;

opacity: 0;
cursor: pointer;
}















/*スマホ終了
--------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width: 768px) {


/*ロゴ　any FAM x iSU COORING*/
.logo_double {
position: fixed;
z-index: 9999;
bottom: 0;
left: 0;
opacity: 1;
}




/*PC右ナビ*/
.nav_right_pc{
display: block;
visibility: visible;
opacity: 0;
position: fixed;
top: 10px;
bottom: auto;
right: 10px;
margin: 0;
z-index: 3;
width: 610px;
height: 64px;
text-align: left;
}

.nav_right_pc .bg_color{
position: absolute;
top:0;
left: 0;
width: 100%;
height: 100%;
background: #f6f0f7;/*f7e7e7*//*明るいグレー　eae4df*/
opacity: 0.9;
z-index: 1;
border-radius: 32px;
}

.nav_right_pc ul{
position: relative;
z-index: 2;
margin: 0;
height: 64px;
}

.nav_right_pc ul li{
display: inline-block;
margin: 15px 30px 0 30px;
/*Omnes Narrow Regular*/
font-size: 19px;
font-family: "omnes-narrow", sans-serif;
font-weight: 400;
font-style: normal;
text-align: center;
}

/*選択時*/
.nav_right_pc ul li.selected a{
color: #000;
}



/*01*/
.nav_right_pc ul li:first-child::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #e5b9d1;

opacity: 0;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}

.nav_right_pc ul li:first-child.selected::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #e5b9d1;

opacity: 1;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}



/*02*/
.nav_right_pc ul li:nth-child(2)::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #a8a3c6;

opacity: 0;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}


.nav_right_pc ul li:nth-child(2).selected::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #a8a3c6;

opacity: 1;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}




/*03*/
.nav_right_pc ul li:nth-child(3)::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #77c7e0;

opacity: 0;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}

.nav_right_pc ul li:nth-child(3).selected::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #77c7e0;

opacity: 1;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}




/*04*/
.nav_right_pc ul li:nth-child(4)::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #ffd542;

opacity: 0;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}


.nav_right_pc ul li:nth-child(4).selected::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #ffd542;

opacity: 1;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}



/*05*/
.nav_right_pc ul li:nth-child(5)::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #7dd389;

opacity: 0;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}

.nav_right_pc ul li:nth-child(5).selected::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
right: 0;
margin: 0 auto;
width: 47px;
height: 2px;
background: #7dd389;

opacity: 1;
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}







.nav_right_pc ul li .japanese{
margin: 5px 0 0 0;
font-size: 11px;
/*DNP ShueiGoKinStd M*/
font-family: "dnp-shuei-gothic-kin-std", sans-serif;
font-weight: 500;
font-style: normal;
}


/*スマホ 各説明*/
.category_description{
width: 100%;
margin: 0 0 70px 0;
text-align: center;
}





.pc_show{
display: inline-block;
}

.sp_show{
display: none;
}

/*イレギュラー*/
#trig00 .sp_show{
display: none;/*Loopの都合上今回blockで*/
}


#trig00 h2{
width: 100%;
text-align: center;
margin: 0 0 24px 0;
}







/*ファーストビュー*/
/*グラデ*/
#grad{
position: relative;
z-index: 100;
width: 100%;
height: 100vh;
height: 100svh;

/*max-height:calc( 100vw / 2800 * 1910 );
max-height:-webkit-calc( 100vw / 2800 * 1910 );*/

background: linear-gradient(to bottom right, #ffdfff, #ffffe4, #bae5c0, #c9d9ff, #e1d2eb);
}


.main_visual{
position: absolute;
top: 20px;
left: 20px;
z-index: 6;
width: calc( 100% - 40px );
width: -webkit-calc( 100% - 40px );

height: calc( 100vh - 40px );
height: -webkit-calc( 100vh - 40px );

height: calc( 100svh - 40px );
height: -webkit-calc( 100svh - 40px );


/*max-height:calc( 100vw / 2800 * 1910 - 40px );
max-height:-webkit-calc( 100vw / 2800 * 1910 - 40px );*/

overflow: hidden;
background: url(../img/main_pc.jpg) no-repeat top center;
background-size: cover;
background-color: #fff;
}



/*メインタイトル*/
.main_visual .catch{
opacity: 1;
position: absolute;
z-index: 999;
bottom: 30px;
right: 30px;

width: auto;
left: auto;
}




.main_visual .catch img{
width: 42vw;
height: auto;
}



/*COPY*/
.copy_disney {
position: relative;
width: calc( 100% - 13px);
width: -webkit-calc( 100% - 13px);
margin: 13px 13px 0 0;
text-align: right;
}






/*リード*/
.lead_area{
position: relative;
z-index: 5;
font-size: 16px;
line-height: 1.68;
text-align: center;
width: 100%;
margin: 80px auto 0 auto;
padding: 0;
color: #404040;
/*フォント句読点、約物は詰めない*/
-moz-font-feature-settings: "pkna" 1;
-webkit-font-feature-settings: "pkna" 1;
font-feature-settings: "pkna" 1;
letter-spacing: 0.06em;
}

.lead_area p{
margin: 0;
}



/*重要 lead area INDEXナビ */
.wrapper{
width: 100%;
overflow: visible;
margin: 0 auto;
padding: 100px 0 30px 0;
}


.wrapper .pc_show{
width: 100%;
}

#trig00 .h-wrap{
width: 920px;
/*outline: 0;*/
margin: 0 auto;
padding: 0;

/*全体 */
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
}



#trig00 .heart_slider{
position: relative;
text-align: center;
width: auto;
flex-basis: 154px;
height: 140px;
margin: 0 15px 0 15px;
cursor: pointer;

opacity: 1.0;
transition: opacity .3s;
-webkit-transition: opacity .3s;

user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none; /* リンク長押しのポップアップを無効化 */
-webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
}


#trig00 .heart_slider.fourth{
flex-basis: 154px;
margin: 0 15px 0 15px;
}

#trig00 .heart_slider.fifth{
flex-basis: 154px;
margin: 0 15px 0 15px;
}



#trig00 .heart_slider img{
position: relative;
margin: 0;
width: 100%;
height: auto;
user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none; /* リンク長押しのポップアップを無効化 */
-webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
}



#trig00 .heart_slider a{
color: #fff;
opacity: 1;
transition: all .3s;
-webkit-transition: all .3s;
}


#trig00 .heart_slider .text_area{
position: absolute;
z-index: 9;
top: 63px;
width: 100%;
text-align: center;
line-height: 1.4;

margin: 0;
/*DNP Shuei Gothic Kin Std BOLD*/
font-family: dnp-shuei-gothic-kin-std, sans-serif;
font-weight: 600;
font-style: normal;
font-size: 21px;
}

#trig00 .heart_slider .text_area div{
font-size: 14px;
}

#trig00 .heart_slider .photo_area{
position: relative;
z-index: 1;
}



/*01
------------------------------------------------------------------------------*/
#trig01{
width: 100%;
margin: 0;
padding: 50px 0 50px 0;
}

.sec01{
width: 100%;
margin: 0 auto;
padding: 0;
background: none;
}



/*01_01*/
.sec01_01{
position: relative;
width: 100%;
min-width: 1000px;
height: auto;
margin: 0 auto;
padding: 0;
/*全体 */
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
overflow: visible;
}

.sec01_01 .photo_area{
position: relative;
flex-basis: 45%;
margin: 0;
padding: 0;
}

.sec01_01 .photo_area .photo{
border-radius: 0px;
position: relative;
z-index: 1;
margin: 0;
padding: 0;
width: 100%;
height: 100%;
min-height: calc( 45vw / 1600 * 2400 );
min-height: -webkit-calc( 45vw / 1600 * 2400 );
background: url(../img/p01_01.jpg) no-repeat right center;
background-size: cover;
}


.sec01_01 .photo_area .copy_disney{
position: absolute;
z-index: 2;
bottom: 12px;
left: 12px;
text-align: left;
}

.sec01_01 .photo_area .copy_disney img{
width: auto;
height: auto;
}

.sec01_01 .photo_area h2.cathc_copy_pc{
position: absolute;
z-index: 2;
top: 33px;
left: 33px;
}

.sec01_01 .photo_area h3.cathc_copy_pc{
position: absolute;
z-index: 2;
top: 108px;
left: 33px;
color: #fff;
letter-spacing: 0.05em;
}

.sec01_01 .text_area{
position: relative;
flex-basis: 55%;
min-height: 890px;

margin: 0;
padding: 0;
overflow: visible;
background: linear-gradient(to bottom right, #ece8ff, #ffffff, #ece8ff, #ffffff, #ece8ff);/*グラデ紫*/
}



.sec01_01 .text_area .text_area_layout{
position: relative;
top: 50%;
-webkit-transform: translateY(-50%); /* Safari用 */
transform: translateY(-50%);
}




.base{
position: relative;
z-index: 1;
width: 390px;
height: 200px;
background: #fff;
border-radius: 20px;
}

.base.first{
left: calc( ( 55vw - 390px ) / 1.6 );
left: -webkit-calc( ( 55vw - 390px ) / 1.6 );
margin: 25px 0 0 0;
}

.base.second{
left: calc( ( 55vw - 390px ) / 4 );
left: -webkit-calc( ( 55vw - 390px ) / 4 );
margin: 90px 0 0 0;
}

.base.third{
left: calc( ( 55vw - 390px ) / 1.6 );
left: -webkit-calc( ( 55vw - 390px ) / 1.6 );
margin: 90px 0 0 0;
}

.base::before{
content: '';
position: absolute;
z-index: 2;
width: 390px;
height: 200px;
border: 1px solid #8c8c8c;
border-radius: 20px;
top: -5px;
left: -5px;
}

.base .icon_layout{
position: absolute;
z-index: 3;
top: 0px;
left: 0;
right: 0;
margin: -50px auto 0 auto;
width: 100%;
text-align: center;
height: 100px;
}

.base h4{
position: relative;
padding: 70px 0 20px 0;
margin: 0;
width: 100%;
font-size: 20px;
text-align: center;
}

.base .text_area_content{
position: relative;
left: 0;
right: 0;
width: 88%;
margin: 0 auto;
z-index: 3;
font-size: 14px;
line-height: 1.642;
color: #666;
padding: 0;
}



.base .text_area_content.third{
width: 88%;
}



.tyui_content{
position: absolute;
bottom: 18px;
width: 100%;
margin: 0 auto;
text-align: center;
font-size: 11px;
}


.base h4 .number{
margin: 0 7px 0 0;
}

.base h4 .tyui.blue_color{
color: #6596dd;
}

.base h4 .tyui.pink_color{
color: #f78ba8;
}

.base h4 .tyui.purple_color{
color: #b291d7;
}

/*02
------------------------------------------------------------------------------*/
#trig02{
width: 100%;
margin: 0 auto;
padding: 50px 0 50px 0;
}


.sec02{
width: 100%;
margin: 0 auto;
padding: 0;
}

.sec02 h2.cathc_copy{
width: 92%;
text-align: left;
margin: 0 auto;
}

.sec02 h2.cathc_copy img{
width: auto;
height: auto;
}

.sec02 h3.cathc_copy{
width: 92%;
text-align: left;
margin: 10px auto 0 auto;
font-size: 16px;
}

.sec02 .description_text{
margin: 40px auto 60px auto;
width: 92%;
text-align: left;
font-size: 16px;
color: #404040;
line-height: 2.0;
letter-spacing: 0.04em;
}





/*02_01*/
.sec02_01{
width: 100%;
margin: 0;
padding: 0;
}

.sec02_01{
position: relative;
width: 100%;
margin: 0;
padding: 0;
background: linear-gradient(to bottom right, #ece8ff, #ffffff, #ece8ff, #ffffff, #ece8ff);/*グラデ紫*/
}



.mySwiper_layout{
width: 100%;
padding: 55px 0 60px 0;
}

.mySwiper{
position: relative;
width: calc( 100% - 80px );
width: -webkit-calc( 100% - 80px );
padding: 0 0 0 80px;
height: 100%;
overflow: hidden;
}


.mySwiper .swiper-slide{
padding: 0 10px 0 10px;
-webkit-box-sizing: border-box;
box-sizing: border-box;

opacity: 1.0;
transition: opacity 0.4s ease-out;
-webkit-transition: opacity 0.4s ease-out;

user-select: none;
-webkit-user-select: none;
}

/*一番メイン*/
.mySwiper .swiper-slide.swiper-slide-active{

}

/*一番左　消すやつ*/
.mySwiper .swiper-slide.swiper-slide-prev{
opacity: 0.0;
transition: opacity 0.4s ease-out;
-webkit-transition: opacity 0.4s ease-out;
}
/*

.sec02-carousel-cell{
width: 100%;
}

.sec02-carousel-cell .photo_area{
width: 100%;
}

.sec02-carousel-cell .text_area{
margin: 20px 0 45px 0;
font-size: 13px;
line-height: 1.6;
color: #404040;
width: 100%;
text-align: center;
}

.sec02-carousel-cell .photo_area img{
border: 4px solid #fff;
-webkit-box-sizing: border-box;
box-sizing: border-box;

border-radius: 50%;
display: block;
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
object-fit: cover;
object-position: center;
}
*/


/*上書き*/
.swiper-button-next:after, .swiper-button-prev:after{
content: none;
}

/*前に戻る*/
.mySwiper .swiper-button-prev{
position: absolute;
top: 45px;
left: 40px;
bottom: auto;
right: auto;

z-index: 9999;
background: #ccb2d3;
border: none;
color: #fff;

width: 40px;
height: 40px;
border-radius: 50%;
transform: translateY(-50%);
}

.mySwiper .swiper-button-prev::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_prev.svg) center center no-repeat;
}



/*次に*/
.mySwiper .swiper-button-next{
position: absolute;
top: 90px;
left: 40px;
bottom: auto;
right: auto;

z-index: 9999;
background: #ccb2d3;
border: none;
color: #fff;

width: 40px;
height: 40px;
border-radius: 50%;
transform: translateY(-50%);
}

.mySwiper .swiper-button-next::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_next.svg) center center no-repeat;
}

/*スクロールバー*/
.mySwiper .swiper-scrollbar{
left:0;
right: 0;
bottom: 0;
margin: 0 auto;
width: 83vw;
height: 2px;
background: #fff;
}

.mySwiper .swiper-scrollbar-drag{
background: linear-gradient(to bottom right, #b2b8ff, #e1bbeb);
}











/*重要 PC*/
.wrapper_first{
position: relative;
margin: 0;
padding: 55px 0 0 0;
width: 100vw;
height: calc( 29vw + 100px );
height: -webkit-calc( 29vw + 100px );
overflow: hidden;
cursor: pointer;
user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none; /* リンク長押しのポップアップを無効化 */
-webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
}


/*LOOP スマホ
-----------------------------------------------------------------*/
.b-slider.marquee-slider{
position: relative;
width: 100%;
height: calc( 29vw + 100px );
height: -webkit-calc( 29vw + 100px );
outline: 0;
margin: 0 auto;
padding: 0;
}



.b-slider.marquee-slider .b-slider__slide{
position: relative;
text-align: center;
width: 29vw;
height: calc( 29vw + 100px );
height: -webkit-calc( 29vw + 100px );
margin: 0 2.5vw 0 0;
}


.marquee-slider .b-slider__slide .sec02-carousel-cell .photo_area img{
border: 4px solid #fff;
-webkit-box-sizing: border-box;
box-sizing: border-box;

border-radius: 50%;
display: block;
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
object-fit: cover;
object-position: center;

user-select: none;
-webkit-user-select: none;
-webkit-touch-callout: none; /* リンク長押しのポップアップを無効化 */
-webkit-user-select: none; /* テキスト長押しの選択ボックスを無効化 */
}


.marquee-slider .b-slider__slide .sec02-carousel-cell .text_area{
position: relative;
margin: 20px 0 45px 0;
font-size: 13px;
line-height: 1.6;
color: #404040;
width: 100%;
text-align: center;
}










.sec02_02{
width: 100%;
margin: 0 auto;
padding: 0;
}

.sec02_02 h2{
width: 100%;
text-align: center;
margin: 70px 0 50px 0;
}


/*サムネイル*/
.mySwiper02-thumbnail-layout{
position: relative;
width: 482px;
margin: 0 auto;
}

.mySwiper02-thumbnail{
position: relative;
z-index: 9999;
width: 482px;
margin: 0 auto;
}

/*サムネイル*/
.mySwiper02-thumbnail .swiper-slide.first{
position: relative;
width: 98px !important;
height: 55px;
margin: 0;
padding: 0;
}

.mySwiper02-thumbnail .swiper-slide.first .thunb_btn{
width: 98px;
text-align: center;
cursor: pointer;
margin: 0;
padding: 0;
}


.mySwiper02-thumbnail .swiper-slide.second{
position: relative;
width: 156px !important;
height: 55px;
margin: 0 80px 20px 80px;
}

.mySwiper02-thumbnail .swiper-slide.second .thunb_btn{
width: 156px;
text-align: center;
cursor: pointer;
margin: 0;
padding: 0;
}

.mySwiper02-thumbnail .swiper-slide.second .thunb_btn img{
width: 100%;
height: auto;
margin: 0;
padding: 0;
}

/*03*/
.mySwiper02-thumbnail .swiper-slide.third{
position: relative;
width: 68px !important;
height: 55px;
margin: 0;
padding: 0;
}

.mySwiper02-thumbnail .swiper-slide.third .thunb_btn{
width: 68px;
text-align: center;
cursor: pointer;
margin: 0;
padding: 0;
}

/*01*/
.mySwiper02-thumbnail .swiper-slide.first .thunb_btn::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
border-top: 2px solid #ccc;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
}

.mySwiper02-thumbnail .swiper-slide.first.swiper-slide-thumb-active .thunb_btn::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
border-top: 2px solid #ddb1b1;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
}


/*02*/
.mySwiper02-thumbnail .swiper-slide.second .thunb_btn::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
border-top: 2px solid #ccc;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
}

.mySwiper02-thumbnail .swiper-slide.second.swiper-slide-thumb-active .thunb_btn::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
border-top: 2px solid #ffab5e;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
}


/*03*/
.mySwiper02-thumbnail .swiper-slide.third .thunb_btn::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
border-top: 2px solid #ccc;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
}


.mySwiper02-thumbnail .swiper-slide.third.swiper-slide-thumb-active .thunb_btn::after{
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
border-top: 2px solid #84bfd1;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
}



.mySwiper_layout02{
position: relative;
width: 1170px;
margin: 0 auto;
padding:0 0 0 0;
}

.mySwiper_layout02 .description{
position: absolute;
z-index: 99;
top: 70px;
left: 0;
width: 100%;
text-align: center;
font-size: 16px;
line-height: 1.5;
color: #404040;
text-align: center;
padding: 40px 0 40px 0;
}


.mySwiper02{
position: relative;
width: 1170px;
padding: 90px 0 0 0;
border-radius: 15px;
background: linear-gradient(to bottom right, #ece8ff, #ffffff, #ece8ff, #ffffff, #ece8ff);/*グラデ紫*/
}

/*上書き*/
.mySwiper02 .swiper-pagination {
position: absolute;
bottom: -30px;
}

:root {
--swiper-theme-color: linear-gradient(to bottom right, #b2b8ff, #e1bbeb);/*グラデ紫*/
}


.swiper, .swiper-container {
overflow: visible;
}

.sec02_02-carousel-cell{
width: 1080px;
margin: 0 auto;
}

.sec02_02-carousel-cell ul{
width: 1080px;
margin: 0 auto;
/*全体 */
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
}


.sec02_02-carousel-cell ul li{
flex-basis: 240px;
height: auto;
margin: 0 40px 0 0;
padding: 0;
}

.sec02_02-carousel-cell ul li:nth-child(2n+1){
margin: 0 40px 0 0;
}


.sec02_02-carousel-cell ul li:last-child{
margin: 0;
}

.sec02_02-carousel-cell ul li .photo{
width: 100%;
}

.sec02_02-carousel-cell ul li .photo img{
width: 100%;
height: auto;
border-radius: 40px;
border: 4px solid #fff;
/*ボーダーボックス*/
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

.sec02_02-carousel-cell ul li .text{
margin: 30px 0 40px 0;
width: 100%;
font-size: 14px;
line-height: 1.5;
color: #666;
text-align: center;
}



/*上書き*/
.swiper-button-next:after, .swiper-button-prev:after{
content: none;
}

/*前に戻る*/
.mySwiper02 .swiper-button-prev{
position: absolute;
top: 240px;
left: -60px;
right: auto;

z-index: 9999;
background: #ccb2d3;
border: none;
color: #fff;

width: 40px;
height: 40px;
border-radius: 50%;
}

.mySwiper02 .swiper-button-prev::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_prev.svg) center center no-repeat;
}

/*次に*/
.mySwiper02 .swiper-button-next{
position: absolute;
top: 240px;
right: -60px;
left: auto;

z-index: 9999;
background: #ccb2d3;
border: none;
color: #fff;

width: 40px;
height: 40px;
border-radius: 50%;
}

.mySwiper02 .swiper-button-next::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_next.svg) center center no-repeat;
}







/*03
------------------------------------------------------------------------------*/
#trig03{
width: 100%;
margin: 0 auto;
padding: 50px 0 50px 0;
}


.sec03{
width: 100%;
margin: 0 auto;
padding: 0;
}


.sec03 h2.cathc_copy{
width: 92%;
text-align: left;
margin: 0 auto;
}

.sec03 h2.cathc_copy img{
width: auto;
height: auto;
}

.sec03 h3.cathc_copy{
width: 92%;
text-align: left;
margin: 10px auto 0 auto;
font-size: 16px;
}

.sec03 .description_text{
margin: 18px auto 40px auto;
padding: 0;
width: 92%;
text-align: left;
font-size: 16px;
color: #404040;
line-height: 2.0;
letter-spacing: 0.04em;
}




.sec03_01{
position: relative;
width: 100%;
margin: 0;
padding: 0;
}

/*背景*/
.sec03_01 .bg{
position: absolute;
z-index: -1;
top: 0;
left: 0;
width: 100%;
height: 260px;
background: linear-gradient(to bottom right, #ece8ff, #ffffff, #ece8ff, #ffffff, #ece8ff);/*グラデ紫*/
}


/*01_01*/
.sec03_01 .sanretu{
width: 801px;
margin: 0 auto 0 auto;
padding: 80px 0 30px 0;
/*全体 */
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
/*天地下に揃える */
-webkit-align-items: flex-end;
align-items:flex-end;
}



.sec03_01 .size_s{
position: relative;
flex-basis: 200px;
margin: 0;
padding: 0;
}

h3.size_title{
position: absolute;
z-index: 3;
top: -44px;
left: 10px;
}

.sec03_01 img.space{
width: auto;
height: 10px;
margin: 0 auto;
}



.sec03_01 .size_s .photo_area{
width: 100%;
border-radius: 40px;
}


.sec03_01 .size_s .photo_area img{
border: 4px solid #fff;
border-radius: 40px;
display: block;
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
object-fit: cover;
object-position: center;
}

.sec03_01 .size_s h4{
width: 100%;
text-align: center;
margin: 20px 0 18px 0;
}

.sec03_01 .size_s h4 img{
width: auto;
height: auto;
}

.sec03_01 .size_s .description_text_size{
margin: 0;
width: 100%;
text-align: center;
font-size: 13px;
color: #666;
line-height: 1.5;
}



.sec03_01 .size_m{
position: relative;
flex-basis: 217px;
margin: 0 70px 0 70px;
padding: 0;
}

.sec03_01 .size_m .photo_area{
width: 100%;
}
.sec03_01 .size_m .photo_area img{
border: 4px solid #fff;
border-radius: 40px;
display: block;
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
object-fit: cover;
object-position: center;
}

.sec03_01 .size_m h4{
width: 100%;
text-align: center;
margin: 20px 0 18px 0;
}

.sec03_01 .size_m h4 img{
width: auto;
height: auto;
}

.sec03_01 .size_m .description_text_size{
margin: 0;
width: 100%;
text-align: center;
font-size: 13px;
color: #666;
line-height: 1.5;
}


.sec03_01 .size_l{
position: relative;
flex-basis: 244px;
margin: 0;
padding: 0;
}

.sec03_01 .size_l .photo_area{
width: 100%;
}

.sec03_01 .size_l .photo_area img{
border: 4px solid #fff;
border-radius: 40px;
display: block;
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
object-fit: cover;
object-position: center;
}




.sec03_01 .size_l h4{
width: 100%;
text-align: center;
margin: 20px 0 18px 0;
}

.sec03_01 .size_l h4 img{
width: auto;
height: auto;
}

.sec03_01 .size_l .description_text_size{
margin: 0;
width: 100%;
text-align: center;
font-size: 13px;
color: #666;
line-height: 1.5;
}







/*02*/
.sec03_02{
width: 100%;
margin: 0;
padding: 0;
background: linear-gradient(to bottom right, #ece8ff, #ffffff, #ece8ff, #ffffff, #ece8ff);/*グラデ紫*/
}

.sec03_02 h2.cathc_copy{
width: 92%;
text-align: center;
margin: 0 auto;
padding: 50px 0 0 0;
}
.sec03_02 h2.cathc_copy img{
width: auto;
height: auto;
}


.mySwiper_layout03{
width: 840px;/*PADDING分たしている*/
margin: 0 auto;
padding: 55px 0 60px 0;
}

.mySwiper03{
position: relative;
width: 740px;
margin: 0 auto;
padding: 0 50px 0 50px;
height: 100%;
overflow: hidden;
}


.mySwiper03 .swiper-slide{
padding: 0 20px 0 20px;
-webkit-box-sizing: border-box;
box-sizing: border-box;

opacity: 0.0;
transition: opacity 0.4s ease-out;
-webkit-transition: opacity 0.4s ease-out;

user-select: none;
-webkit-user-select: none;
}

/*一番メイン*/
.mySwiper03 .swiper-slide.swiper-slide-active{
opacity: 1.0;
}

.mySwiper03 .swiper-slide.swiper-slide-next{
opacity: 1.0;
}

/*一番左　消すやつ*/
.mySwiper03 .swiper-slide.swiper-slide-prev{
opacity: 0.0;
transition: opacity 0.4s ease-out;
-webkit-transition: opacity 0.4s ease-out;
}


.sec03-carousel-cell{
width: 100%;
}

.sec03-carousel-cell .photo_area{
width: 100%;
margin: 0;
padding: 0;
}

.sec03-carousel-cell .text_area{
margin: 20px 0 45px 0;
font-size: 15px;
line-height: 1.6;
color: #404040;
width: 100%;
text-align: left;
}

.sec03-carousel-cell .photo_area img{
border: 4px solid #fff;
-webkit-box-sizing: border-box;
box-sizing: border-box;

border-radius: 20px;
display: block;
width: 100%;
height: auto;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
object-fit: cover;
object-position: center;
}


/*上書き*/
.swiper-button-next:after, .swiper-button-prev:after{
content: none;
}

/*前に戻る*/
.mySwiper03 .swiper-button-prev{
position: absolute;
top: 267px;
left: 0px;
right: auto;

z-index: 9999;
background: #ccb2d3;
border: none;
color: #fff;

width: 40px;
height: 40px;
border-radius: 50%;
transform: translateY(-50%);/*自分のサイズの半分上へ*/
}

.mySwiper03 .swiper-button-prev::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_prev.svg) center center no-repeat;
}



/*次に*/
.mySwiper03 .swiper-button-next{
position: absolute;
top: 267px;
right: 0px;
left: auto;

z-index: 9999;
background: #ccb2d3;
border: none;
color: #fff;

width: 40px;
height: 40px;
border-radius: 50%;
transform: translateY(-50%);
}

.mySwiper03 .swiper-button-next::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_next.svg) center center no-repeat;
}

/*スクロールバー*/
.mySwiper03 .swiper-scrollbar{
left:0;
right: 0;
bottom: 0;
margin: 0 auto;
width: 700px;
height: 2px;
background: #fff;
}

.mySwiper03 .swiper-scrollbar-drag{
background: linear-gradient(to bottom right, #b2b8ff, #e1bbeb);
}








/*04 PC
------------------------------------------------------------------------------*/
#trig04{
width: 100%;
margin: 0 auto;
padding: 50px 0 50px 0;
}

.sec04{
width: 100%;
margin: 0 auto;
padding: 0;
}


.sec04 h2.cathc_copy{
width: 92%;
text-align: left;
margin: 0 auto;
}

.sec04 h2.cathc_copy img{
width: auto;
height: auto;
}

.sec04 h3.cathc_copy{
width: 92%;
text-align: left;
margin: 10px auto 0 auto;
font-size: 16px;
}

.sec04 .description_text{
margin: 18px auto 60px auto;
width: 92%;
text-align: left;
font-size: 16px;
color: #404040;
line-height: 2.0;
letter-spacing: 0.04em;
}




.sec04_01{

}



/*ステップ01*/
.sec04_01 .step01{
position: relative;
margin: 0 auto;
width: 940px;
height: 140px;
border-radius: 70px;
background: linear-gradient(to bottom right, #ece8ff, #ffffff, #ece8ff, #ffffff, #ece8ff);/*グラデ紫*/


/*全体 */
display: block;
}

.sec04_01 .step01 .text_area{
width: auto;
margin: 0;
}


.sec04_01 .step01 .photo_area{
position: absolute;
top: 10px;
right: 50px;
margin: 0;
text-align: center;
width: 120px;
}

.sec04_01 .step01 .photo_area img{
width: 100%;
height: auto;
}


.sec04_01 .step01 h2{
position: absolute;
left: 60px;
top: 0;
bottom: 0;
margin: auto 0;
height: 53px;
}

.sec04_01 .step01 p{
margin: 0;
width: 100%;
font-size: 18px;
height: 140px;
line-height: 140px;
text-align: center;
color: #404040;
}



.sec04_01 .up_down{
width: 100%;
text-align: center;
margin: 40px 0;
}


/*ステップ02*/
.sec04_01 .step02{
position: relative;
margin: 0 auto;
width: 940px;
height: 140px;
border-radius: 70px;
background: linear-gradient(to bottom right, #f6f0f7, #ffffff, #f6f0f7, #ffffff, #f6f0f7);/*グラデ ピンク*/

/*全体 */
display: block;
}


.sec04_01 .step02 .text_area{
width: auto;
margin: 0;
}


.sec04_01 .step02 .photo_area{
position: absolute;
top: 10px;
right: 50px;
margin: 0;
text-align: center;
width: 120px;
}

.sec04_01 .step02 .photo_area img{
width: 100%;
height: auto;
}



.sec04_01 .step02 h2{
position: absolute;
left: 60px;
top: 0;
bottom: 0;
margin: auto 0;
height: 53px;
}

.sec04_01 .step02 p{
margin: 0;
width: 100%;
font-size: 18px;
height: 140px;
line-height: 140px;
text-align: center;
color: #404040;
}


.sec04_01 .tyui{
margin: 22px 0 0 0;
width: 100%;
font-size: 16px;
text-align: center;
color: #404040;
}





/*05
------------------------------------------------------------------------------*/
#trig05{
position: relative;
width: 100%;
margin: 0 auto;
padding: 50px 0 50px 0;
}


.sec05{
width: 100%;
margin: 0 auto;
padding: 0;
background: linear-gradient(to bottom right, #ece8ff, #ffffff, #ece8ff, #ffffff, #ece8ff);/*グラデ紫*/
}

.sec05 h2.cathc_copy{
width: 100%;
text-align: left;
margin: 0 auto;
padding: 0;
}

.sec05 h2.cathc_copy img{
width: auto;
height: auto;
}

.sec05 h3.cathc_copy{
position: relative;
text-align: left;
width: 100%;
height: auto;
margin: 20px 0 0 0;
}



/*02_01*/
.sec05_01{
width: 100%;
background: none;
}


.sec05_01 .niretu{
width: 100%;
/*全体 */
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
/*天地中央揃える */
-webkit-align-items: center;
align-items:center;
padding: 60px 0;
}

/*スマホの幅、145px*2 px*/
.sec05_01 .niretu .photo_area{
position: relative;
flex-basis: calc( 50% + 145px );
flex-basis: -webkit-calc( 50% + 145px );
margin: 0;
padding: 0;
}

.sec05_01 .niretu .text_area{
flex-basis: calc( 50% - 145px );
flex-basis: -webkit-calc( 50% - 145px );
margin: 0;
padding: 0;
}


.sec05_01 .niretu .text_area .text_area_layout{
position: relative;
margin: 0 auto;
width: 235px;
}


/*スマホのイラスト枠*/
.sec05_01 .niretu .photo_area .waku{
position: absolute;
z-index: 2;
top: 0;
left: 0;
width: auto;
height: auto;

transform: translateX(0%);
user-drag: none;
-webkit-user-drag: none;
-moz-user-select: none;
user-select: none;
}

.sec05_01 .niretu .photo_area .waku img{
width: auto;
height: auto;

user-drag: none;
-webkit-user-drag: none;
-moz-user-select: none;
user-select: none;
}








/*上書き*/
.sec05-carousel .flickity-button {
position: absolute;
z-index: 9999;
background: #ccb2d3;
border: none;
color: #fff;
}


/*ボタン基本*/
.sec05-carousel .flickity-prev-next-button {
top: calc( 50% + 85px );
top: -webkit-calc( 50% + 85px );
width: 40px;
height: 40px;
border-radius: 50%;
transform: translateY(-50%);
}

/*矢印　2種類*/
.sec05-carousel .flickity-button-icon{
display: none;
}

/*前に戻る*/
.sec05-carousel .flickity-button.previous{
left: calc( ( 50vw - 145px  - 234px ) / 2 * -1 - 234px );
right: auto;
bottom: 0;
top: 200px;
margin: auto 0;
}

.sec05-carousel .flickity-button.previous::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_prev.svg) center center no-repeat;
}



/*次に*/
.sec05-carousel .flickity-button.next{
left: calc( ( 50vw - 145px  - 234px ) / 2 * -1 - 234px + 50px );
right: auto;
bottom: 0;
top: 200px;
margin: auto 0;
}

.sec05-carousel .flickity-button.next::before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 40px;
height: 40px;
background: url(../img/ti_next.svg) center center no-repeat;
}



.sec05-carousel{
padding: 0;
}

.sec05-carousel-cell{
position: relative;
width: 290px;
height: 578px;
margin: 0 40px 0 0;
/*
background: #fff;
border-radius: 30px;
border: 1px solid #d9d9d9;
*/
/*ボーダーボックス*/
-webkit-box-sizing: border-box;
box-sizing: border-box;
}

/*基本*/
.sec05-carousel-cell .layout{
transform: scale(0.92);
z-index: 9;

width: 290px;
height: 578px;
border-radius: 30px;
background: #fff;
border: 1px solid #d9d9d9;
/*ボーダーボックス*/
-webkit-box-sizing: border-box;
box-sizing: border-box;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;

display: flex;
justify-content: center;
align-items: center;
}


/* 選択！*/
.sec05-carousel-cell.is-selected .layout{
transform: scale(1);
z-index: 9;

width: 290px;
height: 578px;
border-radius: 30px;
background: #fff;
border: 1px solid #fff;
/*ボーダーボックス*/
-webkit-box-sizing: border-box;
box-sizing: border-box;
transition: all 0.4s ease-out;
-webkit-transition: all 0.4s ease-out;
}

.sec05-carousel-cell .layout .layout_center{
width: 100%;
}



.sec05-carousel-cell .icon_area{
position: relative;
padding: 0;
width: 100%;
text-align: center;
}

.sec05-carousel-cell .icon_area img{
width:112px;
}

.sec05-carousel-cell .comment_area{
width: 88%;
margin: 20px auto 0 auto;
text-align: center;

font-size: 15.5px;
line-height: 1.6;
color: #404040;

/*DNP Shuei Gothic Kin Std BOLD*/
font-family: dnp-shuei-gothic-kin-std, sans-serif;
font-weight: 600;
font-style: normal;
}



.sec05-carousel-cell .name_area{
margin: 20px 0 0 0;
width: 100%;
text-align: center;

font-size: 14px;
color: #666;
}

.star_area{
position: absolute;
width: 100%;
text-align: center;
left: 0;
bottom: 20px;
}


.star_area img{
width: auto;
height: auto;
}





/*最後のCheck all item
---------------------------------------------------------------*/
.more-btn{
position: relative;
overflow: visible;
margin: 35px auto 0 auto;
padding: 0;
top: 0px;
left: 0px;
width: 670px;
height: 100px;
line-height: 100px;

background: #ccb2d3;/*色*/

border-radius: 12px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-ms-box-sizing: border-box;

-webkit-transition-delay: .1s;
transition-delay: .1s;
-webkit-transition: all .2s;
transition: all .2s;
cursor: pointer;

opacity: 1;

-webkit-transition: all .6s ease .0s;
transition: all .6s ease .0s;
}

.more-btn:hover{
opacity: 0.8;
-webkit-transition: all .6s ease .0s;
transition: all .6s ease .0s;
}

/*テキスト*/
.more-btn .text_area{
position: absolute;
top: 0;
left: 0;
width: 100%;
text-align: center;
height: 100px;

-webkit-transition: opacity .6s ease .0s;
transition: opacity .6s ease .0s;
}

/*矢印*/
.more-btn .arrow{
position: absolute;
top: 0;
bottom: auto;
right: 20px;
-webkit-transition: opacity .6s ease .0s;
transition: opacity .6s ease .0s;
}

.more-btn .arrow img{
height: auto;
width: auto;
}

.more-btn a{
position: absolute;
top: 0;
left: 0;
z-index: 12;
width: 100%;
height:100%;
}








/*フッター PC
-----------------------------------------------------------------------------*/
.footer_area{
position: relative;
z-index: 4;
width: 100%;
margin: 0;
padding: 0;
background: #fff;
}



/*SNSエリア*/
.share_staff{
width: 425px;
margin: 0 auto 0 auto;
padding: 100px 0;

/*全体 */
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
}


h4.sns_title{
width: auto;
flex-basis: 54px;
display: block;
margin: 0;
padding: 0;
}
h4.sns_title:before,
h4.sns_title:after {
display: none;
}

ul.sns{
height: 24px;
flex-basis: 371px;
margin: 0;
padding: 0;
height: auto;
}

ul.sns li{
display: inline-block;
width: auto;
margin: 0;
padding: 0;
font-size: 0px;
}

ul.sns li:first-child{
display: inline-block;
width: 86px;
margin: 0 35px 0 35px;
}

ul.sns li:nth-child(2){
width: 108px;
margin: 0 35px 0 0;
}

ul.sns li:nth-child(3){
width: 72px;
margin: 0;
}




ul.sns li a{
transition:opacity 0.3s ease;
}

ul.sns li img{
vertical-align:middle;
}

ul.sns li a:hover{
opacity:0.5;
}



.follow_us{
width: 92%;
margin: 0 auto 0 auto;
padding: 0 0 80px 0;
border-bottom: 1px solid #B2B2B2;
}

.follow_us h3{
display: flex;
align-items: center;
}

.follow_us h3:before,
.follow_us h3:after{
content: "";
height: 1px;
flex-grow: 1;
background-color: #B2B2B2;
}

.follow_us h3:before{
margin-right: 30px;
}

.follow_us h3:after{
margin-left: 30px;
}

.follow_us .niretu{
width: 446px;
margin: 80px auto 0 auto;
/*全体 */
display: -webkit-flex;
display: flex;
flex-wrap: wrap;
/*天地中央揃える */
-webkit-align-items: center;
align-items:center;
}


/*公式*/
.follow_us .niretu .official{
flex-basis: 151px;
margin: 0 75px 0 0;
}

.follow_us .niretu .official a{
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}

.follow_us .niretu .official a:hover{
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
opacity: 0.5;
}


.follow_us .niretu .sns_link{
flex-basis: 220px;
}



.follow_us .niretu .sns_link ul{
width: 120px;
margin: 0 auto;
padding: 0;
height: 30px;
display: flex;
}

.sns_link ul li{
display: inline-block;
width: auto;
height: 30px;
margin: 0;
padding: 0;
font-size: 0px;
}

.sns_link ul li img{
height: 100%;
width: auto;
}

.sns_link ul li a{
margin: 0;
padding: 0;
}



.sns_link ul li:first-child{
width: 30px;
margin: 0;
padding: 0;
flex-grow: 1;
text-align: left;
}

.sns_link ul li:nth-child(2){
width: 30px;
margin: 0;
padding: 0;
flex-grow: 1;
text-align: center;
}


.sns_link ul li a{
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}

.sns_link ul li img{
vertical-align:middle;
width: auto;
height: auto;
}

.sns_link ul li a:hover{
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
opacity: 0.6;
}




.link_ec{
width: 680px;
margin: 50px auto 0 auto;
padding: 0;
}

.link_ec ul{
width: 680px;
margin: 0 auto;
padding: 0;
text-align: center;
list-style:none;
font-size:0;
}

.link_ec ul li{
display: inline-block;
width: 330px;
height: 110px;
background: #ccb2d3;/*色*/
border-radius: 12px;

margin: 0 20px 20px 0;
padding: 0;
font-size: 0px;
text-align: center;

transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}

.link_ec ul li:nth-child(2n){
display: inline-block;
margin: 0 0 20px 0;
}

.link_ec ul li a{
margin: 0;
padding: 0;
}

.link_ec ul li:hover{
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
opacity: 0.7;
}



/*最後の注意書き*/
.last_message{
width: 100%;
margin: 0;
padding: 50px 0 0 0;
}

.last_message p{
width: 100%;
text-align: center;
margin: 0;
padding: 0;
font-size: 13px;
line-height: 2.0;
color: #666;
/*フォント句読点、約物は詰めない*/
-moz-font-feature-settings: "pkna" 1;
-webkit-font-feature-settings: "pkna" 1;
font-feature-settings: "pkna" 1;
letter-spacing: 0.0em;
}


/*ロゴ ONWARD*/
.logo_onward_crosset{
width: 180px;
height: auto;
margin: 60px auto 0 auto;
}

.logo_onward_crosset img{
width: 100%;
height: auto;
}



/*Insta Onward*/
.insta_onward_crosset{
width: 32px;
height: auto;
margin: 30px auto 0 auto;
}

.insta_onward_crosset img{
width: 100%;
height: auto;
}




.copy{
width: 100%;
text-align: center;
margin: 30px auto 30px auto;
padding: 0;
}
.copy img{
width: auto;
height: auto;
}










/*ページトップ*/
#pagetop{
position: fixed;
z-index: 90;
right: 15px;
bottom: 15px;
opacity: 0;
cursor: pointer;
/*選択禁止*/
user-select: none;
-webkit-user-select: none;
}


#pagetop img{
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
}

#pagetop img:hover{
transition: opacity .6s ease .0s;
-webkit-transition: opacity .6s ease .0s;
opacity: 0.5;
}











}/*768px PC・タブレット終了*/










/**/







/*
* FMJ ORIGINAL ANIMATION
* Copyright
* FMJ inc. All rights Reserved
* 無断転載・転用・複製を固く禁じます。
*/

.fmj-text{
position: relative;
display: block;
transition: all 1.9s ease;
-webkit-transition: all 1.9s ease;
}


.fmj-text-slow{
position: relative;
display: block;
transition: all 3.5s ease;
-webkit-transition: all 3.5s ease;
}

/*左から右---------------------------------------------*/
.fmj-text.left {
-webkit-clip-path: inset(0 100% 0 0);
clip-path: inset(0 100% 0 0);
}

.fmj-text.left.scrollin{
-webkit-clip-path: inset(0);
clip-path: inset(0);
}

.fmj-text.reveal.left{
-webkit-clip-path: inset(0);
clip-path: inset(0);
}



/*斜め---------------------------------------------*/
.fmj-text.skew{
position: relative;
-webkit-fmj-path: polygon(0 0, 0 0, 0 0);
clip-path: polygon(0 0, 0 0, 0 0);
transform-origin: right top;
-webkit-transform-origin: right top;
}

.fmj-text.skew.scrollin{
-webkit-fmj-path: polygon(0 0, 200% 0, 0 200%);
clip-path: polygon(0 0, 200% 0, 0 200%);
}

.fmj-text.reveal.skew{
-webkit-fmj-path: polygon(0 0, 200% 0, 0 200%);
clip-path: polygon(0 0, 200% 0, 0 200%);
}


/*斜めSLOW---------------------------------------------*/
.fmj-text-slow.skew{
-webkit-fmj-path: polygon(0 0, 0 0, 0 0);
clip-path: polygon(0 0, 0 0, 0 0);
transform-origin: right top;
-webkit-transform-origin: right top;
}

.fmj-text-slow.skew.scrollin{
-webkit-fmj-path: polygon(0 0, 200% 0, 0 200%);
clip-path: polygon(0 0, 200% 0, 0 200%);
transform-origin: right top;
-webkit-transform-origin: right top;
}

.fmj-text-slow.reveal.skew{
-webkit-fmj-path: polygon(0 0, 200% 0, 0 200%);
clip-path: polygon(0 0, 200% 0, 0 200%);
}


/*下から
---------------------------------------------*/
.fmj-text.from_bottom{
-webkit-clip-path: inset(100% 0 0 0);
clip-path: inset(100% 0 0 0);
}

.fmj-text.from_bottom.scrollin{
-webkit-clip-path: inset(0);
clip-path: inset(0);
}



/*Delay-------------------------------*/
.delay01{
transition-delay: 0.1s;
-webkit-transition-delay: 0.1s;
}

.delay02{
transition-delay: 0.2s;
-webkit-transition-delay: 0.2s;
}

.delay03{
transition-delay: 0.3s;
-webkit-transition-delay: 0.3s;
}

.delay04{
transition-delay: 0.4s;
-webkit-transition-delay: 0.4s;
}

.delay05{
transition-delay: 0.5s;
-webkit-transition-delay: 0.5s;
}

.delay06{
transition-delay: 0.6s;
-webkit-transition-delay: 0.6s;
}

.delay07{
transition-delay: 0.7s;
-webkit-transition-delay: 0.7s;
}

.delay08{
transition-delay: 0.8s;
-webkit-transition-delay: 0.8s;
}

.delay09{
transition-delay: 0.9s;
-webkit-transition-delay: 0.9s;
}

.delay10{
transition-delay: 1.0s;
-webkit-transition-delay: 1.0s;
}

.delay11{
transition-delay: 1.1s;
-webkit-transition-delay: 1.1s;
}

.delay12{
transition-delay: 1.2s;
-webkit-transition-delay: 1.2s;
}
/*Delay-------------------------------*/










































/**/
