html{
	--vh:1vh;
	--vh100:100vh;
}

.wrap{ width: 95%; margin: 0 auto; }
.wrap[max="1280"]{ max-width: 1280px; }
.wrap[max="1440"]{ max-width: 1440px; }
.wrap[max="1520"]{ max-width: 1520px; }
.wrap[max="1500"]{ max-width: 1500px; }
.wrap[max="1640"]{ max-width: 1640px; }

@media screen and (max-width: 820px){
    .wrap{ width: 90%; }
}




.topbtn{ width: 54px; height: 54px; border-radius: 50%; background-color: #00e100; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 20px; cursor: pointer; flex-shrink: 0; position: fixed; bottom: 25px; right: calc(50 / 1920 * 100%); z-index: 999; transition-duration: 0.2s; pointer-events: none; opacity: 0; }
.topbtn.show{ opacity: 1; pointer-events: unset; }



/* header */
.header{ position: fixed; top: 0; left: 0; width: 100%; z-index: 997; color: #fff; background-color: rgba(0, 0, 0, 0.6); transition-duration: 0.5s; border-bottom: 1px solid #333333; box-sizing: border-box; height: 80px; }
.header .logo{ display: block; width: 136px; padding: 31px 0; position: fixed; left: calc(40 / 1920 * 100%); top: 0; }
.header .logo img{ transition-duration: 0.2s; }
.header .logo .black{ position: absolute; left: 0; top: 31px; opacity: 0; }
.header .wrap{ height: 100%; display: flex; justify-content: flex-end; }
.header nav{ display: flex; justify-content: center; width: 100%; height: 100%; }
.header nav .menu{ display: flex; justify-content: center; }
.header nav .menu > li{ height: 100%; position: relative; }
.header nav .menu > li > a{ display: flex; height: 100%; padding: 0 23px; box-sizing: border-box; font-size: 18px; font-family: 'Roboto', sans-serif; font-weight: 500; letter-spacing: -0.04em; align-items: center; justify-content: center; text-align: center; transition-duration: 0.2s; position: relative; }
.header nav .menu > li > a span{ transition-duration: 0.2s; }
.header nav .menu > li > a em{ width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; position: absolute; left: 0; top: 0; text-align: center; font-family: 'Pretendard'; letter-spacing: -0.02em; transition-duration: 0.2s; opacity: 0; }

.header nav .menu > li .depth2{ padding: 10px 0; box-sizing: border-box; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); width: 100%; background-color: rgba(0,0,0,0.6); min-width: 220px; display: none; }
.header nav .menu > li .depth2 li > a{ display: block; text-align: center; padding: 5px; box-sizing: border-box; width: 100%; font-size: 15px; letter-spacing: -0.02em; line-height: 1.3; word-break: keep-all; }


.header .hamWrap{ width: 23px; display: flex; align-items: center; justify-content: center; cursor: pointer; display: none; }
.header .hamWrap .hambtn{ width: 100%; height: 9px; margin-top: -5px; position: relative; }
.header .hamWrap .hambtn span{ width: 100%; height: 2px; background-color: #fff; position: absolute; left: 0; transition-duration: 0.4s; transform-origin: 50% 50%; display: block; }
.header .hamWrap .hambtn span:nth-of-type(1){ top: 0; }
.header .hamWrap .hambtn span:nth-of-type(2){ top: 100%; }




.remote{ position: fixed; top: 0; right: calc(213 / 1920 * 100%); z-index: 998; color: #fff; box-sizing: border-box; height: 80px; display: flex; justify-content: flex-end; align-items: center; transition-duration: 0.2s;  }
.remote .m_rm{ transition-duration: 0.2s; border-radius: 9px; overflow: hidden; display: flex; padding: 0 10px; box-sizing: border-box; margin-left: auto; height: 48px; }
.remote .m_rm li > a{ display: block; padding: 0 19px; box-sizing: border-box; font-size: 16px; letter-spacing: -0.04em; height: 100%; }
.remote .m_rm li > a > span{ display: flex; align-items: center; position: relative; height: 100%; transition-duration: 0.2s; }
.remote .m_rm li > a > span::after{ content: ''; display: block; width: 100%; height: 2px; background-color: #00e100; position: absolute; left: 0; top: calc(100% - 2px); transition: transform .4s cubic-bezier(.45,.46,.05,.96); transform: scaleX(0); transform-origin: 100% 0; }
.remote .m_rm li.on > a > span::after{ transform: scaleX(100%); transform-origin: 0 0; }
.remote .m_rm li.on > a > span{ color: #00e100; }

.remote .hashbx{ position: fixed; right: calc(213 / 1920 * 100%); top: 80px; padding: 5px 0; box-sizing: border-box; width: 50%; max-width: 430px; opacity: 0; transform: translateY(-5%); pointer-events: none; transition-duration: 0.5s; z-index: 993; }
.remote .hashbx .inn{ border-radius: 9px; background-color: rgba(1, 15, 22, 0.8); padding: 30px; box-sizing: border-box; transition-duration: 0.2s; border: 1px solid #333; }
.remote .hashbx .inn > strong{ display: block; width: 100%; padding-bottom: 0; font-size: 16px; letter-spacing: -0.02em; color: rgba(255,255,255,0.6); font-family: 'Roboto', sans-serif; transition-duration: 0.2s; cursor: pointer; }
.remote .hashbx .inn .list{ display: flex; margin-top: 13px; gap: 5px; flex-wrap: wrap; }
.remote .hashbx .inn .list li{ display: block; }

.remote .hashbx .inn .list li > a{ display: block; padding: calc(10 / 16 * 1em) calc(18 / 16 * 1em); box-sizing: border-box; border-radius: 20px; font-size: 16px; letter-spacing: -0.02em; font-family: 'Roboto', sans-serif; color: rgba(255,255,255,0.8); border: 1px solid rgba(255,255,255,0.6); transition-duration: 0.2s; }

.remote .hashbx.on{ transform: translateY(0); opacity: 1; pointer-events: unset; }


.header.white{ background-color: rgba(255,255,255,0.8); color: #333; border-color: #f1f1f1; }
.header.white .logo .white{ opacity: 0; }
.header.white .logo .black{ opacity: 1; }
.header.white ~ .remote{ color: #333333; }
.header.white nav .menu > li .depth2{ background-color: rgba(255,255,255,0.8); }

.header.white ~ .remote .hashbx .inn{ background-color: rgba(255,255,255,0.8); border-color: #f1f1f1; }
.header.white ~ .remote .hashbx .inn > strong{ color: #acacac; border-color: #dedede; }
.header.white ~ .remote .hashbx .inn .list li > a{ color: #7c7c7c; border-color: #dedede; }

.header.hide ~ .remote .hashbx .inn{ background-color: rgba(255,255,255,0.8); border-color: #f1f1f1; }
.header.hide ~ .remote .hashbx .inn > strong{ color: #acacac; border-color: #dedede; }
.header.hide ~ .remote .hashbx .inn .list li > a{ color: #7c7c7c; border-color: #dedede; }

.header.hide{ transform: translateY(-100%); }
.header.hide ~ .remote{ color: #333; }
.header.hide ~ .remote .m_rm{ background-color: rgba(255,255,255,0.8); border: 1px solid #f1f1f1; }
.header.hide ~ .remote .hashbx{ top: 63px; }


.header.white .hamWrap .hambtn span{ background-color: #333; }

.header.ham{ box-shadow: none; }
.header.ham .hambtn span:nth-of-type(1){ top: 50%; transform: translateY(-50%) rotate(-135deg); }
.header.ham .hambtn span:nth-of-type(2){ top: 50%; transform: translateY(-50%) rotate(135deg); }




.total{ display: flex; position: fixed; z-index: 995; width: 100%; left: 0; top: 0; height: 100vh; box-sizing: border-box; overflow: auto; background-color: #040404; color: #fff; padding: 70px 0; flex-direction: column; transition-duration: 0.4s; transform: translateY(-100%); opacity: 0; }
.total .mobmenu{ width: 100%; }
.total .mobmenu li .top{ width: 100%; display: flex; justify-content: space-between; align-items: center; cursor: pointer; }
.total .mobmenu li .top .plmi{ width: 20px; height: 20px; position: relative; }

.total .mobmenu li .top .plmi em{ position: absolute; width: 100%; height: 2px; background-color: #fff; border-radius: 1px; top: 50%; left: 50%; transform: translate(-50%, -50%); transition-duration: 0.2s; transform-origin: center; }
.total .mobmenu li span{ font-size: 24px; letter-spacing: -0.04em; font-family: 'Roboto', sans-serif; display: block; padding: 20px 0; transition-duration: 0.4s; }
.total .mobmenu li .dep_{ display: none; }
.total .mobmenu li .dep_ li a{ padding: 13px 17px; font-size: 18px; letter-spacing: -0.04em; display: block; color: #7c7c7c; }

.total .hashbx{ width: 100%; margin-top: 40px; }
.total .hashbx .inn strong{ display: block; padding: 8px 0; font-size: 16px; letter-spacing: -0.02em; color: #acacac; font-family: 'Roboto', sans-serif; border-bottom: 1px solid rgba(255,255,255,0.2); }
.total .hashbx .inn .list{ width: 100%; display: flex; flex-wrap: wrap; gap: 5px; padding-top: 15px; }
.total .hashbx .inn .list li{ border-radius: 20px; border: 1px solid #7c7c7c; box-sizing: border-box; margin-bottom: 5px; }
.total .hashbx .inn .list li > a{ font-size: 16px; letter-spacing: -0.02em; color: #7c7c7c; display: block; padding: 12px 20px; }


.total .mobmenu li.on span{ color: #00e100; }
.total .mobmenu li.on .top .plmi em{ background-color: #00e100; }
.total .mobmenu li.on .top .plmi em:nth-of-type(1){  }
.total .mobmenu li.on .top .plmi em:nth-of-type(2){ transform: translate(-50%, -50%) rotate(90deg); }


.header.ham ~ .remote ~ .total{ transform: translateY(0); opacity: 1; }


@media screen and (min-width: 821px){
    .header nav .menu li:hover > a{ color: #00e100; }
    .header nav .menu li:hover > a span{ opacity: 0; }
    .header nav .menu li:hover > a em{ opacity: 1; }
    .remote .hashbx .inn .list li > a:hover{ background-color: #1b2e38; color: #fff; }
    .header.white ~ .remote .hashbx .inn .list li > a:hover{ background-color: #dedede; color: #7c7c7c; }
    .header.hide ~ .remote .hashbx .inn .list li > a:hover{ background-color: #dedede; color: #7c7c7c; }
}



@media screen and (max-width: 1600px){
    .remote{ right: calc(40 / 1920 * 100%); }
    .remote .hashbx{ right: calc(40 / 1920 * 100%); }
}

@media screen and (max-width: 1280px){
    .header{ height: 68px; }
    .header .logo{ padding: 25px 0; }
    .header .logo .black{ top: 25px; }
    .header nav .menu li > a{ font-size: 16px; padding: 0 15px; }

    .remote{ height: 68px; }
    .remote .hashbx{ top: 68px; }
    .remote .m_rm li > a{ padding: 0 10px; }
    .header.hide ~ .remote .hashbx{ top: 57px; }
}

@media screen and (max-width: 1024px){
    .header nav{ display: none; }
    .header .hamWrap{ display: flex; }
    
    .remote{ right: 60px; }
    .remote .hashbx{ right: 60px; }
    .remote .hashbx .inn{ padding: 20px; }
    .remote .hashbx .inn .list li > a{ font-size: 14px; }
}

@media screen and (max-width: 820px){
    .header{ height: 58px; }
    .header .logo{ padding: 20px 0; left: 5%; }
    .header .logo .black{ top: 20px; }

    .remote{ height: 58px; transition-duration: 0.5s; }
    .remote .m_rm li.sch,
    .remote .m_rm li.home_{ display: none; }
    .remote .m_rm li > a{ font-size: 14px; }

    .header .hamWrap .hambtn{ margin-top: 0; }
    .header.hide ~ .remote{ transform: translateY(-100%); }
    .header.hide ~ .remote .m_rm{ background-color: unset; border: unset; }
    /*
    .remote{ height: 58px; }
    .remote .m_rm{ height: 38px; }
    .remote .m_rm li > a{ font-size: 14px; }
    .remote .m_rm li > a > span i{ font-size: 18px; }

    .remote .hashbx{ top: 58px; width: 60%; }
    .remote .hashbx .inn{ padding: 15px; }
    .remote .hashbx .inn > strong{ padding-bottom: 7px; font-size: 14px; }
    .remote .hashbx .inn .list{ margin-top: 7px; }

    .header.hide ~ .remote{ right: 26px; }
    .header.hide ~ .remote .hashbx{ top: 47px; }
    .header.hide ~ .remote .hashbx .inn .list li > a{ font-size: 12px; }
    */

}

@media screen and (max-width: 500px){
    .header{ height: 46px; }
    .header .logo{ width: 100px; padding: 15px 0; }
    .header .logo .black{ top: 15px; }

    .remote{ height: 44px; right: 58px; }
    .remote .m_rm{ padding: 0; }
    .remote .m_rm li > a{ padding: 0 5px; }

    .total .mobmenu li span{ font-size: 20px; padding: 15px 0; }
    .total .mobmenu li .dep_ li a{ font-size: 14px; padding: 10px 15px; }
    .total .hashbx .inn .list li > a{ padding: 10px 15px; font-size: 14px; }
    
}


/* footer */
.footer{ width: 100%; padding: 50px 0; box-sizing: border-box; overflow: hidden; background-color: #010f16; color: #fff; }
.footer .wrap{ display: flex; align-items: center; justify-content: space-between; }
.footer .wrap .lbx > a{ width: 210px; display: block; }
.footer .wrap .lbx .textbx{ margin-top: 53px; }
.footer .wrap .lbx .textbx p{ font-size: 18px; font-weight: 300; letter-spacing: -0.05em; line-height: 1.4; }
.footer .wrap .lbx .textbx .info{ margin-top: 20px; display: flex; align-items: baseline; }
.footer .wrap .lbx .textbx .info li{ display: flex; align-items: baseline; margin-right: 35px; font-size: 18px; letter-spacing: -0.05em; }
.footer .wrap .lbx .textbx .info li:last-of-type{ margin-right: 0; }
.footer .wrap .lbx .textbx .info li span{ display: block; margin-right: 15px; color: #7c7c7c; }
.footer .wrap .lbx .textbx em{ font-size: 16px; letter-spacing: -0.05em; line-height: 1.4; color: #7c7c7c; display: block; margin-top: 50px; }

.footer .wrap .rbx{ display: flex; align-items: center; justify-content: flex-end; max-width: 319px; width: 30%; }
.footer .wrap .rbx .inn{ width: 100%; border: 1px solid #fff; box-sizing: border-box; border-radius: 9px; transition-duration: 0.2s; }
.footer .wrap .rbx .inn > a{ display: block; width: 100%; height: 100%; padding: 33px 25px; box-sizing: border-box; color: #fff; transition-duration: 0.2s;  }
.footer .wrap .rbx .inn > a .flex{ display: flex; align-items: center; }
.footer .wrap .rbx .inn > a .flex strong{ font-size: 24px; font-weight: 600; letter-spacing: -0.05em; margin-right: 15px; }
.footer .wrap .rbx .inn > a .flex .s_marq{ font-size: 24px; width: 1em; overflow: hidden; display: flex; }
.footer .wrap .rbx .inn > a .flex .s_marq i{ flex-shrink: 0; transition-duration: 0.5s; }
.footer .wrap .rbx .inn > a p{ font-size: 18px; font-weight: 300; letter-spacing: -0.05em; line-height: calc(30 / 18); margin-top: 45px; }
.footer .wrap .rbx > em{ display: none; font-size: 16px; letter-spacing: -0.05em; line-height: 1.4; color: #7c7c7c; margin-top: 50px; }

.footer .wrap .lbx .textbx .footpriv{ margin-top: 20px; font-size: 14px; display: flex; justify-content: flex-start;}
.footer .wrap .lbx .textbx .footpriv > a{ color: #fff;  transition-duration: 0.2s; }
.footer .wrap .lbx .textbx .footpriv > a:hover{ color:#00e100; }


@media screen and (min-width: 821px){
    .footer .wrap .rbx .inn:hover{ border-color: #00e100; }
    .footer .wrap .rbx .inn:hover > a{ color: #00e100; border-color: #00e100; }
    .footer .wrap .rbx .inn:hover > a .flex .s_marq i{ animation: arr 0.6s infinite linear; }
}

@keyframes arr {
    0%{ transform: translateX(-100%); }
    100%{ transform: translateX(0); }
}

@media screen and (max-width: 1280px){
    .footer .wrap .lbx > a{ width: 180px; }
    .footer .wrap .lbx .textbx{ margin-top: 25px; }
    .footer .wrap .lbx .textbx p{ font-size: 16px; }
    .footer .wrap .lbx .textbx .info{ margin-top: 10px; }
    .footer .wrap .lbx .textbx .info li{ font-size: 16px; }
    .footer .wrap .lbx .textbx em{ font-size: 14px; margin-top: 30px; }
    .footer .wrap .rbx > a{ width: 100px; height: 100px; }
    .footer .wrap .rbx span{ font-size: 16px; }

    .footer .wrap .rbx .inn > a{ padding: 20px 15px; }
    .footer .wrap .rbx .inn > a .flex strong{ font-size: 20px; }
    .footer .wrap .rbx .inn > a .flex .s_marq{ font-size: 20px; }
    .footer .wrap .rbx .inn > a p{ font-size: 16px; margin-top: 30px; }
}


@media screen and (max-width: 820px){
    .footer{ padding: 40px 0; }

    .footer .wrap{ flex-direction: column-reverse; align-items: flex-start; }

    .footer .wrap .lbx{ margin-top: 30px; width: 100%; }
    .footer .wrap .lbx > a{ width: 140px; }
    .footer .wrap .lbx .textbx{ margin-top: 25px; }
    .footer .wrap .lbx .textbx p{ font-size: 14px; }
    .footer .wrap .lbx .textbx .info li{ font-size: 14px; }

    .footer .wrap .rbx{ width: auto; display: block;  width: 100%; max-width: 280px; }
    .footer .wrap .rbx > a{ margin-left: 10px; }

    .footer .wrap .rbx .inn > a{ padding: 15px 10px; }
    .footer .wrap .rbx .inn > a .flex strong{ font-size: 16px; }
    .footer .wrap .rbx .inn > a .flex .s_marq{ font-size: 16px; }
    .footer .wrap .rbx .inn > a p{ font-size: 14px; margin-top: 20px; }
    .footer .wrap .rbx > em{ display: block; font-size: 14px; margin-top: 30px; }

}

@media screen and (max-width: 500px){
    .footer .wrap .lbx .textbx .info{ display: block; }
    .footer .wrap .lbx .textbx .info li{ margin: 0; margin-bottom: 5px; }
    .footer .wrap .lbx .textbx .info li span{ width: 22px; }
    .topbtn{ width: 45px; height: 45px; font-size: 18px; }
    .footer .wrap .rbx > a{ width: 80px; height: 80px; font-size: 14px; }
    .footer .wrap .rbx span{ font-size: 14px; }
}


/* 마퀴 */
.marquee{
    width: 100%;
    display: flex;
    align-items: center;
    font-size: 10.4167vw;
    font-style: italic;
    font-weight: 700;
    letter-spacing: -0.025em;
    font-family: 'Roboto', sans-serif;
    color: rgba(51, 51, 51, 0.6);
    opacity: .05;
    overflow: hidden;
    white-space: nowrap;
}

.marquee .absol{
    width: 100%;
    display: flex;
    align-items: center;
}

.marquee .absol span{
    margin: 0 calc(20 / 200 * 1em);
}


/* 서브비주얼 */
._s .visual{ width: 100%; height: var(--vh100); box-sizing: border-box; position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: center; align-items: center; color: #fff; word-break: keep-all; }
html.mo.regularWeb ._s .visual{height: calc(var(--vh100) - 60px);}
html.mo.kakaoWeb ._s .visual{height: calc(var(--vh100) - 60px);}
html.mo.safariWeb ._s .visual{height: calc(var(--vh100) - 100px);}
._s .visual .bg{ width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 0; }
._s .visual .bg img{ width: 100%; height: 100%; object-fit: cover; }
._s .visual .logo{ width: 100%; z-index: 1; position: relative; }
._s .visual .logo .st5{fill:#fff;}
._s .visual .wrap{ position: relative; z-index: 1; }
._s .visual .wrap p{ font-size: 17px; letter-spacing: -0.02em; line-height: calc(30 / 17); margin-top: 40px; text-align: center; }
._s .visual .wrap p br.mob{ display: none; }
._s .visual .wrap dl{ text-align: center; }
._s .visual .wrap dl dt{ font-size: 18px; letter-spacing: -0.02em; color: #00e100; }
._s .visual .wrap dl dd{ font-size: 92px; letter-spacing: -0.02em; font-weight: 600; line-height: 1.3; margin-top: 20px; }
._s .visual .wrap > strong{ display: block; font-size: 28px; letter-spacing: -0.02em; line-height: 1.4; margin-top: 40px; text-align: center; }
._s .visual .wrap > em{ font-size: 20px; letter-spacing: -0.02em; line-height: calc(33 / 20); font-weight: 300; margin-top: 15px; color: #cccccc; text-align: center; display: block; }
._s .visual .wrap > em br.mob{ display: none; }

._s .visual .wrap .subvisnav{ margin-top: 30px; }
._s .visual .wrap .subvisnav .flex{ display: flex; align-items: center; font-size: 18px; letter-spacing: -0.02em; justify-content: center; }
._s .visual .wrap .subvisnav .flex li{ color: #7c7c7c; }
._s .visual .wrap .subvisnav .flex li > a{ display: block; padding: 10px; box-sizing: border-box; transition-duration: 0.2s; text-align: center; }
._s .visual .wrap .subvisnav .flex li.on > a{ color: #fff; }

@media screen and (min-width: 821px){
    ._s .visual .wrap .subvisnav .flex li > a:hover{ color: #fff; }
}


@media screen and (max-width: 1280px){
    ._s .visual .wrap p{ margin-top: 20px; font-size: 16px; }
    ._s .visual .wrap dl dt{ font-size: 16px; }
    ._s .visual .wrap dl dd{ font-size: 60px; margin-top: 15px; }
    ._s .visual .wrap > strong{ font-size: 22px; margin-top: 30px; }
    ._s .visual .wrap > em{ font-size: 16px; }
    ._s .visual .wrap .subvisnav .flex{ font-size: 16px; }
}

@media screen and (max-width: 820px){
    ._s .visual .logo{ width: 140%; }
    ._s .visual .wrap p{ margin-top: 10px; font-size: 14px; }
    ._s .visual .wrap > em br.mob{ display: block; }

    ._s .visual .wrap dl dt{ font-size: 14px; }
    ._s .visual .wrap dl dd{ font-size: 35px; margin-top: 10px; }
    ._s .visual .wrap > strong{ font-size: 18px; margin-top: 20px; }
    ._s .visual .wrap > em{ font-size: 14px; }
    ._s .visual .wrap .subvisnav{ margin-top: 20px; }
    ._s .visual .wrap .subvisnav .flex{ font-size: 14px; }
}

@media screen and (max-width: 500px){
    ._s .visual .wrap p br.mob{ display: block; }
}

._s .subvis_line{ width: 2px; height: 112px; background-color: #b4b4b4; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); }
._s .subvis_line span{ display: block; width: 100%; height: 20%; position: absolute; top: 0; left: 0; }
._s .subvis_line span._1{ background-color: #b4b4b4; animation: line1 2s infinite; }
._s .subvis_line span._2{ background-color: #00e100; animation: line2 2s infinite; }

@keyframes line1 {
    0% {
        height: 0%;
    }
    50% {
        height: 0%;
        z-index: 2;
    }
    100% {
        height: 100%;
        z-index: 2;
    }
}

@keyframes line2 {
    0% {
        height: 0;
    }
    50% {
        height: 100%;
    }
    100% {
        height: 100%;
    }
}

@media screen and (max-width: 500px){
    ._s .subvis_line{ height: 70px; }
}


/* small left subtitle */
._s .lefttitle{ width: 100%; }
._s .lefttitle.center{text-align: center;}
._s .lefttitle em{ display: block; font-size: 20px; font-weight: 500; letter-spacing: -0.025em; color: #00e100; font-weight: 500; font-family: 'Roboto', sans-serif; line-height: 1.3; }
._s .lefttitle strong{ display: block; font-size: 64px; letter-spacing: -0.02em; line-height: 1.3; font-weight: 600; margin-top: 15px; }
._s .lefttitle strong span{color: #00e100;}
._s .lefttitle p{ font-size: 18px; letter-spacing: -0.02em; line-height: calc(30 / 18); color: #444444; margin-top: 15px; }
._s .lefttitle p b{ font-weight: 600; color: #000; }

@media screen and (max-width: 1280px){
    ._s .lefttitle{ word-break: keep-all; }
    ._s .lefttitle em{ font-size: 16px; }
    ._s .lefttitle strong{ font-size: 45px; margin-top: 10px; }
    ._s .lefttitle p{ font-size: 16px; }
}

@media screen and (max-width: 820px){
    ._s .lefttitle em{ font-size: 14px; }
    ._s .lefttitle strong{ font-size: 32px; margin-top: 5px; }
    ._s .lefttitle p{ font-size: 14px; }
}

@media screen and (max-width: 500px){
    ._s .lefttitle strong{ font-size: 25px; margin-top: 5px; }
}


/* pagination */
.pagination{ width: 100%; display: flex; align-items: center; justify-content: center; margin-top: 50px; }
.pagination .btn{ padding: 6px; box-sizing: border-box; font-size: 16px; letter-spacing: -0.02em; color: rgba(0,0,0,0.5); }
.pagination .num{ display: flex; align-items: center; justify-content: center; margin: 0 30px; }
.pagination .num li{ margin-right: 10px; }
.pagination .num li:last-of-type{ margin-right: 0; }
.pagination .num li > a{ display: block; padding: 5px; width: 25px; box-sizing: border-box; border-radius: 5px; font-size: 16px; color: rgba(0,0,0,0.5); text-align: center; }
.pagination .num li.on > a{ background-color: #00e100; color: #fff; }

@media screen and (max-width: 820px){
    .pagination .num{ margin: 0 15px; }
    .pagination .num li{ margin-right: 5px; }
    .pagination .num li > a{ font-size: 14px; }
}

@media screen and (max-width: 500px){
    .pagination .num{ margin: 0 5px; }
    .pagination .num li{ margin-right: 3px; }
    .pagination .btn{ padding: 3px; }
}


/* 모바일_스크롤하세요 */
.scrollnote{ font-size: 14px; text-align: right; margin-top: 75px; margin-bottom: 10px; display: none; letter-spacing: -0.02em; }

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

    .scrollnote._500{ display: none; }
}

@media screen and (max-width: 500px){
    .scrollnote{ margin-top: 50px; }
    .scrollnote._500{ display: block; }
}



/*개인정보처리방침 팝업*/
.privPop{ position: fixed; top: 0; left: 0; width: 100%; height: 100vh; z-index: 99999;  transition: opacity .4s, visibility .4s; opacity: 0; visibility: hidden; word-break: keep-all; color: #333; }
.privPop .eleBg{ width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); }
.privPop .inn{ width: 95%; max-width: 600px; height: 55vh; margin: 0 auto; background-color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 15px; box-sizing: border-box; padding: 50px; }
.privPop .inn .cont{ width: 100%; height: 100%; position: relative; }
.privPop .inn .cont .close{ position: absolute; bottom: calc(100% + 60px); left: 50%; transform: translateX(-50%); z-index: 99999; cursor: pointer; color: #fff; font-size: 24px; }
.privPop .inn .cont .p{ height: 100%; line-height: 1.4; overflow: auto; font-size: 16px; letter-spacing: -0.04em; padding-right: 10px; }
.privPop .inn .cont .p strong{ font-weight: 700; font-size: 20px; line-height: 1.3; color: #333; }
.privPop .inn .cont .p p{ font-size: 16px; letter-spacing: -0.02em; }
.privPop .inn .cont .p ul{ border-radius: 9px; background-color: #f1f1f1; padding: 30px; box-sizing: border-box; margin: 20px 0; font-size: 16px; letter-spacing: -0.02em; }
.privPop .inn .cont .p ul li{ display: flex; line-height: 1.4; padding: 10px 0; border-bottom: 1px solid #dadada; }
.privPop .inn .cont .p ul li:last-of-type{ border-bottom: none; }
.privPop .inn .cont .p ul li span{ display: block; flex-shrink: 0; width: 140px; font-weight: 700; display: flex; color: #000; }
.privPop .inn .cont .p ul li b{ font-weight: 600; }


.privPop .inn .cont .p::-webkit-scrollbar{ width: 8px; }
.privPop .inn .cont .p::-webkit-scrollbar-thumb{ border-radius: 10px; background-color: #333; }

.privPop.on { opacity: 1; visibility: visible; }

@media screen and (max-width: 820px){
    .privPop .inn{ padding: 30px 15px; }
    .privPop .inn .cont .p strong{ font-size: 18px; }
    .privPop .inn .cont .p ul{ font-size: 14px; }
    .privPop .inn .cont .p p{ font-size: 14px; }
}

@media screen and (max-width: 450px){
    .privPop{ font-size: 14px; }
    .privPop .inn .cont .p ul{ padding: 15px; }
    .privPop .inn .cont .p ul li{ display: block; }
    /* .privPop .inn .cont .p ul li b{ color: #888; } */
    .privPop .inn .cont .close{ bottom: calc(100% + 40px); }
    /* .privPop .inn{ padding-right: 0; } */
}


._s .wrap .category{ display: block; width: 70%; }
._s .wrap .category > ul{ display: flex; }
._s .wrap .category > ul li{ cursor: pointer; }
._s .wrap .category > ul li > a{ display: block; padding: 30px 15px; font-size: 24px; letter-spacing: -0.02em; font-weight: 700; color: #cccccc; transition-duration: 0.2s; text-align: center; display: flex; align-items: center; justify-content: center; line-height: 1.2; height: 100%; box-sizing: border-box; }
._s .wrap .category > ul li.on > a{ color: #00e100; }
._s .wrap .category > ul li:first-of-type{ padding-left: 0; }

@media screen and (min-width: 821px){
    ._s .wrap .category > ul li:hover > a{ color: #00e100; }
}

@media screen and (max-width: 1280px){
    ._s .wrap .category > ul li > a{ font-size: 18px; padding: 20px 10px; }
}


@media screen and (max-width: 500px){
    ._s .wrap .category{ overflow: auto; width: 100%; }
    /* ._s .wrap .category > ul{ min-width: 500px; } */
    ._s .wrap .category > ul li > a{ font-size: 14px; padding: 10px; }
}