@charset "utf-8";
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css');


/*초기화*/
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

li {
    list-style: none
}

a {
    text-decoration: none
}

img {
    border: none
}

h1, h2, h3, h4, h5, h6, header, body, footer, section, div, p, ul, li, a, input, button, address {
    font-family: 'Pretendard', sans-serif;
    font-size: 16px;
    line-height: 22px;
    font-weight: 400;
    color: #2b2b2b;
    letter-spacing: -2%;
    box-sizing: border-box;
    word-break: keep-all !important;
}

h1, h2, h3, address {
    cursor: default;
}

.container {
    margin: 0 auto;
    display: flex;
}

/* title */
.title-h9 {font-size: 40px;line-height: 52px;font-weight:700;letter-spacing: -0.15rem;}
.title-h8 {font-size: 36px;line-height: 48px;font-weight:700;letter-spacing: -0.1rem;}
.title-h7 {font-size: 30px;line-height: 44px;font-weight:700;letter-spacing: -0.1rem;}
.title-h6 {font-size: 24px;line-height: 36px;font-weight:600;letter-spacing: -0.05rem;}
.title-h5 {font-size: 20px;line-height: 32px;font-weight:600;letter-spacing: -0.03rem;}
.title-h4 {font-size: 18px;line-height: 24px;font-weight:600;letter-spacing: -0.02rem;}
.title-h3 {font-size: 16px;line-height: 22px;font-weight:600;letter-spacing: -0.01rem;}
.title-h2 {font-size: 14px;line-height: 20px;font-weight:600;letter-spacing: -0.005rem;}

/* text */
.text-p9{font-size:40px;line-height:54px;letter-spacing: -0.15rem;}
.text-p8{font-size:36px;line-height:50px;letter-spacing: -0.1rem;}
.text-p7{font-size:30px;line-height:44px;letter-spacing: -0.1rem;}
.text-p6{font-size:24px;line-height:36px;letter-spacing: -0.05rem;}
.text-p5{font-size:20px;line-height:32px;letter-spacing: -0.03rem;}
.text-p4{font-size:18px;line-height:24px;letter-spacing: -0.02rem;}
.text-p3{font-size:16px;line-height:22px;letter-spacing: -0.01rem;}
.text-p2{font-size:14px;line-height:20px;letter-spacing: -0.005rem;}
.text-p1{font-size:12px;line-height:15px;}

.text-b {font-weight: bold;}

/* color */
.primary-red{color:#E60013;}
.primary-brown{color:#655C4F;}
.white {color: #ffffff;}
.black {color: #000000;}
.yellow {color: #FFFF52;}

:root {
    --white: #ffffff;
    --black: #000000;
    --red010: #FFF1F0;
    --red020: #FBE3E1;
    --red030: #FFA9A1;
    --red040: #F06254;
    --red050: #E60013;
    --red060: #b70016;
    --primary-red: #D21300;
    --primary-brown: #655C4F;
    --brown060: #3E3223;
    --brown070: #2B1E0E;
    --blue010: #F9FAFC;
    --blue020: #F2F5F9;
    --blue030: #DBE9FF;
    --blue040: #C3D9FF;
    --blue050: #94BAFF;
    --blue060: #1968F8;
    --blue070: #012F83;
    --blue080: #0e222a;
    --blue090: #090e10;
    --grey010: #F9F9F9;
    --grey020: #F4F4F4;
    --grey030: #EBEBEB;
    --grey040: #BCBCBC;
    --grey050: #828282;
    --grey060: #484848;
    --grey070: #2B2B2B;
}

/*공통*/
.pc {display: block;}
.tab {display: none;}
.mo {display: none;}
main {padding-top: 100px; display: flex; flex-direction: column; }
section {padding: 24px 0; margin: 0;}
section .container {padding: 80px 0; max-width: 1200px;}
#topBanner a {max-width: 1200px;}
#topBanner img {width: 100%;}
#menuTitle .container {display: flex; flex-direction: column; gap: 24px;}
#menuTitle .line {border: 1px solid var(--primary-red);}
#menuTitle .promotion-view-title{display: flex; flex-direction: row; justify-content: space-between;}
#menuTitle .promotion-view-title-btn{padding:4px 16px;border-radius:4px;background:var(--black);}
*:hover {transition: all 0.8s ease;}

/*헤더*/
header {width: 100%; margin: 0; padding: 0; position: fixed; background-color: var(--white); z-index:99; border: 1px solild var(--grey030); height: 100px; align-content: center;}
header .container {max-width: 1200px; width: 1200px;}
header nav {display: flex; flex-direction: row; justify-content: space-between; align-items: center; width: 100%;}
header .nav-logo {width: 100%; margin-top: 8px;}
header .nav-left h1 {max-width: 390px; min-width: 220px; margin-right: 24px;}
header .nav-right {display: flex; flex-direction: row; gap: 28px; justify-content: flex-start;}
header .nav-right > a {color: var(--grey070); padding:8px 0;}
header .nav-right > a:hover {color: var(--primary-red);}

/*비쥬얼 (수정-0812)*/
#visual {background-color: var(--black); }
#visual .pc {display: block;}
#visual .tab {display: none;}
#visual .mo {display: none;}
#visual {width: 100%; overflow: hidden; display: block; height: 500px; position: relative;  padding: 0;}

/* Swiper 기본 크기 설정 - 화면 너비에 따라 유동적 (추가-0812)*/
.swiper {
    width: 100%;
    height: 100%; /* 높이는 화면의 50% */
    max-height: 500px;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* 슬라이드 이미지 설정 (추가-0812)*/
.swiper-slide {
    display: flex;
    justify-content: center;
    align-items: center;
}

.swiper-slide img {
    width: 1920px;
    height: 500px;
    object-fit: contain; /* 비율 유지하며 꽉 채움 */
    display: block;
}

/*단독특가*/
#hotDeal {background-color: var(--brown060); margin: 0; padding: 0;}
#hotDeal .container {flex-direction: column; justify-content: center; align-items: center; gap: 40px; padding: 80px 16px;}
#hotDeal .text-wrap {display: flex; flex-direction: column; gap: 8px; align-items: center; text-align: center; }
#hotDeal .text-wrap > img {width: 479px; max-width: 100%;}
#hotDeal .button-cta {width: 450px;  max-width: 100%; color:var(--white); border: 1px solid var(--primary-red); background-color: var(--primary-red); border-radius:8px;  padding: 12px 0; cursor: pointer; margin-top: 16px; text-align: center;}
#hotDeal .button-cta:hover {background-color: transparent; color: var(--primary-red); font-weight: 700; border: 1px solid var(--primary-red);}
#hotDeal .slider-container {position: relative; width: 100%; max-width: 1200px; height: 441px; perspective: 1500px;  display: flex; justify-content: center; align-items: center; margin: 0 auto;}
#hotDeal .slider-container .card {position: absolute; top: 0; left: 50%; transform: translateX(-50%);  width: 100%; max-width: 359px; transition: all 0.8s ease; border-radius: 16px; overflow: hidden; box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2); cursor: pointer; background-color: var(--white); width: 359px; height: auto; padding: 32px 16px; display: flex; flex-direction: column; align-items: center;justify-content: space-between;}
#hotDeal .slider-container .card > .car-name {display: flex; flex-direction: row; align-items: center;}
#hotDeal .slider-container .card > .car-name > img {width: 70px;}
#hotDeal .slider-container .card > .car-name > span {font-size: 28px;}
#hotDeal .slider-container .card > img.car {width: 80%; display: block; margin-bottom: 24px;}
#hotDeal .slider-container .card .car-price {margin-top: 16px;}
#hotDeal .conditions {color: var(--primary-brown); margin-top: 40px;}

/*스위치비교*/
#switch .container {flex-direction: column; gap: 40px; align-items: center;  justify-content: center;}
#switch .title-wrap {display: flex; flex-direction: column; align-items: center; justify-content: center;}
#switch .title-wrap > .text-02 {display: flex; flex-direction: row; justify-content: center; align-items: center; flex-wrap: wrap; letter-spacing: -0.1rem;}
#switch .title-wrap > .text-02 > span {color: var(--primary-red);}
#switch .title-wrap > .text-02 > img {margin-right: 8px; max-width: 244px; width: 100%;}
#switch .price-wrap {display: flex; flex-direction: row; gap: 16px; align-items: center; justify-content: center;background-color: var(--blue020); padding: 40px 24px; width: 100%; border-radius: 16px;}
#switch .price-wrap img.vs {max-width: 350px; width: 100%; min-width: 250px;}
#switch .price-wrap .origin-price {display: flex; flex-direction: column; gap: 24px; align-items: center;}
#switch .price-wrap .origin-price > p {color: var(--grey050);}
#switch .receipt-01 {background: url(/assets/img/switch-image-01.png) no-repeat top center; background-size:cover; width: 240px; height: 290px; padding: 32px 16px; display: flex; flex-direction: column; justify-content: center;}
#switch .receipt-01 > img {margin: 8px 0;}
#switch .receipt-01 > p {width: 100%; display: flex; flex: 100%; flex-direction: row; justify-content: space-between; align-items: center; width: 100%; color: var(--grey050);}
#switch .receipt-01 > .text-01 {justify-content: center;}
#switch .receipt-01 > .text-02 {justify-content: center;}
#switch .price-wrap .switch-price {display: flex; flex-direction: column; gap: 24px; align-items: center;}
#switch .receipt-02 {background: url(/assets/img/switch-image-02.png) no-repeat top center; background-size:cover; width: 292px; height: 352px; padding: 32px 24px; display: flex; flex-direction: column; justify-content: center;}
#switch .receipt-02 > img {margin: 8px 0;}
#switch .receipt-02 > p {width: 100%; display: flex; flex: 100%; flex-direction: row; justify-content: space-between; align-items: center; width: 100%; color: var(--grey070);}
#switch .receipt-02 > .text-01 {justify-content: center;}
#switch .receipt-02 > .text-02 {justify-content: center;}
#switch .button-cta {width: 400px; border: 1px solid var(--brown060); background-color: var(--brown060); border-radius:8px;  padding: 12px 0; cursor: pointer; margin-top: 16px; text-align: center; color: var(--white);}
#switch .button-cta:hover {background-color: transparent; color: var(--primary-red); font-weight: 700;}

/*배너01*/
#banner01 {padding: 20px 0;}
#banner01 .container {width: 1200px;}
#banner01 a.text-wrap {display: flex; flex-direction: row; justify-content: space-between; width: 100%; gap: 24px; background-color: var(--red020); padding: 32px 80px; border-radius: 16px;}
#banner01 a.text-wrap > .image {width: 18%; min-width: 187px; position: relative; right: 0; top: 0; }
#banner01 a.text-wrap > .image > img {width: 100%; position: absolute; right: 0; bottom: -18px;}

/*인기차종*/
#topPicks {background: url(/assets/img/toppicks-bg.png) repeat center center; background-size: cover;}
#topPicks .container {flex-direction: column; gap: 40px; align-items: center; }
#topPicks .title-wrap {display: flex; flex-direction: row; gap: 16px; flex-wrap: wrap; justify-content: center;}
#topPicks .title-wrap > .text-01 {font-size: 34px; color: var(--primary-red); padding: 4px 24px; border: 1px solid var(--primary-brown); border-radius: 100px;}
#topPicks .title-wrap > .text-01 > span {color: var(--primary-brown);}
#topPicks .title-wrap > .text-02 {color: var(--grey030);}
#topPicks .content-wrap {display: flex; flex-direction: row; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 40px; width: 100%;}
#topPicks .content-wrap > .car-main-wrap {display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 1 1 45%; background: url(/assets/img/toppicks-light.png) no-repeat center top; background-size: contain;}
#topPicks .content-wrap > .car-main-wrap > .car-name {color: var(--grey030); display: flex; align-items: center; gap: 8px;}
#topPicks .content-wrap > .car-main-wrap > .car-image > img {width: 100%; max-width: 500px;}
#topPicks .content-wrap > .car-main-wrap > .car-price {border: 1px solid var(--grey050); border-radius: 8px; display: inline-block; padding: 4px 32px; background-color: rgba(0,0,0,0.7);}
#topPicks .content-wrap > .car-main-wrap > .car-price > span {color: var(--red030);}
#topPicks .content-wrap > .car-list-wrap {flex: 1 1 50%; display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 16px 0;}
#topPicks .content-wrap > .car-list-wrap > ul {display: flex; flex-direction: column; gap: 8px; align-items: center; width: 100%;}
#topPicks .content-wrap > .car-list-wrap > ul > li {border: 1px solid var(--grey050); border-radius: 8px; width: 100%; min-width: 540px; background-color: rgba(0,0,0,0.5); }
#topPicks .content-wrap > .car-list-wrap > ul > li > a {display: flex; flex-direction: row; justify-content: space-between; padding: 4px 24px; align-items: center; width: 100%;}
#topPicks .content-wrap > .car-list-wrap > ul > li:hover {scale: 1.05; background-color: rgba(0,0,0,0.8); transition: all 0.8s ease; border: 1px solid var(--primary-red);}
#topPicks .content-wrap > .car-list-wrap > ul > li.selected {border: 1px solid var(--primary-red); background-color: rgba(0,0,0,0.8);}
#topPicks .content-wrap > .car-list-wrap > ul > li > a > .car-name {display: flex; flex-direction: row; align-items: center; gap: 8px;}
#topPicks .content-wrap > .car-list-wrap > ul > li > a > .car-name > img {width: 80px; }
#topPicks .content-wrap > .car-list-wrap > ul > li > a > .car-name > p {display: flex; flex-direction: row; gap: 8px;}
#topPicks .content-wrap > .car-list-wrap > ul > li > a > .car-price > span {color: var(--red030);}
#topPicks .content-wrap > .car-list-wrap > p {font-weight: normal; color: var(--grey050); display: flex; gap: 12px;}
#topPicks .button-cta {background-color: var(--primary-red); width: 400px;  max-width: 100%; color:var(--white); border: 1px solid var(--primary-red); background-color: var(--primary-red); border-radius:8px;  padding: 12px 0; cursor: pointer; margin-top: 16px; text-align: center;}
#topPicks .button-cta:hover {border: 1px solid var(--white); background-color: transparent;}

/*즉시출고*/
#instantDelivery {background-color: var(--blue020);}
#instantDelivery .container {flex-direction: column; gap: 40px; align-items: center; }
#instantDelivery .title-wrap {display: flex; flex-direction: row; gap: 16px; flex-wrap: wrap; justify-content: center;}
#instantDelivery .title-wrap > .text-01 {font-size: 34px; color: var(--primary-red); padding: 4px 24px; border: 1px solid var(--primary-brown); border-radius: 100px;}
#instantDelivery .title-wrap > .text-01 > span {color: var(--primary-brown);}
#instantDelivery .card-wrap {width: 100%;}
#instantDelivery .card-wrap > ul {display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 16px;}
#instantDelivery .card-wrap > ul > li {display: flex; flex-direction: column; align-items: center; flex: 1 1 18%; background-color: var(--white); border-radius: 16px; border: 1px solid var(--grey030);}
#instantDelivery .card-wrap > ul > li > .car-image {display: flex; justify-content: center; border-radius: 16px; background-color: var(--blue010);margin: 16px;}
#instantDelivery .card-wrap > ul > li > .car-image > img {width: 100%; margin: 16px;}
#instantDelivery .card-wrap > ul > li > .car-name {width: 100%; font-size: 20px; font-weight: 500; margin-top: 0px; padding: 0 16px; text-align: center;} /*수정-0812*/
#instantDelivery .card-wrap > ul > li > .car-price {width: 100%; padding: 0 16px; text-align: center;}
#instantDelivery .card-wrap > ul > li > .car-price > span {font-weight: 700; color: var(--primary-red);}
#instantDelivery .button-cta {width: 100%; border: 1px solid var(--brown060); background-color: var(--brown060); border-bottom-left-radius:16px; border-bottom-right-radius:16px;  padding: 12px 0; cursor: pointer; margin-top: 16px; text-align: center;}
#instantDelivery .button-cta:hover {background-color: transparent; color: var(--primary-red); font-weight: 700;}
#instantDelivery .conditions {color: var(--grey040); display: flex; flex-direction: row; align-items: center; gap: 12px;}
#instantDelivery .conditions > span {font-size: 10px;}

/*배너02*/
#banner02 {padding: 56px 0;}
#banner02 .container {width: 1200px; }
#banner02 a.text-wrap {display: flex; flex-direction: row; justify-content: space-between; width: 100%; height: 140px; gap: 24px; background-color: var(--red040); padding: 0px 40px; border-radius: 16px;}
#banner02 a.text-wrap > .text-01 {display: flex; flex-direction: row; align-items: center; gap: 16px; width: 90%;}
#banner02 a.text-wrap > .text-01 > p {line-height: 30px; letter-spacing: 0px;}
#banner02 a.text-wrap > .text-01 > img {width: 80px; height: 73px;}
#banner02 a.text-wrap > .image {width: 18%; min-width: 187px; position: relative; right: 0; top: 0; justify-content: center; }
#banner02 a.text-wrap > .image > img {width: 100%; position: absolute; right: 0; bottom: 0px;}

/*푸터*/
footer {width: 100%; background-color: var(--grey070);margin: 0; padding: 0 0 150px;}
footer .container {width: 1200px; padding: 40px 0; display: flex; flex-direction: row;justify-content: space-between; flex-wrap: wrap;}
footer .footer-left-wrap {display: flex; flex-direction: column; gap: 24px; justify-content: flex-start; width: 100%;}
footer .caution-wrap {display: flex; flex-direction: column; gap: 8px;}
footer .caution-wrap > p {color: var(--grey040);}
footer .caution-wrap > ul {display: flex; flex-direction: column; gap: 8px;}
footer .caution-wrap > ul > li {color: var(--grey040); list-style:disc; margin-left: 20px;}
footer .footer-logo {width: 180px;}
footer .footer-nav {display: flex; flex-direction: row; gap: 24px; justify-content: flex-start; align-items: center; flex-wrap: wrap; border-top: 1px solid var(--grey060); border-bottom: 1px solid var(--grey060); padding: 8px 0;}
footer .footer-nav > a {color: var(--grey040);}
footer .footer-nav > a:hover {color: var(--grey020);}
footer .carbay-info-wrap {display: flex; flex-direction: column; gap: 4px;}
footer .carbay-info-wrap > p {color: var(--grey040); }
footer .customer-wrap {display: flex; flex-direction: row; gap: 8px; align-items: center;}
footer .customer-title {color: var(--grey040); }
footer .customer-tel {color: var(--grey040);}
footer .customer-wrap > a {color: var(--white); background-color: var(--primary-red); padding: 2px 16px; border-radius: 4px; border: 1px solid var(--grey070);}
footer .customer-wrap > a:hover {border: 1px solid var(--grey070); background-color: var(--white); color: var(--grey070);}

/* 날개배너 */
.quick-form {
    width: 240px;
    height:295px;
    position: fixed;
    right: 16px;
    top: 45%; /*(수정-0812)*/
    transform: translateY(-50%);
    background-color: var(--white);
    border-radius: 8px;
    border: 1px solid var(--primary-brown);
    box-shadow: 0px 3px 10px rgba(0,0,0,0.1);
    padding: 0;
    margin: 0;
    z-index: 9999;
}

.quick-form > .title {
    background-color:var(--primary-brown);
    border-radius:8px 8px 0 0;
    padding: 4px 0;
    text-align: center;
} /*수정-0812*/

.quick-form .container {
    padding: 16px 16px 18px 16px;
    flex-direction: column;
    align-items: stretch;
    justify-content: space-evenly;
    gap: 8px;
}
.quick-form input[type="text"] {
    border: 0px solid var(--grey030);
    border-radius: 6px;
    background-color: var(--red010);
    height: 40px;
    text-align: center;
} /*수정-0812*/

.quick-form input[type="text"]::placeholder {
    text-align: center;
    font-size: 14px; /*(추가-0812)*/
}

.quick-form .agreement-wrap {
    display:flex;
    flex-direction: row;
    align-items: center;
    gap: 4px;
    width: 100%;
    padding: 8px 0;
    color: var(--grey050);
}

.quick-form .agreement-wrap a {
    color: var(--primary-red);
} /*(수정-0812)*/

/* (수정-0812)
.quick-form .agreement-wrap a:hover {
    color: var(--primary-red);
}
*/

.quick-form .btn-quickform {
    width: 100%;
    background-color: var(--brown070);
    color: var(--white);
    font-weight: 600;
    border-radius: 6px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
}/*(수정-0812)*/
.quick-form .btn-quickform:hover {
    background-color: var(--white);
    color: var(--primary-brown);
    border: 1px solid var(--primary-brown);
}/*(수정-0812)*/

.quick-call {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap:5px;
}

.quick-call p {
    color: var(--grey070);
}

.quick-call img {
    width: 30px;
    height:auto;
}

.m-btn-quickform {
    display: none;
}

/*전차종 견적확인 배너 (추가-0812)*/
.quick-form .check-models {width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; top: 55px; background-color: var(--primary-red); border: 1px solid rgba(255,255,255,0.4); border-radius: 8px; height: 50px;}
.quick-form .check-models:hover {background-color: var(--brown070); border: 1px solid rgba(255,255,255,0.4); color: var(--white); font-weight: bold;}
.quick-form .check-models > img {display: block; width: 85px; position: absolute; bottom: 0px; right: 5px;}
.quick-form .check-models > p {width: 100%; padding-left: 24px; text-align: left;}
.quick-form .check-models > p > span {font-weight: 700;}
.m-check-models {display: none;}

/*전차종 견적확인 팝업 (추가-0812)*/
#popupCheckModels {display: none; position:fixed; top: 0; left: 0; width: 100vw; height: 100vh; background-color: rgba(0,0,0,0.8); z-index: 999;}
#popupCheckModels .popup-wrap {position:fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; max-width: 900px; height: auto;}
#popupCheckModels .popup-wrap .container {padding: 0; display: flex; flex-direction: column; background-color: var(--white); border-radius: 16px; overflow: hidden;}
#popupCheckModels .popup-wrap .btn-close {position: absolute; top: -40px; right: 0; padding:4px; border-radius: 4px; background-color: var(--black); background-color: var(--black); height: 32px;}
#popupCheckModels .popup-wrap .btn-close > img {width: 24px;}
#popupCheckModels .tab-wrap {display: flex; flex-direction: row; justify-content: center; align-items: center; width: 100%;}
#popupCheckModels .tab-wrap > a {background-color: var(--red020); flex: 1 1 50%; color: var(--white); padding: 12px; text-align: center;}
#popupCheckModels .tab-wrap > a:hover {background-color: var(--red060); transition: all 0.8s;}
#popupCheckModels .tab-wrap > a.selected {background-color: var(--primary-red);}
#popupCheckModels .brand-list-wrap { width: 100%; background-color: var(--blue010); padding: 16px 16px 0px 16px;}
#popupCheckModels .brand-list-wrap > ul {display: flex; flex-direction: row; gap: 16px; width: auto; padding: 0px; overflow-x: auto; padding-bottom: 16px;}
#popupCheckModels .brand-list-wrap > ul.brand-abroad {justify-content: flex-start;}
#popupCheckModels .brand-list-wrap > ul.brand-domestic {justify-content: center;}
#popupCheckModels  ul::-webkit-scrollbar {width: 8px; height:7px;}
#popupCheckModels  ul::-webkit-scrollbar-thumb {background-color: var(--grey030); border-radius: 100px;}
#popupCheckModels  ul::-webkit-scrollbar-thumb:hover {background-color: var(--grey040);}
#popupCheckModels  ul::-webkit-scrollbar-track {border:1px solid var(--grey030); border-radius: 100px;}
#popupCheckModels .brand-list-wrap > ul > li > a {display: flex; flex-direction: column; align-items: center; gap: 8px; opacity: 0.5;}
#popupCheckModels .brand-list-wrap > ul > li > a > img {width: 60px; border: 1px solid var(--grey030); border-radius: 100px; background-color: var(--white);}
#popupCheckModels .brand-list-wrap > ul > li > a:hover {opacity: 1; transition: all 0.8s;}
#popupCheckModels .brand-list-wrap > ul > li > a > .brand-logo {padding: 4px 8px; border-radius: 100px; border: 1px solid var(--grey030); display: flex; align-items: center; justify-content: center; width: 68px;}
#popupCheckModels .brand-list-wrap > ul > li > a > .brand-text {font-size: 14px; color: var(--grey070);}
#popupCheckModels .brand-list-wrap > ul > li > a > .brand-logo > img {height: 40px;}
#popupCheckModels .brand-list-wrap > ul > li.selected > a {opacity: 1;}
#popupCheckModels .brand-list-wrap > ul > li.selected > a > img {width: 60px;}
#popupCheckModels .brand-list-wrap > ul > li.selected > a > .brand-logo {background-color: var(--white);}
#popupCheckModels .brand-list-wrap > ul > li.selected > a > .brand-text {font-weight: bold;}
#popupCheckModels.openForm .models-list-wrap {height: 250px; margin-bottom: 140px;}
/* #popupCheckModels.openForm .models-list-wrap > ul {height: 233px !important;} */
#popupCheckModels.openForm .model-form {display: block !important;}
@media screen and (max-width:700px) { #popupCheckModels.openForm .models-list-wrap {height: calc(100vh - 522px) !important;}}
#popupCheckModels .models-list-wrap {background-color: var(--white); height: 380px; overflow-y: auto; margin: 20px 16px;}
#popupCheckModels .models-list-wrap::-webkit-scrollbar {width: 8px; height:7px;}
#popupCheckModels .models-list-wrap::-webkit-scrollbar-thumb {background-color: var(--grey030); border-radius: 100px;}
#popupCheckModels .models-list-wrap::-webkit-scrollbar-thumb:hover {background-color: var(--grey040);}
#popupCheckModels .models-list-wrap::-webkit-scrollbar-track {border:1px solid var(--grey030); border-radius: 100px;}
#popupCheckModels .models-list-wrap > ul {display: flex; flex-direction: row; flex-wrap: wrap;  gap: 16px; margin-top: 16px; align-items: flex-start; justify-content: flex-start;}
#popupCheckModels .models-list-wrap > ul > li {opacity: 0.4; flex: 0 1 23%; margin: 8px 0;}
#popupCheckModels .models-list-wrap > ul > li > a {display: flex; flex-direction: column; align-items: center; }
#popupCheckModels .models-list-wrap > ul > li > a > img {max-width: 180px; width: 100%;}
#popupCheckModels .models-list-wrap > ul > li.selected {opacity: 1;}
#popupCheckModels .models-list-wrap > ul > li:hover {opacity: 1; transition: all 0.8s;}
/*전차종 견적확인 폼 (추가-0812)*/
#popupCheckModels .model-form {position:absolute; bottom: -1px; width: 100%; background-color: var(--primary-red); padding: 16px; border-radius: 0 0 14px 14px;}
#popupCheckModels .model-form > form {display: flex; flex-direction: column; gap: 16px;}
#popupCheckModels .model-form > form > .text-wrap {display: flex; flex-direction: row; justify-content: space-between; width: 100%; align-items: center;}
#popupCheckModels .model-form > form > .text-wrap > div {display: flex; flex-direction: row; align-items: center; gap: 40px; justify-content: space-between; width: calc(100% - 54px);}
#popupCheckModels .model-form > form > .text-wrap > a {position: absolute; right: 16px;}
#popupCheckModels .model-form > form > .text-wrap > div > p > span {color: var(--white); background-color: var(--black); padding: 4px 8px; border-radius: 4px;}
#popupCheckModels .model-form > form > .text-wrap > div > .agree-box {display: flex; flex-direction: row; align-items: center; gap: 8px;}
#popupCheckModels .model-form > form > .text-wrap > div > .agree-box > a {color: var(--red030);}
#popupCheckModels .checkbox-wrap {position: relative;font-size:14px;color:#fff;}
#popupCheckModels .checkbox-wrap input[type="checkbox"] {display:none;}
#popupCheckModels .checkbox-wrap input[type="checkbox"] + label span {display:inline-block; width: 20px; height: 22px;margin-right:4px;vertical-align: middle;cursor: pointer;background: url(/assets/img/landing-checkbox2-off@3x.png) 0 0 no-repeat;background-size:18px 18px;}
#popupCheckModels .checkbox-wrap input[type="checkbox"]:checked + label span {display: inline-block;background: url(/assets/img/landing-checkbox2-on@3x.png) 0 0 no-repeat;background-size:18px 18px;}
#popupCheckModels .form-wrap {display: flex; flex-direction: row;}
#popupCheckModels .form-wrap input{margin-right:18px;flex: 1 1 30%;height:45px;border-radius:4px;border:none;text-align:center;font-size:16px;vertical-align:middle}
#popupCheckModels .form-wrap a.btn-estimate{display: flex; flex-direction: row; gap: 8px; align-items: center; height: 45px; align-items: center; justify-content: center; flex: 1 1 30%; background-color: var(--black); border-radius: 4px;}
#popupCheckModels .form-wrap a.btn-estimate > img{display:inline;vertical-align:middle; width: 20px;}


/*하단 고정폼*/
.landing-floating-estimate {position:fixed;bottom:0;width:100%;min-width:1200px;background:var(--primary-red); margin:0;padding: 0;}
.landing-floating-estimate .container {width: 1200px; margin: 0 auto; box-sizing: border-box; padding: 16px 0 20px;}
.landing-floating-estimate h2{position:relative; top: 0px; left: 0px; padding:20px 0 18px;color:#fff;font-size:24px;font-weight:500;text-align:left}
.landing-floating-estimate h2 > span{color:#fff}
.landing-floating-estimate input{margin-right:18px;flex: 1 1 30%;height:50px;border-radius:4px;border:none;text-align:center;font-size:16px;vertical-align:middle}
.landing-floating-estimate a.btn-floating-estimate{display: flex; flex-direction: row; gap: 8px; align-items: center; height: 50px; align-items: center; justify-content: center; flex: 1 1 30%; background-color: var(--black); border-radius: 4px;}
.landing-floating-estimate a.btn-floating-estimate > img{display:inline;vertical-align:middle; width: 22px;}
.landing-floating-estimate form {display: flex; flex-direction: column; justify-content: space-between; gap: 12px; width: 100%;}
.landing-floating-estimate .agree-box{display: flex; flex-direction:row; width:100%;color:#fff;font-size:14px; justify-content: flex-end;}
.landing-floating-estimate .agree-box > a{display:inline-block;margin-left:10px;width:80px;height:24px;background:var(--black);border-radius:14px;font-size:12px;color:#fff;text-align:center;line-height:24px}
.landing-floating-estimate .landing-form-wrap {display: flex; flex-direction: row; }
.landing-checkbox-wrap2 {position: relative;font-size:14px;color:#fff;}
.landing-checkbox-wrap2 input[type="checkbox"] {display:none;}
.landing-checkbox-wrap2 input[type="checkbox"] + label span {display:inline-block; width: 20px; height: 22px;margin-right:8px;vertical-align: middle;cursor: pointer;background: url(/assets/img/landing-checkbox2-off@3x.png) 0 0 no-repeat;background-size:20px 20px;}
.landing-checkbox-wrap2 input[type="checkbox"]:checked + label span {display: inline-block;background: url(/assets/img/landing-checkbox2-on@3x.png) 0 0 no-repeat;background-size:20px 20px;}
.landing-footer {height: 400px !important;}

/* 상담신청 팝업 (수정-0812)*/
.estimate-popup-wrap {display:none;position: fixed;top: -20px;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,0.65);z-index:99999; padding: 0px;}
.estimate-popup-wrap .container {width:90%; max-width: 540px;height:auto;position: relative;top: 50%;transform: translateY(-50%);flex-direction: column; border-radius: 16px;background:var(--white);box-shadow: 0px 0px 10px rgba(0,0,0,0.2); padding: 0;}
.estimate-popup-title {display: flex;flex-direction: column;align-items:center;gap:8px;margin-bottom:10px; padding: 50px 40px 16px 40px; background: var(--primary-red);border-radius:16px 16px 0 0;}
.estimate-popup-title > a {position: absolute; top: 16px; right: 16px;  background-color: var(--black); border-radius: 4px; padding: 4px; height: 32px;}
.estimate-popup-title > a > .estimate-popup-btn-close {position: relative ;top: 0px;right: 0px; width:24px;}
.estimate-popup-title h2 {color: var(--red030); font-size: 24px;}
.estimate-popup-title .logo-img{display:block;width:85%;max-width:375px;height:auto;}
.estimate-popup-wrap hr {display: none;}
.estimate-popup-wrap form {padding: 16px 40px 40px;}
.estimate-popup-input-wrap{margin:16px 0 ;width:100%; display: flex;flex-direction: row;align-items:center; justify-content: space-between;}
.estimate-popup-input-wrap label{width:12%;text-align:center;color:var(--grey050)}
.estimate-popup-input{width:85%;height:45px;background:var(--red010);border:0px solid var(--grey030);border-radius:8px;text-align:center}
.estimate-popup-input::placeholder{color:var(--grey040)}
a.estimate-popup-btn{width:100%;height:58px;background:var(--brown060);border:1px solid var(--brown060);border-radius:8px;color:var(--white);display: flex;align-items:center;justify-content: center;text-align:center; margin-bottom: 0px;}
a.estimate-popup-btn:hover{background:var(--white);color:var(--primary-red)}
.estimate-popup-privacy {display: flex;flex-direction: row;align-items: center;justify-content: space-between;flex-wrap: wrap;   gap: 8px;padding: 12px 0 18px}
.estimate-popup-privacy input { width: 22px;height: 22px;}
.estimate-popup-privacy > span {display: flex;flex-direction: row;align-items: center;gap: 8px;color:var(--grey050)}
.estimate-popup-privacy > span > .btn-detail{color:var(--primary-red)}

/* 프로모션 페이지*/
#promotionList{}
.container {
	margin: 0 auto;
	display: flex;
	justify-items: center;
}
.title-h8 {font-size: 36px; line-height: 48px; font-weight: 700; letter-spacing: -0.1rem;}
#promotionList .container {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}
section .container {
	padding: 24px 0;
	max-width: 1200px;
}
#promotionList ul {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	/*justify-content: space-between;*/
	gap: 5%;
	list-style: none;
    width: 100%;
}
#promotionList ul li {
	position: relative;
	width: 30%;
	margin-bottom: 100px;
}
#promotionList .promotion-list-thumb {
	margin-bottom: 24px;
}
#promotionList .promotion-list-thumb img {
	width: 100%;
	height: auto;
	border-radius: 16px;
	border: 1px solid var(--grey030);
}
#promotionList .promotion-list-title {
	margin-bottom: 10px;
	color: var(--black);
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}
#promotionList .promotion-list-date {
	color: var(--grey050);
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

#topBanner a {max-width: 1200px;}
#topBanner img {width: 100%;}
#menuTitle .container {display: flex; flex-direction: column; gap: 24px;}
#menuTitle .line {border: 1px solid #3e3223}
#menuTitle .promotion-view-title{display: flex; flex-direction: row; justify-content: space-between;}
#menuTitle .promotion-view-title-btn{padding:7px 16px;border-radius:4px;background:var(--black);}
.page_prev img,.page_next img{
	width: 32px; height:32px;
}
.page_prev ,.page_next{
	display:flex; 
    align-items: center;
	margin: 0 10px;

}
.pagination {display: flex;}
.page_btn{display:flex; margin: 0 auto; padding-bottom:80px; align-items: center}
.btn_inner{display:flex;}
.btn_inner a {font-size: 16px; padding:6px 13px; border:1px solid #d21300; border-radius:3px; text-align:center; margin:0 5px;}
.btn_inner .active a {background:#d21300; color:#fff;}
*:hover {transition: all 0.8s ease;}

.promotion-view{width:100% ;padding:0px; display:flex; justify-content:center; }
.promotion-view img{width:100%; }
.promotionView {padding:0}
@media screen and (max-width: 1200px) {
    .container {
        width: calc(100% - 24px) !important;
    }
}
@media (max-width:700px){
	#promotionList ul li {
        position: relative;
        width: 46%;
        margin-bottom: 50px;
    }
	#promotionList .container {
	padding: 16px 0;
	max-width: 1200px;
	}
	#promotionList ul {
        gap: 8%;
    }
	section .promotion_container {
        padding: 16px 0 !important;
        max-width: 1200px;
    }
}


/*모바일-1200*/
@media screen and (max-width:1200px) {

    /*공통*/
    .container {width:calc(100% - 24px) !important;}

    /*헤더*/
    header .nav-right > a {font-size:18px;}

    /*비쥬얼 (수정-0812)*/
    .swiper-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover; /* 비율 유지하며 꽉 채움 */
        display: block;
    }
    #visual .pc {display: none !important;}
    #visual .tab {display: block !important;}
    #visual .mo {display: none !important;}
    #visual img {width: 100% !important;}
    #visual {height: auto;}

    /*스위치비교*/
    #switch .price-wrap {flex-direction: column; gap: 0;}
    #switch .price-wrap .origin-price {gap: 8px;}
    #switch .price-wrap .switch-price {gap: 8px;}

    /*인기차종*/
    #instantDelivery .card-wrap > ul {justify-content: flex-start;}
    #instantDelivery .card-wrap > ul > li {flex: 1 1 40%;}
    #instantDelivery .card-wrap > ul > li:last-child {flex: 0 0 49%;}

    /*푸터 (수정-0812)*/
    footer {padding-bottom: 100px !important;}

    /* 날개배너 */
    .quick-form{display:none;}

    /*전차종 견적확인 배너 (추가-0812)*/
    .m-check-models {display: block; position: fixed; bottom: 120px; right: 0px; z-index: 999;}

    /*전차종 견적확인 팝업 (추가-0812)*/
    #popupCheckModels .popup-wrap .btn-close {right: 12px;}
    #popupCheckModels .model-form {width: calc(100% - 24px);}

    /*하단고정폼*/
    .landing-floating-estimate {min-width: 100%;}
}


/*모바일-700*/
@media screen and (max-width:700px) {

    /*공통*/
    .pc {display: none !important;}
    .mo {display: block !important;}
    main {margin-top: -20px;}
    section .container {padding: 40px 0; max-width: 1200px;}
	#promotionList{padding:0 !important}
	#promotionView{padding:0 !important}
	.promotionview{padding:0 !important}
    #menuTitle .title {font-size: 30px;}
    #menuTitle .container {gap: 16px;}
    #menuTitle .text01 {font-size: 16px;}

    /*헤더*/
    header nav {display: flex; justify-content: center; width: 100%; flex-direction: column; align-items: flex-start; }
    header .nav-logo {width: 280px !important;}
    header .nav-right {width: 100%; overflow-x: auto; justify-content: flex-start !important;}
    header .nav-right > a {font-size: 18px !important; padding: 0 !important;}

    /*비쥬얼 (수정-0812)*/    
    #visual .pc {display: none !important; }
    #visual .tab {display: none !important; }
    #visual .mo {display: block !important;}
    #visual .swiper {max-height: initial;}

    /*단톡특가*/
    #hotDeal .container {padding: 60px 0;}
    #hotDeal .slider-container {position: relative; max-width: 90%; aspect-ratio: 359/441; }
    #hotDeal .slider-container .card {width: 80%; height: auto; top: 0;}
    #hotDeal .slider-container .car-price {font-size:30px;}

    /*스위치비교*/
    #switch .button-cta {width: 100%;}

    /*배너01*/
    #banner01 {padding: 24px 0;}
    #banner01 a.text-wrap {flex-direction: column; justify-content: center; align-items: center; padding: 24px;}
    #banner01 a.text-wrap p {text-align: center;}
    #banner01 a.text-wrap > .image {position: initial;}
    #banner01 a.text-wrap > .image > img {position: initial; width: 150px;}
	

    /*인기차종*/
    #topPicks .content-wrap {gap: 20px; flex-direction: column;}
    #topPicks .content-wrap > .car-list-wrap {width: 100%;}
    #topPicks .content-wrap > .car-main-wrap > .car-price {font-size: 26px;}
    #topPicks .content-wrap > .car-list-wrap > ul > li {min-width:100%;}
    #topPicks .content-wrap > .car-list-wrap > ul > li > a > .car-price {font-size: 18px; line-height: 22px;}
    #topPicks .content-wrap > .car-list-wrap > ul > li > a > .car-name > img {width: 100%; max-width: 80px;}
    #topPicks .content-wrap > .car-list-wrap > ul > li > a > .car-name > p > span {font-size: 16px; line-height: 14px; font-weight: normal;}
    #topPicks .button-cta {width: 100%;}

    /*즉시출고*/
    #instantDelivery .card-wrap > ul > li {flex: 100%;}
    #instantDelivery .card-wrap > ul > li:last-child {flex: 100%;}

    /*배너02*/
    #banner02 {padding: 40px 0;}
	#banner02 .tab {display: block;}
    #banner02 a.text-wrap {flex-direction: column; justify-content: center; align-items: center; padding: 24px 24px 0 24px; height: auto;}
    #banner02 a.text-wrap p {text-align: center;}
    #banner02 a.text-wrap > .image {position: initial; display: flex; flex-direction: row;}
    #banner02 a.text-wrap > .image > .image-01 {position: initial; width: 150px; margin-bottom: 0px;}
    #banner02 a.text-wrap > .image > .image-02 {position: initial; width: 80px; height: 73px; }

    /*푸터*/
    footer {padding-bottom : 40px !important;} /*수정-0812*/
    footer .container {flex-direction: column !important;}
    .footer-nav {flex-direction: column !important; gap: 8px !important;align-items: flex-start !important;}

    /* 상담신청 팝업 (수정-0812) */
    .estimate-popup-wrap .container {width: 100%; max-width: 100%; height: auto; padding: 0; border-radius: 16px; margin-top: 16px;}
    .estimate-popup-title > a {position: absolute; top: 12px; right: 12px;}
    .estimate-popup-input-wrap{margin:12px 0 ;}
    .estimate-popup-input{height:50px;}
    .estimate-popup-privacy{padding: 12px 0 22px}
    /*.estimate-popup-btn-close {position: absolute;top: 16px;right: 16px; width: 24px; }*/

    /*날개배너*/
    .m-btn-quickform {
        position: fixed;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 50px;
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 8px;
        background-color: var(--primary-red);
        color: var(--red010);
        font-weight: 700;
    }
    .m-btn-quickform img {
        width: 24px;
    }

    /*전차종 견적확인 배너 (추가-0812)*/
    .m-check-models {bottom: 50px;}

    /*전차종 견적확인 팝업 (추가-0812)*/
    #popupCheckModels .popup-wrap .btn-close > img {width: 24px;}
    #popupCheckModels .popup-wrap .btn-close {top: -35px;}
    #popupCheckModels .popup-wrap {height: calc(100% - 40px); bottom: 0; transform: translateX(-50%); top: initial;}
    #popupCheckModels .popup-wrap .container {height: calc(100% - 16px);}
    #popupCheckModels .models-list-wrap {height: calc(100vh - 260px);}
    #popupCheckModels .models-list-wrap > ul > li {flex: 0 1 45%;}
    #popupCheckModels .models-list-wrap > ul > li > a > img {width: 100%; max-width: 180px;}
    #popupCheckModels .model-form > form > .text-wrap > div {flex-direction: column; gap: 8px; width:calc(100% - 54px);align-items: flex-start;}
    #popupCheckModels .model-form > form > .text-wrap > a {top: 16px;}
    #popupCheckModels .model-form {bottom: 16px;}
    #popupCheckModels .model-form > form > .text-wrap {width: 100%;}	
    #popupCheckModels .form-wrap {flex-direction: column; gap: 8px;}
    #popupCheckModels .form-wrap input {flex: initial; margin-right: 0;}
    #popupCheckModels .form-wrap a.btn-estimate {flex: initial;}
    #popupCheckModels .checkbox-wrap input[type="checkbox"] + label span {display:inline-block; background: url(/assets/img/landing-checkbox2-off@3x.png) 0 3px no-repeat;background-size:16px 16px;}
    #popupCheckModels .checkbox-wrap input[type="checkbox"]:checked + label span {display: inline-block;background: url(/lt/img/landing-checkbox2-on@3x.png) 0 3px no-repeat;background-size:16px 16px;}
    #popupCheckModels .form-wrap {display: flex; flex-direction: column;}
    #popupCheckModels .model-form > form > .text-wrap > div > .agree-box {flex-wrap: wrap;}

    /*하단 고정폼*/
    .landing-floating-estimate {display: none;}
}


/*모바일-460*/
@media screen and (max-width:460px) {

    /*단독특가*/
    #hotDeal .container {padding: 40px 0; gap: 20px;}
    #hotDeal .slider-container {padding: 0 16px !important; /* ✅ 좌우 여백 강제 적용 */ box-sizing: border-box;     /* ✅ 패딩 포함해서 전체 너비로 계산되게 */ }
    #hotDeal .slider-container .card {width: 80%; min-width: 207px; aspect-ratio: initial; padding: 16px;}
    #hotDeal .slider-container .card .badge {width: 80%;}
    #hotDeal .slider-container .card > .car-price {font-size: 24px; margin-top: 8px !important; line-height: 30px;}
    #hotDeal .slider-container .card > .car-name {flex-direction: column; flex-wrap: wrap; justify-content: center;}
    #hotDeal .slider-container .card > .car-name > img {width: 50%;}
    #hotDeal .slider-container .card > .car-name > span {font-size: 20px; line-height: 20px;;}
    #hotDeal .slider-container .card {padding: 24px 16px;}
    #hotDeal .conditions {margin-top: 8px;}

    /*footer*/
    footer .caution-wrap > ul > li {font-size: 14px; line-height: 16px;}
    footer .footer-nav > a {font-size: 14px; line-height: 16px;}
    footer .carbay-info-wrap > p {font-size: 13px; line-height: 15px;}

    /*인기차종*/
    #topPicks .content-wrap > .car-list-wrap > ul > li > a > .car-name > img {max-width: 60px;}
    #topPicks .content-wrap > .car-list-wrap > ul > li > a > .car-name {flex-direction: column; gap: 8px; align-items: flex-start;}
    #topPicks .content-wrap > .car-list-wrap > ul > li > a > .car-name > p {flex-wrap: wrap; justify-content: flex-start;}
    #topPicks .content-wrap > .car-list-wrap > ul > li > a {padding: 8px; gap: 8px;}
    #topPicks .content-wrap > .car-main-wrap > .car-price {font-size: 24px; padding: 0px 32px;}

	/*전차종 견적확인 팝업*/
	#popupCheckModels .brand-list-wrap > ul.brand-domestic {justify-content: flex-start;}
}

/*모바일-360*/
@media screen and (max-width:360px) {

    /*공통*/
    .text-p9 {font-size: 36px; text-align: center;}

    /*단독특가*/
    #hotDeal .slider-container {height: auto;}

    /*즉시출고*/
    #instantDelivery .title-wrap > .text-01 {font-size: 28px; padding: 0 16px;}
    #instantDelivery .title-wrap > .text-02 {font-size: 36px;}
    #instantDelivery .title-wrap {gap: 8px;}

    /* 상담신청 팝업 (수정-0812) */
    .estimate-popup-input-wrap{flex-direction: column;align-items:flex-start;}
    .estimate-popup-input-wrap label{width:100%;text-align:left;margin:0 0 10px 0}
    .estimate-popup-input{height:50px;width:100%}
    .estimate-popup-btn-close {width: 20px;height: 20px;}

    .estimate-popup-title > h2 {text-align: center;}
    /* 날개배너 */
    .m-btn-quickform img {
        width: 18px;
    }
}

/*이용자 동의사항 팝업*/
.layer_popup_wrap_new {display: none;  margin-left: 0px; margin-top: 0px; width: 100%; height:100%; position: fixed;top: 0;left: 0; background-color: rgba(0, 0, 0, 0.85); z-index: 99999999; }
.layer_popup_wrap_new .layer_popup_renew02 {  position: absolute; width: 450px; height: 536px; left: 50%; top: 50%; margin-left: -225px; margin-top: -268px; background-color: #FFF; border-radius: 16px;}
.layer_popup_wrap_new .popup_body_renew02 { width: 450px; height: 467px; padding: 30px; box-sizing: border-box; overflow-y: scroll; overflow-x:hidden;}
.layer_popup_wrap_new .popup_body_renew02 ul { width: 390px; height: 416px;}
.layer_popup_wrap_new .popup_body_renew02 li { list-style: none; margin-bottom: 0; padding:0;}
.layer_popup_wrap_new .popup_title_renew02 { width: 100%; height: 60px; background-color: var(--brown060); padding: 0 30px; box-sizing: border-box; margin-top: -18px; border-top-left-radius: 16px; border-top-right-radius: 16px;}
.layer_popup_wrap_new .popup_title_renew02 p.tc { color: #FFF;font-size: 18px; line-height: 58px; text-align: center; }
.layer_popup_wrap_new .popup_close_renew02 { position: absolute; top: -4px; right: 20px; cursor: pointer; }
.layer_popup_wrap_new .popup_close_renew02 > img {width: 24px;}


ul.terms_list li.terms_item:first-child { background-color: #ffffff; }
ul.terms_list li.terms_item.open:first-child .btn02 { background-color: #ffffff; border:none; }
ul.terms_list li.terms_item.open:first-child .input_chk_new label { background-color: #ffffff; }
ul.terms_list li.terms_item .desc {position: relative; left: 50%;	transform: translateX(-50%);	width: 100%;	height: 410px;	background-color: #f8f8f8;	padding: 0;	list-style: none;box-sizing:border-box;	overflow: hidden; 		}
ul.terms_list li.terms_item .desc::-webkit-scrollbar { 	overflow-x: hidden;	width: 7px;}
ul.terms_list li.terms_item .desc::-webkit-scrollbar-track { background-color: transparent;	}
ul.terms_list li.terms_item .desc::-webkit-scrollbar-thumb { border-radius: 3px; background-color: var(--brown060);	}
ul.terms_list li.terms_item .desc::-webkit-scrollbar-button { width: 0; height: 0;}
ul.terms_list li.terms_item .btn02 {position: relative;width: 100%; background-color: #fff;cursor: pointer; padding:18px 0; box-sizing: border-box;}

/*item이 open클래스/close클래스일 때 변경되는 css 작성  */
ul.terms_list li.terms_item.close .btn02 .arrow_down { position: absolute; right: 0px; top:15px;}
ul.terms_list li.terms_item.open .btn02 .arrow_down { position: absolute; right: 0px; top:15px; transform: rotate(180deg);}
ul.terms_list li.terms_item.open .desc {height: 207px;padding: 10px 19px;overflow-y: scroll; border: 1px solid #ebebeb; border-top: none;}
ul.terms_list li.terms_item.close .desc { height: 0; overflow: hidden; }
ul.terms_list li.terms_item.open .btn02 {	background-color: #f8f8f8; border: 1px solid #ebebeb; border-bottom: none;}
ul.terms_list li.terms_item.close .btn02 { background-color: #fff; }
ul.terms_list li.terms_item .red { color:rgb(221, 42, 42); }
ul.terms_list li.terms_item .bold { font-weight:normal; }
ul.terms_list li.terms_item .blue {  color: var(--primary-red); }
ul.terms_list li.terms_item .normal {  font-weight: normal; }
ul.terms_list li.terms_item .desc p { word-break: break-all; font-size: 13px;}
ul.terms_list li.terms_item .desc span { display: block; font-size: 13px; padding-bottom: 5px;}
ul.terms_list li.terms_item .desc .tr { text-align: right; }
ul.terms_list li.terms_item .desc .terms_table { border:none; margin: 10px 0px;}
ul.terms_list li.terms_item .desc .terms_table tr th { border:1px solid #ffffff; background-color: #d6e5fa; padding:10px; text-align: center; font-size: 13px;}
ul.terms_list li.terms_item .desc .terms_table tr td { border:1px solid #ffffff; background-color: #ffffff; padding:10px; font-size: 13px; }

ul.terms_list li.terms_item.terms_chk_all .btn02 .chk_all_txt { font-weight: bold; color:var(--primary-red); }
ul.terms_list li.terms_item .input_chk_new input { position: absolute; overflow: hidden; clip: rect(0 0 0 0); margin: -1px; width: 1px; height: 1px; }
ul.terms_list li.terms_item .input_chk_new label {position: relative;width: 100%;padding: 10px 0px 10px 43px;font-size: 14px;font-weight: 700;line-height: 21px;cursor: pointer;color: #333;box-sizing: border-box;background: url(/assets/img/chk_icon_off.png) no-repeat 3px 6px;background-size: 30px;}
ul.terms_list li.terms_item .input_chk_new input:checked+label { background: transparent; background-size: 0px;}
ul.terms_list li.terms_item .input_chk_new input:checked+label:before {content: '';position: absolute;top: 57%;left: 1px;display: block;width: 33px;height: 32px;margin-top: -15px;background: url(/assets/img/chk_icon_on.png) no-repeat 3px 1px;background-size: 29px;}

@media (max-width:700px) {
    .layer_popup_wrap_new .layer_popup_renew02 {
        width: 100%;
        height: auto;
        transform: translate(-50%, -50%);
        margin: 0 auto;
        padding: 0 16px;
        background: transparent;
    }

    .layer_popup_wrap_new .popup_title_renew02 {
        margin: 0;
        top: 12px;
    }

    .layer_popup_wrap_new .popup_body_renew02 {
        width: 100%;
        background-color: #fff;
        padding: 30px;
        height: auto;
        border-bottom-left-radius: 16px;
        border-bottom-right-radius: 16px;
    }

    .layer_popup_wrap_new .popup_close_renew02 {
        top: 13px;
    }

    .layer_popup_wrap_new .popup_body_renew02 ul {
        width: 100%;
    }

    ul.terms_list li.terms_item .input_chk_new label {
        background: url(/assets/img/chk_icon_off.png) no-repeat 3px 4px;
        background-size: 30px;
    }
}


/* 닫기버튼 */
.agreement_new_close_btn {cursor: pointer; background-color: var(--primary-red); margin: 50px auto; text-align: center; transition: ease-in 0.4s; color: #fff; border: 1px solid var(--primary-red); border-radius: 5px; display: block; box-sizing: border-box; width: 100%; height: 50px; padding: 11px; font-weight: bold; font-size: 20px;}
.agreement_new_close_btn:hover { background-color: #fff; color: var(--primary-red); border:1px solid var(--primary-red);}

/* 추석 팝업  css*/
.working-hours-pop{display:none;position:fixed;top:0px;left:0;width:100%;height:100%;background-color:rgba(25,25,25,0.85);z-index:999999999;}
.working-hours-pop-inner{position:absolute;width:100%; max-width:620px;left:50%;top:52%;transform:translate(-50%, -50%);background-color:rgba(0,0,0,0);text-align:center;}
.working-hours-pop-inner img{width:100%;height:auto}
.working-hours-btn{
    position: absolute;
    bottom: 8%;
    width: 52%;
    right: 25%; text-align: center; color: #fff; display: flex; justify-content: space-between;
}
.working-hours-btn a {
    color: #fff;
}

.promotion_btn{
	    line-height: 32px; font-weight:600;
		    font-size: 20px;
}