/* intro */
._intro{ width: 100%; height: 100vh; box-sizing: border-box; color: #fff; position: fixed; z-index: 999; top: 0; left: 0; overflow: hidden; transition-duration: 0.6s; display: none; background-color: #080808; }
._intro .bgWrap{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
._intro .bgWrap .bg{ width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-repeat: no-repeat; background-position: center; background-size: cover; opacity: 0; transform: scale(1.2); transition-duration: 0.8s; }
._intro .bgWrap .bg.on{ opacity: 1; transform: scale(1); } 
._intro .vertical{ height: 100vh; }
._intro .vertical ._inn{ height: 100%; width: 100%; display: flex; align-items: center; justify-content: center; border-bottom: 1px solid rgba(255,255,255,0.3); box-sizing: border-box;  color: #838383; transition-duration: 0.6s; }
._intro .vertical ._inn strong{ font-size: 6.25vw; font-weight: 700; transition-duration: 0.6s; }
._intro .vertical ._inn p{ font-size: 25px; line-height: calc(30 / 25); padding: 0 15px; text-align: right; }
._intro .vertical ._inn em{ font-size: 25px; line-height: calc(30 / 25); padding: 0 35px; text-align: left; }

._intro.hide{ opacity: 0; transform: translateY(-100%); }

._intro .vertical .swiper-slide-active ._inn{ color: #fff; }
._intro .vertical .swiper-slide-active ._inn strong{ font-size: 8.33vw; }
/* ._intro .vertical .swiper-slide-duplicate-active ._inn{ color: #fff; }
._intro .vertical .swiper-slide-duplicate-active ._inn strong{ font-size: 8.33vw; } */

@media screen and (max-width: 1280px){
    ._intro .vertical ._inn p{ font-size: 18px; }
    ._intro .vertical ._inn em{ font-size: 18px; padding: 0 20px; }
}

@media screen and (max-width: 820px){
    ._intro .vertical ._inn{ flex-direction: column; }
    ._intro .vertical ._inn p{ font-size: 16px; width: 100%; padding: 10px 5%; box-sizing: border-box; }
    ._intro .vertical ._inn p br{ display: none; }
    ._intro .vertical ._inn em{ font-size: 16px; width: 100%; padding: 10px 5%; box-sizing: border-box; }
    ._intro .vertical ._inn em br{ display: none; }
}

@media screen and (max-width: 500px){
    ._intro .vertical ._inn p{ font-size: 14px; }
    ._intro .vertical ._inn em{ font-size: 14px; }
    ._intro .vertical .swiper-slide-active ._inn strong{ font-size: 8.43vw; }
}


/* sideFixbar */
.sideFix{ position: fixed; top: 50%; right: 0; transform: translateY(-50%); color: #fff; z-index: 10; opacity: 0; pointer-events: none; transition-duration: 0.4s; }
.sideFix.on{ opacity: 1; pointer-events: unset; }
.sideFix > a{ display: block; padding: 20px; padding-right: 30px; box-sizing: border-box; border-radius: 5px 0 0 5px; background-color: #252525; transition-duration: 0.4s; transform: translateX(10px); }
.sideFix > a i{ display: block; transform: rotate(-45deg); font-size: 25px; margin-bottom: 20px; }
.sideFix > a:nth-of-type(1){ background-color: #000; }
.sideFix > a span{ writing-mode: vertical-lr; font-size: 16px; font-family: 'Roboto Condensed', sans-serif; }

@media screen and (min-width: 821px){
    .sideFix > a:hover{ transform: translateX(0); }
}

@media screen and (max-width: 1280px){
    .sideFix > a{ padding: 15px; padding-right: 20px; }
    .sideFix > a span{ font-size: 14px; }
    .sideFix > a i{ font-size: 20px; margin-bottom: 10px; }
    
}

@media screen and (max-width: 820px){
    .sideFix{ display: none; }
}


body ._m > section{ opacity: 0; transition-duration: 0.4s; }
body.on ._m > section{ opacity: 1; }

._m{ background-color: #080808; color: #fff; width: 100%; overflow: hidden; }
._m .se01{ position: relative; box-sizing: border-box; }
._m .se01 .visual{ height: 100vh; position: relative; }
._m .se01 .bg{ position: absolute; top: 50%; transform: translateY(-50%); width: 100%; overflow: hidden; left: 0; z-index: 0; height: 100%; }

._m .se01 .bg ._max{ width: 100vw; height: 56.25vw; min-height: 100vh; min-width: 177.77vh; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 0; }

._m .se01 .vidWrap{ overflow: hidden; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 1; width: 100%; height: 100%; }
._m .se01 .vidWrap iframe{ width: 100vw; height: 56.25vw; min-height: 100vh; min-width: 177.77vh; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 2; }

._m .se01 .flex{ position: absolute; display: flex; align-items: center; justify-content: space-between; padding-left: calc(160 / 1920 * 100%); padding-right: calc(125 / 1920 * 100%); box-sizing: border-box; padding-bottom: 45px; z-index: 10; bottom: 0; left: 0; width: 100%; }

._m .se01 .flex .playbtn{ cursor: pointer; }
._m .se01 .flex .contactWrap{ display: flex; }
._m .se01 .flex .contactWrap > a{ display: block; padding: 20px 30px; box-sizing: border-box; color: #fff; background-color: rgba(37,37,37,0.8); border-radius: 5px; position: relative; width: 50%; min-width: 255px; padding-top: 75px; margin-left: 12px; transition-duration: 0.2s; }
._m .se01 .flex .contactWrap > a span{ font-size: 22px; font-family: "Roboto Condensed", sans-serif; line-height: calc(27 / 22); display: block; }
._m .se01 .flex .contactWrap > a i{ display: block; position: absolute; top: 20px; right: 20px; font-size: 40px; transform: rotate(-45deg); }

@media screen and (min-width: 821px){
    ._m .se01 .flex .contactWrap > a:hover{ background-color: rgba(0,0,0,0.8); }
}


._m .se01 .scroll{ padding-top: 140px; padding-bottom: 60px; box-sizing: border-box; position: relative; height: 100vh; box-sizing: border-box; }
._m .se01 .scroll .aboutT{ font-size: 100px; font-weight: 700; display: block; }

._m .se01 .scroll .txt p{ background: linear-gradient(90deg, #fff 1%, #878787 1%); -webkit-background-clip: text !important; -webkit-text-fill-color: transparent; font-weight: 500; line-height: calc(40 / 25); display: inline; font-size: 25px; }

._m .se01 .scroll .txt{ margin-top: 35px; }
._m .se01 .scroll .txt._r{ width: calc(655 / 1600 * 100%); margin-left: auto; margin-top: 65px; }

._m .se01 .scroll .imgs{ width: 100%; max-width: 1140px; display: flex; margin: 0 auto; margin-top: 65px; }
._m .se01 .scroll .imgs li{ width: 25%; overflow: hidden; }



@media screen and (max-width: 1440px){
    ._m .se01 .flex .playbtn{ width: 70px; }
    ._m .se01 .flex .contactWrap > a{ padding: 15px 20px; padding-top: 50px; }
    ._m .se01 .flex .contactWrap > a span{ font-size: 18px; }
    ._m .se01 .flex .contactWrap > a i{ font-size: 30px; }

    ._m .se01 .scroll .aboutT{ font-size: 80px; }
    ._m .se01 .scroll .txt p{ font-size: 20px; }
    ._m .se01 .scroll .txt{ margin-top: 20px; }
    ._m .se01 .scroll .txt._r{ margin-right: 80px; }
}

@media screen and (max-width: 1280px){
    ._m .se01 .flex .contactWrap > a{ min-width: 210px; }

    ._m .se01 .scroll .aboutT{ font-size: 60px; }
    ._m .se01 .scroll .txt p{ font-size: 18px; }
    ._m .se01 .scroll .txt{ margin-top: 15px; }
    ._m .se01 .scroll .txt._r{ margin-right: 60px; }
}

@media screen and (max-width: 820px){
    ._m .se01 .flex{ padding-bottom: 30px; }
    ._m .se01 .flex .contactWrap > a{ min-width: 170px; padding: 10px 15px; padding-top: 30px; }
    ._m .se01 .flex .contactWrap > a span{ font-size: 16px; }
    ._m .se01 .flex .contactWrap > a i{ font-size: 20px; top: 15px; right: 15px; }

    ._m .se01 .scroll{ padding-top: 10vh; }
    ._m .se01 .scroll .aboutT{ font-size: 35px; }
    ._m .se01 .scroll .txt{ width: 70%; }
    ._m .se01 .scroll .txt p{ font-size: 16px; }
    ._m .se01 .scroll .txt p br{ display: none; }
    ._m .se01 .scroll .txt{ margin-top: 10px; }
    ._m .se01 .scroll .txt._r{ margin-right: 0; width: 70%; margin-top: 40px; }

    ._m .se01 .scroll .imgs{ margin-top: 40px; }
}

@media screen and (max-width: 500px){
    ._m .se01 .flex{ flex-direction: column; padding: 30px 7%; }
    ._m .se01 .flex .playbtn{ width: 40px; margin-right: auto; margin-bottom: 10px; }
    ._m .se01 .flex .contactWrap{ justify-content: space-between; width: 100%; }
    ._m .se01 .flex .contactWrap > a{ min-width: unset; width: 49%; margin-left: 0; padding: 10px; padding-top: 15px; }
    ._m .se01 .flex .contactWrap > a span{ font-size: 14px; min-height: 5em; display: flex; align-items: flex-end; }
    ._m .se01 .flex .contactWrap > a i{ top: 10px; right: 10px; }

    ._m .se01 .scroll .txt{ width: 100%; }
    ._m .se01 .scroll .txt._r{ width: 100%; }
    ._m .se01 .scroll .txt p{ font-size: 14px; }
    ._m .se01 .scroll .imgs{ margin-top: 30px; flex-wrap: wrap; }
    ._m .se01 .scroll .imgs li{ width: 50%; }
}




._m .se02{ width: 100%; position: relative; z-index: 2; }
._m .se02 .first{ width: 100%; height: 100vh; box-sizing: border-box; position: relative; }
._m .se02 .first .bg{ width: 100%; height: 100vh; position: absolute; top: 0; left: 0; z-index: 0; overflow: hidden; }
._m .se02 .first .bg::after{ content: ''; display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-image: url(/asset/img/main/se02_filter.png); mix-blend-mode: soft-light; opacity: 0.5; }
._m .se02 .first .bg ._max{ width: 100vw; height: 56.25vw; min-height: 100vh; min-width: 177.77vh; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 0;  }
._m .se02 .first .bg ._max._1{ clip-path: polygon(56% 17%, 41% 17%, 56% 43%); }
/* polygon(100% 0%, 33% 0%, 100% 143%) */
._m .se02 .first .bg ._max._2{ clip-path: polygon(44% 60%, 44% 33%, 60% 60%); }
/* polygon(0% 100%, 0% -71%, 80% 100%) */
._m .se02 .first .wrap{ position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); padding-bottom: 60px; }
._m .se02 .first .wrap dl{ text-align: center; }
._m .se02 .first .wrap dl dt{ font-size: 50px; font-weight: 700; }
._m .se02 .first .wrap dl dd{ font-size: 100px; font-weight: 700; margin-top: 20px; }
._m .se02 .first .wrap p{ font-size: 30px; color: #878787; margin-top: 40px; text-align: center; }

._m .se02 .second{ width: 100%; height: 100vh; position: absolute; left: 0; top: 0; backdrop-filter: blur(5px); display: flex; flex-direction: column; justify-content: center; align-items: center; background-image: url(/asset/img/main/se02_secondbg.png); background-repeat: no-repeat; background-position: center; background-size: cover; z-index: 10; }
._m .se02 .second .wrap dl{ text-align: center; }
._m .se02 .second .wrap dl dt{ font-size: 30px; font-weight: 700; }
._m .se02 .second .wrap dl dd{ font-size: 80px; font-weight: 700; margin-top: 25px; }
._m .se02 .second .wrap p{ font-size: 26px; font-weight: 500; color: #878787; text-align: center; }
._m .se02 .second .wrap .lists{ display: flex; margin-top: 80px; gap: 30px; justify-content: center; }
._m .se02 .second .wrap .lists li{ overflow: hidden; }
._m .se02 .second .wrap .lists li img{ transition-duration: 0.6s; }

._m .se02 .third{ width: 100%; height: 100vh; position: relative; overflow: hidden; }
._m .se02 .third .bgs{ position: absolute; left: 0; top: 0; width: 100%; height: 100%; }
._m .se02 .third .bgs .bx{ width: 100%; height: 100%; }
._m .se02 .third .bgs .bx ._max{ width: 100vw; position: absolute; left: 0; top: 0; height: 100vh; background-repeat: no-repeat; background-position: center; background-size: cover; z-index: 0; }
._m .se02 .third .bgs .bx .bgswiper{ height: 100%; }
._m .se02 .third .bgs .bx .bgswiper .swiper-slide{ width: 100%; height: 100%; overflow: hidden; }

._m .se02 .third .wrap{ position: relative; z-index: 3; padding-top: 200px; box-sizing: border-box; height: 100%; }
._m .se02 .third .wrap > span{ font-size: 20px; font-weight: 700; }
._m .se02 .third .wrap .txt1{ font-size: 80px; font-weight: 700; position: relative; height: 1em; margin-top: 30px; }
._m .se02 .third .wrap .txt1 strong{ position: absolute; left: 0; top: 0; display: block; clip-path: polygon(0 0, 100% 0, 100% 0%, 0 0%);  }
._m .se02 .third .wrap .txt1 strong.on{ clip-path: polygon(0 0%, 100% 0%, 100% 100%, 0% 100%); transform-origin: 0 0; }
/* clip-path: polygon(0 0, 100% 0, 100% 30%, 0 30%); transition-duration: 0.4s; transform-origin: 100% 100%; */

._m .se02 .third .wrap .txt2{ margin-top: 35px; font-size: 20px; font-weight: 700; line-height: calc(35 / 20); position: relative; color: rgba(255,255,255,1); width: 100%; max-width: 710px; }
._m .se02 .third .wrap .txt2 p{ opacity: 0; transform: translateX(-20%); position: absolute; top: 0; left: 0; transition-duration: 1s; }
._m .se02 .third .wrap .txt2 p.on{ opacity: 1; transform: translateX(0); }

._m .se02 .third .pagination{ position: absolute; left: 0; width: 100%; bottom: 45px; }
._m .se02 .third .pagination .pag{ display: flex; justify-content: space-between; }
._m .se02 .third .pagination .pag li{ padding: 10px 3px; font-size: 20px; font-weight: 700; color: #9e9e9e; transition-duration: 0.4s; cursor: pointer; text-align: center; box-sizing: border-box; }
._m .se02 .third .pagination .pag li.on{ color: #fff; }
._m .se02 .third .pagination .pag li:first-of-type{ padding-left: 0; }
._m .se02 .third .pagination .pag li:last-of-type{ padding-right: 0; }
._m .se02 .third .pagination .pag li span{  }

._m .se02 .third .pagination .bar{ width: 100%; position: relative; height: 7px; background-color: rgba(255,255,255,0.2); overflow: hidden; }
._m .se02 .third .pagination .bar em{ width: 25px; left: 0px; position: absolute; top: 0; height: 7px; background-color: #fff; transition-duration: 0.6s; }

@media screen and (min-width: 821px){
    ._m .se02 .third .pagination .pag li:hover{ color: #fff; }
    /* ._m .se02 .second .wrap .lists li:hover img{ transform: scale(1.05); } */
}

@media screen and (max-width: 1440px){
    ._m .se02 .first .wrap dl dt{ font-size: 40px; }
    ._m .se02 .first .wrap dl dd{ font-size: 85px; }
    ._m .se02 .first .wrap p{ font-size: 26px; margin-top: 30px; }

    ._m .se02 .second .wrap dl dt{ font-size: 24px; }
    ._m .se02 .second .wrap dl dd{ font-size: 60px; }
    ._m .se02 .second .wrap p{ font-size: 24px; margin-top: 20px; }
    ._m .se02 .second .wrap .lists{ margin-top: 50px; }

    ._m .se02 .third .wrap{ padding-top: 160px; }
    ._m .se02 .third .wrap > span{ font-size: 16px; }
    ._m .se02 .third .wrap .txt1{ font-size: 60px; margin-top: 20px; }
    ._m .se02 .third .wrap .txt2{ font-size: 16px; margin-top: 25px; }

    ._m .se02 .third .pagination .pag li{ font-size: 15px; }
}

@media screen and (max-width: 1280px){
    ._m .se02 .first .wrap dl dt{ font-size: 30px; }
    ._m .se02 .first .wrap dl dd{ font-size: 55px; }
    ._m .se02 .first .wrap p{ font-size: 20px; margin-top: 20px; }
    ._m .se02 .second .wrap .lists{ gap: 15px; }
    ._m .se02 .second .wrap dl dt{ font-size: 20px; }
    ._m .se02 .second .wrap dl dd{ font-size: 40px; margin-top: 15px; }
    ._m .se02 .second .wrap p{ font-size: 20px; margin-top: 15px; }

    ._m .se02 .third .wrap{ padding-top: 120px; }
    ._m .se02 .third .wrap > span{ font-size: 14px; }
    ._m .se02 .third .wrap .txt1{ font-size: 40px; margin-top: 10px; }
    ._m .se02 .third .wrap .txt2{ font-size: 14px; margin-top: 20px; }

    ._m .se02 .third .pagination .pag li{ font-size: 15px; }
}

@media screen and (max-width: 820px){
    ._m .se02 .first .wrap{ padding-bottom: 10vh; }
    ._m .se02 .first .wrap dl dt{ font-size: 22px; }
    ._m .se02 .first .wrap dl dd{ font-size: 35px; margin-top: 10px; }
    ._m .se02 .first .wrap p{ font-size: 16px; margin-top: 10px; }

    ._m .se02 .second .wrap .lists{ flex-wrap: wrap; gap: unset; justify-content: space-between; }
    ._m .se02 .second .wrap .lists li{ width: 32%; margin-bottom: 10px; }
    
    ._m .se02 .third .pagination .pag{ flex-wrap: wrap; justify-content: space-between; }
    ._m .se02 .third .pagination .pag li{ font-size: 14px; width: 32%; display: flex;align-items: center; justify-content: center; border-radius: 5px; background-color: rgba(255,255,255,0.1); min-height: 4.4em; margin-bottom: 10px; }
    ._m .se02 .third .pagination .pag li.on{ background-color: rgba(255,255,255,0.5); }
    ._m .se02 .third .wrap .txt1{ font-size: 5.5vw; }
    ._m .se02 .third .pagination .bar{ display: none; }

    ._m .se02 .third .bgs .bx ._max._1{ background-position: left 20% center; }
    ._m .se02 .third .bgs .bx ._max._3{ background-position: left 60% center; }

}

@media screen and (max-width: 500px){
    ._m .se02 .first .bg ._max._1{ clip-path: polygon(54% 33%, 45% 33%, 54% 56%); }
    ._m .se02 .first .bg ._max._2{ clip-path: polygon(46% 66%, 46% 43%, 55% 66%); }

    ._m .se02 .first .wrap{ padding: 0; bottom: auto; top: 72%; }
    ._m .se02 .first .wrap dl dt{ font-size: 16px; }
    ._m .se02 .first .wrap dl dd{ font-size: 24px; }
    ._m .se02 .first .wrap p{ font-size: 14px; }

    ._m .se02 .second .wrap dl dt{ font-size: 16px; }
    ._m .se02 .second .wrap dl dd{ font-size: 24px; margin-top: 10px; }
    ._m .se02 .second .wrap p{ font-size: 14px; margin-top: 10px; }
    ._m .se02 .second .wrap .lists{ margin-top: 30px; }

    ._m .se02 .third .pagination .pag li{ font-size: 12px; }
}




._m .se03{ width: 100%; height: 100vh; box-sizing: border-box; position: relative; z-index: 0; }
._m .se03 .flexbx{ display: flex; width: 100%; height: 100%; }
._m .se03 .flexbx .bx{ width: 50%; position: relative; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; background-repeat: no-repeat; background-size: cover; background-position: center; overflow: hidden; }
._m .se03 .flexbx .bx .bg{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-repeat: no-repeat; background-size: cover; background-position: center; z-index: 0;  transition-duration: 0.8s; clip-path: circle(0% at 50% 50%); }
/* ._m .se03 .flexbx .bx span{ display: block; width: 100%; height: 100%; position: absolute ;top: 0; left: 0; background-color: rgba(0,0,0,0.9); transition-duration: 0.8s; z-index: 1; } */
._m .se03 .flexbx .bx dl{ margin-top: 40px; position: relative; z-index: 2; transition-duration: 0.6s; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; width: 100%; padding: 0 80px; box-sizing: border-box; }
._m .se03 .flexbx .bx dl dt{ font-size: 60px; font-weight: 700; text-align: center; transition-duration: 0.6s; width: 100%; }
._m .se03 .flexbx .bx dl dd{ text-align: center; font-size: 30px; color: #878787; font-weight: 500; line-height: calc(40 / 30); transition-duration: 0.6s; }
._m .se03 .flexbx .bx dl dd._1{ margin-top: 35px; text-align: center; width: 100%; }
._m .se03 .flexbx .bx dl dd._2{ text-align: center; width: 100%; }

/* ._m .se03 .flexbx .bx._1 dl dd._1{ transform: translateX(67%); }
._m .se03 .flexbx .bx._1 dl dd._2{ transform: translateX(-37%); }

._m .se03 .flexbx .bx._2 dl dd._1{ transform: translateX(97%); }
._m .se03 .flexbx .bx._2 dl dd._2{ transform: translateX(-35%); } */

._m .se03 .flexbx .bx > a{ position: relative; z-index: 3; display: flex; align-items: center; justify-content: flex-end; margin-left: auto; padding-right: 35px; transition-duration: 0.6s; opacity: 0; transform: translateX(20%); margin-top: 30px; color: rgba(255,255,255,0.6);  }
._m .se03 .flexbx .bx > a span{ font-size: 30px; font-weight: 500; display: block; margin-right: 30px;}
._m .se03 .flexbx .bx > a em{ width: 95px; height: 2px; background-color: #fff; display: block; transition-duration: 0.6s; transform: scaleX(0); transform-origin: 0 0; }

._m .se03 .flexbx .bx small{ display: block; position: absolute; left: 80px; top: 125px; font-size: 30px; font-weight: 700;  transition-duration: 0.6s; opacity: 0; transform: translateX(-20%); }


@media screen and (min-width: 821px){
    ._m .se03 .flexbx .bx:hover .bg{ clip-path: circle(40% at 50% 50%); }
    ._m .se03 .flexbx .bx:hover small{ opacity: 1; transform: translateX(0); }
    ._m .se03 .flexbx .bx:hover dl{ margin-top: 0; }
    ._m .se03 .flexbx .bx:hover dl dt{ opacity: 0; transform: translateY(-100%); }
    ._m .se03 .flexbx .bx:hover dl dd{ font-size: 3vw; color: #fff; }
    ._m .se03 .flexbx .bx:hover dl dd._1{ transform: translateX(-40px); }
    ._m .se03 .flexbx .bx:hover dl dd._2{ transform: translateX(60px); }

    ._m .se03 .flexbx .bx:hover > a{ opacity: 1; transform: translateX(0); }
    ._m .se03 .flexbx .bx > a:hover{ color: #fff; }
    ._m .se03 .flexbx .bx > a:hover em{ transform: scaleX(1); }
}

@media screen and (min-width: 1281px){
    ._m .se03 .flexbx .bx:hover dl dd{ font-size: 55px; color: #fff; }
}


@media screen and (max-width: 1440px){
    ._m .se03 .flexbx .bx dl dt{ font-size: 50px; }
    ._m .se03 .flexbx .bx dl dd{ font-size: 24px; }
    ._m .se03 .flexbx .bx dl dd._1{ margin-top: 20px; }
    ._m .se03 .flexbx .bx small{ font-size: 24px; left: 5%; }
    ._m .se03 .flexbx .bx > a span{ font-size: 24px; margin-right: 20px; }
}

@media screen and (max-width: 1280px){
    ._m .se03 .flexbx .bx dl{ padding: 0 5%; box-sizing: border-box; }
    ._m .se03 .flexbx .bx dl dt{ font-size: 40px; }
    ._m .se03 .flexbx .bx dl dd{ font-size: 20px; }
    ._m .se03 .flexbx .bx dl dd._1{ margin-top: 10px; }
    ._m .se03 .flexbx .bx small{ font-size: 20px; }
    ._m .se03 .flexbx .bx > a{ padding-right: 5%; }
    ._m .se03 .flexbx .bx > a span{ font-size: 20px; margin-right: 10px; }
    ._m .se03 .flexbx .bx > a em{ width: 40px; }
}

@media screen and (max-width: 820px){
    ._m .se03 .flexbx{ flex-direction: column; }   
    ._m .se03 .flexbx .bx{ width: 100%; }   
    ._m .se03 .flexbx .bx .bg{ clip-path: circle(40% at 50% 50%); }
    ._m .se03 .flexbx .bx small{ opacity: 1; transform: translateX(0); top: 50px; font-size: 16px; }
    ._m .se03 .flexbx .bx dl{ margin-top: 0; }
    ._m .se03 .flexbx .bx dl dt{ opacity: 0; transform: translateY(-100%); }
    ._m .se03 .flexbx .bx dl dd{ font-size: 7.7vw; color: #fff; }
    ._m .se03 .flexbx .bx dl dd._1{ text-align: left; }
    ._m .se03 .flexbx .bx dl dd._2{ text-align: right; }

    ._m .se03 .flexbx .bx > a{ opacity: 1; transform: translateX(0); }
    ._m .se03 .flexbx .bx > a{ color: #fff; }
    ._m .se03 .flexbx .bx > a em{ transform: scaleX(1); }

    ._m .se03 .flexbx .bx > a span{ font-size: 16px; }
    
}

@media screen and (max-width: 500px){
    ._m .se03 .flexbx .bx .bg{ clip-path: circle(30% at 50% 50%); }
}



._m .se04{ padding-top: 190px; padding-bottom: 120px; box-sizing: border-box; background-color: #080808; }
._m .se04 .wrap > strong{ display: block; text-align: center; font-size: 60px; font-weight: 700; }


@media screen and (max-width: 1440px){
    ._m .se04 .wrap > strong{ font-size: 50px; }
}

@media screen and (max-width: 1280px){
    ._m .se04{ padding-top: 160px; }
    ._m .se04 .wrap > strong{ font-size: 40px; }
}

@media screen and (max-width: 820px){
    ._m .se04{ padding-top: 120px; }
    ._m .se04 .wrap > strong{ font-size: 35px; }
}

@media screen and (max-width: 500px){
    ._m .se04{ padding-top: 70px; }
    ._m .se04 .wrap > strong{ font-size: 28px; }
}








