/* 상세검색 */
.detail-search {margin-bottom:50px; padding:30px 0; background:#f8f8f8; color:#454545;}
.detail-search .wrap {display:flex; flex-wrap:wrap; gap:12px;}
.detail-search .car-cate {width:calc(29% - 6px); display:grid; gap:12px;}
.detail-search .car-cate + .car-brand {width:calc(71% - 6px);}
.detail-search .car-cate .link {display:flex; align-items:center; justify-content:center; width:100%; height:100%; background:#fff; border:1px solid #ddd; border-radius:var(--radius-10); color:#878787; font-size:var(--font-size-18); font-weight:600;}
.detail-search .car-cate .link.active {background:var(--color-primary); border-color:var(--color-primary); color:#fff;}
.detail-search .car-brand {width:100%; padding:20px 30px 30px; text-align:center;}
.detail-search .car-brand .swiper-slide {width:auto;}
.detail-search .car-brand .swiper-scrollbar {margin-top:17px; height:3px; border-radius:0; background:#f2f3f7;}
.detail-search .car-brand .swiper-scrollbar-drag {background:#ddd; border-radius:0;}
.detail-search .car-brand .link {position:relative; display:block; width:100%; padding:12px 5px;}
.detail-search .car-brand .link .img {display:flex; justify-content:center; align-items:center; width:100%; max-width:80px; height:43px; margin:0 auto; color:#b9b9b9; font-size:var(--font-size-22); font-weight:800; line-height:1.3em;}
.detail-search .car-brand .link .tit {display:block; padding:4px 0; margin-top:4px; line-height:1.3em;}
.detail-search .car-brand .link.active:after {content:''; position:absolute; top:0; right:0; bottom:0; left:0; border:1px solid var(--color-primary); border-radius:var(--radius-10); opacity:.5;}
.detail-search .car-brand .link.active .img,
.detail-search .car-brand .link.active .tit {color:var(--color-primary);}
.detail-search .car-model {width:calc(68% - 6px);}
.detail-search .car-search {display:flex; align-items:center; width:calc(32% - 6px); padding:0 20px; font-size:14px;}
.detail-search .car-search label {width:76px; color:#878787;}
.detail-search .car-search input {flex:1 1 auto; min-width:0; width:1%; height:60px; padding:0; border:0; outline:none; background:none; font-size:14px;}
.detail-search .car-search input::-webkit-input-placeholder {color:#afafaf;}
.detail-search .car-search input:-moz-placeholder {color:#afafaf;}
.detail-search .car-search input::-moz-placeholder {color:#afafaf;}
.detail-search .car-search input:-ms-input-placeholder {color:#afafaf;}
.detail-search .car-search input:placeholder-shown {color:#afafaf;}
.detail-search .car-search button {width:20px; height:20px; margin-left:6px; background:none; border:0;}
.detail-search .car-range {width:calc(68% - 6px); height:60px; padding:17px 45px 0 30px;}
.detail-search .car-check {width:calc(32% - 6px);}
.detail-search .box {position:relative; background:#fff; border-radius:var(--radius-10);}
.detail-search .items {display:flex; padding:15px 0;}
.detail-search .item {position:relative; flex:1; text-align:center; font-size:var(--font-size-17); line-height:30px;}
.detail-search .item:before {content:''; position:absolute; top:50%; left:0; width:1px; height:14px; margin-top:-7px; background:#ddd;}
.detail-search .item:first-child::before {display:none;}
.detail-search .item input {display:none;}
.detail-search .item label {display:block; cursor:pointer;}
.detail-search .item input:checked + label {color:var(--color-primary); font-weight:600;}

/* 상품정렬 */
.goods-sort {position:relative; z-index:10; margin-bottom:37px;}
.goods-sort .sort {position:relative; display:flex; justify-content:flex-end;}
.goods-sort .sort .sort-name {display:none;}
.goods-sort .sort ul {display:flex; justify-content:flex-end;}
.goods-sort .sort ul li {position:relative; padding:0 23px;}
.goods-sort .sort ul li:after {content:""; position:absolute; top:50%; right:0; width:1px; height:12px; background:#ddd; margin-top:-6px;}
.goods-sort .sort ul li:last-child {padding-right:0;}
.goods-sort .sort ul li:last-child::after {display:none;}
.goods-sort .sort ul li a {display:block; color:#454545; line-height:1.5em;}
.goods-sort .sort ul li.active a {color:var(--color-primary); font-weight:600;}

@media (max-width:700px) {
	.goods-sort {margin-bottom:10px;}
	.goods-sort .sort .sort-name {display:flex; align-items:center; border:1px solid #ddd; border-radius:5px; padding:4px 10px; font-weight:500; font-size:13px; line-height:1.5em;}
	.goods-sort .sort .sort-name:after {content:""; display:inline-block; vertical-align:top; margin-top:-.2em; margin-left:10px; width:12px; height:8px; background:url('../images/bbs/select.svg') 50% 50%/contain no-repeat; opacity:.6;}
	.goods-sort .sort ul {display:none; position:absolute; top:32px; right:0; padding:8px 10px; width:auto; background:#fff; border-radius:5px; border:1px solid #ddd;}
	.goods-sort .sort ul li {padding:0;}
	.goods-sort .sort ul li:after {display:none;}
	.goods-sort .sort ul li a {display:block; padding:4px; white-space:nowrap;}
	.goods-sort .sort.active ul {display:block;}
}

/* 상품 리스트 */
.goods-list .items {display:flex; flex-wrap:wrap; margin:0 -10px;}
.goods-list .item {width:25%; padding:0 10px; margin-bottom:40px;}
.goods-list .none {width:100%; padding:70px 0; margin:0; text-align:center; color:#767676;}

.car-box {position:relative; height:100%; border-radius:var(--radius-16); border:1px solid #ddd; background:#fff;}
.car-box .thumb {padding: 50px 0; background-color: #ededed; position:relative; border-radius:var(--radius-16) var(--radius-16) 0 0; overflow:hidden;}
.car-box .thumb:before {content:''; display:block; padding-bottom:45%;}
.car-box .thumb img {position:absolute; top:0; left:0; width:100%; height:100%; transition:.4s; transform-origin:center center; object-fit:contain;}
.car-box .badge-area {position:absolute; top:20px; left:10px; display:flex; gap:5px;} 
.car-box .badge {display:inline-block; min-width:58px; border-radius:5px; color:#fff; font-size:13px; font-weight:600; line-height:28px; text-align:center;}
.car-box .badge.new {background:var(--color-primary);}
.car-box .badge.best {background:#d7563e;}
.car-box .badge.to-be {padding:0 10px; background:#ec1c24;}
.car-box .badge.to-be i {width:12px; height:17px; margin-right:5px; vertical-align:middle; display:inline-block; background-image:url('../images/bbs/tobe-ico.png'); background-repeat:no-repeat; background-position:50% 50%;}
.car-box .cnt {padding:19px; border-radius:0 0 var(--radius-16) var(--radius-16);}
.car-box .tit {color:#242424; font-size:var(--font-size-18); font-weight:600; line-height:1.3em; letter-spacing:-.03em;}
.car-box .tit span {font-size:13px; margin-right:7px; font-weight:600; line-height:24px; padding:0 10px; display:inline-block; background-color:var(--color-primary); color:#fff; border-radius:5px;}
.car-box .option {display:grid; /* gap:5px 0; */ margin:14px 0 17px; color:#878787; font-size:var(--font-size-14); line-height:1.4em;}
.car-box .option .opt {display:flex; align-items:center; flex-wrap:wrap;}
.car-box .option .bar {display:inline-block; margin:0 7px; width:1px; height:10px; background:#ddd;}
.car-box .option strong {color:#454545; font-weight:500; margin-left:12px;}
.car-box .price-wrap {display:flex; flex-wrap:wrap; gap:5px 11px;}
.car-box .price {color:#242424; font-size:var(--font-size-14); line-height:1.3em; letter-spacing:-.03em;}
.car-box .price span {display:inline-block; margin-right:3px; width:20px; height:20px; background:var(--color-primary); border-radius:5px; color:#fff; font-size:var(--font-size-14); line-height:20px; text-align:center;} /**color:#878787;**/
.car-box .month {color:#242424; font-size:var(--font-size-14); line-height:1.3em; letter-spacing:-.03em;}
.car-box .month span {display:inline-block; margin-right:3px; width:20px; height:20px; background:var(--color-second); border-radius:5px; color:#fff; line-height:20px; text-align:center;}
.car-box .month strong {font-weight:400;}
.car-box:hover .thumb img {-webkit-transform:scale(1.05); transform:scale(1.05);}
.car-box .btnbox {padding:16px 0; border-radius:0 0 var(--radius-16) var(--radius-16); background-color:var(--color-primary); color:#fff; text-align:center; font-weight:600;}

.price-wrap2 .val {font-size: var(--font-size-14); display:flex; line-height:1.7em;}
.price-wrap2 .val strong {font-size: var(--font-size-18); font-weight: 600;}
.price-wrap2 .val span {display: block; font-weight: 600; color: #898989; flex:1;}




.pop_modal .car-box .cnt .tit {display:flex; align-items:center;}

.pop-view-wrap {padding:45px 30px 30px;}
.pop-view-wrap .top {margin-bottom:var(--space-30); text-align:center;}
.pop-view-wrap .top .title {font-size:var(--font-size-26); margin-bottom:8px; line-height:1.4em; color:#242424; letter-spacing:-.03em; font-weight:700;}

.pop-view-wrap ul {max-width:800px; margin:auto;}
.pop-view-wrap ul li {margin-bottom:10px; height:52px; border:1px solid #ddd; display:flex; align-items:center;}
.pop-view-wrap ul li.h-auto {height:auto; align-items:normal;}
.pop-view-wrap ul li.h-auto p {padding-top:10px;}
.pop-view-wrap ul li:last-child {margin-bottom:0;}
.pop-view-wrap ul li p {padding-left:17px; width:170px; font-weight:600; color:#242424;}
.pop-view-wrap ul li .input {border:0; flex:1;}
.pop-view-wrap ul li .items span {padding-right:30px;}
.pop-view-wrap ul li .items span:last-child {padding-right:0;}
.pop-view-wrap .form-agree {margin:var(--space-20) 0 var(--space-50);}

.required {padding-left:5px; color:#ff6600;}

.modal {padding:0; max-width:1100px; max-height:550px; box-shadow:none; border-radius:20px;}
.layer_popup {display:none; width:100%; position:relative; z-index:100 !important;}
.modal a.close-modal {width:30px; height:30px; top:-35px; right:-35px; transform:translateX(-50%); background-size:contain; background-image:url(../images/bbs/modal_cls.png);}

.layer_popup .inner {padding:30px 30px 50px;}
.layer_popup .group {border-bottom:1px solid #ddd; display:flex;}
.layer_popup .group:first-child {border-top:1px solid #ddd;}
.layer_popup .col-l {width:120px; padding-left:15px; display:flex; align-items:center; font-weight:500; color:#121212; font-size:var(--font-size-15); border-right:1px solid #ddd; background-color:#f9f9f9;}
.layer_popup .col-l span {padding-left:5px;}
.layer_popup .col-r {padding:10px; flex:1;}
.layer_popup .col-r .input {border-radius:4px;}

.car-top {padding:var(--space-70) 0; margin-bottom:var(--space-100); background-color:#f7f7f7; background-size:cover; background-repeat:no-repeat;}
.car-top .wrap {display:flex; align-items:center}
.car-top .col {width:50%;}
.car-top .col-r {padding-left:var(--space-100); position:relative;}
.car-top .col-r .name {font-size:var(--font-size-30); font-weight:700; letter-spacing:-.03em; color:#242424; line-height:1.3em;}
.car-top .col-r .name .img {width:55px; margin-right:20px;}
.car-top .col-r .name .img img {margin-top:-5px; width:100%; max-width:100%; vertical-align:middle;}
.car-top .col-r .name p {flex:1;}

.car-top .option {display:grid; gap:5px 0; padding:var(--space-20) 0 var(--space-30); margin-bottom:var(--space-30); border-bottom:1px solid #ddd; color:#878787; font-size:var(--font-size-18); line-height:1.4em;}
.car-top .option .opt {display:flex; align-items:center; flex-wrap:wrap;}
.car-top .option .bar {display:inline-block; margin:0 7px; width:2px; height:14px; background:#ddd;}
.car-top .option strong {color:#454545; font-weight:500; margin-left:12px;}
.car-top .col-r .info a {font-size:var(--font-size-15); position:absolute; right:0; top:0; border-radius:30px; min-width:100px; line-height:40px; font-weight:500;}

.car-top .thumb {position:relative; padding-bottom:35%; overflow:hidden;}
.car-top .thumb img {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -webkit-transform:translate(-50%,-50%); width:auto !important; height:auto !important; max-width:100%; max-height:100%; object-fit:contain;}

.opt-choice {display:flex; margin:0 -40px 60px;}
.opt-choice .col {padding:0 40px; width:50%;}
.opt-choice .title {font-size:var(--font-size-24); margin-bottom:25px; line-height:1.3em; font-weight:700; letter-spacing:-.03em; color:#242424;}

.detail-opt {height:570px; overflow-y:scroll; padding:20px; background-color:#f7f7f7;}
.detail-opt .list .item {margin-bottom:10px;}
.detail-opt .list .item:last-child {margin-bottom:0;}
.detail-opt .tit {font-weight:500; border:1px solid #ddd; border-radius:10px; line-height:1.5em; letter-spacing:-.02em;}
.detail-opt .tit a {height:60px; padding-left:20px; position:relative; display:flex; align-items:center; background-color:#fff; border-radius:10px;}
.detail-opt .tit a:after {content:""; position:absolute; right:20px; top:20px; display:inline-block; width:12px; height:12px; border-right:2px solid #505050; border-bottom:2px solid #505050; transform:rotate(45deg);}
.detail-opt .cnt {padding:15px 20px; margin-top:10px; border:1px solid #ddd; border-radius:10px; display:none; position:relative; color:#878787; background-color:#fff;}
.detail-opt .cnt li {margin-bottom:15px; display:flex; align-items:center; justify-content:space-between;}
.detail-opt .cnt li:last-child {margin-bottom:0;}
.detail-opt .cnt li:hover {color:var(--color-primary); font-weight:600;}
.detail-opt .item.active {position:relative;}
.detail-opt .item.active .tit a:after {transform:rotate(-135deg); margin-top:6px;}
.detail-opt .cnt li .radiobox input:checked + label {color:var(--color-primary); font-weight:600;}

.car-color {margin-bottom:var(--space-30); position:relative;}
.car-color .tt {margin-bottom:var(--space-20); font-size:var(--font-size-24); font-weight:700; letter-spacing:-.03em; display:block; color:#242424;}
.car-color .items .item {padding: 0 5px;}
.car-color .items .item input {position:absolute; top:0; left:0; width:0; height:0; border:0; opacity:0; z-index:-1;}
.car-color .items .item label {display:block; border-radius:10px; position:relative;/*  padding-bottom:100%;  */overflow:hidden;}
.car-color .items .item label img {position:absolute; top:50%; left:0; transition:.4s ease-in-out; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.car-color .items .item label .img {width:90px; height:90px; overflow: hidden; position: relative; border-radius:10px; display:block;}
.car-color .items .item input:checked + label .color-name {color:var(--color-primary); font-weight: 600;}
.car-color .items .item input:checked + label .img:after {border-radius:10px; position:absolute; content:''; top:0; left:0; right:0; bottom:0; border:3px solid var(--color-primary);}
.car-color .items .item p {font-size:13px; margin-top:15px; color:#686868; letter-spacing:-.03em; line-height:1.538em; text-align:center;}

.car-color .slick-arrow {width:11px; height:19px; position:absolute; top:-40px; z-index:20; border:0; font-size:0; line-height:0; background-color:transparent; background-position:50% 50%; background-repeat:no-repeat; background-size:contain;}
.car-color .slick-prev {right:30px; background-image:url("../images/bbs/cc-prev.png");}
.car-color .slick-next {right:0; background-image:url("../images/bbs/cc-next.png");}

.color-name {margin-top: 10px; font-size:var(--font-size-14); text-align: center; line-height:1.4em; /*  position:absolute; top:0; right:0;  */color:#686868;}

.use-opt .col {width:100%;}
.use-opt .group {margin-bottom:25px;}
.use-opt .group:last-child {margin-bottom:0;}
.use-opt .group .tt {font-size:var(--font-size-18); font-weight:600; color:#242424;}

.use-opt ul {margin-top:12px; display:flex;}
.use-opt li {flex-basis:50%;}
.use-opt li .radiobox {display:block;}
.use-opt li input {position:absolute; top:0; left:0; width:0; height:0; border:0; opacity:0; z-index:-1;}
.use-opt li label {height:44px; display:flex; align-items:center; justify-content:center;}
.use-opt li label:before {display:none;}
.use-opt li input + label {font-weight:500; text-align:center; border:1px solid #ddd; width:100%; cursor:pointer;}
.use-opt li input:checked + label {color:var(--color-primary); border:1px solid var(--color-primary); font-weight:600;}
.use-opt li:first-child input + label {border-top-left-radius:7px; border-bottom-left-radius:7px;}
.use-opt li:last-child input + label {border-top-right-radius:7px; border-bottom-right-radius:7px;}