@charset "utf-8";
#wrap { position: relative; }
#wrap * { box-sizing: border-box; }

#header { position: absolute; top: 25px; right: 25px; z-index: 99; display: flex; align-items: center; background: #fff; padding: 11px 28px; border-radius: 100px; }
#header > ul { display: flex; gap: 0 22px; align-items: center; }
#header > ul > li {}
#header > ul > li:nth-of-type(1) { width: 137px; }
#header > ul > li:nth-of-type(2) { width: 132px; }
#header > ul > li > a { display: block; }
#header > ul > li > a > img { width: 100%; }

#header > div.lang { margin-left: 55px; padding-left: 29px; width: 118px; display: flex; flex-direction: column; position: relative; }
#header > div.lang::before { content: ''; position: absolute; left: 0; top: -3px; width: 20px; height: 20px; background: url('../img/ico_global.svg'); }
#header > div.lang > p { position: relative; font-size: 16px; color: #000; font-weight: 600; line-height: 1; cursor: pointer; text-transform: uppercase; }
#header > div.lang > p::after { content: ''; position: absolute; right: 0; top: 5px; width: 10px; height: 8px; background: url('../img/arrow-down.svg') no-repeat; }
#header > div.lang.active > p::after { background: url('../img/lang_up.png') no-repeat; }

#header > div.lang > ul { position: relative; width: 141px; display: flex; flex-direction: column; align-items: center; padding: 15px 0; background: #5BCBF5; color:#000; border-radius: 12px; position: absolute; right: -13px; top: -15px; opacity: 1; display: none; }
#header > div.lang > ul > li { position: relative; order: 2; width: 118px; padding-left: 29px; box-sizing: border-box; margin-top: 12px; }
#header > div.lang > ul > li.on { display: block; order: 1; margin-top: 0; }
#header > div.lang > ul > li.on > a { color: #000; }
#header > div.lang > ul > li.on::before { content: ''; position: absolute; left: 0; top: -3px; width: 20px; height: 20px; background: url('../img/ico_global.svg'); }
#header > div.lang > ul > li.on::after { content: ''; position: absolute; right: 0; top: 5px; width: 10px; height: 8px; background: url('../img/arrow-down.svg') no-repeat; }
#header > div.lang > ul > li > a { font-size: 16px; color: #000; font-weight: 600; line-height: 1; }

.available { position: fixed; width: 100%; height: 100vh; display: none; z-index: 100; left: 0; top: 0; overflow-y: scroll; }
.available > div { position: relative; width: 100%; display: flex; justify-content: center; align-items: flex-start; padding: 100px 0; }
.available > div > p { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.8); cursor: pointer; }
.available > div > div { width: 700px; position: relative; }
.available > div > div > img { width: 100%; }
.available > div > div > p { width: 100%; background: rgba(0,0,0,0.5); color: #fff; padding: 10px 0; text-align: center; font-size: 24px; cursor: pointer; }
@media (max-width: 1200px){
	.available { position: fixed; width: 100%; height: 100vh; display: none; background: rgba(0,0,0,0.8); z-index: 100; left: 0; top: 0; overflow-y: scroll; }
	.available > div { position: relative; width: 100%; display: flex; justify-content: center; align-items: flex-start; padding: 100px 0; }
	.available > div > div { width: 1100px; position: relative; }
	.available > div > div > img { width: 100%; }
	.available > div > div > p { width: 100%; background: rgba(0,0,0,0.5); color: #fff; padding: 20px 0; text-align: center; font-size: 28px; cursor: pointer; }
}



.section { width: 100%; position: relative; }
.section > p { width: 100%; }
.section > a > img,
.section > p > img { width: 100%; }
.section > .btn-wrap { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0); }
.section > .btn-wrap > li { position: relative; }
.section > .btn-wrap > li > a { position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; }


.section.video { display: flex; align-items: flex-start; }
.section.video video { width: 100%; }


.section-wrap { background: url('../img/bg-top.webp') center top/100% no-repeat #D0F3E1; }
.section-wrap::after { position: absolute; bottom: 0; width: 100%; }


.section.section1 { position: relative; }
.section.section1 .btn-wrap { width: 100%; height: auto; display: grid; grid-template-columns: repeat(4, min(332px, 17.2917vw)); justify-content: center; gap: min(34px, 1.7708vw) min(40px, 2.0833vw); padding-top: min(444px, 23.1250vw); }
.section.section1 .btn-wrap > li { width: 100%; height: min(341px, 17.7604vw); background: rgba(0,0,0,0); }


.section.section2 { padding-bottom: min(100px, 5.2083vw); }
.section.section2 > p { width: 100%; }
.section.section2 > p > img { width: 100%; }
.section.section2 > div { width: min(1540px, 100%); margin: min(65px, 3.3854vw) auto 0; padding: 0 20px; }
.section.section2 > div > dl { width: 100%; }
.section.section2 > div > dl~dl { margin-top: 20px; }
.section.section2 > div > dl > dt { cursor: pointer; }
.section.section2 > div > dl > dt > img { width: 100%; }
.section.section2 > div > dl > dd { margin-top: 30px; display: none; padding: 0 min(25px, 1.3021vw); }
.section.section2 > div > dl > dd .btn-wrap { width: 100%; display: flex; flex-wrap: wrap; gap: min(40px, 2.0833vw); }
.section.section2 > div > dl > dd .btn-wrap > li { width: 100%; padding: min(60px, 3.1250vw); border-radius: min(20px, 1.0417vw); background: #fff; }
.section.section2 > div > dl > dd .btn-wrap > li img { width: 100%; }
.section.section2 > div > dl > dd .btn-wrap > li > p { position: relative; }
.section.section2 > div > dl > dd .btn-wrap > li > p > img { cursor: pointer; }
.section.section2 > div > dl > dd .btn-wrap > li > p > span { position: absolute; bottom: min(10px, 0.5208vw); right: min(13px, 0.6771vw); width: min(136px, 7.0833vw); height: min(136px, 7.0833vw); background: url('../img/coupon-down.png') center/100% no-repeat; cursor: pointer; }
.section.section2 > div > dl > dd .btn-wrap > li > p.show > span { background: url('../img/coupon-up.png') center/100% no-repeat; }
.section.section2 > div > dl > dd .btn-wrap > li > div { display: none; width: 100%; }


.section.section3 {}
.section.section3 .btn-wrap { display: flex; justify-content: center; gap: min(21px, 1.0938vw); margin-top: min(478px, 24.8958vw); }
.section.section3 .btn-wrap > li { width: min(467px, 24.3229vw); height: min(593px, 30.8854vw); background: rgba(0,0,0,0); }


.section.footer { background: #01C05F; }
.section.footer .btn-wrap { width: 100%; gap: min(120px, 6.2500vw); display: flex; justify-content: center; margin-top: min(411px, 21.4063vw); }
.section.footer .btn-wrap > li { width: min(174px, 9.0625vw); height: min(246px, 12.8125vw); background: rgba(0,0,0,0); }

.top-btn { cursor: pointer; width: 7.2396%; padding-bottom: 7.2396%; position: absolute; z-index: 99; bottom: 0; margin-bottom: 2.6042%; right: 2.7604%; background: rgba(0,0,0,0); }