/* °øÅëÀû¿ë */
html {scroll-behavior:smooth;}
img {max-width: 100%;}
.inner {width: 90%; margin: 0 auto; max-width: 1600px;}
.colorMain {color: var(--mainColor);}
.colorSub {color: var(--subColor);}
.bold {font-weight: 700;}
.stroke {color: transparent; -webkit-text-stroke-width: 1px; -webkit-text-stroke-color: #fff;}
.textCt {text-align: center;}
#container {overflow: hidden;}



/* ºñ¸Þ¿À, À¯Æ©ºê */
.video_container {position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%;}
.video_container iframe {position: absolute; top: 0; left: 0; width: 100%; height: 100%; }



/* padding */
.padding_tb {padding: 150px 0;}
.padding_t {padding-top: 150px;}
.padding_b {padding-bottom: 150px;}



/* swiper */
.swiper_box {position: relative;}
.swiper-button-prev:after,
.swiper-button-next:after {font-size: 0;}
.swiper-button-next,
.swiper-button-prev {width: 70px; height: 70px; margin-top: 0;}
.swiper-button-next {background: url('/base/img/mf/swiper_btn_next.png') no-repeat center center / cover;}
.swiper-button-prev {background: url('/base/img/mf/swiper_btn_prev.png') no-repeat center center / cover;}



/* header */
#header {width: 100%; height: 120px; display: flex; align-items: center; position: fixed; z-index: 998; transition: all .3s;}
#header .hd_inner {display: flex; align-items: center; justify-content: space-between; padding: 0 40px; width: 100%;}
#header .logo {font-size: 0; z-index: 2; position: relative;}
#header .logo img {height: 80px;}
#header .hamberg {width: 30px; height: 30px; font-size: 0; display: flex; align-items: center; cursor: pointer; position: relative; z-index: 2;}
#header .hamberg span {width: 100%; height: 2px; background: #fff; display: block; position: relative; transition: all .3s;}
#header .hamberg span::before,
#header .hamberg span::after {display: block; content: ""; width: 100%; height: 2px; background: #fff; position: absolute; transition: all .3s;}
#header .hamberg span::before {top: -10px;}
#header .hamberg span::after {top: 10px;}
#header .hamberg span.on {background: rgba(255,255,255,0);}
#header .hamberg span.on::before {top: 0; transform: rotate(-45deg);}
#header .hamberg span.on::after {top: 0; transform: rotate(45deg);}
#header .nav_wrap {
    width: 100%; height: 100%; min-height: 100vh; background: rgba(0, 0, 0, 0.95); transition: all .3s; color: #fff;
    position: absolute; top: 0; left: 100%; z-index: 1; display: flex; align-items: center; justify-content: center;
}
#header .nav_wrap.on {left: 0;}
#header .nav_inner {width: 100%; display: flex; align-items: center; justify-content: space-around; gap: 40px;}
#header .nav {display: flex; flex-direction: column; gap: 40px;}
#header .nav > li > a {font-size: 4.25rem; font-weight: 700; line-height: 1; transition: all .3s; position: relative;}
#header .nav > li > a::after {
    display: block; content: ""; width:30px; aspect-ratio: 1/1; background: url('/base/img/mf/icon_plus_sky.png') no-repeat center center / contain;
    position: absolute; top: 5px; right: -30px; opacity: 0; transition: all .3s;
}
#header .nav > li > a:hover {color: var(--subColor);}
#header .nav > li > a:hover::after {opacity: 1;}
#header .info {font-size: 1.25rem; display: flex; flex-direction: column; gap: 40px;}
#header .info .gu {font-weight: 700;}



#header.active {background: rgba(0, 0, 0, .8); height: 80px;}
#header.active .logo img {height: 55px;}



/* footer */
#footer {background: #000; color: #fff; padding: 80px 0;}
#footer .inner {display: flex; justify-content: space-between; align-items: flex-end; gap: 40px;}
#footer .info {display: flex; flex-wrap: wrap; gap: 20px; width: 1000px;}
#footer .info > div {width: calc(50% - 10px);}
#footer .info .gu {font-weight: 700;}
#footer .copy {font-size: 0.875rem; color: #aaa; flex-shrink: 0;}



/* sub */
.sec_tit {margin-bottom: 60px;}
.sec_tit .big {font-size: 4.5rem; font-weight: 800; display: inline-block; position: relative; line-height: 1.2;}
.sec_tit .big::after {
    display: block; content: ""; width: 32px; aspect-ratio: 1/1; background: url('/base/img/mf/icon_plus.png') no-repeat center center / contain;
    position: absolute; right: -35px; top: 0;
}
.sec_tit .small {font-size: 1.125rem; margin-top: 10px;}
.sec_tit.white {color: #fff;}
.sec_tit.white .big::after {background-image: url('/base/img/mf/icon_plus_sky.png');}


/* background */
/* .bg_wrap {width: 100%; height: 100vh; position: fixed; top: 0; left: 0; z-index: -1;}
.cursor {
    width: 30%; aspect-ratio: 1/1; opacity: .5; border-radius: 1000px; filter: blur(20px);
    background-image: linear-gradient(127deg,#ca8eff,#fcccff 51%,#cbe6ff); position: fixed;
    transform: translate(-50%, -50%);
} */



@media screen and (max-width:1440px) {
    /* header */
    #header .nav > li > a {font-size: 3.25rem;}
    #header .nav > li > a::after {width: 24px; right: -24px}
    #header .info {font-size: 1.125rem; gap: 20px;}
    
    /* sub */
    .sec_tit .big {font-size: 3rem;}
    .sec_tit .big::after {width: 24px; right: -26px;}
    .sec_tit .small {font-size: 1rem;}
}



@media screen and (max-width:1199px) {


    .inner {width: 100%; padding: 0 40px;}


    /* padding */
    .padding_tb {padding: 100px 0;}
    .padding_t {padding-top: 100px;}
    .padding_b {padding-bottom: 100px;}


    /* header */
    #header {height: 60px;}
    #header .hd_inner {padding: 0 20px;}
    #header .hamberg {width: 24px; height: 24px;}
    #header .hamberg span::before {top: -8px;}
    #header .hamberg span::after {top: 8px;}
    #header .logo img {height: 50px;}
    #header .nav > li > a {font-size: 2.5rem;}
    #header .info {font-size: 0.875rem;}
    #header.active {height: 60px;}
    #header.active .logo img {height: 50px;}


    /* footer */
    #footer .inner {flex-direction: column; align-items: flex-start;}
    #footer .info {gap:10px 20px; width: 100%;}
    #footer .info > div {width: auto; display: flex; gap: 10px;}


    /* sub */
    .sec_tit {margin-bottom: 40px;}





}


@media screen and (max-width:899px) {


    .inner {width: 100%; padding: 0 20px;}


    /* header */
    #header .nav {text-align: center;}
    #header .info {display: none;}


    /* footer */
    #footer {padding: 50px 0;}
    #footer .info {font-size: 0.875rem;}
    #footer .copy {font-size: 0.75rem;}


    /* sub */
    .sec_tit .big {font-size: 2rem;}
    .sec_tit .big::after {width: 18px; right: -20px;}



}


@media screen and (max-width:599px) {


    /* padding */
    .padding_tb {padding: 80px 0;}
    .padding_t {padding-top: 80px;}
    .padding_b {padding-bottom: 8dvb;}


    /* header */
    #header .nav {gap: 30px;}
    #header .nav > li > a {font-size: 1.5rem;}
    #header .nav > li > a::after {width: 16px; right: -16px; top: 0;}


    /* footer */
    #footer .info > div {flex-direction: column; width: 100%; gap: 0px;}


    /* sub */
    .sec_tit {margin-bottom: 30px;}
    .sec_tit .big {font-size: 1.5rem;}
    .sec_tit .big::after {width: 16px; right: -18px;}


}