@charset 'utf-8';

/* ====================== */
/* UI Reset */
/* ====================== */
@import url('https://cdnjs.cloudflare.com/ajax/libs/pretendard/1.3.9/static/pretendard-subset.min.css');
* {margin:0;padding:0;font:inherit;}
*, *::before, *::after {box-sizing:border-box;}
html {font-size: 62.5%;-moz-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none;-webkit-touch-callout: none;-webkit-user-select: none;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);scroll-behavior: smooth;}
img, video, svg, picture {display:block;height:auto;max-width:100%;}
body {font-size:1.4rem;color:#333D4B;;overflow-x: hidden;font-family:"Pretendard", pretendard, -apple-system, BlinkMacSystemFont, system-ui, Roboto, "Helvetica Neue", "Hiragino Sans", "Apple SD Gothic Neo",  "Noto Sans KR", "Malgun Gothic", Osaka, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", sans-serif;}
a {text-decoration:none;cursor:pointer;color:inherit;}
button {border:none;cursor:pointer;background-color:transparent;color:inherit;}
sup {line-height:1;vertical-align:0px;}
ul, ol, li {list-style:none;}

input {-webkit-appearance: none;-moz-appearance: none;appearance: none;}
input::-ms-clear {display: none;}
input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button {-webkit-appearance: none;-moz-appearance: none;appearance: none;}
input[type='number'] {-moz-appearance: textfield;}

select {-webkit-appearance: none;-moz-appearance: none;appearance: none;} 
select::-ms-expand {display: none;}

.blind {position:absolute; clip:rect(0 0 0 0); width:1px; height:1px; margin:-1px; overflow:hidden;}

/* ====================== */
/* Layout */
/* ====================== */
/* checkbox */
.checkbox {position:relative;display:inline-block;align-items:center;}
.checkbox .checkbox-inner {display:flex;align-items:center;gap:10px;}
.checkbox input {position:absolute;left:0;top:0;opacity:0;width:0;height:0;cursor: pointer;}
.checkbox i {content:'';display:block;width:22px;height:22px;flex:none;border: 1px solid #F0F0F0;background: #fff;position:relative;border-radius:4px;transition:all .3s ease;}
.checkbox input:checked + .checkbox-inner i:before {content:'';display:block;position: absolute;left:50%;top:50%;transform:translate(-50%, -50%);width:100%;height:100%;background:url(/images/v2/checkbox.svg) no-repeat center/14px auto;}
.checkbox input:checked + .checkbox-inner i {background-color:#5CC89C;}

/* 레이아웃 공통 */
#wrap {min-height:100dvh;}
.container {max-width:1240px;width:100%;margin-left:auto;margin-right:auto;}

/* 모바일 서랍 */
.drawer-wrap {position:fixed;left:0;right:0;width:100%;top:115px;bottom:0;background-color:#fff;display:flex;flex-direction:column;visibility:hidden;opacity:0;z-index:-1;}
.drawer-wrap.show {visibility:visible;z-index:10;opacity:1;}
.drawer-wrap.show.type1 {top:105px;}
.drawer-wrap.show.type2 {top:55px;}
.drawer-wrap .drawer-btn {display:flex;gap:10px;padding:20px 20px 0 20px;}
.drawer-wrap .drawer-btn > * {width:100%;}
.drawer-wrap .drawer-btn .drawer-login-btn {padding:10px 12px;display:inline-flex;align-items:center;color:#fff;border-radius:6px;background-color:#2c2c2c;justify-content:center;}
.drawer-wrap .drawer-btn .drawer-login-btn img {margin-right:5px;}
.drawer-wrap .drawer-btn .drawer-cs-btn {padding:10px 12px;display:inline-flex;align-items:center;border-radius:6px;background-color:#fff;border:1px solid #F0F0F0;justify-content:center;}
.drawer-wrap .drawer-btn .drawer-cs-btn img {margin-right:5px;}
.drawer-wrap .drawer-nav {flex:1;padding:0 30px;}
.drawer-wrap .drawer-nav li {margin-top:34px;}
.drawer-wrap .drawer-nav a {font-size:18px;font-weight:600;}
.drawer-wrap .drawer-banner {position:relative;padding:20px;width:100%;}
.drawer-wrap .drawer-banner .swiper {height:180px;border-radius:6px;overflow:hidden;background-color:#ddd;}
.drawer-wrap .drawer-banner .text-box {padding:12px 12px;background:rgba(0, 0, 0, 0.40);z-index:1;position:absolute;left:0;right:0;bottom:0;color:#fff;}
.drawer-wrap .drawer-banner .text-box .name {font-weight:600;margin-bottom:4px;}
.drawer-wrap .drawer-banner .text-box .desc {font-size:12px;}
.drawer-wrap .drawer-banner .swiper-slide img {object-fit:cover;width:100%;height:100%;}
.drawer-wrap .drawer-banner-close {width:16px;height:16px;font-size:0;text-indent:-9999px;overflow:hidden;white-space:nowrap;background:url(/images/v2/top_banner_close.svg) no-repeat center/contain;position:absolute;right:12px;top:12px;z-index:1;}
.drawer-wrap .drawer-banner .swiper-pagination {width:auto;left:unset;right:12px;bottom:10px;}
.drawer-wrap .drawer-banner .swiper-pagination .swiper-pagination-bullet {background-color:#fff;opacity:1;width:6px;height:6px;margin:0 3px;}
.drawer-wrap .drawer-banner .swiper-pagination .swiper-pagination-bullet-active {background-color:#5CC89C;}

/* 상단 배너 */
.top-banner {position:relative;background-color:#19542D;overflow:hidden;display:none;}
.top-banner.show {display:block;}
.top-banner:before {content:'';display:block;left:-76px;top:-70px;position:absolute;width:152px;height:152px;background:linear-gradient(180deg, #42B0FF 0%, #67C5D7 50%, #5BA1D9 100%);opacity:.2;border-radius:300px;}
.top-banner:after {content:'';display:block;right:-76px;top:-20px;position:absolute;width:152px;height:152px;background:linear-gradient(180deg, #42B0FF 0%, #67C5D7 50%, #5BA1D9 100%);opacity:.2;border-radius:300px;}
.top-banner .container {display:flex;position:relative;height:60px;align-items:center;z-index:1;}
.top-banner .top-banner-contents {flex:1;display:flex;align-items:center;}
.top-banner .top-banner-contents .con2 {margin-left: 25px;display:flex;align-items:center;}
.top-banner .top-banner-contents .con1 {display:flex;align-items:center;}
.top-banner .top-banner-contents img {margin-right:8px;}
.top-banner .top-banner-contents p {font-weight:500;color:#fff;}
.top-banner .top-banner-close {width:16px;height:16px;font-size:0;text-indent:-9999px;overflow:hidden;white-space:nowrap;background:url(/images/v2/top_banner_close.svg) no-repeat center/contain;}

/* 헤더 */
.header-wrap {position:sticky;top:0;background-color:#fff;z-index:10;}
.header-wrap .main-header {border-bottom:1px solid #f0f0f0;}
.header-wrap .main-header .container {display:flex;height:85px;align-items:center;}
.header-wrap .main-header .logo {display:inline-block;margin-right:40px;width:145px;height:34px;background:url(/images/v2/logo.svg) no-repeat center/contain;}
.header-wrap .main-header .search-wrap {position:relative;}
.header-wrap .main-header .search-result {position:absolute;top:39px;z-index:11;padding-top:10px;width: 100%;opacity:0;visibility:hidden;}
.header-wrap .main-header .search-result.show {opacity:1;visibility:visible;}
.header-wrap .main-header .search-result ul {border: 2px solid #2C2C2C;border-radius:10px;background-color:#fff;z-index:2;overflow:auto;max-height:400px;}
.header-wrap .main-header .search-result ul li {padding:10px 12px;border-bottom:1px solid #eee;transition:all .3s ease;cursor:pointer;}
.header-wrap .main-header .search-result ul li:hover {background-color:#f9f9f9;}
.header-wrap .main-header .search {display:inline-flex;align-items:center;padding:0 16px;width:376px;height:45px;border:2px solid #2C2C2C;border-radius:100px;overflow:hidden;}
.header-wrap .main-header .search input {border:0;flex:1;outline:none;background-color:#fff;outline:none;}
.header-wrap .main-header .search input::placeholder {color:#7F8894;}
.header-wrap .main-header .search input[type="search"]::-webkit-search-cancel-button,
.header-wrap .main-header .search input[type="search"]::-webkit-search-results-button {display: none;}
.header-wrap .main-header .search .search-btn {width:20px;height:20px;display:inline-block;font-size:0;text-indent:-9999px;overflow:hidden;background:url(/images/v2/search_btn.svg) no-repeat center/contain;}
.header-wrap .main-header .util {margin-left:auto;display:flex;gap:10px;}
.header-wrap .main-header .util.dp-m {display:none;}
.header-wrap .main-header .util .util-login-btn {padding:10px 12px;display:inline-flex;align-items:center;color:#fff;border-radius:6px;background-color:#2c2c2c;}
.header-wrap .main-header .util .util-login-btn img {margin-right:5px;}
.header-wrap .main-header .util .util-cs-btn {padding:10px 12px;display:inline-flex;align-items:center;border-radius:6px;background-color:#fff;border:1px solid #F0F0F0;}
.header-wrap .main-header .util .util-cs-btn img {margin-right:5px;}
.header-wrap .main-header .util .btn-search {width:24px;height:24px;font-size:0;text-indent:-9999px;overflow:hidden;background:url(/images/v2/search_btn.svg) no-repeat center;}
.header-wrap .main-header .util .btn-menu {width:24px;height:24px;font-size:0;text-indent:-9999px;overflow:hidden;background:url(/images/v2/btn_menu.svg) no-repeat center;}
.header-wrap .main-header .util .btn-menu.active {background-image:url(/images/v2/btn_menu_active.svg);}
.header-wrap .gnb-header {border-bottom:1px solid #f0f0f0;}
.header-wrap .gnb-header .container {display:flex;align-items:center;}
.header-wrap .gnb-header .gnb-all {margin-right:40px;width:150px;height:52px;display:inline-flex;align-items:center;font-weight:500;border:1px solid #f0f0f0;border-width:0 1px;justify-content:center;}
.header-wrap .gnb-header .gnb-all img {width:24px;margin-right:8px;}
.header-wrap .gnb-header .gnb-list {display:flex;gap:40px;}
.header-wrap .gnb-header .gnb-list a {font-weight:500;}
.header-wrap .gnb-header .gnb-list .gnb-call {color:#5CC89C;font-weight:600;}

/* 푸터 */
.footer-wrap .footer-top {padding:17px 0;border-top:1px solid #f0f0f0;}
.footer-wrap .footer-top .container {display:flex;justify-content:space-between;align-items:center;}
.footer-wrap .footer-top .sns-list {display:flex;gap:20px;}
.footer-wrap .footer-top .sns-list a {display:block;width:30px;height:30px;font-size:0;text-indent:-9999px;overflow:hidden;white-space:nowrap;}
.footer-wrap .footer-top .sns-list a.sns-facebook {background:url(/images/v2/sns_facebook.svg) no-repeat center/contain;}
.footer-wrap .footer-top .sns-list a.sns-x {background:url(/images/v2/sns_x.svg) no-repeat center/contain;}
.footer-wrap .footer-top .sns-list a.sns-instagram {background:url(/images/v2/sns_instagram.svg) no-repeat center/contain;}
.footer-wrap .footer-top .sns-list a.sns-youtube {background:url(/images/v2/sns_youtube.svg) no-repeat center/contain;}
.footer-wrap .footer-top .quick-links {position:relative;}
.footer-wrap .footer-top .quick-links-btn {display:inline-flex;font-size:18px;font-weight:600;align-items:center;}
.footer-wrap .footer-top .quick-links-btn img {margin-left:8px;}
.footer-wrap .footer-top .quick-links-list {margin-top:10px;width:100%;position:absolute;border-radius:6px;border: 1px solid #F0F0F0;background: #FFF;overflow:hidden;z-index:10;opacity:0;visibility:hidden;transform:translateY(10px);transition:all .3s ease;}
.footer-wrap .footer-top .quick-links-list.active {opacity:1;visibility:visible;transform:translateY(0);}
.footer-wrap .footer-top .quick-links-list li {border-bottom:1px solid #f0f0f0;padding:12px 14px;}
.footer-wrap .footer-top .quick-links-list li:last-child {border-bottom:0;}
.footer-wrap .footer-top .quick-links-list li a {color:#7F8894;}
.footer-wrap .footer-btm {padding:40px 0;border-top:1px solid #f0f0f0;}
.footer-wrap .footer-btm .corp-lr {display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;}
.footer-wrap .footer-btm .footer-links button {color:#7F8894;font-size:14px;margin-right:12px;}
.footer-wrap .footer-btm .footer-links button:last-child {margin-right:0;}
.footer-wrap .footer-btm .corp-text {color:#7F8894;line-height:1.35;font-weight:300;margin-bottom:20px;}
.footer-wrap .footer-btm .corp-info {margin-bottom:40px;}
.footer-wrap .footer-btm .corp-info-item {display:flex;align-items:center;gap:9px;margin-bottom:6px;color:#7F8894;}
.footer-wrap .footer-btm .corp-info-item:last-child {margin-bottom:0;}
.footer-wrap .footer-btm .copyright {color:#7F8894;font-size:13px;font-weight:300;}

/* floating navigation bar */
.fnb {position:fixed;right:20px;bottom:20px;display:flex;flex-direction:column;gap:10px;z-index:10;}
.fnb .fnb-btn {display:block;width:56px;height:56px;border-radius:6px;font-size:0;text-indent:-9999px;overflow:hidden;white-space:nowrap;}
.fnb .fnb-kakao {background:#FACC15 url(/images/v2/fnb_kakao.svg) no-repeat center/70% auto;}
.fnb .fnb-call {background:#2C2C2C url(/images/v2/fnb_call.svg) no-repeat center/56% auto;}
.fnb .fnb-top {border:1px solid #F0F0F0;background:#fff url(/images/v2/fab_top.svg) no-repeat center/45% auto;}

/* 띠 배너 */
.line-banner.container {padding-bottom: 80px;}
.line-banner .swiper-pagination {width:auto;left:unset;right:20px;bottom:15px;}
.line-banner .swiper-pagination .swiper-pagination-bullet {background-color:#fff;opacity:1;}
.line-banner .swiper-pagination .swiper-pagination-bullet-active {background-color:#5CC89C;}
.line-banner img {width:100%;}
.line-banner .swiper .swiper-wrapper .swiper-slide .img_wrap { width: 100%; height: 152px; }

/* 바텀 내비게이션 */
.bottom-navigation {display:none;}

/* 모달 */
.modal {position:fixed;display:none;left:0;top:0;right:0;bottom:0;width:100%;height:100%;background:transparent;transition:background .5s ease;}
.modal.active {display:block;z-index:102;background:rgba(0, 0, 0, .5);}
.modal .modal-box {width:486px;height:auto;background-color:#fff;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);border-radius:6px;}
.modal .modal-close {font-size:22px;font-weight:400;color:#333D4B;}
.modal .modal-head {display:flex;padding:14px 20px;border-bottom:1px solid #f0f0f0;align-items:center;}
.modal .modal-head strong {font-size:18px;font-weight:700;flex:1;}
.modal .modal-contents {height:580px;overflow:auto;padding:16px 20px;line-height:1.5;color:#333D4B;}
.modal .modal-contents strong {font-weight:600;}
.modal .modal-btn {display:flex;gap:10px;justify-content:center;align-items:center;margin-top:20px;}

@media screen and (max-width: 1241px) {
    .container {padding:0 20px;}
    .header-wrap .main-header .search {width:250px;}
}

/* 모바일 사이즈 (가로 767px 이하) */
@media screen and (max-width: 767px) {
    .checkbox i {content:'';display:block;width:20px;height:20px;}

    .top-banner .container {height:50px;}
    .top-banner .top-banner-contents p {font-size:12px;}
    .top-banner .top-banner-contents .con2 {margin-left:12px;}

    .header-wrap .main-header .container {height:54px;}
    .header-wrap .main-header .util.dp-m {display:flex;gap:14px;}
    .header-wrap .main-header .util.dp-pc {display:none;}
    .header-wrap .main-header .search-wrap {position:absolute;top:70px;width:auto;left:20px;right:20px;visibility:hidden;opacity:0;transform:translateY(-10px);transition:all .3s ease;}
    .header-wrap .main-header .search-wrap.show {z-index:11;opacity:1;transform:translateY(0);visibility:visible;}
    .header-wrap .main-header .search {background-color: #fff;width:100%;}
    .header-wrap .main-header .search input {font-size:16px;}
    .header-wrap .main-header .logo {width:96px;height:26px;margin-right:0;}
    .header-wrap .gnb-header {display:none;}

    .footer-wrap {padding-bottom:68px;}
    .footer-wrap .footer-top .sns-list {gap:12px;}
    .footer-wrap .footer-top .sns-list a {width:24px;height:24px;}
    .footer-wrap .footer-top .quick-links-btn img {width:12px;}
    .footer-wrap .footer-top .quick-links-btn {font-size:15px;}
    .footer-wrap .footer-btm {padding:20px 0;}
    .footer-wrap .footer-btm .footer-logo img {width:88px;}
    .footer-wrap .footer-btm .footer-links button {font-size:10px;margin-right:5px;}
    .footer-wrap .footer-btm .corp-text {font-size:12px;}
    .footer-wrap .footer-btm .corp-info {margin-bottom:20px;}
    .footer-wrap .footer-btm .corp-info-item {font-size:12px;}
    .footer-wrap .footer-btm .corp-info-item img {width:16px;}
    .footer-wrap .footer-btm .copyright {font-size:12px;}

    .fnb {gap:7px;bottom:78px;}
    .fnb .fnb-btn {width:46px;height:46px;}
    .fnb .fnb-top {box-shadow: 0 2px 8px rgba(0,0,0,0.18);}
    .fnb .fnb-kakao, .fnb .fnb-call {
      display: none;
    }

    .line-banner .swiper .swiper-wrapper .swiper-slide .img_wrap { height: 48px; }
    .line-banner .swiper-pagination { display:none; }

    .bottom-navigation {height:58px;display:flex;position:fixed;bottom:0;left:0;right:0;z-index:10;border-top: 1px solid #F0F0F0;box-shadow: -1px -1px 4px 0px rgba(0, 0, 0, 0.10);background-color:#fff;}
    .bottom-navigation-btn {width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:7px;color:#7F8894;font-size:12px;}
    .bottom-navigation-btn i {font-size:20px;color:#333D4B;}

    .modal .modal-box {max-width:90%;}
    .modal .modal-head {padding:10px 15px;}
    .modal .modal-contents {height:445px;font-size:13px;padding:15px;}
}

@media screen and (min-width: 2560px) {
  .container { max-width: 1440px; }
  .line-banner .swiper .swiper-wrapper .swiper-slide .img_wrap { height: 172px; }
}