.usedcar {display:flex;flex-direction: row; justify-content: space-between; width:100%; padding:0; margin:0;} .usedcar .left-nav-area { display:inline-block; vertical-align:top; width:320px; padding-right:40px;border-top:1px solid transparent} /* tab menu */ .tab-menu{display:block; font-size:0;} .tab-menu:after{display:block;content:'';clear:both;} .tab-menu li{display:inline-block; cursor:pointer} .tab-menu li.on{z-index:1;} .tab-menu li.on:before{display:none;} .tab-menu li a, .tab-menu li span{display:block;height:3.125rem;line-height:3.125rem;color:#666;font-size:1.063rem; padding:0 25px;font-weight:600; border-radius:6rem; text-align:center; letter-spacing:-.04em;} .tab-menu li.on a, .tab-menu li.on span{position:relative;color:#fff;background-color:var(--txt-default)} .ui-tab .tab-cont{position:relative;display:none;} .ui-tab .tab-cont.show{display:block;} /* checkbox */ .custom-checkbox{position:relative;display:inline-block;padding-left:0rem;} /* category test01*/ .cate-wrap .category{position:relative;display:none;width:16.9%;} .cate-wrap.open .category, .cate-wrap.left-fixed .category{display:block;} .cate-wrap.left-fixed .category-lay-box{display:none;} .cate-wrap.left-fixed.open .category-lay-box{display:block;} .cate-wrap .btn-close{position:absolute;top:-1px;right:-1px;display:block;width:3.125rem;height:3.125rem;text-indent:-99999px;overflow:hidden;background:url('../images/sub/btn_cate_close.png') 50% no-repeat;-webkit-background-size:cover;background-size:cover;} /* 차량검색 */ -wrap .filter{margin:0rem 0 0;} -wrap .title{margin:0 0 .875rem;color:#111;font-size:1.125rem;font-weight:500;} -wrap .mo.sel-st03{display:none;} -wrap {position:relative;} /* -wrap .tab-menu{position:relative;} -wrap .tab-menu:before{position:absolute;bottom:0;left:0;z-index:1;display:block;content:'';width:100%;} -wrap .tab-menu li{width:50%; cursor:pointer;} -wrap .tab-menu li a{height:3.125rem;color:#aaa;font-size:1.063rem;line-height:3.125rem;font-weight:500;background:#fff;} -wrap .tab-menu li.on a{color:#fff;background-color:var(--txt-default) !important;} */ -wrap .filter-content{padding:2.55rem 0.625rem 0;} -wrap .filter-content button.reset { display:block; font-size:0.95rem;line-height:0.95rem; color:#333; font-weight:500; margin-bottom:1rem; letter-spacing:-.04rem; } -wrap .filter-content button.reset:after {content:''; display:inline-block; vertical-align:top; margin-left:7px; width:18px; height:18px; background:url('/images/inc/ico_reset.png') no-repeat center ; background-size:auto 16px; } -wrap .cate-list {border-top:1px solid #555;} -wrap .cate-list li{position:relative;display:block;color:#333;line-height:3.75rem;cursor:pointer;border-bottom:1px solid #ececec;} -wrap li p:hover .tit{text-decoration:underline;} -wrap .cate-list li .tit{ display:block; text-overflow:ellipsis; white-space:nowrap;overflow:hidden;padding:0 .625rem;} -wrap .cate-list .num{position:absolute;top:0 !important;right:.65rem; max-width:3.75rem;color:#aaa;font-family:'Roboto';text-align:right;} -wrap .open > p .tit{position:relative;display:block;color:#0d386d;font-weight:500;} -wrap .open > p .tit:before{display:block;content:"";position:absolute;right:1rem;top:50%;width:5px;height:5px;margin-top:-5px;border-left:2px solid;border-bottom:2px solid;border-color:#d4d4d4;-webkit-transform:rotate(-45deg);transform:rotate(-45deg);} -wrap .open > p .tit:before{margin-top:0;border-color:#0c4c9a;-webkit-transform:rotate(135deg);transform:rotate(135deg);} -wrap .open > p .num{display:none; } -wrap .sm-cate-list{display:none;max-height:16.5rem;padding:0.313rem 0 0.313rem 0.625rem !important; border-top:0px solid #ececec; overflow-y:auto; background:#f8f8f9; } -wrap .sm-cate-list li {line-height:2.063rem; border-bottom:0} -wrap .sm-cate-list.col5 li {width:50%; float:left;} -wrap .keywordsearch .title2 {display:inline-block;cursor:defualt;} -wrap .keywordsearch .sm-cate-list {display:inline-block;padding-top:0 !important;position:absolute;right:0;top:0;background:transparent;text-align:right;} -wrap .keywordsearch .sm-cate-list input {width:50%;} -wrap .keywordsearch .sm-cate-list button {width:3rem;height:40px;border:1px solid #ddd;background:#fff;font-size:.9rem;} -wrap .has-sm-cate.open .sm-cate-list{position:relative;display:block;} -wrap .cate-list>li.has-sm-cate:hover>.tit{text-decoration:none;} -wrap .model li{font-size:.875rem;line-height:2.4rem;} -wrap .model .tit{display:block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;} -wrap .scroll{display: none;width: 100%;overflow-y: auto;background: #f8f8f9;border-top:1px solid #ececec;} -wrap .brand > li > .scroll{max-height: 330px;} -wrap .model .scroll{max-height: 286px;} -wrap .brand > .open > .scroll{display:block;} -wrap .model > .open > .scroll{display:block;} .usedcar .left-nav-area .cate-wrap {display:none;} .usedcar .left-nav-area -wrap {display:block;} .usedcar -wrap .btn-pop-close {display:none;} .usedcar -wrap .btn-layer-close {display:none;position:absolute; right:0; top:0;width:3.5rem;height:2.5rem;text-indent:-99999px;overflow:hidden;background:url('/images/inc/pop_close.png') no-repeat center ;-webkit-background-size:auto 1.75rem;background-size:auto 1.25rem;} /* 좌측 검색메뉴 */ .car_wrap -wrap .cate-list .has-sm-cate > .title, -wrap .cate-list .has-sm-cate > .title2 {position:relative;display:block;margin:0;padding:0 .625rem;color:var(--txt-dark-grey);font-weight:500;font-size:1rem;cursor:pointer;} .car_wrap -wrap .has-sm-cate > .title:before{display:block;content:"";position:absolute;right:1rem;top:50%;width:16px;height:16px;margin-top:-8px; background:url('/images/inc/ico_plus.png') no-repeat center ;} .car_wrap -wrap .has-sm-cate.open > .title:before{ background:url('/images/inc/ico_minus.png') no-repeat center ;} .car_wrap -wrap .custom-checkbox .check-label {font-size:.875rem;} .car_wrap -wrap .filter-content .search-box {margin:0; padding:0} .car_wrap -wrap .filter-content .search-box .search-input {width:100%;height:2.5rem;background:#f0f0f0;border:0;} .car_wrap -wrap .filter-content .search-box .btn {width:40px;height:40px;margin:0;line-height:40px;background:url('/images/common/btn_search.png') no-repeat center center #22252a;background-size:auto 70%;text-indent:-9999px;} .car_wrap -wrap select {height:2.5rem; line-height:2.5rem; padding-left:.313rem;background-color:#fff; border-radius:4px; border:1px solid #eee; } .car_wrap -wrap select.col2 {width:calc(50% - 8px); } .car_wrap -wrap em {height:20px; line-height:20px; width:16px; text-align:center; } .car_wrap -wrap .sm-cate-list {/*-webkit-overflow-scrolling: touch;*/} .uscar_wrapedcar -wrap .sm-cate-list.range {padding:0 0rem;} .car_wrap -wrap .sm-cate-list li .custom-checkbox, .usedcar -wrap .sm-cate-list li .custom-checkbox label {width:100%;/* padding:.15rem 0 .15rem .75rem;*/ line-height:1.2rem;word-break:keep-all;cursor:pointer;} .car_wrap -wrap .sm-cate-list li .tit {display:block;padding:.3rem 0;line-height:1.3rem;white-space:unset;cursor:pointer;} .car_wrap .filter-box-wrap .sm-cate-list li.choice1, .car_wrap .filter-box-wrap .sm-cate-list li.choice2, .car_wrap .filter-box-wrap .sm-cate-list li.choice3, .car_wrap .filter-box-wrap .sm-cate-list li.choice4 {display:none;background:url("/images/sub/btn_cate_del.png?ver=3") no-repeat 98% center;background-size:auto 16px;font-weight:bold;color:#111;} .car_wrap .filter-box-wrap .sm-cate-list li.c2, .car_wrap .filter-box-wrap .sm-cate-list li.c3 {display:none;} .car_wrap .filter-box-wrap .sm-cate-list .step2 li.choice1 {display:block;padding-left:0rem;padding-right:2.2rem;} .car_wrap .filter-box-wrap .sm-cate-list .step2 li {padding-left:1rem;} .car_wrap .filter-box-wrap .sm-cate-list .step2 li.c1 {display:none;} .car_wrap .filter-box-wrap .sm-cate-list .step2 li.c2 {display:block;} .car_wrap .filter-box-wrap .sm-cate-list .step3 li.choice2 {display:block;padding-left:0.65rem;} .car_wrap .filter-box-wrap .sm-cate-list .step3 li.choice3 {display:block;padding-left:1.2rem;} .car_wrap .filter-box-wrap .sm-cate-list .step3 li {padding-left:1.3rem;} .car_wrap .filter-box-wrap .sm-cate-list .step3 li.c1, .car_wrap .filter-box-wrap .sm-cate-list .step3 li.c2 {display:none;} .car_wrap .filter-box-wrap .sm-cate-list .step3 li.c3 {display:block;} .car_wrap .filter-box-wrap .sm-cate-list .step4 li.choice4 {display:block;padding-left:0.65rem;} .car_wrap .filter-box-wrap .sm-cate-list .step4 li.choice4 {display:block;padding-left:1.2rem;} .car_wrap .filter-box-wrap .sm-cate-list .step4 li {padding-left:1.3rem;} .car_wrap .filter-box-wrap .sm-cate-list .step4 li.c1, .car_wrap .filter-box-wrap .sm-cate-list .step4 li.c2, .car_wrap .filter-box-wrap .sm-cate-list .step4 li.c3 {display:none;} .car_wrap .filter-box-wrap .sm-cate-list .step4 li.c4 {display:block;} .car_wrap -wrap .cate-list .num {top:.0rem;} .car_wrap -wrap .btn-search { display:none; } @media all and (max-width:1200px) { .usedcar .left-nav-area {width:270px; padding-right:20px; } .tab-menu li span{height:2.5rem;line-height:2.5rem;font-size:1rem; padding:0 20px;} } @media all and (max-width:1024px) { .usedcar {display:block;} .usedcar .left-nav-area {width:100%;padding-right:0px; display:block !important;margin:0 !important;} .usedcar .left-nav-area .cate-wrap {display:inline-block !important; position:relative; } .usedcar .left-nav-area .cate-wrap .btn-cate {line-height:1.8rem;font-size:0.95rem; font-weight:600; padding:6px 50px 6px 16px; border-radius:60px; border:1px solid #eee;background:url('../images/sub/icon_filter.png') no-repeat 85% ; background-size:auto 20px; } .usedcar .left-nav-area -wrap {display:none; position:fixed; left:0; bottom:0;width:100%; height:100%;z-index:3333; background-color:rgba(0,0,0,0.3); } /* 조회버튼 클릭후 적용 미적용 display:none; */ .usedcar .left-nav-area -wrap .filter { position:absolute; left:0; bottom:0; width:100%; height:97%;background:#fff;padding:15px 12px 100px;overflow-y:auto;overflow-x:hidden; border-radius:1.563rem 1.563rem 0 0; border:1px solid #eee; box-shadow:5px -5px 10px rgba(0,0,0,0.1) } .usedcar -wrap .btn-pop-close {display:inline-block;} .usedcar -wrap .btn-layer-close {display:inline-block;} .usedcar .left-nav-area -wrap .filter-content{padding:1.5rem 0.35rem 0;} .usedcar -wrap .btn-search {display:block; position:fixed; left:0; bottom:0; width:100%; padding:0.65rem; background-color:transparent; z-index:333 } .usedcar -wrap .btn-search button {font-weight:bold; font-size:1.125rem; line-height:3.125rem; border-radius:9rem; box-shadow:3px 3px 10px rgba(0,0,0,0.1);overflow:hidden; } .usedcar -wrap .btn-search button.search-detail{float:right;width:calc(100% - 4.35em);color:#fff; background-color:var(--txt-default); border-radius:9rem; } .usedcar -wrap .btn-search button.search-detail:after {content:''; display:inline-block; vertical-align:middle; margin-left:3px; line-height:3.125rem;height:3.125rem; width:30px; background:url('/images/sub/ico_search_mobile_w.png') no-repeat center ; background-size:auto 22px;} -wrap .filter-content button.reset { position:fixed; left:0.65rem; bottom:-0.395rem; z-index:333;width:3.25rem;height:3.125rem; line-height:3.125rem; border-radius:9rem; color:#fff; text-indent:-9999px; background-color:#0f2660; background-image:url('/images/inc/ico_reset_w.png'); background-repeat:no-repeat; background-position:center ; background-size:auto 25px;box-shadow:3px 3px 10px rgba(0,0,0,0.1); } } .cate-wrap .btn-list-order {display:none;} @media all and (max-width:677px) { /* .usedcar .left-nav-area .cate-wrap {position:fixed; left:0;bottom:0; width:100%; padding:0.65rem 0.65rem; background-color:transparent;display:flex !important;flex-direction: row; justify-content: space-between; gap:0.35rem; z-index:5; } .usedcar .left-nav-area .cate-wrap .btn-cate { display:inline-flex; height:3.125rem; line-height:3.105rem !important; width:50% !important; color:#fff; font-size:0.85rem !important; padding:0px; padding-left:20px; border-radius:9rem; border:0; text-align:left; box-shadow:5px 5px 10px rgba(55,111,255,0.2);background:var(--txt-default) url('../images/sub/icon_filter_w.png') no-repeat ; background-size:auto 22px; background-position:calc(100% - 20px) ; } .usedcar .left-nav-area .cate-wrap button:first-child {border-left:0; } */ .usedcar .left-nav-area .cate-wrap {display:block; width:100%;padding:0 10px 10px;margin-top:0px;} .usedcar .left-nav-area .cate-wrap .btn-cate {display:inline-block; width:100% !important; height:2.85rem; line-height:2.85rem !important; color:#fff; font-size:0.95rem !important; padding:0px; padding-left:20px; border-radius:9rem; border:0; text-align:left; background:var(--txt-default) url('../images/sub/icon_filter_w.png') no-repeat ; background-size:auto 22px; background-position:calc(100% - 20px) ; /* box-shadow:5px 5px 10px rgba(55,111,255,0.2);*/ } .usedcar .left-nav-area .cate-wrap select.btn-list-order { display:inline-flex; width:50%; height:3.125rem; line-height:3.105rem;text-align:left !important; font-weight:bold ; font-size:0.85rem !important; color:#fff; background-color:#999; border:0;border-radius:9rem; padding-left:20px;box-shadow:5px 5px 10px rgba(0,0,0,0.1); background-image:url('/images/icon_select_w.png'); background-size:auto 16px; background-position:calc(100% - 20px) } .usedcar -wrap .btn-search button.reset{ font-size:0.85rem;} .usedcar -wrap .btn-search button.search-detail{font-size:0.85rem; } /* .resultWrap .align-wrap select.select-align {position:fixed; z-index:5; bottom:0.65rem; right:0.65rem; width:calc(50% - 1.3rem); cursor:pointer; height:3.125rem; line-height:3.105rem;text-align:left !important; font-weight:bold ; font-size:0.85rem !important; color:#fff; background-color:#999; border:0;border-radius:9rem; padding-left:20px;box-shadow:5px 5px 10px rgba(0,0,0,0.1); background-image:url('/images/icon_select_w.png'); background-size:auto 16px; background-position:calc(100% - 20px)} */ .usedcar{padding-top:0 !important;margin-top:60px; border:0px solid #f00} } @media all and (max-width:360px) { .usedcar .left-nav-area .cate-wrap .btn-cate:after {right:15px;} } /* 검색결과 없음 */ .result_nodata {width:100% !important;height:500px !important;line-height:500px;padding:0 !important; font-size:1rem !important; font-weight:500; border-bottom:0px solid #ddd; font-family:'Spoqa Han Sans';border-top:0px solid #ddd;background:#fbfbfb;text-align:center;color:#999;} .result-carlist>li.result_nodata {margin-bottom:50px; } .result-carlist>li.result_nodata:after {border:0;} .result-carlist.list-view>li.result_nodata {margin-bottom:0;} .result-carlist.gallery.result_nodata>li.result_nodata:after { border:0 !important} .result-carlist.result_nodata {border:0; margin-top:20px;} .result-carlist.result_nodata>li.result_nodata {border:0} @media all and (max-width:1024px) { .result-carlist.result_nodata { margin-top:15px;} .result_nodata {height:300px !important;line-height:300px;} } /* 차량리스트 */ .carList-Wrap {width:1400px; margin:0 auto;position:relative; } .page-sangsa .car-right { display:block; width:100%;} .car-right{display:inline-block; vertical-align:top; width:calc(100% - 320px); margin-top:0rem; } .car-right .keyword {display:block; margin:25px 0 0; padding:20px 30px; border-radius:7px; background-color:#f4f4f4} .car-right .keyword button {display:inline-block; margin-left:25px; font-size:15px; line-height:1.3em;color:#333; } .car-right .keyword button:first-child {margin-left:0} .car-right .keyword button:after {content:"\e921"; display:inline-block; vertical-align:top; margin-left:5px; margin-top:0px; line-height:1.3em;font-size:15px; color:#333;font-family:'xeicon'; } .car-right .keyword button:hover::after {color:var(--txt-default);} .car-right .order-pc {display:inline-block;} .car-right .order-mobile {display:none;} /* 마이페이지 내차관리*/ .car-right.my{float:right;width:calc(100% - 180px); margin-top:0rem;padding-left:3.125rem; } .resultWrap {margin:20px 0 10px; font-size:0; display:flex; width:100%; justify-content: space-between;flex-direction: row;align-items: center; } .resultWrap input[type=checkbox] + label{ padding-right:0px; } .resultWrap button { font-weight:500; padding:0 0.85rem; border:1px solid #ddd; font-size:0.85rem; font-weight:500; color:#333;height:32px; border-radius:4px; } .resultWrap button.consult-done {background-color:var(--txt-sky-blue); color:#fff; border-color:var(--txt-sky-blue)} .resultWrap select {display:inline-block; vertical-align:middle; border:1px solid #dedede; border-radius:5px; height:38px; } .resultWrap .count {display:inline-block; vertical-align:middle; width:100px; font-size:18px; line-height:38px; font-weight:500; color:#555;} .resultWrap .count strong{font-weight:bold; color:var(--txt-default)} .resultWrap .align-wrap {display:inline-block; vertical-align:middle; width:calc(100% - 100px) ; text-align:right; } .resultWrap .align-wrap .seq {display:inline-block; vertical-align:middle; } .resultWrap .align-wrap .seq ul {display:inline-block; vertical-align:middle; } .resultWrap .align-wrap .seq ul button{display:inline-block; margin-left:10px; font-size:14px; font-weight:500; color:#777; } .resultWrap .align-wrap .seq ul button:first-child {margin-left:0; padding-left:0; } .resultWrap .align-wrap .seq ul button:before {content:''; display:inline-block; vertical-align:middle; margin-right:10px; height:14px; width:1px; background-color:#ddd; } .resultWrap .align-wrap .seq ul button:first-child:before {display:none; } .resultWrap .align-wrap .seq ul button.on {font-weight:bold; color:#333} .resultWrap .align-wrap .seq ul button.on:before {display:none;} .resultWrap .align-wrap select {display:inline-block; vertical-align:middle; font-weight:500; border:1px solid #dedede; border-radius:5px; height:38px; margin:0 2px; padding:0 25px 0 8px; background-position:calc(100% - 5px) ; } .resultWrap .align-wrap select.select-align {display:inline-block;} .resultWrap .compare {display:inline-block; vertical-align:middle; margin-right:5px;height:38px; padding:0 15px 0 20px; font-size:14px; border:1px solid var(--txt-default); color:var(--txt-default); border-radius:5px; font-weight:bold; background:url('/images/sub/ico_vs_on.png') no-repeat 15px ; text-indent:15px; background-size:auto 16px; } .resultWrap .btn-align {display:inline-block; vertical-align:middle; margin-left:5px; width:auto; font-size:0; height:auto;right:0; padding:5px; background-color:#eaecf0; border-radius:4px; } .resultWrap .btn-align a { display:inline-block; vertical-align:top; width:30px; height:30px; border-radius:2px; background-size:auto 25px; background-repeat:no-repeat; background-position:center center; } .resultWrap .btn-align a.on {box-shadow:2px 2px 5px rgba(0,0,0,0.1)} .resultWrap .btn-align a.general { background-image: url('/images/sub/icon_list.png'); } .resultWrap .btn-align a.general.on { background-image: url('/images/sub/icon_list_on.png'); background-color:#fff; } .resultWrap .btn-align a.gallery { background-image: url('/images/sub/icon_gallery.png'); } .resultWrap .btn-align a.gallery.on { background-image:url('/images/sub/icon_gallery_on.png'); background-color:#fff; } .resultWrap.my {display:flex;justify-content: space-between;flex-direction: row; align-items: center; flex-wrap: nowrap; } .resultWrap.my .row {display:flex; flex-direction: row; gap:0.2rem; } .resultWrap.my input[type=checkbox] + label {padding-right:3px; display:inline-block; vertical-align:middle; } .resultWrap.my select, .resultWrap.my button, .resultWrap.my .compare {height:32px; border-radius:4px;font-size:0.85rem; } .resultWrap.my .compare {border-color:var(--txt-default ); color:var(--txt-default); padding-left:25px !imortant; background-position:10px ; margin:0;} .resultWrap.my .btn-upload {background-color:var(--txt-violet); border-color:var(--txt-violet); color:#fff; } .resultWrap.my .delete {background-color:#444; border-color:#444; color:#fff;} /* 차량리스트 일반형 */ .result-carlist { position:relative; display:block; margin-top:0px; border-top:1px solid #dedede; } .result-carlist > li { display:block; position:relative; height:auto; width:100%; padding-left:25px; font-size:0;padding-bottom:25px; padding-top:25px; border-bottom:1px solid #dedede;} .result-carlist > li > a {display:block;} .result-carlist > li .check-area {position:absolute; left:2px; top:50%; margin-top:-10px; z-index:10; } .result-carlist > li .img-wrap {display:inline-block; position:relative; vertical-align:middle; width:190px; height:135px; border-radius:5px; /*background:url('/images/no_img_400.jpg') no-repeat center ; */background-size:cover; background-repeat:no-repeat ; background-position:center center;} .result-carlist > li .img-wrap a {display:block;position:relative; width:100%; height:100%; background-size:cover; background-repeat:no-repeat ; background-position:center center; } .result-carlist > li.viewed .img-wrap:before {content: "\e950";display:grid;position:absolute;left:0;top:0;right:0;bottom:0;background-color:rgba(0,0,0,0.35);font-size:26px; line-height:1;font-weight:lighter !important; color:#fff; border:0px;align-items:center;text-align:center;z-index:10;} .result-carlist > li > .car-info .title a{ font-size:1.063rem;font-weight:600; color:var(--txt-dark-grey); letter-spacing:-.04em;word-break:keep-all; white-space:nowrap; text-overflow:ellipsis;overflow:hidden; } .result-carlist > li > .car-info .title a:hover {text-decoration:underline;} .result-carlist .car-info {display:inline-block;vertical-align:middle; width:calc(100% - 190px); padding:0px 0 0 30px; font-size:0; } .result-carlist .car-info .infoBox {display:inline-block; vertical-align:middle; width:calc(100% - 200px); } .result-carlist .car-info .infoBox .title {display:block;} .result-carlist .car-info .infoBox .title a {font-weight:bold; } .result-carlist .car-info .car-desc {display:block; font-size:14px; margin-top:0.3rem; font-family:'Spoqa Han Sans'; } .result-carlist .car-info .car-desc em { display:inline-block; vertical-align:middle; margin:0px 10px 0; width:4px; height:4px; border-radius:5px; background-color:#c3c7d3;} .result-carlist .car-info .car-desc span {display:inline-block; vertical-align:middle;font-size:0.85rem; color:#666; margin-right:6px; padding-right:0px;} .result-carlist .car-info .car-desc span:after {content:''; display:inline-block; vertical-align:middle; margin-left:6px; width:4px; height:4px; border-radius:5px; background-color:#c3c7d3;} .result-carlist .car-info .car-desc span:last-child:after { display:none !important; } .result-carlist .car-info .car-desc .dealer {color:#111;display:inline-block; vertical-align:middle; font-weight:bold; font-family:'NotoSans'; } .result-carlist .car-info .car-desc br {display:none;} .result-carlist .car-info .car-exp {display:block; padding-top:0.565rem;font-weight:500; color:#555; font-size:0.85rem; overflow:hidden; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis;font-family:'Spoqa Han Sans'; } .result-carlist .car-hash { display:block; font-size:0.85rem; color:#36acff; font-weight:500; margin-top:5px; height:26px; overflow:hidden; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis;} .result-carlist .auc-info {display:inline-block; vertical-align:middle; width:200px; text-align:right; } .result-carlist .auc-info .price {display:block;font-size:20px; color:#555;} .result-carlist .auc-info .price em {padding-right:10px;font-size:14px;} .result-carlist .auc-info .price strong{font-size:25px; font-weight:bold; color:var(--txt-default); letter-spacing:0} .result-carlist .auc-info .cn-manage {display:block; font-size:0.8rem; padding-top:0.65rem; font-family:'Spoqa Han Sans'; } .result-carlist .auc-info .cn-manage .car-state {display:block; } .result-carlist .auc-info .cn-manage button.save-done {display:inline-block;vertical-align:middle; border:0; background-color:#999; color:#fff;height:22px; line-height:20px; padding:0 0.65rem; border-radius:9rem; font-size:0.8rem; font-weight:500; font-family:'Spoqa Han Sans'; } .result-carlist .auc-info .cn-manage p.carN {display:block;font-size:0.75rem; padding-top:0.25rem;} .result-carlist .auc-info .car-date {display:block; font-size:0.9rem; color:#555; font-family:'Spoqa Han Sans'; margin-bottom:0.65rem} .result-carlist .car-select {position:relative;display:block; margin-top:10px; } .result-carlist .car-select button {display:inline-block; width:30px; height:30px; line-height:30px; text-align:center; margin-left:8px;} .result-carlist .car-select button:hover {border-color:#555 !important;opacity:1;} .result-carlist .car-select button.wish { background-image:url('/images/sub/ico_wish_off.png'); background-size:24px 24px; background-position:center center; background-repeat:no-repeat; } .result-carlist .car-select button.wish.on {background-image:url('/images/sub/ico_wish_on.png'); border-color:var(--txt-default) !important;opacity:1;} .result-carlist .car-select button.vs { background-image:url('/images/sub/ico_vs_off.png'); background-size:24px 24px; background-position:center center; background-repeat:no-repeat; } .result-carlist .car-select button.vs.on {background-image:url('/images/sub/ico_vs_on.png'); border-color:var(--txt-default) !important;opacity:1;} .result-carlist button.carcheck {padding:0 1rem;margin-top:.5rem;border:1px solid #777;border-radius:.2rem;color:#111;font-size:.9rem;line-height:1.5rem;letter-spacing:-.07rem;} .result-carlist button, .result-carlist a { transition: all 0s ease-in; } /* 차량리스트 갤러리형 */ .result-carlist.gallery {position:relative; border-top:0; margin-top:20px; font-size:0;} .result-carlist.gallery li { display:inline-block;vertical-align:top; position:relative;width:calc(33.3% - 20px); margin-left:30px; padding:0;border:0; margin-bottom:30px; background-color:transparent; border-radius:7px; overflow:hidden; } .result-carlist.gallery li:after {content:''; position:absolute; left:0; top:0; width:100%; height:100%; background-color:#fff; border:1px solid #e5e9f0; z-index:-1; border-radius:8px; } .result-carlist.gallery li:first-child {margin-left:0} .result-carlist.gallery li:nth-child(3n+1) {margin-left:0} .result-carlist.gallery li .check-area {left:auto; right:5px; top:5px !important; margin-top:0px; width:18px; height:18px; z-index:1} .result-carlist.gallery .img-wrap { width:100%; height:200px; position:relative; border-radius:8px 8px 0 0} .result-carlist.gallery > li.viewed .img-wrap:before {font-size:36px;line-height:36px;} .result-carlist.gallery .car-badge {position:absolute; left:10px; top:10px; } .result-carlist.gallery .car-badge label {font-size:0.721rem; padding:0px 10px 0; height:22px; line-height:22px;} .result-carlist.gallery .car-hash {margin-top:0px;} .result-carlist.gallery .car-info { display:block; width:100%;min-height:160px; margin:0;padding:15px 23px 0;} .result-carlist.gallery .car-info .infoBox {display:block; width:100%;min-height:7rem;} .result-carlist.gallery .car-info .car-desc {font-size:0.85rem; line-height:16px;/*height:1.5rem;*/ letter-spacing:-.07em;} .result-carlist.gallery .car-info .car-desc em {margin:0px 5px 0; width:3px; height:3px; } .result-carlist.gallery .auc-info { display:flex; flex-direction: row;justify-content: space-between; width:100%;height:auto; margin:0 auto;right:auto;top:auto;padding:25px 0px 25px;} .result-carlist.gallery .auc-info .price {width:50%; font-size:18px; text-align:left;margin-top:5px;} .result-carlist.gallery .auc-info .car-select {width:50%;margin-top:0 ; text-align:right;} .result-carlist.gallery .auc-info .car-select button {margin-left:5px; margin-right:0px; } .result-carlist.gallery .auc-info .cn-manage {display:none} .result-carlist.gallery .btnArea {padding:0 12px 15px 15px; } .result-carlist.gallery .btnArea button {height:42px;line-height:42px;font-size:14px;} @media all and (max-width:800px) { .result-carlist button.carcheck {position:absolute;right:1rem;bottom:0.75rem;} .result-carlist.gallery button.carcheck {right:3.5rem; z-index:10;} } @media all and (max-width:500px) { .result-carlist button.carcheck {margin-top:0rem;font-size:.815rem;line-height:1.315rem; padding:0 0.65rem;position:absolute; right:3px; bottom:3px;} .result-carlist.gallery button.carcheck {bottom:0.6rem; } } /* 상사별 */ .page-sangsa .result-carlist.gallery li {width:calc(25% - 21px); margin-left:28px; } .page-sangsa .result-carlist.gallery li:nth-child(1), .page-sangsa .result-carlist.gallery li:nth-child(4n+1) {margin-left:0} @media all and (max-width:1400px) { .carList-Wrap {width:100%; padding:0 10px; } } @media screen and (max-width:1200px){ .car-right{ width:calc(100% - 270px); } .page-carList .container {padding-top:0} .page-sangsa .car-right {margin-top:0} .page-sangsa .container {padding-top:30px} .result-carlist > li { padding-bottom:15px; padding-top:15px;} .result-carlist > li .img-wrap {width:150px; height:115px; } .result-carlist .car-info { width:calc(100% - 150px); padding:0px 0 0 20px; } .result-carlist .car-info .infoBox { width:calc(100% - 170px); } .result-carlist .car-hash {font-size:0.75rem;height:20px; } .result-carlist > li > .car-info .title a{ font-size:0.95rem; } .result-carlist .car-select button {width:25px; height:25px; line-height:25px; } .result-carlist .car-select button.wish, .result-carlist .car-select button.vs { background-size:20px 20px; } .result-carlist .auc-info {width:170px; } .result-carlist .auc-info .price {font-size:15px;} .result-carlist .auc-info .price em {padding-right:5px;font-size:12px;} .result-carlist .auc-info .price strong{font-size:20px; } .car-badge {min-height:auto; } .result-carlist .car-info .car-desc {margin-top:5px;} .result-carlist.gallery li {width:calc(33.3% - 10px); margin-left:15px; margin-bottom:20px; border-radius:5px; } .result-carlist.gallery .car-info { padding:10px 15px 0; min-height:auto;} .result-carlist.gallery .auc-info { padding:20px 0px 20px;} .result-carlist.gallery .auc-info .price { font-size:1rem;margin-top:0px; } /* 상사별 */ .page-sangsa .usedcar{padding-top:0;} .page-sangsa .result-carlist.gallery li {width:calc(33.3% - 10px); margin-left:15px; margin-bottom:20px; border-radius:5px; } .page-sangsa .result-carlist.gallery li:nth-child(1){margin-left:0 !important} .page-sangsa .result-carlist.gallery li:nth-child(3n+1) {margin-left:0} .page-sangsa .result-carlist.gallery li:nth-child(4n+1) {margin-left:15px} } @media screen and (max-width:1024px){ .page-sangsa .container {padding-top:0} .car-right{display:block;clear:both; width:100%; } .resultWrap{margin:0} .resultWrap .count { font-size:1.1rem; } .resultWrap .align-wrap { } .resultWrap .align-wrap select {height:30px ;} .resultWrap .align-wrap .compare {margin-right:5px; font-size:0.75rem; height:30px ;} .resultWrap .align-wrap .seq ul {margin-right:0px;} .resultWrap .btn-align {margin-left:5px; padding:3px; } .resultWrap .btn-align a { width:25px; height:25px ; background-size:auto 20px;} .car-right .order-pc {display:none !important;} .car-right .order-mobile {display:inline-block !important;} .result-carlist{margin-top:15px; } .result-carlist .car-info .car-desc {font-size:13px; margin-top:5px; } .result-carlist .car-info .car-desc em { margin:0px 7px 0; width:3px; height:3px; } .result-carlist.gallery {margin-top:15px; } .result-carlist.gallery .car-info {min-height:auto;} .result-carlist.gallery .car-info .car-desc {height:auto; } .resultWrap.my {padding:0 5px;} .result-carlist > li .check-area } @media screen and (max-width:1023px){ .result-carlist .car-select button.vs, .result-carlist.gallery .car-select button.vs, .slideWrap .sellerInfo .info-left button.vs {display:none; } .resultWrap .compare {display:none;} .slideWrap .sellerInfo .info-left {padding-right:0} .resultWrap button.car-modify, .resultWrap button.save, .resultWrap button.move, .resultWrap .view-count, .resultWrap .btn-upload {display:none;} } @media screen and (max-width:677px){ .car-right .order-mobile {display:none !important;} .car-right {margin-top:0px;padding:0 } .resultWrap {padding:0 5px;} .resultWrap .count {width:80px; font-size:0.9rem; line-height:0.9rem; } .resultWrap .align-wrap {width:calc(100% - 80px) ; } /*.resultWrap .align-wrap .compare {display:none !important}*/ .car-badge {display:none;} .resultWrap .btn-align {margin-left:0px; } .resultWrap .item-pc{display:none;} .resultWrap.my {margin-top:0.65rem;} /* 상사별 */ .page-sangsa .usedcar{padding-top:0rem;} .page-sangsa .result-carlist.gallery li { border-radius:0px; } .result-carlist .auc-info .cn-manage, .result-carlist .auc-info .car-date, .result-carlist .car-info .car-exp {display:none;} .resultWrap button { padding:0 0.35rem; font-size:0.75rem; height:24px; } .resultWrap select {height:30px; border:0; background-position:calc(100% - 5px) ; background-size:auto 12px;} .resultWrap .align-wrap select {border:0;} .resultWrap button.consult-done {display:inline-block;} .page-consult .resultWrap {display:block; text-align:right; padding:0 8px; margin-top:-20px !important;} .result-carlist.gallery .car-info .infoBox {min-height:auto;} .result-carlist.gallery .auc-info .car-select {width:auto; } .result-carlist > li .check-area } @media screen and (max-width:650px){ .result-carlist > li { padding-bottom:0px; padding-top:0px; padding-left:0; border-top:5px solid #f1f1f1} .result-carlist > li:first-child {border-top:0;} .result-carlist > li .check-area {position:absolute; left:6px; top:6px; margin-top:0px; } .result-carlist .car-hash {height:auto; padding:0; margin:0; display:none; } .result-carlist > li > .car-info .title { margin-top:1rem; } .result-carlist .car-info .car-desc {font-size:12px; margin-top:4px; } .result-carlist .car-info .car-desc em { margin:0px 6px 0; width:2px; height:2px; } .result-carlist > li .img-wrap {width:120px;height:95px !important; vertical-align:top; border-radius:0 } .result-carlist .car-info { width:calc(100% - 120px); padding:0px 0 0 10px; vertical-align:top; } .result-carlist .car-info .infoBox { width:100%; } .result-carlist .auc-info {display:block; width:100%; text-align:left;padding-top:7px;} .result-carlist .auc-info .car-select {display:inline-block; vertical-align:top; margin-top:0; margin-left:5px;} .result-carlist .auc-info .price {display:inline-block;vertical-align:top; font-size:0.85rem; font-family:'Spoqa Han Sans' } .result-carlist .auc-info .price strong{font-size:1rem; } .result-carlist .car-select button {width:20px; height:20px; line-height:20px; margin-left:5px; } .result-carlist .car-select button.wish, .result-carlist .car-select button.vs { background-size:auto 16px; } .result-carlist.gallery li {width:calc(50% - 5px); margin-left:10px; margin-bottom:15px; } .result-carlist.gallery li:nth-child(2n+1) {margin-left:0; } .result-carlist.gallery li:nth-child(2n) {margin-left:10px; } .result-carlist.gallery > li .img-wrap {height:18rem !important;} .result-carlist.gallery > li > .car-info .title {margin:0 0 .3rem;} .result-carlist.gallery .car-info { padding:10px 18px 0;} .result-carlist.gallery .auc-info { padding:15px 0px 20px;} .result-carlist.gallery .car-badge { left:10px; top:10px; } .result-carlist.gallery .car-badge label {font-size:0.65rem; padding:0px 8px 0; height:18px; line-height:18px;} .result-carlist.gallery .car-select button {width:23px; height:23px; line-height:23px; margin-left:5px; } .result-carlist.gallery .car-select button.wish, .result-carlist.gallery .car-select button.vs { background-size:auto 21px; } .result-carlist.gallery .auc-info .price strong{font-size:1.25rem; } /* 상사별 */ .page-sangsa .result-carlist.gallery li {width:calc(50% - 5px); margin-left:10px ; margin-bottom:15px; } .page-sangsa .result-carlist.gallery li:nth-child(2n+1) {margin-left:0} .page-sangsa .result-carlist.gallery li:nth-child(2n) {margin-left:10px; } } @media screen and (max-width:580px){ .result-carlist.gallery .car-badge {display:block !important} .result-carlist > li > .car-info .title {margin-top:0.5rem;} .result-carlist > li > .car-info .title a {margin-top:0rem; font-size:0.85rem;} .result-carlist .car-info .car-desc {font-size:0.7rem;line-height:14px; margin-top:3px; } .result-carlist .car-info .car-desc em { margin:0px 5px 0; width:1px; height:1px; } .result-carlist.gallery > li > .car-info .title a {margin-top:3px; font-size:0.95rem;} .result-carlist.gallery .car-info .car-desc {font-size:0.75rem;line-height:15px;height:auto;} .result-carlist.gallery .car-info .car-desc em {margin:0px 5px 0; width:1px; height:1px; } /* .badge */ .badge-style {margin-right:2px; font-size:0.7rem;padding:0px 6px 0; height:20px; line-height:20px; ;} } @media screen and (max-width:460px){ .page-sangsa .resultWrap .count {width:80px;} .page-sangsa .resultWrap .align-wrap {width:calc(100% - 80px); display:inline-flex; flex-direction: row; justify-content: flex-end;padding-left:0; text-align:left;} .resultWrap select {border:0; width:auto; text-overflow: ellipsis;} .carList-Wrap { padding:0; } .result-carlist .img-wrap {border:0px solid #f00} .result-carlist.gallery li {border-radius:0px; } .result-carlist.gallery .img-wrap {border-radius:0; } .result-carlist.gallery li:after {display:none; } .result-carlist.gallery li .check-area {right:10px; top:10px !important; } .result-carlist.gallery li {width:100%; margin-left:0px !important; margin-bottom:20px; } .result-carlist.gallery .auc-info { padding:20px 0px 10px;} .page-sangsa .result-carlist.gallery li {width:100%; margin-left:0px !important; margin-bottom:20px; } .resultWrap.my select {width:auto;font-size:0.8rem; height:28px; line-height:26px;padding-left:0.4rem;padding-right:23px;background-position:calc(100% - 5px) ; } .resultWrap.my button{font-size:0.8rem; height:28px; line-height:26px;padding:0 0.5rem; } } @media screen and (max-width:390px){ .carList-Wrap { padding:0; } .resultWrap .align-wrap .item-pc {display:none !important; } .result-carlist.general > li .img-wrap {height:90px; } /* 상사별 */ .page-sangsa .resultWrap .align-wrap select {font-size:0.75rem;} } @media screen and (max-width:360px){ .result-carlist.gallery .car-info { padding:10px 10px 0;} } @media screen and (max-width:350px){ .page-sangsa .resultWrap .align-wrap .compare {font-size:0;width:20px;height:20px;margin:0; } .resultWrap .count {display:none;} .resultWrap .align-wrap {width:calc(100% - 35px)} .resultWrap .align-wrap select {padding-left:0 !important} } /*/////////////////////////////////////////////////////////////////////////////////////////*/ /* 차량상세페이지 ///////////////////////////////////////////////////////////////////////////////////////////*/ .page-detail .carN-top {display:none; } .slideWrap {padding-top:240px;position:relative; width:1200px; margin:0 auto; } .slideWrap .detail-headInfo { position:absolute; left:0; top:100px;height:140px; width:100%; display:flex; flex-direction: row; justify-content: space-between;align-items: center; } .slideWrap .detail-headInfo .infoWrap {display:inline-block; width:calc(100% - 350px); } .slideWrap .detail-headInfo .label-area {position:relative;display:block; font-size:0; } .slideWrap .detail-headInfo .label-area label {display:inline-block; vertical-align:top; background-color:var(--txt-default); color:#fff; width:auto; border-radius:6rem; height:24px; line-height:24px; padding:0 0.85rem;margin-right:5px; font-size:0.75rem; font-weight:500; letter-spacing:-.07em; } .slideWrap .detail-headInfo .car-title {font-size:1.7rem; line-height:1.9rem; margin-top:10px; color:#222; letter-spacing:-.06em;} .slideWrap .detail-headInfo .car-desc {font-size:0.938rem; line-height:0.938rem; letter-spacing:-.07em; color:#666; font-weight:500; margin-top:0.85rem; letter-spacing:0 ; font-family:'Spoqa Han Sans';} .slideWrap .detail-headInfo .car-desc em {margin:3px 10px 0; } .slideWrap .detail-headInfo .priceBox { width:350px;font-size:0; padding-top:1.325rem; position:relative;} .slideWrap .detail-headInfo .priceBox .price{ display:inline-block;vertical-align:middle; text-align:right; padding-right:12px; width:calc(100% - 10rem);color:var(--txt-default); font-weight:bold; font-size:1.75rem; line-height:1.75rem;letter-spacing:-.06em; } .slideWrap .detail-headInfo .priceBox .price em { display:inline-block; margin-left:2px;margin-right:7px; font-size:75%; font-weight:500; } .slideWrap .detail-headInfo .priceBox .price button.all-calc {display:inline-block; margin-top:0.35rem; background-color:#fff; border:1px solid #ddd; border-radius:3rem; padding:0 0.85rem; height:28px; line-height:27px;font-size:0.85rem; font-weight:500; color:#666; } .slideWrap .detail-headInfo .priceBox .btn-consult { display:inline-block; vertical-align:middle; width:10rem; text-align:center;} .slideWrap .detail-headInfo .priceBox .btn-consult a{ display:block;background-color:var(--txt-default); color:#fff; font-size:1.25rem; font-weight:bold; border-radius:10rem; height:4.063rem; line-height:4.063rem; } .slideWrap .detail-headInfo .priceBox .s-txt {font-size:0.85rem !important; color:#777; font-weight:normal; margin-right:5px; font-family:'Spoqa Han Sans'; } .slideWrap .sellerInfo {position:relative; display:flex; flex-direction: row; justify-content: space-between; width:100%; background-color:#f2f3f4; height:60px; padding:0 1rem; border-radius: 0 0 12px 12px; } .slideWrap .sellerInfo .info-left {width:45%;padding:1rem 1rem 0 1rem; position:relative;} .slideWrap .sellerInfo .info-left button:first-child {margin-left:0} .slideWrap .sellerInfo .info-left button {display:inline-block;margin-left:1.45rem; padding-left:25px; font-size:0.855rem;font-weight:500;line-height:25px; text-align:center; background-size:auto 21px; background-position:left center; background-repeat:no-repeat; } .slideWrap .sellerInfo .info-left button.wish { background-image:url('/images/sub/ico_wish_off.png'); } .slideWrap .sellerInfo .info-left button.wish.on {background-image:url('/images/sub/ico_wish_on.png'); } .slideWrap .sellerInfo .info-left button.vs { background-image:url('/images/sub/ico_vs_off.png'); } .slideWrap .sellerInfo .info-left button.vs.on {background-image:url('/images/sub/ico_vs_on.png'); } .slideWrap .sellerInfo .info-left button.print { background-image:url('/images/sub/ico_print_off.png'); } .slideWrap .sellerInfo .info-left button.btn_sns { background-image:url('/images/sub/ico_sns.png'); } .slideWrap .sellerInfo .info-left button.print.on {background-image:url('/images/sub/ico_print_on.png'); } .slideWrap .sellerInfo .seller-right{width:55%; font-size:0.9rem; text-align:right; padding:1rem 1rem 0 0;} .slideWrap .sellerInfo .seller-right span {display:inline-block; margin-left:1rem; font-size:1.125rem; font-weight:500; color:#555 } .slideWrap .sellerInfo .seller-right span:first-child {margin-left:0} .slideWrap .sellerInfo .seller-right span.seller:before {content:''; display:inline-block; vertical-align:top; width:20px; height:20px;background:url('/images/sub/ico_call.png') no-repeat left ; background-size:auto 18px; } .slideWrap .sellerInfo .seller-right span.seller a { display:inline-block; font-weight:bold; color:var(--txt-default); margin-left:5px;font-size:105% } .slideWrap .sellerInfo .seller-right span.number {font-size:0.85rem; } .slideWrap .sellerInfo .seller-right span.number a {display:inline-block; margin-left:5px; height:1.75rem; line-height:1.75rem; padding:0 0.85rem; border-radius:6rem; background-color:#5491ff; color:#fff; font-weight:bold; } /* .detail-headInfo .auc-info li button:before {content:'';position:absolute;left:0;right:0;top:0;height:35px;background:rgba(255,255,255,.6); } .detail-headInfo .auc-info li button.on:before, .detail-headInfo .auc-info li.active button:before {display:none;} .detail-headInfo .auc-info li button.on:after, .detail-headInfo .auc-info li.active button:after {color:#37bdfc;} .detail-headInfo .auc-info li button.vs { background-image:url('/images/inc/ico_vs_off.png'); } .detail-headInfo .auc-info li button.vs.on { background-image:url('/images/inc/ico_vs_on.png'); } .detail-headInfo .auc-info li button.vs:after {content:'비교하기'; } .detail-headInfo .auc-info li button.share { background-image:url('/images/inc/ico_share_off.png'); } .detail-headInfo .auc-info li.active button.share { background-image:url('/images/inc/ico_share_on.png'); } .detail-headInfo .auc-info li button.share:after {content:'공유하기'; } .detail-headInfo .auc-info .shareWrap{position:relative;} .detail-headInfo .auc-info .socialBox{display:none;position:absolute;right:0;bottom:-70px; font-size:0;min-width:160px;width:max-content;height:auto;line-height:normal;padding:13px ;background:#fff;border:1px solid #949494; box-shadow: 7px 7px 15px -3px rgba(0, 0, 0, 0.15); border-radius:7px; text-align:center; z-index:30;transition: all 0.2s ease-in;} .detail-headInfo .auc-info .socialBox:before{clear:both;display:block;content:'';position:absolute;top:-10px;right:17px;width:21px;height:10px;background:url("/images/inc/social_box_arrow.gif") center 0 no-repeat; background-size:21px 10px; } .detail-headInfo .auc-info .socialBox a {display:inline-block; vertical-align:top; margin:0 4px; width:35px; height:35px; border-radius:5px; text-align:center; } .detail-headInfo .auc-info .socialBox a:before {content:''; display:inline-block; line-height:35px; font-size:20px;font-family:'xeicon';} .detail-headInfo .auc-info .socialBox a.fb {background-color:#3c7bd9; color:#fff; } .detail-headInfo .auc-info .socialBox a.fb:before { content:"\ebd3"; } .detail-headInfo .auc-info .socialBox a.kakao {background-color:#f2da00; color:#2d191a; } .detail-headInfo .auc-info .socialBox a.kakao:before { content:"\ebee"; font-size:22px ; } .detail-headInfo .auc-info .socialBox a.twitter {background-color:#1c9cea; color:#fff; } .detail-headInfo .auc-info .socialBox a.twitter:before { content:"\ec1f"; } .detail-headInfo .auc-info .shareWrap.active .socialBox{display:block;} */ .CDV_Topmenu.fixed{position:fixed; top:0; left:0; width:100%; margin-top:0 !important; z-index: 99; } @media screen and (max-width:1200px){ .slideWrap {width:100%; padding-top:210px; } .slideWrap .detail-headInfo{ top:70px; padding:0 5px; } .slideWrap .detail-headInfo .label-area label{ height:20px; line-height:20px; padding:0 0.75rem;margin-right:3px; font-size:0.715rem; } .slideWrap .detail-headInfo .car-title{font-size:1.563rem; line-height:1.8rem; margin-top:10px; } .slideWrap .detail-headInfo .car-desc{ margin-top:0.5rem; font-size:0.813rem; line-height:0.813rem; } .slideWrap .detail-headInfo .car-desc em {margin:3px 6px 0; } .slideWrap .detail-headInfo .priceBox {padding-top:0.85rem;} .slideWrap .sellerInfo {border-radius:0} .slideWrap .sellerInfo .info-left {padding-left:0} .slideWrap .sellerInfo .seller-right{ padding-right:0} } @media screen and (max-width:1024px){ .slideWrap .detail-headInfo {top:70px; height:140px;} .slideWrap .detail-headInfo .car-title{font-size:1.4rem; line-height:1.7rem; letter-spacing:-.06em;} } @media screen and (max-width:768px){ .slideWrap .detail-headInfo .car-title {font-size:1.438em; line-height:1.438rem;} .slideWrap .detail-headInfo .infoWrap { width:calc(100% - 300px);} .slideWrap .detail-headInfo .priceBox { width:300px; position:relative; } .slideWrap .detail-headInfo .priceBox .price{ font-size:1.438rem; line-height:1.438rem; } .slideWrap .detail-headInfo .priceBox .price .all-calc {margin-top:0.35rem; font-size:0.75rem; } .slideWrap .detail-headInfo .priceBox .btn-consult { width:9rem;} .slideWrap .detail-headInfo .priceBox .btn-consult a{ font-size:1.125rem; height:3.5rem; line-height:3.5rem; } } @media screen and (max-width:677px){ .page-detail {padding-bottom:80px;} .page-detail footer {display:none; } .page-detail a.go-back {display:none !important; } .slideWrap { padding-top:60px;position:relative;} .slideWrap .detail-headInfo {position:relative; top:auto; height:auto; padding:0 15px; margin-top:20px; flex-direction: column; } .slideWrap .detail-headInfo .infoWrap { width:100%;position:relative; } .slideWrap .detail-headInfo .car-title {font-size:1.188rem; line-height:1.5rem;font-weight:bold; } .slideWrap .detail-headInfo .car-desc { margin-top:0.85rem; font-size:0.813rem; line-height:0.813rem; color:#666} .slideWrap .detail-headInfo .priceBox { display:block; width:100% !important; margin-top:1rem; text-align:left; position:relative;} .slideWrap .detail-headInfo .priceBox .price { width:100%; text-align:left;font-size:1.563rem; line-height:1.563rem;position:relative; } .slideWrap .sellerInfo { background-color:transparent;padding:0; } .slideWrap .sellerInfo .info-left { width:94%; text-align:right; position:absolute; margin-top:-45px;padding:0; z-index:0} .slideWrap .sellerInfo .info-left button {font-size:0; margin-left:0.85rem;} .slideWrap .sellerInfo .seller-right {text-align:center; border:1px solid #d1d7e0; border-radius:10px;width: 96%;height:auto;padding:1rem 0; display:block; margin:0 auto; } .slideWrap .sellerInfo .info-left button.wish {z-index:10} .slideWrap .sellerInfo .info-left button.btn_sns {background-size:auto 27px;} /* 모바일 하단 고정버튼 */ .slideWrap .detail-headInfo .priceBox .price button.all-calc {position:fixed; width:50%; bottom:0; left:0; z-index:332; height:3.75rem; line-height:3.75rem; border-radius:0; font-size:1.1rem; border:0; background-color:#444; color:#fff; font-weight:bold ; } .slideWrap .detail-headInfo .priceBox .btn-consult a{position:fixed; width:50%; bottom:0; right:0; z-index:332; height:3.75rem; line-height:3.75rem; font-size:1.1rem; border-radius:0rem; } } @media screen and (max-width:360px){ .slideWrap .sellerInfo .seller-right {height:5.3rem;} .slideWrap .sellerInfo .seller-right span {display:block; margin-left:0rem; } .slideWrap .sellerInfo .seller-right span.number {margin-top:0.35rem; } } #detail-cont {display:block; position:relative;} .detailWrapper {position:relative; display:block; width:100%} .carDetail-wrap {display:inline-block;position:relative; vertical-align:top; width:100%; margin-top:3rem; } .carDetail-wrap .column { margin:1.2rem 0 4rem} /* 차량상세정보 */ .car-detail-inner {position:relative; z-index:0;display:block; margin:0; padding:0;} .car-detail-inner h2.title {display:block; clear:both;position:relative;font-size:1.313rem; line-height:1.313rem; color:#111; padding:50px 0 15px;letter-spacing:-.06em; font-weight:500; } .car-detail-inner h2.title span {display:inline-block; margin-left:5px; font-size:80%; color:#888} .car-detail-inner h2.title:first-child {padding-top:0} .car-detail-inner h2.title a.btn-more {position:absolute; right:5px; bottom:0rem; font-size:0.98rem; font-weight:500; color:var(--txt-dark-grey); font-family:'Spoqa Han Sans'; } .car-detail-inner h2.title a.btn-more:after {content:"\e93f"; display:inline-block; vertical-align:top; margin-top:0.5px;font-family:'xeicon'; font-size:1.4rem; } .car-detail-inner h2.title .txt-link {display:inline-block; margin-left:1rem; font-size:0.9rem; color:#777; } .car-detail-inner h2.title .txt-link i {text-decoration:underline; color:#000 } .car-detail-inner h2.title .btn-pop {position:absolute; right:0; bottom:5px;height:2.813rem; line-height:2.8rem; padding:0 1.3rem; border-radius:5px ; border:1px solid #ddd; font-size:0.95rem; font-weight:500; color:#333; } .car-detail-inner h2.title .btn-pop:hover {border-color:var(--txt-default); background-color:var(--txt-default); color:#fff;} .btn-pop2 {position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); width:360px; height:2.813rem; line-height:2.8rem;text-align:center; border-radius:2px ; border:0px solid #ddd; font-size:0.95rem; font-weight:500; background-color:#888; color:#fff !important; } .btn-pop2:hover {background-color:var(--txt-default); color:#fff !important;} .car-detail-inner h2.title a.info{display:inline-block; vertical-align:top; margin-top:0px; margin-left:8px; position:relative;text-align:center; width:20px; height:20px; border-radius:25px; background-color:#fff; border:1px solid #aaa; } .car-detail-inner h2.title a.info:before {content:"?"; display:inline-block; vertical-align:top; font-family:'Roboto'; font-size:14px; line-height:20px; color:#555; } .car-detail-inner h2.title a.info + div.expLayer {display:none;position:absolute;left:110px; top:-10px; width:50%;padding:15px 15px;border:1px solid #ccc; border-radius:7px; background:#fff;font-size:13px; color:#777; line-height:1.3em; text-align:left; box-shadow:1px 1px 10px rgba(0,0,0,.1);z-index:1;} .car-detail-inner h2.title a.info + div.expLayer:after {content:'';position:absolute;left:-6px;top:14px;width:10px;height:10px;border-width:0 0 1px 1px;border-color:#999;border-style:solid;background:#fff;z-index:2;transform:rotate(45deg);} .car-detail-inner h2.title a.info:hover + div {display:block;} /* 차량정보 */ .car-detail-inner p.txt-exp { display:block; font-size:15px; color:#666; line-height:1.4em; } .car-detail-inner .detail-info01 {display:block; background-color:#fff; padding:20px 20px 20px 30px; border-radius:8px; background-color:#f6f8fa; } .car-detail-inner .detail-info01 ul{font-size:0;} .car-detail-inner .detail-info01 ul li {display:inline-block; vertical-align:top; width:20%; line-height:1.3em; font-size:1rem; margin:1rem 0;color:#888;font-weight:500;} .car-detail-inner .detail-info01 ul li p {display:block; margin-top:8px; font-size:102%; line-height:1.3em; color:#222; letter-spacing:-.02em} @media screen and ( max-width:1024px ) { .carDetail-wrap .column { margin:0.85rem 0 2rem} .car-detail-inner .detail-info01 { padding:1rem; border-radius:5px; margin-bottom:3rem; } .car-detail-inner .detail-info01 ul li { width:25%;} .car-detail-inner h2.title { font-size:1.125rem; line-height:1.125rem; padding:40px 0 15px; font-weight:bold;} } @media screen and ( max-width:677px ) { .page-detail .carN-top {display:block; position:absolute; top:0; left:60px; width:calc(100% - 120px); height:3.75rem; line-height:3.75rem; text-align:center; font-size:1.25rem; font-weight:bold; color:#333; letter-spacing:0; z-index:333} .carDetail-wrap .column { margin:0.5rem 0 1.3rem} .car-detail-inner .detail-info01 ul li { width:33.3%;margin:0.85rem 0;} .car-detail-inner h2.title {padding-left:10px; padding-right:10px;} .car-detail-inner h2.title .btn-pop { bottom:8px; right:10px;height:1.875rem; line-height:1.87rem; padding:0 0.9rem;font-size:0.75rem; } .car-detail-inner p.txt-exp {padding:0 10px;} .btn-pop2 { height:2.5rem; line-height:2.5rem; width:80%;padding:0 0.65rem; font-size:0.85rem;} } @media screen and ( max-width:500px ) { .page-detail .carN-top { font-size:1.185rem;} .car-detail-inner .detail-info01 ul li { width:50%;} .car-detail-inner .detail-info01 ul li {font-size:0.85rem; } .carDetail-wrap { margin-top:0 !important; } .carDetail-wrap .column { margin:0.5rem 0 1rem} .car-detail-inner h2.title a.btn-more { right:0px; bottom:0.65rem; font-size:0.765rem; } } @media screen and ( max-width:320px ) { .car-detail-inner .detail-info01 ul li {font-size:0.85rem; } .car-detail-inner .detail-info01 ul li p {margin-top:0.35rem;} } .detail-quickinfo {display:flex; margin:.5rem 0 2rem;} .detail-quickinfo .box {position:relative;flex:1;padding:2rem 14rem 2rem 2rem;background:#f2f3f4;border-radius:8px;} .detail-quickinfo .box:first-child {margin:0 .5rem 0 0;} .detail-quickinfo .box h3 {font-size:1.2rem;letter-spacing:-.08rem;} .detail-quickinfo .box p {padding:.5rem 0 0;font-size:.9rem;letter-spacing:-.07rem;} .detail-quickinfo .box .button {position:absolute;right:2rem;top:2rem;width:10rem;height:2.8rem;border-radius:2px;background:#fff;border-color:var(--txt-default);color:var(--txt-default);font-size:.95rem;letter-spacing:-.07rem;} .detail-quickinfo .box .button:hover {background:var(--txt-default);color:#fff;} .detail-quickinfo .box .button[disabled] {border:0;background:#eee !important;color:#fff !important; cursor:default; } @media screen and ( max-width:800px ) { .detail-quickinfo {padding:0 2%;} .detail-quickinfo .box {padding:0;background:transparent;} .detail-quickinfo .box h3, .detail-quickinfo .box p {display:none;} .detail-quickinfo .box .button {position:relative;right:auto;top:auto;width:100%;height:3rem;border-radius: 10px;} } @media screen and ( max-width:360px ) { .detail-quickinfo {padding:1.5rem 2%;} } /* 차량옵션 */ .car-detail-inner .carOption {display:block; } .car-detail-inner .carOption ul { padding:0px; font-size:0;text-align:center; width:100%; } .carOption ul li {display:inline-block; vertical-align:top; width:16.6%; margin-bottom:2rem;} .carOption ul li figure {display:inline-block; width:150px; height:150px; background-size:auto 4.375rem; background-position:center 30%; background-repeat:no-repeat; transition: all 0s ease-in; border-radius:30px; background-color:#f8f8f8 } .carOption ul li figure.option1 {background-image:url('/images/optionParts/sub_icon1.png'); } .carOption ul li figure.option2 {background-image:url('/images/optionParts/sub_icon2.png');} .carOption ul li figure.option3 {background-image:url('/images/optionParts/sub_icon3.png');} .carOption ul li figure.option4 {background-image:url('/images/optionParts/sub_icon4.png');} .carOption ul li figure.option5 {background-image:url('/images/optionParts/sub_icon5.png');} .carOption ul li figure.option6 {background-image:url('/images/optionParts/sub_icon15.png');} .carOption ul li figure.option7 {background-image:url('/images/optionParts/sub_icon16.png');} .carOption ul li figure.option8 {background-image:url('/images/optionParts/sub_icon8.png');} .carOption ul li figure.option9 {background-image:url('/images/optionParts/sub_icon9.png');} .carOption ul li figure.option10 {background-image:url('/images/optionParts/sub_icon10.png');} .carOption ul li figure.option11 {background-image:url('/images/optionParts/sub_icon11.png');} .carOption ul li figure.option12 {background-image:url('/images/optionParts/sub_icon12.png');} .carOption ul li figure.option13 {background-image:url('/images/optionParts/sub_icon13.png');} .carOption ul li figure.option14 {background-image:url('/images/optionParts/sub_icon14.png');} .carOption ul li figure p {font-size:0.915rem; color:#999; font-weight:500; margin-top:6.25rem; letter-spacing:-.08rem} .carOption ul li.active figure { background-color:#f2f6fe} .carOption ul li.active figure p {color:var(--txt-default)} .carOption ul li.active figure.option1 {background-image:url('/images/optionParts/sub_icon1_on.png');} .carOption ul li.active figure.option2 {background-image:url('/images/optionParts/sub_icon2_on.png');} .carOption ul li.active figure.option3 {background-image:url('/images/optionParts/sub_icon3_on.png');} .carOption ul li.active figure.option4 {background-image:url('/images/optionParts/sub_icon4_on.png');} .carOption ul li.active figure.option5 {background-image:url('/images/optionParts/sub_icon5_on.png');} .carOption ul li.active figure.option6 {background-image:url('/images/optionParts/sub_icon15_on.png');} .carOption ul li.active figure.option7 {background-image:url('/images/optionParts/sub_icon16_on.png');} .carOption ul li.active figure.option8 {background-image:url('/images/optionParts/sub_icon8_on.png');} .carOption ul li.active figure.option9 {background-image:url('/images/optionParts/sub_icon9_on.png');} .carOption ul li.active figure.option10 {background-image:url('/images/optionParts/sub_icon10_on.png');} .carOption ul li.active figure.option11 {background-image:url('/images/optionParts/sub_icon11_on.png');} .carOption ul li.active figure.option12 {background-image:url('/images/optionParts/sub_icon12_on.png');} .carOption ul li.active figure.option13 {background-image:url('/images/optionParts/sub_icon13_on.png');} .carOption ul li.active figure.option14 {background-image:url('/images/optionParts/sub_icon14_on.png');} .carOption .plusOption {display:block; margin-top:1rem; text-align:center; } .carOption .plusOption a {display:inline-block; height:2.813rem; line-height:2.810rem; padding:0 2rem; border:1px solid #ddd; border-radius:9rem; font-size:1rem; font-weight:500; color:#333; } .carOption .plusOption a:after {content:''; display:inline-block; vertical-align:top; margin-left:5px; width:20px; height:2.75rem; background:url('/images/ico_plus.png') no-repeat center ; background-size:auto 0.85rem;} @media screen and ( max-width:1024px ) { .carOption ul {padding:0} .carOption ul li {margin-bottom:1rem} .carOption ul li figure {width:130px; height:130px; background-size:auto 3.75rem; } .carOption ul li figure p {font-size:0.85rem;margin-top:5.5rem; } .carOption .plusOption a { height:2.188rem; line-height:2.188rem; padding:0 1.3rem; font-size:0.85rem; } .carOption .plusOption a:after { margin-left:3px; width:20px; height:2.18rem; background-size:auto 0.65rem;} } @media screen and ( max-width:870px ) { .carOption ul li {width:25%; margin-bottom:0.65rem} } @media screen and ( max-width:667px ) { .car-detail-inner .carOption {padding: 0 10px;} .carOption ul li figure {width:120px; height:120px; background-size:auto 3.05rem; } .carOption ul li figure p {font-size:0.85rem;margin-top:4.1rem; } } @media screen and ( max-width:530px ) { .carOption ul {display:flex; width:100%; flex-direction: row; align-items: stretch; flex-wrap: wrap; justify-content: space-between; gap:0.5rem } .carOption ul li {width:31%; margin-bottom:0.15rem; padding:0rem;} .carOption ul li figure { width:100%; height:100%; padding:1.5rem 0; border-radius:20px;} .carOption ul li figure p {font-size:0.75rem;margin-top:3rem; } } @media screen and ( max-width:360px ) { .carOption ul li figure { padding:1rem 0} } .carOption ul li.tip {position:relative;} .carOption ul li.tip div {display:none;position:absolute;width:100%;padding:15px 15px;border:1px solid #999;background:#fff;font-size:17px;box-shadow:1px 1px 10px rgba(0,0,0,.1);z-index:1;} .carOption ul li.tip div img {width:100%;height:auto;} .carOption ul li.tip div:after {content:'';position:absolute;left:15px;top:-6px;width:10px;height:10px;border-width:0 0 1px 1px;border-color:#999;border-style:solid;background:#fff;z-index:2;transform:rotate(135deg);} .carOption ul li.tip div strong {display:inline-block;padding:5px 0;font-weight:bold;font-size:16px;} .carOption ul li.tip div p {color:#888;font-size:14px;font-weight:normal;} .carOption ul li.tip:hover + div {display:block;} .carOptD { width:100%; } .carOptD th {text-align:center; padding:10px 0 5px; background-color:#f5f5f5;} .carOptD td, .carOptD th {border-right:1px solid #eaeaea !important; } .carOptD td{vertical-align:top;padding:20px; text-align:left; } .carOptD i{display:block;line-height:1.5em;font-size:1rem;color:#ddd; font-weight:300; cursor:pointer; letter-spacing:-.06em;} .carOptD i.active{color:#333; font-weight:500} .carOptD i.tip {padding-left:0;} .carOptD i.tip + div {display:none;position:absolute;width:50% ; left:50%; top:50%; transform: translate(-50%,-50%); padding:15px 15px;border:1px solid #ddd; border-radius:5px; background:#fff;font-size:17px;box-shadow:5px 5px 10px rgba(0,0,0,.06);z-index:1;} .carOptD i.tip + div img {width:100%;} .carOptD i.tip + div:after { display:none; content:'';position:absolute;left:15px;top:-6px;width:10px;height:10px;border-width:0 0 1px 1px;border-color:#ddd;border-style:solid;background:#fff;z-index:2;transform:rotate(135deg);} .carOptD i.tip + div strong {display:inline-block;padding:5px 0;font-weight:bold;font-size:16px;} .carOptD i.tip + div p {color:#888;font-size:14px;font-weight:normal;} .carOptD i.tip:hover + div {display:block;} /* .carOptD.hide{display:none;}*/ .car-detail-inner .basic_T {border-right:0px solid #eaeaea} .carOptD h2.option-title {display:block; font-size:1.3rem; color:#333; margin:1.5rem 0; border-top:1px dashed #ddd; padding:2rem 0 0 } .carOptD h2.option-title:first-child {border:0;padding-top:0; margin-top:1rem; } .carOptD ul {font-size:0; } .carOptD ul li {display:inline-block; vertical-align:top; width:25%; margin:0.65rem 0 } @media screen and ( max-width:1024px ) { .carOptD i{font-size:0.95rem;} .carOptD ul li { width:33.3%; margin:0.45rem 0 } } @media screen and ( max-width:667px ) { .carOptD ul li { width:50%; margin:0.25rem 0 } .carOptD i.tip + div { width:80% ; } } @media screen and ( max-width:460px ) { .carOptD i{font-size:0.85rem; letter-spacing:-.1em;} } @media screen and ( max-width:360px ) { .carOptD i{font-size:0.75rem;} } /* 차량설명 */ .carDetail-wrap .car-exp { background-color:#f6f8fa; border-radius:8px;padding:40px; font-size:1rem; line-height:1.5rem; color:#444; min-height:150px; } .carDetail-wrap .car-exp.disable:after { content:'차량설명이 없습니다.'; display:block; width:100%; text-align:center; line-height:300px; font-size:1rem; color:#888; font-weight:500; } /* 판매자정보 */ .carDetail-wrap .dealerInfo { background-color:#f6f8fa; border-radius:12px; padding:2rem 1rem 2rem 4rem; font-size:0; display:flex; flex-direction: row;justify-content: space-between;align-items: center; width:100%; } .carDetail-wrap .dealerInfo .profile-img { width:120px; height:155px; background-color:#fff; border:1px solid #e5e6e9; background-color:#fff; border-radius:5px; overflow:hidden; background-repeat:no-repeat; background-position:center 0; background-size:cover; } .carDetail-wrap .dealerInfo .profile-info {width:calc(100% - 120px); padding-left:3rem; font-size:0; } .carDetail-wrap .dealerInfo .profile-info li { display:inline-block; width:50%; vertical-align:top; font-size:1rem; color:#a3a4a6; font-weight:500; margin:0.65rem 0; } .carDetail-wrap .dealerInfo .profile-info li span {display:inline-block;vertical-align:top; } .carDetail-wrap .dealerInfo .profile-info li span:first-child {width:120px; } .carDetail-wrap .dealerInfo .profile-info li span:first-child + span {color:#000; width:calc(100% - 120px)} /* 보증정보 */ .carDetail-wrap .w-info { } .carDetail-wrap .w-info h3.tit1 { font-size:1.063rem; font-weight:bold; color:var(--txt-default); line-height:1.8rem; margin-top:1.5rem; } .carDetail-wrap .w-info h3.tit1:first-child {margin-top:0} .carDetail-wrap .w-info p.txt1 {margin-top:0.5rem; font-size:1rem; color:#777; line-height:1.8rem; font-weight:500; } .carDetail-wrap .w-info .noteBox {margin:1rem 0 0; border-radius:8px; padding:2rem 3rem; background-color:#f5f6f7} .carDetail-wrap .w-info .noteBox p {font-size:0.95rem; color:#666; line-height:1.4rem; margin:0.65rem 0; font-weight:500; } .carDetail-wrap .w-info .noteBox p.note{color:var(--txt-light-blue)} .carDetail-wrap .w-info .noteBox p.note:before {content:''; display:inline-block; vertical-align:top; margin-right:3px; width:21px; height:21px; background:url(/images/ico_note_blue.png) no-repeat center ; background-size:cover; } /* 동급 차량 */ .sameCar {overflow:hidden; position:relative; margin-top:1.2rem; margin-left:-0.65rem; margin-right:-0.65rem; } .sameCarlist .car_list_item {border:1px solid #e9edf3 ; box-shadow:7px 7px 10px -5px rgba(0,0,0,0.03);} .sameCarlist .car_list_item figure { height:180px; } @media screen and ( max-width:1024px ) { /* 차량설명 */ .carDetail-wrap .car-exp {padding:1.3rem; } /* 판매자정보 */ .carDetail-wrap .dealerInfo { border-radius:8px; padding:1.5rem 0.9rem 1.5rem 2rem; } .carDetail-wrap .dealerInfo .profile-img { width:110px; height:130px;} .carDetail-wrap .dealerInfo .profile-info {width:calc(100% - 110px); padding-left:1.5rem; } .carDetail-wrap .dealerInfo .profile-info li { font-size:0.9rem; margin:0.45rem 0; } .carDetail-wrap .dealerInfo .profile-info li span:first-child {width:100px; } .carDetail-wrap .dealerInfo .profile-info li span:first-child + span { width:calc(100% - 100px)} /* 동급 차량 */ .sameCarlist {margin-left: 0; margin-right: 0;padding: 0 1rem; } .sameCarlist .slick-list{overflow: visible;} .sameCarlist li.car_list_item {margin:0 5px 10px; } } @media screen and ( max-width:798px ) { /* 판매자정보 */ .carDetail-wrap .dealerInfo { padding:1.1rem 0.6rem 1.1rem 1.3rem; } .carDetail-wrap .dealerInfo .profile-img { width:90px; height:110px;} .carDetail-wrap .dealerInfo .profile-info {width:calc(100% - 90px); padding-left:0.8rem; } .carDetail-wrap .dealerInfo .profile-info li { display:inline-block; width:50%; font-size:0.85rem; margin:0.35rem 0; } .carDetail-wrap .dealerInfo .profile-info li span:first-child {width:80px; } .carDetail-wrap .dealerInfo .profile-info li span:first-child + span { width:calc(100% - 80px)} } @media screen and ( max-width:677px ) { /* 차량설명 */ .carDetail-wrap .car-exp { padding:1rem; font-size:0.85rem; line-height:1.5em; } .carDetail-wrap .car-exp.disable:after { line-height:150px; font-size:0.85rem; } /* 판매자정보 */ .carDetail-wrap .dealerInfo {padding:2rem 1rem; align-items: flex-start; } .carDetail-wrap .dealerInfo .profile-img {margin-top:0.5rem;} .carDetail-wrap .dealerInfo .profile-info { padding-left:1rem; } .carDetail-wrap .dealerInfo .profile-info li { display:block; width:100%; } .carDetail-wrap .w-info {padding:0 10px;} .carDetail-wrap .w-info h3.tit1 { font-size:1rem; font-weight:bold; color:var(--txt-default); line-height:1.2rem; margin-top:1.5rem; } .carDetail-wrap .w-info p.txt1 {margin-top:0.5rem; font-size:0.85rem; line-height:1.4rem; } .carDetail-wrap .w-info .noteBox {margin:0.65rem 0 0; border-radius:5px; padding:1rem; } .carDetail-wrap .w-info .noteBox p {font-size:0.80rem; line-height:1.3rem; margin:0.35rem 0;} .carDetail-wrap .w-info .noteBox p.note:before {width:18px; height:18px; margin-top:0.2rem; } } @media screen and ( max-width:400px ) { .carDetail-wrap .dealerInfo {padding:1.3rem; flex-direction: column; justify-content: center;} .carDetail-wrap .dealerInfo .profile-img {margin:0 auto; width:120px; height:120px; border-radius:50%;} .carDetail-wrap .dealerInfo .profile-info {padding:0; width:100%; margin-top:0.65rem} .carDetail-wrap .dealerInfo .profile-info li { display:inline-block; width:50%; } .carDetail-wrap .dealerInfo .profile-info li span {display:block !important; width:100% !important;} .carDetail-wrap .dealerInfo .profile-info li span:first-child + span {margin-top:0.25rem;} } /* 차량비교 */ .compare-wrap { padding:20px 0;text-align:center;} .compare-wrap .basic_T {margin-top:5px; } .compare-wrap .basic_T tbody th, .compare-wrap .basic_T tbody td {padding:7.5px;margin:0; font-size:14px; line-height:1.3em; } .compare-wrap .basic_T tbody th, .compare-wrap .basic_T tbody tr {padding:0; margin:0; } .compare-wrap .t_normal {margin-top:5px; } .compare-wrap .t_normal tbody th, .compare-wrap .t_normal tbody td {padding:7.5px;margin:0; font-size:14px; line-height:1.3em; } .compare-wrap .t_normal tbody th, .compare-wrap .t_normal tbody tr {padding:0; margin:0; } .compare-wrap .th_tit i{display:block;width:100%;height:50px;margin-bottom:15px;background:url("/images/carDetail_view/vs_ico.png") 50% 50% no-repeat;} .compare-wrap .mid_tit {height:30px;padding:0;background:#555;color:#fff;} .compare-wrap .pic {padding:5px 0 0 !important;vertical-align:top;} .compare-wrap .pic p{position:relative;width:200px;margin:0 auto;height:120px;overflow:hidden;} .compare-wrap .pic p i{position:absolute;top:0;left:0;width:100%;height:100%;display:block;} .compare-wrap .pic p i.imgWrap img {overflow:hidden;width:100%;height:100%;object-fit:cover;}/* ie,엣지 외 다른브라우저위해 꼭 필요함 */ .compare-wrap .pic p a{position:absolute;top:0;right:0;display:block;height:18px;width:18px;background:url("/images/r_del.png") 0 0 no-repeat;} .compare-wrap .pic em{display:block;padding:5px 8px;font-weight:500;text-align:center;font-size:14px;color:#000;letter-spacing:-.5px;word-break:keep-all;} .compare-wrap .button-group { margin-top:20px; padding:0;text-align:center;} .compare-wrap .button-group button {width:150px;height:45px;font-size:14px; display:inline-block; margin-left:10px; } .compare-wrap .button-group button:first-child {margin-left:0; } .compare-wrap .btn-close { background-color:#444; color:#fff; } .compare-wrap .btn-close:hover { background-color:#111; color:#fff; } .compare-wrap .btn-print { background-color:#02b1e7; color:#fff; } .compare-wrap .btn-print:hover { background-color:#02b1e7; color:#fff; } @media screen and ( max-width:767px ) { .compare-wrap .pic p{ width:180px ; height:110px; } } @media screen and ( max-width:550px ) { .compare-wrap .pic {padding:0 !important;} .compare-wrap .pic p{ width:100%; height:90px; } }