main{ position:relative; overflow:hidden; z-index:1; }
main, main *{ box-sizing:border-box; }
section{ overflow:hidden; }

#sc_wrap{ position:relative; z-index:1; min-height:100svh; display:flex; }
#sc_wrap > .swiper-wrapper{ height:auto !important; }
.main_sc{ overflow:hidden; }
.sc_bk{ position:absolute; z-index:1; top:0; bottom:0; left:0; right:0; }


/* ld */
.ld{ position:fixed; z-index:99999999999999; top:0; left:0; width:100%; height:100%; background-color:#0b1124; display:flex; align-items:center; justify-content:center; }
.ld, .ld *{ box-sizing:border-box; }
.ld_lg{ position:absolute; top:50%; left:50%; transform:translate(0, 0) translate(-50%, -50%); opacity:0; }
.ld.act .ld_lg{ animation:2.5s fadeinout 0.5s forwards; }
.ld_txt{ position:absolute; top:50%; left:50%; width:100%; padding:0 30px; transform:translate(0, 0) translate(-50%, -50%); opacity:0; }
.ld.act .ld_txt{ animation:4.5s fadeinout2 3s forwards; }
.ld_txt > p{ font-family:'gw'; font-size:20px; font-weight:400; color:#fff; text-align:center; }

@keyframes fadeinout{
	0%{ transform:translate(0, 50px) translate(-50%, -50%); opacity:0 }
	47%{ transform:translate(0, 0) translate(-50%, -50%); opacity:1 }
	53%{ transform:translate(0, 0) translate(-50%, -50%); opacity:1 }
	100%{ transform:translate(0, -50px) translate(-50%, -50%); opacity:0 }
}

@keyframes fadeinout2{
	0%{ transform:translate(0, 50px) translate(-50%, -50%); opacity:0 }
	30%{ transform:translate(0, 0) translate(-50%, -50%); opacity:1 }
	70%{ transform:translate(0, 0) translate(-50%, -50%); opacity:1 }
	100%{ transform:translate(0, -50px) translate(-50%, -50%); opacity:0 }
}


/* side_bottom */
.sc_side{ position:absolute; z-index:99; top:120px; bottom:100px; right:74px; transform:translate(-50%, 0); text-align:center; display:flex; flex-direction:column; justify-content:center; transition:0.4s right; }
.sc_side > p{ writing-mode:vertical-rl; font-size:12px; font-weight:300; color:#fff; padding:20px 0; }
.sc_side > hr{ flex:1 auto; display:block; width:1px; height:auto; border:none; background-color:#fff; }
.sc_bt{ position:absolute; z-index:99; bottom:65px; right:90px; }
.sc_bt > p{ font-size:12px; font-weight:300; color:#fff; }

@media(max-width:1500px){
	.sc_side{ right:44px; bottom:60px; }
	.sc_bt{ display:none; }
}
@media(max-width:850px){
	.sc_side{ display:none; }
}

.video-bg{
    position:absolute;
    inset:0;
    overflow:hidden;
    z-index:0;
    pointer-events:none;
}

.video-bg iframe{
    position:absolute;
    top:50%;
    left:50%;
    width:100vw;
    height:56.25vw;
    min-height:100vh;
    min-width:177.77vh;
    transform:translate(-50%,-50%);
}

/* sc01 */
#sc01{ display:flex; background-color:#333; }
.sc01_fr{ position:relative; z-index:1; width:100%; padding:150px 400px 60px 60px; display:flex; align-items:flex-end; }
.sc01_txt{ display:flex; word-break:keep-all; align-items:flex-end; max-width:1170px; }
.sc01_tt{ margin-right:30px; }
.sc01_tt > h4{ font-family:'gw'; font-size:18px; font-weight:400; color:#fff; line-height:1em; margin-bottom:30px; transform:translate(0, -40px); opacity:0; transition:0s transform 0s, 0s opacity 0s; }
.sc01_tt > h4.act{ transform:translate(0, 0); opacity:1; transition:1s transform 1.2s, 1s opacity 1.2s; }
.sc01_tt > h2{ font-family:'bof'; font-size:130px; font-weight:400; color:#fff; line-height:0.8em; }
.sc01_tt > h2 > span{ position:relative; z-index:1; left:8vw; opacity:0; transition:0s left 0s, 0s opacity 0s; }
.sc01_tt > h2.act > span{ left:0; opacity:1; transition:1s left, 1s opacity; }
.sc01_de{ flex:1 auto; }
.sc01_de > p{ font-family:'gw'; font-size:18px; font-weight:400; color:#fff; line-height:1.7em; transform:translate(40px, 0); opacity:0; transition:0s transform 0s, 0s opacity 0s; }
.sc01_de > p.act{ transform:translate(0, 0); opacity:1; transition:1s transform 1.2s, 1s opacity 1.2s; }

#sc01_bdo{ position:absolute; z-index:1; top:0; left:0; width:100%; height:100%; }

#sc01Sli{ position:absolute; z-index:1; top:0; left:0; width:100%; height:100%; }
.sc01Sli{ display:flex; }
.sc01_bg{ width:100%; background-position:center; background-size:cover; background-repeat:no-repeat; }

@media(max-width:1500px){
	.sc01_fr{ padding:120px 100px 60px 60px; }
	.sc01_tt > h2{ font-size:max(8.66666667vw, 80px); }
}
@media(max-width:900px){
	.sc01_txt{ flex-flow:row wrap; }
	.sc01_tt{ margin-right:0; }
}
@media(max-width:850px){
	.sc01_fr{ padding:120px 30px 60px; }
}
@media(max-width:600px){
	.sc01_fr{ padding:100px 15px 30px; }
	.sc01_tt > h2{ font-size:max(13.3333333vw, 60px); }
	.sc01_de > p{ font-size:16px; }
}


/* sc02 */
#sc02{ display:flex; background-color:#333; }
.sc02_fr{ position:relative; z-index:1; width:100%; padding:150px 120px 110px; display:flex; justify-content:center; align-items:center; }
.sc02_txt{ max-width:561px; text-align:center; word-break:keep-all; }
.sc02_txt > h2{ font-size:40px; font-weight:800; color:#fff; line-height:1.3em; }
.sc02_txt > h2 > span{ position:relative; top:40px; opacity:0; transition:0s top 0s, 0s opacity 0s; }
.sc02_txt.act > h2 > span{ top:0; opacity:1; transition:1s top 0s cubic-bezier(0.15, 0.73, 0.45, 1), 0.7s opacity 0s cubic-bezier(0.71, 0.26, 0.32, 0.81); }
.sc02_txt > hr{ display:block; width:0; height:1px; margin:20px auto; border:none; background-color:#fff; transition:0s width; }
.sc02_txt.act > hr{ width:max(200px, 60%); transition:1s width; }
.sc02_txt > p{ font-family:'gw'; font-size:18px; font-weight:300; color:#fff; line-height:1.3em; margin-bottom:50px; transform:translate(0, 30px); opacity:0; transition:0s transform 0s, 0s opacity 0s; }
.sc02_txt.act > p{ transform:translate(0, 0); opacity:1; transition:1s transform 0.3s, 1s opacity 0.3s; }
.sc02_txt > img{ max-width:100%; width:auto; transform:translate(0, 30px); opacity:0; transition:0s transform 0s, 0s opacity 0s; }
.sc02_txt.act > img{ transform:translate(0, 0); opacity:1; transition:1s transform 0.5s, 1s opacity 0.5s; }
.sc02_txt > a{ display:block; max-width:200px; margin:30px auto 0; background:#fff; border-radius:10px; padding:15px; text-align:center; font-size:16px; color:#333; transform:translate(0, 30px); opacity:0; transition:0s transform 0s, 0s opacity 0s; }
.sc02_txt.act > a{ transform:translate(0, 0); opacity:1; transition:1s transform 0.7s, 1s opacity 0.7s; }

#sc02_bdo{ position:absolute; z-index:1; top:0; left:0; width:100%; height:100%; }

#sc02Sli{ position:absolute; z-index:1; top:0; left:0; width:100%; height:100%; }
.sc02Sli{ display:flex; }
.sc02_bg{ width:100%; background-position:center; background-size:cover; background-repeat:no-repeat; }

@media(max-width:850px){
	.sc02_fr{ padding:120px 30px 60px; }
	.sc02_txt > h2{ font-size:30px; }
}
@media(max-width:600px){
	.sc02_fr{ padding:100px 15px 30px; }
}


/* sc03 */
#sc03{ display:flex; background-color:#333; }
.sc03_fr{ position:relative; z-index:1; width:100%; padding:150px 120px 110px; display:flex; justify-content:center; align-items:center; }
.sc03_txt{ max-width:950px; text-align:center; word-break:keep-all; }
.sc03_txt > svg{ display:block; width:100%; height:auto; }
.sc03_txt > svg > path, .sc03_txt > svg > rect{ stroke:#c18b52; stroke-width:2px; fill:transparent; transition:0s stroke-dashoffset 0s, 0s fill 0s; }
.sc03_txt.act > svg > path, .sc03_txt.act > svg > rect{ stroke-dashoffset:0 !important; fill:#c18b52; transition:1.5s stroke-dashoffset 0s, 0.4s fill 1.6s; }
.sc03_txt > img{ max-width:100%; width:auto; }
.sc03_txt > hr{ display:block; width:0; height:1px; margin:20px auto; border:none; background-color:#fff; transition:0s width 0s; }
.sc03_txt.act > hr{ width:min(200px, 60%); transition:2s width 0s; }
.sc03_txt > p{ font-family:'gw'; width:min(500px, 100%); margin:0 auto; font-family:'bof'; font-size:18px; font-weight:400; color:#fff; line-height:1.3em; transform:translate(0, 100%); opacity:0; transition:0s transform 1s, 0s opacity 1s; }
.sc03_txt.act > p{ transform:translate(0, 0); opacity:1; transition:1s transform 0s, 1s opacity 0s; }

#sc03_bdo{ position:absolute; z-index:1; top:0; left:0; width:100%; height:100%; }

#sc03Sli{ position:absolute; z-index:1; top:0; left:0; width:100%; height:100%; }
.sc03Sli{ display:flex; }
.sc03_bg{ width:100%; background-position:center; background-size:cover; background-repeat:no-repeat; }

@media(max-width:1500px){
	.sc03_fr{ padding:120px 100px 60px; }
}
@media(max-width:850px){
	.sc03_fr{ padding:120px 30px 60px; }
}
@media(max-width:600px){
	.sc03_fr{ padding:100px 15px 30px; }
}


/* sc04 */
#sc04{ display:flex; background-color:#333; }
.sc04_fr{ position:relative; z-index:1; width:100%; padding:150px 400px 60px 60px; display:flex; align-items:flex-end; }
.sc04_txt{ word-break:keep-all; }
.sc04_txt > img{ display:block; width:min(230px, 40%); margin:0 0 40px; -webkit-clip-path:ellipse(0 0 at 50% 50%); transition:0s -webkit-clip-path; }
.sc04_txt.act > img{ -webkit-clip-path:ellipse(100% 100% at 50% 50%); transition:2s -webkit-clip-path; }
.sc04_txt > h2{ font-family:'bof'; font-size:130px; font-weight:400; color:#fff; line-height:1em; -webkit-clip-path:ellipse(0 0 at 0% 50%); transition:0s -webkit-clip-path; }
.sc04_txt.act > h2{ opacity:1; -webkit-clip-path:ellipse(100vw 100vw at 0% 50%); transition:10s -webkit-clip-path cubic-bezier(0.1, 0.93, 0.24, 1.02); }
.sc04_txt > p{ font-family:'gw'; font-size:18px; font-weight:400; color:#fff; line-height:1.5em;  }
.sc04_txt > p > span{ position:relative; z-index:1; top:15px; opacity:0; transition:0s opacity, 0s top; }
.sc04_txt.act > p > span{ top:0; opacity:1; transition:1s opacity, 1s top; }

#sc04_bdo{ position:absolute; z-index:1; top:0; left:0; width:100%; height:100%; }

#sc04Sli{ position:absolute; z-index:1; top:0; left:0; width:100%; height:100%; }
.sc04Sli{ display:flex; }
.sc04_bg{ width:100%; background-position:center; background-size:cover; background-repeat:no-repeat; }

@media(max-width:1610px){
	.sc04_txt > h2{ font-size:max(7.8vw, 80px); }
}
@media(max-width:1500px){
	.sc04_fr{ padding:120px 100px 60px 30px; }
}
@media(max-width:650px){
	.sc04_fr{ padding:100px 15px 30px; }
	.sc04_txt > h2{ font-size:max(11.5vw, 55px); margin-bottom:15px; }
}