/* 상세검색 */
.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 {position:relative; border-radius:var(--radius-16) var(--radius-16) 0 0; overflow:hidden;}
.car-box .thumb:before {content:''; display:block; padding-bottom:75%;}
.car-box .thumb img {position:absolute; top:0; left:0; width:100%; height:100%; transition:.4s; transform-origin:center center; object-fit:cover;}
.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;}

.pop_modal .car-box .cnt .tit {display:flex;}

.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:var(--color-primary);}

.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-50) 0; margin-bottom:var(--space-100); background-image:url('../images/sub/cartopbg.jpg'); background-size:cover; background-repeat:no-repeat;}
.car-top .wrap {display:flex; align-items:center}
.car-top .col {width:50%;}
.car-top .col-l {padding:var(--space-50) var(--space-40) var(--space-60); border-radius:20px; background-color:#fff;}
.car-top .col-l .name {font-size:var(--font-size-32); font-weight:600; letter-spacing:-.03em; color:#121212; line-height:1.3em;}
.car-top .col-l .name .img {width: 40px; height: 40px; display: flex; align-items: center; justify-content: center;}
.car-top .col-l .name p {margin-bottom:var(--space-20);}
.car-top .col-l .info {position:relative;}
.car-top .col-l .info ul {padding-bottom:var(--space-20); margin-bottom:var(--space-30); gap:0 24px; position:relative; display:flex; flex-wrap:wrap; border-bottom:1px solid #ddd;}
.car-top .col-l .info ul:last-child {border-bottom: 0; padding-bottom: 0; margin-bottom: 0;}
.car-top .col-l .info ul li {font-size:var(--font-size-18); color: #121212; letter-spacing:-.03em; position:relative;}
.car-top .col-l .info ul li:after {width:4px; height:4px; right:-14px; position:absolute; content:''; top:50%; transform:translateY(-50%); background-color:#121212; border-radius:100%;}
.car-top .col-l .info ul li:nth-child(3):after,
.car-top .col-l .info ul li:last-child:after {display:none;}
.car-top .col-l .info a {position:absolute; right:0; bottom:-10px; border-radius:7px; font-weight:500;}
.car-top .col-r {text-align:center;}
.car-top .col-r .thumb {position:relative; padding-bottom:42%; overflow:hidden;}
.car-top .col-r .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;}

.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:-.03em;}
.detail-opt .tit a {height:62px; padding:0 var(--space-20); font-size:var(--font-size-18); position:relative; display:flex; align-items:center;}
.detail-opt .tit a:after {width:12px; height:12px; right:20px; top:23px; content:""; position:absolute; display:inline-block; border-right:2px solid #121212; border-bottom:2px solid #121212; transform:rotate(45deg);}
.detail-opt .cnt {max-height:280px; overflow-y:scroll; padding:var(--space-20) var(--space-30); display:none; position:relative; color:#878787;}
.detail-opt .cnt li {margin-bottom:var(--space-15); display:flex;}
.detail-opt .cnt li:last-child {margin-bottom:0;}
.detail-opt .cnt li:hover {color:#121212; font-weight:600;}
.detail-opt .item.active {position:relative; border:1px solid #121212; border-radius:10px;}
.detail-opt .item.active .tit {border:none; font-weight:600; color:#121212;}
.detail-opt .item.active .tit a:after {transform:rotate(-135deg); margin-top:6px;}

.detail-opt .cnt li .radiobox {display:block; flex:1;}
.detail-opt .cnt li .radiobox input + label {display:flex; align-items:center;}
.detail-opt .cnt li .radiobox input + label span {display:block; flex:1;}
.detail-opt .cnt li .radiobox input + label:before {margin-top:0;}
.detail-opt .cnt li .radiobox input:checked + label {color:#121212; font-weight:600;}

.opt-choice {display:flex;}
.opt-choice .col-wid1 {width:620px;}
.opt-choice .col-wid2 {padding-left:var(--space-80); flex:1; width:1%;}
.opt-choice .title {font-size:var(--font-size-32); margin-bottom:var(--space-30); line-height:1.3em; font-weight:600; letter-spacing:-.03em; color:#121212;}


.opt-choice-wrap {padding:var(--space-100) 0; margin:var(--space-100) 0; background-color:#f9f9f9;}

.use-opt .col {width:100%;}
.use-opt .group {margin-bottom:var(--space-30);}
.use-opt .group:last-child {margin-bottom:0;}
.use-opt .group .tit {font-size:var(--font-size-22); font-weight:600; color:#121212; letter-spacing:-.03em; line-height:1.3em;}
.use-opt .group ul {margin-top:12px; display:flex;}
.use-opt .group ul li {flex-basis:50%;}
.use-opt .group ul li .radiobox {display:block; margin-top:0;}
.use-opt .group ul li input {position:absolute; top:0; left:0; width:0; height:0; border:0; opacity:0; z-index:-1;}
.use-opt .group ul li label {height:64px; font-size:var(--font-size-18); display:flex; align-items:center; justify-content:center;}
.use-opt .group ul li label:before {display:none;}
.use-opt .group ul li input + label {text-align:center; border:1px solid #ddd; width:100%; cursor:pointer; background-color:#fff;}
.use-opt .group ul li input:checked + label {color:var(--color-primary); border:1px solid var(--color-primary); font-weight:600;}
.use-opt .group ul li:first-child input + label {border-top-left-radius:10px; border-bottom-left-radius:10px;}
.use-opt .group ul li:last-child input + label {border-top-right-radius:10px; border-bottom-right-radius:10px;}

.car-color .group {position:relative;}
.car-color strong {font-size:var(--font-size-22); margin-bottom:var(--space-15); display:block; color:#121212; font-weight:600;}
.car-color .group {margin-bottom:var(--space-50);}
.car-color .group:last-child {margin-bottom:0;}
.car-color .group ul {margin:0 -10px -25px; display:flex; flex-wrap:wrap;}
.car-color .group ul li {padding:0 10px; margin-bottom:var(--space-25); width:20%;}
.car-color .group ul li input {position:absolute; top:0; left:0; width:0; height:0; border:0; opacity:0; z-index:-1;}
.car-color .group ul li label {display:block; }
.car-color .group ul li label .img {display:block; border-radius:10px; position:relative; padding-bottom:100%; overflow:hidden;}
.car-color .group ul li 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 .group ul li 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 .group ul li input:checked + label p {color:#121212; font-weight:600;}
.car-color .group ul li p {font-size:13px; margin-top:15px; color:#505050; letter-spacing:-.03em; line-height:1.3em; text-align:center; word-break: break-all;}

.chocie-total {margin-bottom:var(--space-60);}
.chocie-total .box {padding:var(--space-40) var(--space-40) var(--space-45); color:#686868; line-height:1.4em; border:1px solid #121212; border-radius:20px;}
.chocie-total .cate {margin-bottom:10px;}
.chocie-total .col-l ul {display:flex; flex-wrap:wrap;}
.chocie-total .col-l ul li {margin-bottom:var(--space-50); width:33.3333%;}
.chocie-total .col-l .color-in {display:flex; align-items:flex-end;}
.chocie-total .col-l .color-in .thumb {width:84px; height:84px; border-radius:5px; position:relative; overflow:hidden;}
.chocie-total .col-l .color-in .thumb 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;}
.chocie-total .col-l .color-in span {padding-left:15px; line-height:1.3em; color:#121212; font-weight:600; letter-spacing:-.03em; display:block;}
.chocie-total .col-l ul li p {font-size:var(--font-size-24); color:#121212; letter-spacing:-.03em; font-weight:600; line-height:1.5em;}
.chocie-total .col-r {margin-top:-15px; padding-top:var(--space-35);  display:flex; border-top:1px solid #ddd;}
.chocie-total .col-r .tt {order:2; text-align:right;}
.chocie-total .col-r .tt .won {font-size:var(--font-size-24); position:relative; font-weight:600; color:#121212; letter-spacing:-.03em;}
.chocie-total .col-r .tt .won:after {height:12px; left:-3px; right:-3px; border-radius:3px; z-index:-1; bottom:-3px; position:absolute; content:''; background-color:#99f2bd;}
.chocie-total .col-r ul {flex:1;}
.chocie-total .col-r li {margin-bottom:5px;}
.chocie-total .col-r li:last-child {margin-bottom:0;}