@charset "UTF-8";

.pc-ver { display: block !important; }
.pad-ver { display: none !important; }
.mobile-ver { display: none !important; }


/*--------------------------------------------------------------------- LAYOUT --------------------------*/
.inner { max-width: calc(1380px + 80px); width: 100%; margin: 0 auto; padding: 0 40px; }
#container {position: relative;min-height: calc(100vh - 165px);padding-bottom: 120px;}
header {position: fixed;width: 100%;z-index: 999;}
header .pc-ver { display: block; }
.hd-wrap {height: 110px;}
.hd-logo{margin-right: 120px;}
.hd-logo img{width: 166px;}
.hd-logo a{gap: 16px;}
.hd-logo span{font-size: 26px; margin-top: 3px;}
header .inner{max-width: calc(1560px + 80px)}
header .gnb-cont>li {display: flex;align-items: center;height: 100%;position: relative;}
header .gnb-cont>li:not(:last-child) { margin-right: 80px; }
header .gnb-cont>li .tit { font-size: 26px; font-weight: 600; color: var(--color-800);}
header .gnb-cont>li .depth2 { position: absolute; display: none; top: calc(100% + 16px); left: calc(50% - 20px); transform: translateX(-50%); text-align: center; padding: 15px 25px; background: #fff; border: 1px solid #E4E4E4; box-shadow: 0 6px 12px rgba(0, 0, 0, 0.16); border-radius: 11px; white-space: nowrap; width: 150px; z-index: 12; }
header .gnb-cont>li .depth2:after { content: ""; position: absolute; width: 20px; height: 12px; top: -12px; left: 50%; transform: translateX(-50%); background: no-repeat 50%/cover; background-image: url(../../images/cmn/ico-triangle.svg); }
header .gnb-cont>li .depth2>li { padding: 12px 0; }
header .gnb-cont>li .depth2>li.on a, header .gnb-cont>li .depth2>li a:hover { text-decoration: underline; color: #4B3329; font-weight: 700; }
header .gnb-cont>li .depth2>li>a {font-size: 16px;font-weight: 400;color: var(--color-800);}
.hd_lang { position: absolute; right: 0; padding-right: calc((100vw - 1440px) / 2); top: 6px; z-index: 11; }
.hd_lang .goog-te-gadget { font-size: 0 !important; }
.hd_lang .goog-te-gadget .goog-te-combo { width: 120px; height: 35px; font-family: "Spoqa Han Sans Neo", "sans-serif"; font-size: 14px; margin: 0; }
.hd_lang .goog-te-gadget .goog-te-combo option { font-size: 14px; }
.hd_lang span { display: none !important; }
nav.gnb{flex: 1;}
.tnb-r{margin-right: 30px;}
.tnb-r > li > a{font-size: 20px; font-weight: 600; color: var(--color-600);}
.tnb-r > li:not(:last-child){position: relative;padding-right: 17px;}
.tnb-r > li:not(:last-child)::after{content: 'ㆍ';font-size: 20px;font-weight: 600;color: var(--color-600);margin-right: 2px;position: absolute;}
.hd-site a{background: var(--color-gradient); padding: 8px 16px; border-radius: 30px; font-size: 16px; font-weight: 700; color: #fff;}
.hd-site > li:not(:last-child){margin-right: 10px;}
header.scroll-active{background: #fff;box-shadow: 0 3px 10px rgba(0,0,0,0.05);}

/* footer */
footer {width: 100%;padding: 40px 0 40px;border-radius: 100px 100px 0px 0px;background: #fff;box-shadow: 0px -6px 20px 0px rgba(0, 0, 0, 0.05);}
footer .inner {max-width: calc(1320px + 80px);}
footer .ft-logo {flex: none;font-size: 0;}
footer .ft-logo img{width: 268px;}
footer .ft-info__link {display: flex;font-size: 0;margin: 0 -10px;}
footer .ft-info__link > li {padding: 0 10px;position: relative;}
footer .ft-info__link .btn {font-weight: 500;color: var(--color-500);transition: 0.4s;font-size: 14px;}
footer .ft-info__link .btn.txt-policy {color: var(--primary-blue-100);font-weight: 700;}
footer .ft-info__link > li:not(:last-child)::after {content: "";width: 1px;height: 10px;background: var(--color-200);position: absolute;top: 50%;transform: translateY(-50%);right: 0;}
footer .ft-info__txt { display: flex; margin-top: 5px; }
footer .ft-info__txt li {color: var(--color-600);font-size: 16px;font-weight: 600;}
footer .ft-info__txt li:not(:last-child){position: relative;padding-right: 10px;margin-right: 10px;}
footer .ft-info__txt li:not(:last-child):after{content: ''; position: absolute; top: 50%; transform: translateY(-50%); right: 0; width: 1px; height: 10px; background: var(--color-200);}
footer .ft-info__txt {display: flex;margin-top: 8px;}
footer .ft-info__copy { margin-top: 24px; font-size: 14px; font-weight: 500; color: var(--color-400); line-height: 1.3; }
/*footer .ft-info__copy a { display: inline-block; color: #BABABA; font-size: 12px; text-decoration: underline; }*/
footer .ft-num { margin-top: 8px; }
footer .ft-num li { display: flex; align-items: center; justify-content: space-between; padding: 11px 15px; background: #F7F7F7; border-radius: 5px; width: 190px; }
footer .ft-num li:not(:last-child) { margin-bottom: 10px; }
footer .ft-num li > * { font-size: 14px; }
footer .ft-num__tit { font-weight: 500; }
.top_btn {position: fixed;bottom: 40px;right: 32px;width: 50px;height: 50px; border: 1px solid var(--color-400); border-radius: 10px; z-index: 21;background: no-repeat 50% / 16px 19px;background-image: url(/assets/images/cmn/top-btn.svg); background-color: #fff;}


/* popup */
.pop h2 { position: absolute; font-size: 0; line-height: 0; overflow: hidden; }
.pop_wrap { position: absolute !important; background: #4A8FF5; padding: 10px; border-radius: 10px;z-index: 999; }
.pop_cont { /* width: 450px; */ min-width: 165px; /* min-height: 300px; */}
.pop_cont img { width: 100%; max-width: 100%; }
.pop_ft { padding: 0; background: #4A8FF5 ; color: #fff; text-align: left; position: relative; font-size: 14px; font-weight: 400; padding: 9px 13px; border-top: 0; user-select: none; }
.pop_ft:after { display: block; visibility: hidden; clear: both; content: ""; }
.pop_ft label.sfchkra > span { color: inherit; }
.pop_ft label.sfchkra > input:checked + i:after { background-color: #000000; border-color: #ffffff; border-width: 2px; }
.pop_ft button { padding: 2px; border: 0; color: #fff; }
.pop_ft .pop_cls_btn { background: #4A8FF5 ; position: absolute; top: 7px; right: 12px; font-size: 14px; }
.pop_ft .pop_cls_btn:before { content: "["; }
.pop_ft .pop_cls_btn:after { content: "]"; }
.pop_ft input { display: inline-block; vertical-align: top; margin-top: 3px; margin-right: 5px; }
.pop_ft .sfchkra span { margin-left: 0; }

#container{padding-top: 110px;overflow: hidden;}

@media (max-width: 1280px){
    .inner, .inner-wide { max-width: 100%; padding: 0 40px; }
    #container {padding-top: 80px; padding-bottom: 100px; min-height: auto}
    .pc-ver { display: none !important; }
    .pad-ver { display: block !important; }
    .mobile-ver { display: none !important; }


    /* header */
    header .pc-ver { display: none !important; }
    header .mobile-ver { display: block !important; }
    header .inner{max-width: 100%;}
    header .hd-top {height: 80px;padding-top: 10px;padding-bottom: 10px;}
    header .hd-logo {position: relative;z-index: 13;display: inline-block;margin-right: 0;}
    .hd-logo span {font-size: 20px;}
    header .hd-top__wrap { margin-top: 20px; }
    header .hd-search input { width: 390px; height: 60px; }
    header .hd-search .btn .ico { width: 24px; height: 24px; }
    header .hd-rev { position: static; }
    header .hd-rev .btn { display: flex; justify-content: center; padding: 0; }
    header .hd-rev__img { position: relative; top: auto; left: auto; z-index: 2; }
    header .hd-rev__img { position: relative; top: auto; left: auto; z-index: 2; }
    header .gnb-btn { position: absolute; right: 40px; top: 15px; z-index: 13; }
    header .gnb-btn button {width: 50px;height: 50px;border: 0;border-radius: 5px;position: relative;background: var(--color-gradient);}
    header .gnb-btn button span {display: block;height: 2px;width: 24px;background: #fff;position: absolute;top: 50%;margin-top: -1px;left: 50%;margin-left: -11px;transition: all 0.5s;}
    header .gnb-btn button span:before, header .gnb-btn button span:after {content: "";display: block;height: 100%;width: 100%;background: #fff;position: absolute;top: -8px;transform: rotate(0deg);transition: all 0.5s;}
    header .gnb-btn button span:after { top: 8px; }
    header .gnb-btn.active button span { background: transparent; }
    header .gnb-btn.active button span:before { transform: rotate(135deg); top: 0; }
    header .gnb-btn.active button span:after { transform: rotate(-135deg); top: 0; }
    header .gnb-all {flex-direction: column;position: fixed;top: 0;left: 0;width: 100%;height: calc(var(--vh, 1vh)* 100);background: #fff;z-index: 12;padding-top: 81px;overflow: hidden;opacity: 0;visibility: hidden;transition: 0.4s;display: none;}
    header .gnb-btn.active+.gnb-all { display: flex; opacity: 1; visibility: visible; }
    header .gnb-all__top { padding-bottom: 20px; }
    header .gnb-all__top .user-info {min-height: 65px;padding: 16px 20px;border-radius: 10px;background-repeat: no-repeat;background: var(--primary-blue-10);}
    header .gnb-all__top .user-info .txt1 { font-size: 14px; color: #232323; }
    header .mobile-ver .gnb { overflow: hidden; overflow-y: auto; height: 100%; }
    header .mobile-ver .gnb-wrap { display: flex; flex-direction: column; height: 100%; }
    header .mobile-ver .gnb-tit {display: flex;align-items: center;width: 100%;background: var(--color-gradient);font-size: 14px;font-weight: 500;color: #fff;height: 40px;}
    header .mobile-ver .gnb-cont {background: var(--primary-blue-10);height: 100%;position: relative;overflow-y: auto;}
    header .mobile-ver .gnb-cont>li { position: static; height: auto; display: block; width: 132px; margin: 0; padding: 0; }
    header .mobile-ver .gnb-cont>li .tit {font-size: 16px;font-weight: 700;width: 172px;justify-content: left;padding: 10px 40px;line-height: 1.75;}
    header .mobile-ver .gnb-cont>li.active .tit {background: var(--primary-blue-10);text-decoration: underline;}
    header .mobile-ver .gnb-cont .depth2 { position: absolute; top: 0; left: 172px; width: calc(100% - 172px); display: none; padding: 0 15px; border-left: 0; transform: none; border: 0; box-shadow: none; height: calc(100% + 6px); border-radius: 0; padding: 0 20px; }
    header .mobile-ver .gnb-cont>li.active .depth2 { display: block; }
    header .mobile-ver .gnb-cont .depth2>li { padding: 0; text-align: left; }
    header .mobile-ver .gnb-cont .depth2>li:not(:last-child) { border-bottom: 1px solid rgba(35, 35, 35, 0.05); }
    header .mobile-ver .gnb-cont .depth2>li>a {display: flex;align-items: center;font-size: 16px;font-weight: 500;position: relative;padding: 20px 0;}
    header .mobile-ver .gnb-cont .depth2>li>a::before { content: ""; width: 3px; height: 3px; border-radius: 50%; background: #210000; margin-right: 7px; }
    header .mobile-ver .gnb-cont .depth3 { display: none; background-color: #F7F7F7; border-radius: 5px; padding: 12px 20px; margin-top: 10px; margin-bottom: 22px; }
    header .mobile-ver .gnb-cont .depth3 a { color: #232323; font-size: 14px; padding: 12px 0; }
    header .mobile-ver .gnb-control { display: table; table-layout: fixed; width: 100%; border: 1px solid #E4E4E4; }
    header .mobile-ver .gnb-control li { display: table-cell; vertical-align: middle; }
    header .mobile-ver .gnb-control li:not(:last-child) { border-right: 1px solid #e4e4e4; }
    header .mobile-ver .gnb-control .btn { width: 100%; height: 60px; display: flex; align-items: center; justify-content: center; color: #5D5D5D; font-size: 16px; transition: 0.4s; }
    .hd_lang { right: 105px; top: 20px; }


    /* footer */
    footer {border-radius: 100px 100px 0px 0px;}
    footer .ft-wrap {flex-direction: column-reverse;align-items: center;}
    footer .ft-info {margin-left: 0;margin-top: 20px;text-align: center;}
    footer .ft-info__link { justify-content: center; }
    footer .ft-info__link > li {}
    footer .ft-info__link .btn { font-size: 14px; }
    footer .ft-info__link > li:not(:last-child)::after {}
    footer .ft-num { margin-top: 23px; }
    footer .ft-num li { width: 100%; }
}

@media (max-width: 768px){
    .inner, .inner-wide { max-width: 100%; padding: 0 20px; }
    .pc-ver { display: none !important; }
    .pad-ver { display: none !important; }
    .mobile-ver { display: block !important; }

    #container{padding-bottom: 80px;}

    /* header */
    .hd-logo a{gap: 10px;}
    .hd-logo img {width: 131px;}
    .hd-logo span {font-size: 14px;}
    header .mobile-ver .hd-top__wrap { display: block; }
    header .mobile-ver .hd-search input { width: 100%; height: 44px; font-size: 14px; border-width: 1.5px; padding: 0 22px; }
    header .hd-search .btn { right: 22px; }
    header .hd-search .btn .ico { width: 18px; height: 18px; }
    header .mobile-ver .hd-top__info { margin-top: 20px; text-align: center; }
    header .mobile-ver .hd-top__info .info1 { justify-content: center; }
    header .mobile-ver .hd-top__info .info2 { margin-top: 10px; justify-content: center; }
    header .mobile-ver .gnb-btn {top: 18px;right: 20px;}
    header .mobile-ver .gnb-btn button {width: 45px;height: 45px;}
    header .mobile-ver .gnb-all {}
    header .mobile-ver .quick-menu__list ul { margin: 0 -3.5px; }
    header .mobile-ver .quick-menu__list ul li { padding: 0 3.5px; }
    header .mobile-ver .quick-menu__list ul li .btn { height: 70px; font-size: 12px; border-radius: 10px; }
    header .mobile-ver .quick-menu__list ul li .btn .ico { width: 32px; height: 30px; margin-bottom: 7px; }
    header .mobile-ver .gnb-cont > li .tit {width: 132px;padding: 14px 20px;}
    header .mobile-ver .gnb-cont .depth2 { height: calc(var(--vh, 1vh)* 100 - 300px); height: 100%; left: 132px; width: calc(100% - 132px); }
    header .mobile-ver .gnb-cont .depth3 { padding: 9px 20px; }
    header .mobile-ver .gnb-cont .depth3 a { padding: 9px 0; }
    .hd_lang {right: 80px;top: 18px;}
    .hd_lang .goog-te-gadget .goog-te-combo {width: 35px;height: 35px;font-size: 0;border: 0;background: no-repeat 50% / cover;background-size: 35px 35px;padding: 0 !important;background-image: url(/assets/images/ico/ico-lang.svg);}

    /* footer */
    footer{border-radius: 50px 50px 0 0;padding: 25px 0;}
    footer .ft-logo img{width: 240px;}
    footer .ft-info__link { justify-content: center; flex-wrap: wrap; margin: 0 -6px; }
    footer .ft-info__txt {display: block;margin-top: 15px;}
    footer .ft-info__txt li {font-size: 14px;margin-right: 0;margin-bottom: 10px;}
    footer .ft-info__copy { margin-top: 15px; }
    footer .ft-num { width: 100%; margin-top: 40px; }
    footer .ft-info__txt li:not(:last-child):after {display: none;}
    footer .ft-info__txt li:not(:last-child) {padding-right: 0;margin-right: 0;}
    .top_btn {bottom: 30px;right: 20px;}
}
