@charset "utf-8";
/* CSS Document */

/* base
-----------------------------------------------*/
/* ========== base style ========== */

/* common parts
-----------------------------------------------*/
/* ========== text ========== */
/* ========== border ========== */
/* ========== float ========== */
/* ========== display ========== */
/* ========== position ========== */
/* ========== overflow ========== */
/* ========== width ========== */
/* ========== margin ========== */
/* ========== background ========== */
/* ========== device displaying ========== */
/* ========== animation for ScrollTrigger.min.js  ========== */

/* other style
-----------------------------------------------*/



/* base
-----------------------------------------------*/
picture {
display: block;
}

/* ========== base style ========== */
.allwrapper,
.modal {
width: 100%;
min-height: 100vh;
overflow: hidden;
color: #000;
font-family: noto-serif, serif;
font-style: normal;
font-weight: 400;
font-size: 3.73333333vw;
line-height: 100%;
letter-spacing: 0;
background: #fff;
animation-delay: 0.75s;
}
.modal {
min-height: auto;
}
.allwrapper *,
.modal * {
box-sizing: border-box;
}
.allwrapper a:link,
.allwrapper a:visited,
.allwrapper .acordion_btn {
color: #fff;
text-decoration: none;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all  0.3s ease;
}
.allwrapper a:hover,
.allwrapper a:hover img,
.allwrapper button:hover img {
opacity: 0.80;
filter: alpha(opacity=80);
}
.allwrapper ol,
.allwrapper ul {
list-style:none;
}
.allwrapper img, 
.allwrapper video,
.allwrapper button {
width: 100%;
height: auto;
display: block;
margin-left: auto;
margin-right: auto;
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
transition: all  0.3s ease;
}
@media (min-width:768px){
	.allwrapper,
	.modal {
	width: 100vw;
	font-size: 13px;
	}
}
@media (min-width:1100px){
	.allwrapper,
	.modal {
	width: 100%;
	font-size: 17px;
	}
}

/* common parts
-----------------------------------------------*/
/* ========== text ========== */
/* align */
.al_left { text-align: left; }
.al_center { text-align: center; }
.al_right { text-align: right; }

/* size */
.fs8 { font-size: 2.133333vw; }
.fs9 { font-size: 2.4vw; }
.fs10 { font-size: 2.666666vw; }
.fs11 { font-size: 2.933333vw; }
.fs11_5 { font-size: 3.066666vw; }
.fs12 { font-size: 3.2vw; }
.fs12_5 { font-size: 3.33333333vw; }
.fs13 { font-size: 3.466666vw; }
.fs13_5 { font-size: 3.6vw; }
.fs14 { font-size: 3.733333vw; }
.fs15 { font-size: 4vw; }
.fs16 { font-size: 4.266666vw; }
.fs17 { font-size: 4.533333vw; }
.fs18 { font-size: 4.8vw; }
.fs19 { font-size: 5.066666vw; }
.fs20 { font-size: 5.333333vw; }
@media (min-width:768px){
	.fs11 { font-size: 11px; }
	.fs14 { font-size: 14px; }
}

/* weight */
.fw200 { font-weight: 200 !important; }
.fw300 { font-weight: 300 !important; }
.fw400 { font-weight: 400 !important; }
.fw500 { font-weight: 500 !important; }
.fw600 { font-weight: 600 !important; }
.fw700 { font-weight: 700 !important; }

/* line height */
.lh100 { line-height: 100%; }
.lh110 { line-height: 110%; }
.lh120 { line-height: 120%; }
.lh130 { line-height: 130%; }
.lh140 { line-height: 140%; }
.lh150 { line-height: 150%; }
.lh160 { line-height: 160%; }
.lh170 { line-height: 170%; }
.lh180 { line-height: 180%; }
.lh190 { line-height: 190%; }
.lh200 { line-height: 200%; }
.lh210 { line-height: 210%; }

/* letter space */
.ltrspace0 { letter-spacing: 0; }
.ltrspace0025 { letter-spacing: 0.025em; }
.ltrspace005 { letter-spacing: 0.05em; }
.ltrspace0075 { letter-spacing: 0.075em; }
.ltrspace01 { letter-spacing: 0.1em; }
.ltrspace0125 { letter-spacing: 0.125em; }
.ltrspace015 { letter-spacing: 0.15em; }

/* line */
.deco_line { text-decoration: underline; }


/* ========== float ========== */
/* clearfix */
.clearfix:before,
.clearfix:after {
display: table;
content: " ";
}
.clearfix:after { clear: both; }

/* float */
.float_left { float: left; }
.float_right { float: right; }


/* ========== display ========== */
.disp_block { display: block !important; }
.disp_iblock { display: inline-block !important; }
.disp_inline { display: inline !important; }
.disp_none { display: none; }
.disp_flex { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-start; }


/* ========== position ========== */
.posi_relative { position: relative !important; }
.posi_absolute { position: absolute !important; }
.posi_fixed { position: fixed !important; }


/* ========== overflow ========== */
.overflow_hidden { overflow: hidden !important; }


/* ========== margin ========== */
/* margin-auto */
.mx_auto { margin-left: auto; margin-right: auto; }


/* ========== device displaying ========== */
.sp_none{ display: none; }
img.sp_none{ display: none; }
.sp_only{ display: block; }
img.sp_only{ display: block; }
@media (min-width:768px){
	.sp_none{display: block;}
	img.sp_none{display: block;}
	.tab_none { display: none; }
	img.tab_none { display: none; }
	.sp_only{display: none;}
	img.sp_only{display: none;}
	.sp_only{display: none;}
	img.sp_only{display: none;}
}
.spc_none{ display: block; }
@media (min-width:999px){.pc_none{display: block;}}
.pc_only{ display: none; }
@media (min-width:1000px){.pc_none{display: none;}
.pc_only{display: block;}
.tab_none{ display: block; }
}


/* ========== animation for ScrollTrigger.min.js  ========== */
.invisible {
transition: opacity 1s ease;
opacity: 0.0;
}
.visible {
transition: opacity 1s ease;
opacity: 1.0;
}



/* other style
-----------------------------------------------*/
body.static .wrapper {
margin-top: 0;
}
.footer {
position: relative;
background: #fff;
z-index: 2;
}
.ff_yugo { font-family: yu-gothic-pr6n, sans-serif; font-weight: 400; font-feature-settings: "palt"; }

.mv { width: 100%; min-height: 140vw; }
.mv_title { width: 100%; top: 0; left: 0; animation-delay: 1.5s; }
@media (min-width:768px){
	.mv { min-height: 46.8vw; }
	.mv picture { width: 128%; margin-left: -14%; }
	.mv_title { width: 23.21%; top: 6vw; left: 2.8%; }
}
@media (min-width:1100px){
	.mv picture { width: 100%; margin-left: 0; }
	.mv_title { top: 4.64vw; left: 3.84%; }
}

.allwrapper h2 { position: relative; z-index: 3; }
.crossfade { overflow: hidden; background: #fff; }
.modal_open {
position: relative;
display: block;
background: #fff;
cursor: pointer;
-webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease;
}
.ico_item { position: absolute; bottom: 2.13vw; width: 21.333333vw; }
.ico_item.right { right: 2.13vw; }
.ico_item.left { left: 2.13vw; }
.modal_open:hover img { opacity: 0.7; }
@media (min-width:768px){
	.ico_item { width: 85px; bottom: 10px; }
	.ico_item.right { right: 10px; }
	.ico_item.left { left: 10px; }
}

.intro { margin-top: 14.66vw; }
video.intro_movie { width: 66.66666666%; margin-top: 14.66vw; }
.intro_texts { margin-top: 13.33vw; }
.intro_title { width: 50.13333333%; }
.intro_texts p { margin-top: 9.33vw; }
@media (min-width:768px){
	.intro { display: flex; justify-content: space-between; align-items: center; width: 520px; margin-top: 70px; }
	video.intro_movie { width: 190px; margin: 0; }
	.intro_texts { margin-top: 0; }
	.intro_title { width: 140px; }
	.intro_texts p { margin-top: 25px; font-size: 12px; }
}
@media (min-width:1000px){
	.intro { width: 674px; margin-top: 95px; }
	video.intro_movie { width: 250px; }
	.intro_title { width: 180px; }
	.intro_texts p { margin-top: 38px; font-size: 15px; }
}

.lineup { margin-top: 18.66vw; padding: 6.66vw 0 1px; background: url("../images/lineup-bg_sp.jpg") top center / cover; }
.lineup_title { width: 29.86666666%; }
.lineup_list { width: 88.26666666%; margin-top: 4vw; }
.lineup_list li { width: 42.66666666vw; margin-bottom: 6.66vw; background: #fff; }
@media (min-width:768px){
	.lineup { margin-top: 30px; padding: 40px 0 50px; background: url("../images/lineup-bg_pc.jpg") top center / cover; }
	.lineup_title { width: 134px; }
	.lineup_list { width: 630px; margin-top: 15px; }
	.lineup_list li { width: 150px; margin-bottom: 0; }
}
@media (min-width:1000px){
	.lineup { margin-top: 40px; padding: 50px 0 70px; }
	.lineup_title { width: 110px; }
	.lineup_list { width: 820px; margin-top: 18px; }
	.lineup_list li { width: 193px; }
}

.btn_allitems { width: 68%; max-width: 255px; }
.btn01 { margin-top: 13.33vw; }
.btn02 { margin-top: 13.33vw; }
@media (min-width:768px){
	.btn01 { margin-top: 38px; }
	.btn02 { margin-top: 50px; }
}
@media (min-width:1000px){
	.btn01 { margin-top: 50px; }
	.btn02 { margin-top: 65px; }
}

.look01_bg01 { width: 100%; margin-top: 20vw; }
.look01_img01 { width: 85.06666666%; margin: -154.4vw 0 auto 11.73333333%; }
.look01_img01 .crossfade { height: 114vw; }
img.look01_img02 { width: 46.93333333%; margin: 4.26vw auto 0 0; }
img.look01_img03 { width: 46.93333333%; margin: -50.93vw auto 0 49.33333333%; }
@media (min-width:768px){
	.look01_bg01 { width: 433px; margin: 80px auto 0 calc(50% - 108px); }
	.look01_img01 { width: 295px; margin: -419px 0 auto calc(50% + 19px); }
	.look01_img01 .crossfade { height: 395px; }
	img.look01_img02 { width: 164px; margin: -346px 0 auto calc(50% - 325px); }
	img.look01_img03 { width: 164px; margin: -160px 0 auto calc(50% - 154px); }
}
@media (min-width:1000px){
	.look01_bg01 { width: 562px; margin: 100px auto 0 calc(50% - 140px); }
	.look01_img01 { width: 382px; margin: -548px 0 auto calc(50% + 25px); }
	.look01_img01 .crossfade { height: 512px; }
	img.look01_img02 { width: 210px; margin: -450px 0 auto calc(50% - 422px); }
	img.look01_img03 { width: 210px; margin: -207px 0 auto calc(50% - 200px); }
}

.look02_bg01 { width: 65.06666666%; margin: 38.66vw auto 0 0; }
img.look02_img01 { width: 88%; margin: -196.26vw auto 0; }
.look02_img02 { width: 66.66666666%; margin: 2.66vw auto 0 31.2%; }
.look02_img02 .crossfade { height: 92.22133vw; }
@media (min-width:768px){
	.look02_bg01 { width: 227px; margin: 230px auto 0 calc(50% - 102px); }
	img.look02_img01 { width: 305px; margin: -565px auto 0 calc(50% - 277px); }
	.look02_img02 { width: 230px; margin: -188px auto 0 calc(50% + 46px); }
	.look02_img02 .crossfade { height: 318px; }
}
@media (min-width:1000px){
	.look02_bg01 { width: 294px; margin: 300px auto 0 calc(50% - 133px); }
	img.look02_img01 { width: 396px; margin: -737px auto 0 calc(50% - 360px); }
	.look02_img02 { width: 300px; margin: -247px auto 0 calc(50% + 60px); }
	.look02_img02 .crossfade { height: 415px; }
}

.interval01 { width: 100%; margin: 13.33vw auto 0; padding: 11.2vw 0 4.26vw; background: url("../images/interval01-bg01.jpg") top center / cover; }
.interval01_img01 { width: 85.06666666%; height: 113.7vw; margin-left: 4%; }
img.interval01_text01 { width: 53.6%; top: 0.533vw; left: 46.13333333%; }
@media (min-width:768px){
	.interval01 { width: 348px; margin: 85px auto 0; padding: 38px 0 15px; }
	.interval01_img01 { width: 295px; height: 394px; margin-left: 14px; }
	img.interval01_text01 { width: 185px; top: 3px; left: 161px; }
}
@media (min-width:1000px){
	.interval01 { width: 450px; margin: 112px auto 0; padding: 52px 0 20px; }
	.interval01_img01 { width: 383px; height: 512px; margin-left: 18px; }
	img.interval01_text01 { width: 241px; top: 4px; left: 207px; }
}

.look03_img01 { width: 94.4%; margin: 13.6vw 0 0 auto; }
.look03_img01 .crossfade { height: 125.792vw; }
@media (min-width:768px){
	.look03_img01 { width: 326px; margin: 58px auto 0; }
	.look03_img01 .crossfade { height: 434px; }
}
@media (min-width:1000px){
	.look03_img01 { width: 424px; margin: 75px auto 0; }
	.look03_img01 .crossfade { height: 565px; }
}

.look04_look05 { width: 100%; margin: 13.33vw auto 0; padding: 7.2vw 0 8.53vw; background: url("../images/look04-05-bg01.jpg") top center / cover; }
.look04_img01 { width: 90.66666666%; margin: 0 auto 0 0; }
.look04_img01 .crossfade { height: 121.1vw; }
.look05_img01 { width: 90.66666666%; margin: 4vw 0 0 auto; }
.look05_img01 .crossfade { height: 121.1vw; }
@media (min-width:768px){
	.look04_look05 { margin: 60px auto 0; padding: 30px 0; }
	.look04_img01 { width: 315px; margin: 0 auto 0 calc(50% - 333px); }
	.look04_img01 .crossfade { height: 420px; }
	.look05_img01 { width: 315px; margin: -343px auto 0 calc(50% - 4px); }
	.look05_img01 .crossfade { height: 420px; }
}
@media (min-width:1000px){
	.look04_look05 { margin: 75px auto 0; padding: 40px 0; }
	.look04_img01 { width: 408px; margin: 0 auto 0 calc(50% - 435px); }
	.look04_img01 .crossfade { height: 545px; }
	.look05_img01 { width: 408px; margin: -343px auto 0 calc(50% - 6px); }
	.look05_img01 .crossfade { height: 545px; }
}

.outro { width: 100%; margin-top: 13.33vw; padding: 7.46vw 0 8.8vw; background: url("../images/outro-bg.jpg") top center / cover; }
img.outro_text01 { width: 49.33333333%; }
img.outro_img { width: 56.53333333%; margin-top: 2.66vw; }
img.outro_text02 { width: 42.4%; margin-top: 5.33vw; }
@media (min-width:768px){
	.outro { width: 346px; margin-top: 60px; padding: 26px 0 30px; }
	img.outro_text01 { width: 172px; }
	img.outro_img { width: 196px; margin-top: 10px; }
	img.outro_text02 { width: 150px; margin-top: 18px; }
}
@media (min-width:1000px){
	.outro { width: 450px; margin-top: 75px; padding: 33px 0 40px; }
	img.outro_text01 { width: 223px; }
	img.outro_img { width: 337px; margin-top: 14px; }
	img.outro_text02 { width: 190px; margin-top: 23px; }
}

.bottomarea { padding: 10.66vw 0 0; }
.bottomarea *,
.bottomarea a { color: #000 !important; }
.bottomarea_banner { width: 88%; }
.bottomarea_staffcredit { margin-top: 16vw; }
.brandlogo { padding-bottom: 10vw; margin-top: 20vw; }
.brandlogo img { width: 50px; margin-bottom: 10px; }
@media (min-width:768px){
	.bottomarea { padding-top: 62px; }
	.bottomarea_banner { width: 300px; }
	.bottomarea_staffcredit { margin-top: 70px; font-size: 13px; }
	.brandlogo { margin-top: 100px; padding-bottom: 100px; font-size: 13px; }
	.brandlogo img { width: 85px; margin-bottom: 12px; }
}

.modal {
z-index: 200;
}
.modal__container{
z-index: 9000;
position: fixed;
top: -150vh;
left: 0;
width: 100%;
height: 101%;
text-align: center;
background: url("../images/modal-bg.jpg") center center / cover;
padding: 70px 0 32.27vw;
overflow: auto;
opacity: 0;
visibility: hidden;
box-sizing: border-box;
}
.modal__container.is-active{
visibility: visible;
top: 0;
}
.modal__close-btn {
position: fixed;
top: 6vw;
right: 3.7vw;
width: 22px;
cursor: pointer;
}
img.modal__close-btn-img { width: 100%; height: auto; }
.modal__content { text-align: left; color: #454444; }
.modal_box + .modal_box { padding-top: 20vw; }
.modal_pricebox { width: 93.33333333%; }
.modal_pricebox li { margin-top: 4vw; }
.modal_pricebox li a { color: #fff; align-items: center; }
.modal_itemname { margin-right: 15px; color: #fff; }
.modal_line { flex-grow: 1; background: url("../images/modal-item-bg.png") center left / 8px auto repeat-x; }
.modal_buy { width: 50px; margin-left: 15px; }
@media (min-width:768px){
	.modal__container { padding-bottom: 100px; }
	.modal__close-btn { top: 30px; right: 30px;	}
	.modal_item { width: 375px; }
	.modal_box + .modal_box { padding-top: 50px; }
	.modal_pricebox { width: 100%; }
	.modal_pricebox li { margin-top: 15px; }
	.modal_buy { width: 55px; }
}
@media (min-width:1100px){
	.modal__close-btn { top: 50px; right: calc(50% - 500px); }
	.modal__content { display: flex; justify-content: space-between; flex-wrap: wrap; width: 780px; }
	#modal02 { padding-top: 0; }
}