@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 {

width: 100%;

min-height: 100vh;

color: #141e14;

font-family: acumin-pro-condensed, sans-serif;

font-style: normal;

font-weight: 400;

font-size: 3.73333333vw;

line-height: 100%;

letter-spacing: 0.025em;

background: #141e14;

animation-delay: 0.75s;

}

.allwrapper * {

box-sizing: border-box;

}

.allwrapper a:link,

.allwrapper a:visited,

.allwrapper .acordion_btn {

color: #141e14;

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:375px){

	.allwrapper {

	font-size: 14px;

	}

}

@media (min-width:768px){

	.allwrapper {

	width: 100vw;

	}

}



/* 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; }

.fs12 { font-size: 3.2vw; }

.fs13 { font-size: 3.466666vw; }

.fs14 { font-size: 3.733333vw; }

.fs15 { font-size: 4vw; }

.fs16 { font-size: 4.266666vw; }

.fs17 { font-size: 4.533333vw; }

.fs18 { font-size: 4.8vw; }

.fs20 { font-size: 5.3333333vw; }

@media (min-width:375px){

	.fs8 { font-size: 8px; }

	.fs9 { font-size: 9px; }

	.fs10 { font-size: 10px; }

	.fs11 { font-size: 11px; }

	.fs12 { font-size: 12px; }

	.fs13 { font-size: 13px; }

	.fs14 { font-size: 14px; }

	.fs15 { font-size: 15px; }

	.fs16 { font-size: 16px; }

	.fs17 { font-size: 17px; }

	.fs18 { font-size: 18px; }

	.fs20 { font-size: 20px; }

}



/* 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; }

.fw800 { font-weight: 800 !important; }

.fw900 { font-weight: 900 !important; }



/* line height */

.lh100 { line-height: 100%; }

.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%; }

.lh225 { line-height: 225%; }



/* 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; }





/* ========== 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:1099px){.pc_none{display: block;}}

.pc_only{ display: none; }

@media (min-width:1100px){.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;

}

.contentsfooter {

position: relative;

background: #fff;

z-index: 2;

}

.help-area,

.sns-area,

.group-area {

background: #fff;

border-top: 1px solid #ddd;

}

#ch-plugin {

display: none !important;

}

@media (min-width:768px){

	.contentsfooter-inner {

	background: #fff;

	border-top: 1px solid #C9C9C9;

	}

	.contentsfooter-group {

	border-bottom: 1px solid #C9C9C9;

	background: #fff;

	}

	.help-area,

	.sns-area,

	.group-area {

	background: #ECECEC;

	}

	.help-area,

	.sns-area {

	border: none;

	}

}



.mv_area { background: #141e14; }

.mvarea_logo { width: 29.06666666%; margin: 7.2vw auto 0 33.33333333%; }

.mv_flowtitle {

width: 100%; height: 10.13333333vw; margin-top: 4.53vw;

background: url("../images/title-mvarea.png") repeat-x;

background-size: auto 100%;

animation: mvtext_bgloop_sp 5s linear infinite;

}

@keyframes mvtext_bgloop_sp {

	0% { background-position: 0 0; }

	100% { background-position: -54.4vw 0; }

}

.mv_flowimg01 {

width: 100%; height: 48vw; margin-top: 16vw;

background: url("../images/mv-flowimg01_sp.jpg") repeat-x;

background-size: auto 100%;

animation: mvimg01_bgloop_sp 20s linear infinite;

}

@keyframes mvimg01_bgloop_sp {

	0% { background-position: 0 0; }

	100% { background-position: 258.66666666vw 0; }

}

@media (min-width:375px){

	.mvarea_logo { width: 110px; margin: 25px auto 0 calc(50% - 60px); }

	.mv_flowtitle { height: 38px; margin-top: 17px; animation: mvtext_bgloop_sp_l 5s linear infinite; }

	.mv_flowimg01 { height: 180px; margin-top: 60px; animation: mvimg01_bgloop_sp_l 20s linear infinite; }

}

@keyframes mvtext_bgloop_sp_l {

	0% { background-position: 0 0; }

	100% { background-position: -204px 0; }

}

@keyframes mvimg01_bgloop_sp_l {

	0% { background-position: 0 0; }

	100% { background-position: 970px 0; }

}

@media (min-width:1200px){

	.mv_area { padding-bottom: 65px; }

	.mvarea_logo { width: 143px; margin: 30px auto 0 calc(50% - 83px); }

	.mv_flowtitle {

	width: 100%; height: 55px; margin-top: 25px;

	animation: mvtext_bgloop_pc 5s linear infinite;

	}

	.mv_flowimg01 {

	position: absolute; top: 0; right: 2.08333333%; width: 13.33333333%; height: 66.66666666vw; margin: 0;

	background: url("../images/mv-flowimg01_pc.jpg") repeat-y;

	background-size: 100% auto;

	animation: mvimg01_bgloop_pc 20s linear infinite;

	}

	.mv_flowimg02 {

	position: absolute; top: 0; right: 15.41666666%; width: 13.33333333%; height: 66.66666666vw; margin: 0;

	background: url("../images/mv-flowimg02_pc.jpg") repeat-y;

	background-size: 100% auto;

	animation: mvimg02_bgloop_pc 20s linear infinite;

	}

}

@keyframes mvtext_bgloop_pc {

	0% { background-position: 0 0; }

	100% { background-position: -295px 0; }

}

@keyframes mvimg01_bgloop_pc {

	0% { background-position: 0 0; }

	100% { background-position: 0 -80vw; }

}

@keyframes mvimg02_bgloop_pc {

	0% { background-position: 0 0; }

	100% { background-position: 0 80vw; }

}



.intro { padding: 26.66vw 0; background: #b39b74; }

.intro * { font-family: dnp-shuei-gothic-kin-std, sans-serif; font-weight: 500; }

.intro_title { width: 34.13333333%; }

.intro_title img { margin-bottom: 10px; }

.intro_text { margin-top: 6.93vw; }

.intro_text p { line-height: 213%; }

.intro_text p + p { margin-top: 2.13em; }

@media (min-width:375px){

	.intro { padding: 75px 0; }

	.intro_title { width: 128px; }

	.intro_text { margin-top: 26px; }

}

@media (min-width:768px){

	.intro_text p { line-height: 225%; font-size: 12px; }

	.intro_text p + p { margin-top: 2.25em; }

}



.lookbox { margin-bottom: 24vw; }

.price { width: 89.33333333%; margin-top: 5.33vw; }

.price li,

.price li * { font-weight: 700; color: #e5ded3 !important; text-decoration: underline !important; }

.price li + li { margin-top: 2.4vw; }

.price li span { color: #b39b74 !important; }

img.price_buy { width: 9.33333333vw; margin-right: 2.4vw; vertical-align: middle; }

@media (min-width:375px){

	.lookbox { margin-bottom: 90px; }

	.price { margin-top: 20px; }

	.price li + li { margin-top: 9px; }

	img.price_buy { width: 35px; margin-right: 9px; }

}

@media (min-width:768px) {

	.lookbox { margin-bottom: 7.5vw; }

	.lookbox:nth-child(2) { animation-delay: 0.3s; }

	.secbox { display: flex; }

	.lookbox { width: 50%; }

	.price { width: 100%; margin-top: 25px; padding-left: 25px; }

}



.outro { padding: 20vw 0 16vw; background: #4e5746; }

.outro_logo { width: 29.06666666%; margin: 8vw auto 0 33.33333333%; }

.outro_flowtitle {

width: 100%; height: 10.13333333vw; margin-top: 4.53vw;

background: url("../images/title-outro.png") repeat-x;

background-size: auto 100%;

animation: outro_bgloop_sp 5s linear infinite;

}

@keyframes outro_bgloop_sp {

	0% { background-position: 0 0; }

	100% { background-position: -54.4vw 0; }

}

@media (min-width:375px){

	.outro { padding: 75px 0 60px; }

	.outro_logo { width: 110px; margin: 30px auto 0 calc(50% - 60px); }

	.outro_flowtitle { height: 38px; margin-top: 17px; animation: outro_bgloop_sp_l 5s linear infinite; }

}

@keyframes outro_bgloop_sp_l {

	0% { background-position: 0 0; }

	100% { background-position: -204px 0; }

}

@media (min-width:768px){

	.outro { padding: 0 0 65px; }

}

@media (min-width:1200px){

	.outro_logo { width: 143px; margin: 35px auto 0 calc(50% - 83px); }

	.outro_flowtitle {

	width: 100%; height: 55px; margin-top: 25px;

	animation: outro_bgloop_pc 5s linear infinite;

	}

}

@keyframes outro_bgloop_pc {

	0% { background-position: 0 0; }

	100% { background-position: -295px 0; }

}



.items { width: 100%; padding-bottom: 14.66vw; background: #fff; }

.itembox_wrapper { justify-content: flex-start; width: 100%; }

.itembox { width: 33.33333333%; margin-top: 6.66vw; }

.itemname { text-decoration: underline; }

@media (min-width:375px){

	.items { padding-bottom: 60px; }

	.itembox { margin-top: 25px; }

}

@media (min-width:768px){

	.items { padding-bottom: 140px; }

	.itembox_wrapper { width: 748px; }

	.itembox { width: 25%; margin-top: 55px; }

	.itemname { font-size: 15px; }

}

@media (min-width:1000px){

	.items { padding-bottom: 150px; }

	.itembox_wrapper { width: 935px; }

	.itembox { width: 187px; }

}



.contentsfooter { padding: 65px 0 30px; background: #b39b73; }

.contentsfooter *,

.contentsfooter a { color: #000; letter-spacing: 0.05em; }

.contentsfooter_bottomlink div + div { margin-top: 25px; }

.contentsfooter_sns { width: 140px; margin-top: 95px; }

.contentsfooter_sns li { width: 35px; }

.contentsfooter_logo { width: 120px;  margin-top: 35px; }

@media (min-width:768px){

	.contentsfooter { padding: 90px 0 75px; }

}