/*================================================== html guide page 전용 ==================================================*/ .pg-guide-wrap {} .pg-guide-wrap h1.o-title {padding: 10px 20px; font-size: 2.4rem; font-weight: 800; color: #FFF; background: #DA291C;} .pg-guide-wrap h2.o-title {margin-bottom: 16px; padding: 0 0 8px; border-bottom: 1px solid #DA291C; font-size: 1.8rem; font-weight: 700; color: #DA291C;} .pg-guide-wrap h3.o-title { font-size: 1.4rem; font-weight: 600; color: #000;} .pg-guide-wrap .o-title-wrap {margin: 30px 0;} .pg-guide-wrap .o-title-wrap .title {font-size:32px; font-weight: 800; color:#000;} .pg-guide-wrap .o-title-wrap .text {font-size: 16px;} .pg-guide-wrap .o-section {position: relative;} .pg-guide-wrap .o-section + .o-section {margin: 60px 0 0;} .pg-guide-wrap .o-section > h2.o-title {padding:10px; font-size:2.4rem; color: #DA291C;} .pg-guide-wrap .o-section .o-text {margin: 0 0 4px; padding: 10px; font-size: 1.6rem; color: #EEE; letter-spacing: 0; background-color: #333;} .pg-guide-wrap .o-section .o-text p {margin: 4px 0;} .pg-guide-wrap .o-section .o-text p::before {content: '-'; margin-right: 8px;} .pg-guide-wrap .o-article {margin-bottom: 10px; padding:10px; border-radius: 10px; border: 1px solid #DDD;} .pg-guide-wrap .o-article.bg {background-color:#EEE;} .pg-guide-wrap .o-article > h3.o-title {margin: -10px -10px 20px; padding:20px; border-radius: 10px 10px 0 0; border-bottom:1px solid #DDD; background-color: #EEE;} .pg-guide-wrap .o-article.bg > h3.o-title {border-color: #FFF;} .pg-guide-wrap .o-article > p {margin:20px 0 10px 0; font-size:12px;} .pg-guide-wrap .o-item {margin-top: 10px;} .pg-guide-wrap .o-item > button {margin-right: 4px;} .pg-guide-wrap .dl-guide-font {display: flex; font-size: 1.1rem; letter-spacing: 0;} .pg-guide-wrap .dl-guide-font > div {flex: 0 0 auto; margin: 0 0 0 16px;} .pg-guide-wrap .dl-guide-font > div > dt {font-weight: 800;} .pg-guide-wrap .dl-guide-font > div > dt::after {content: ':'; margin: 0 10px;} .pg-guide-wrap .dl-guide-font > div > dd {display: flex; flex-direction: column;} .pg-guide-wrap .dl-guide-font > div > dd span {} .pg-guide-wrap .dl-guide-font > div > dd span strong {color: #DA291C;} .pg-guide-wrap .dl-guide-font > div > dd strong {color: #000;} /* 작업중, asis 소스 사용 예정 */ .temp-ready {padding: 50px; font-size: 1.8rem; font-weight: 700; text-align: center; background: #EEE;} /* 작업중-221013 */ .pg-guide-wrap .o-clause {position: relative; margin:30px 20px;} /*================================================== 회원 ==================================================*/ /* 회원/layout */ .ui-member {flex: 0 0 668px; width: 668px; margin: 0 auto;} /* 회원/커스텀 */ .ui-member .page-button-wrap {margin-top: 40px;} .ui-member .fieldset-wrap .title-wrap.h-3 {margin-bottom: 12px; padding-top: 12px; padding-bottom: 12px; border-bottom: 1px solid #dddd;} /* 회원/가입유형선택 ========== */ .ui-member .list-select-kind {display: flex; justify-content: space-between; align-items: stretch; margin: 0 -32px;} .ui-member .list-select-kind li {flex: 1; margin: 0 32px;} .ui-member .list-select-kind li a {display: block;} .ui-member .list-select-kind li a:focus dl {border: 2px solid #000;} .ui-member .list-select-kind dl {display: flex; flex-direction: column; padding: 76px 16px; border-radius: 8px; border: 1px solid #E0E0E0; text-align: center; background-color: #fff;} .ui-member .list-select-kind dl dt {text-indent: -9999em;} .ui-member .list-select-kind dl dt::after {content: ''; display: block; width: 84px; height: 84px; margin: 0 auto; background-repeat: no-repeat; background-position: center top; background-size: 100% auto;} .ui-member .list-select-kind dl dd {margin-top: 30px; font-size: 1.4rem; font-weight: 600;} .ui-member .list-select-kind dl dd strong {display: block; margin-top: 10px; font-size: 1.8rem; font-weight: 700; color: #DA291C;} /* 회원/가입유형선택 - 회원유형 */ .ui-member .list-select-kind dl dt.buyer::after {background-image: url('../images/MB/join-type-buyer.svg?ver=202610221000');} .ui-member .list-select-kind dl dt.seller::after {background-image: url('../images/MB/join-type-seller.svg?ver=202610221000');} /* 회원/가입유형선택 - 멤버십유형 */ .ui-member .list-select-kind dl dt.country.kor::after {background-image: url('../images/MB/membership-country-kor.svg?ver=202610221000');} .ui-member .list-select-kind dl dt.country.other::after {background-image: url('../images/MB/membership-country-other.svg?ver=202610221000');} /* 회원/가입완료 ========== */ .ui-member .member-finish {margin: 60px 0; text-align: center;} .ui-member .member-finish .cate {} .ui-member .member-finish .cate::before {content: ''; display: block; width:162px; height: 132px; margin: 0 auto; background-repeat: no-repeat; background-position: center top; background-size: 100% auto;} .ui-member .member-finish .cate.buyer::before {background-image: url('../images/MB/join-complete-buyer.svg?ver=202610221000');} .ui-member .member-finish .cate.seller::before {background-image: url('../images/MB/join-complete-seller.svg?ver=202610221000');} .ui-member .member-finish .text {margin-top: 40px; font-size: 2.4rem; color:#000;} .ui-member .member-finish .later-box {margin-top: 16px;} .ui-member .member-finish .later-box .btn-text.btn-line {border-color: #999; font-weight: 600; color: #999;} .member-join{background:#F5F6F8 url('../images/common/member-join.png?ver=202610221000') no-repeat 450px;border-radius:10px; padding:80px; font-size:1.6rem; color:#000} /* 회원/멤버십가입/가입유형선택 ========== */ .membership.accordion-wrap.box {padding: 0;} .membership.accordion-wrap.box .acc-item {transition: all .3s; padding: 30px 20px;} .membership.accordion-wrap.box .acc-item + .acc-item {margin-top: 10px;} .membership.accordion-wrap.box .acc-item .acc-header {flex-direction: row; justify-content: space-between; padding-top: 0; padding-bottom: 0;} .membership.accordion-wrap.box .acc-item .acc-header::after {width: 6px; height : 6px; background-size: auto;} .membership.accordion-wrap.box .acc-header .title {font-size: 2rem; color: #000; font-weight: 700;} .membership.accordion-wrap.box .acc-header .amount {font-size: 1.8rem; font-weight: 600; color: #DA291C;} .membership.accordion-wrap.box .acc-container {font-size: 1.4rem; color: #9E9E9E;} .membership.accordion-wrap.box .acc-item.is-active {} .membership.accordion-wrap.box .acc-item.is-active .acc-container {padding: 16px 0 0 0; border-top: none;} /* 회원/로그인 ========== */ .login-wrap {padding: 52px 80px; border-radius: 16px; border: 1px solid #E0E0E0; background-color: #FFF;} .login-wrap .logo {margin-bottom: 40px; text-align: center;} .login-wrap .logo span {width: 192px; height: 51px; text-indent: -9999em; background: url('../images/common/logo-login.png?ver=202610221000') no-repeat 0 0;} .login-wrap .fieldset-wrap {margin: 0;} .login-wrap .fieldset-wrap .form-mix > input {margin-left: 42px; font-weight: 600; color: #000;} .login-wrap .fieldset-wrap .form-mix > input::placeholder {font-weight: 600; color: #000;} .login-wrap .fieldset-wrap .form-mix > .form-bdr {background-color: transparent;} .login-wrap .login-id, .login-wrap .login-pw {background-repeat: no-repeat; background-size: 22px auto; background-position: 12px center;} .login-wrap .login-id {background-image: url('../images/MB/login-id.svg?ver=202610221000');} .login-wrap .login-pw {background-image: url('../images/MB/login-pw.svg?ver=202610221000');} .login-wrap .util-box {display: flex; justify-content: space-between; align-items: center; margin: 20px 0 40px; color: #000;} .login-wrap .util-box .choice-text-wrap {margin: 0;} .login-wrap .util-box .choice-text-wrap label {margin-top: 0; margin-bottom: 0;} .login-wrap .util-box ul {display: flex;} .login-wrap .util-box ul li {position: relative;} .login-wrap .util-box ul li + li {margin-left: 10px; padding-left: 10px;} .login-wrap .util-box ul li + li::before {content: ''; position: absolute; top: 50%; left: 0; height: 16px; margin-top: -8px; border-left: 1px solid #E8E8E9;} .login-wrap .page-button-wrap.column {border-top: none; margin-top: 40px; padding-top: 0;} /* 회원/아이디찾기/가입제안 ========== */ .suggest-join {margin: 20px 0; padding-top:20px; border-top:1px solid #E0E0E0;} .suggest-join .item {display:flex; justify-content: flex-end; align-items:center;} .suggest-join .item + .item {margin-top: 10px;} .suggest-join .item .text {color:#000;} .suggest-join .item .btn2 {margin-left: 20px;} /* 회원/아이디찾기/결과 ========== */ .find-info-text {} .find-info-text span {font-size: 2.0rem; color: #000;} .find-info-text span strong {font-weight: 700;} /* 회원/아이디비밀번호차기/결과 ========== */ .data-result {margin: 90px 0 90px; text-align:center;} .data-result .result-text {font-size:2.4rem; color:#000;} .data-result .result-text.lg {font-size:3.2rem; font-weight:700; color:#000;} .data-result dl {display:flex; justify-content:center; align-items:center; margin-top: 20px; font-size:1.4rem;} .data-result dl > dt::after {content:':'; margin-right: 5px;} /*================================================== 셀러매물등록 ==================================================*/ /* 공통/사진등록 ========== */ /* regist-visual-wrap */ .regist-visual-wrap {display: flex; align-items: stretch} .regist-visual-wrap .regist-box {flex: 1; display: flex; flex-direction: column; justify-content: space-between;} .regist-visual-wrap .regist-box .regist-thumb {margin-top: 0;} .regist-visual-wrap .regist-box .regist-thumb ul.list li {width: 20%;} .regist-visual-wrap .slide-box {flex: 0 0 auto; position: relative; width: 612px; /*;*/ margin-left: 24px;} .regist-visual-wrap .slide-box .swiper-slide {height: 392px;} .regist-visual-wrap .slide-box .swiper-slide a {display: block; height: 100%;} .regist-visual-wrap .slide-box .swiper-slide a .thumb {display: flex; justify-content: center; align-items: center; height: 100%;} .regist-visual-wrap .slide-box .swiper-slide a .thumb img {object-fit: cover; display: block; width: 100%; height: 100%;} .regist-visual-wrap2 {position: relative; } .regist-visual-wrap2 .regist-box {} .regist-visual-wrap2 .regist-box .title-wrap {width:50%;} .regist-visual-wrap2 .regist-box .regist-thumb.half {margin-top: 0; width:calc(50% - 6px);} /*221104*/ .regist-visual-wrap2 .regist-box .regist-thumb {margin-top: 0; overflow:hidden;} .regist-visual-wrap2 .regist-box .regist-thumb ul.list2 {margin:-6px;} /*221104*/ .regist-visual-wrap2 .regist-box .regist-thumb ul.list2 li {width: 10%; float:left; padding:6px; } .regist-visual-wrap2 .regist-box .regist-thumb ul.list2 li:nth-child(5) {margin-right:50%;} .regist-visual-wrap2 .regist-box .regist-thumb ul.list2 li:nth-child(10) {margin-right:50%;} .regist-visual-wrap2 .regist-box .regist-thumb ul.list2 li:nth-child(15) {margin-right:50%;} .regist-visual-wrap2 .regist-box .regist-thumb ul.list2 li:nth-child(20) {margin-right:50%;} .regist-visual-wrap2 .slide-box {position:absolute; top:70px; right:5px; width:612px; margin-left:10px;} /*221104*/ .regist-visual-wrap2 .slide-box .swiper-slide {height: 392px;} /* regist-thumb */ .regist-thumb {margin: 16px 0;} .regist-thumb ul.list {display: flex; flex-wrap: wrap; margin: -6px;} .regist-thumb ul.list li {padding: 6px; flex:1;} /*221102*/ /* 커스텀 */ .regist-thumb .inform-text-wrap:first-child {margin-top: 0;} /* 사진등록/마우스드래그 */ .add-file-box {flex: 1; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; position: relative; border-radius: 8px; border: 1px dashed #E0E0E0;} .add-file-box .dropzone {cursor: pointer;} .add-file-box .dz-default {opacity: 1; -ms-filter: none; filter: none; -webkit-transition: opacity 0.3s ease-in-out; -moz-transition: opacity 0.3s ease-in-out; -o-transition: opacity 0.3s ease-in-out; -ms-transition: opacity 0.3s ease-in-out; transition: opacity 0.3s ease-in-out;} .add-file-box .dz-default.dz-message {} .add-file-box .dz-default.dz-message .text-msg {display: block; padding-top: 84px; color: #999; text-align: center; background: url('../images/icon/form-dragable.png?ver=202610221000') no-repeat center 20px;} /* 셀러매물등록/사진동영상등록/동영상등록 ========== */ .regist-mov-wrap {} .regist-mov-wrap .cate-box {} .regist-mov-wrap .cate-box .choice-text-wrap {} .regist-mov-wrap .cont-box {border-top: 1px solid #E8E8E9;} .regist-mov-wrap .cont-box .title-box {margin-bottom: 8px;} .regist-mov-wrap .cont-box .title-box .title {font-size: 1.6rem; color: #000;} .regist-mov-wrap .cont-box .fieldset-wrap {margin: 20px 0;} .regist-mov-wrap .cont-box .fieldset-wrap .title-wrap {margin-top: 0;} .regist-mov-wrap .cont-box .fieldset-wrap .row {} .regist-mov-wrap .cont-box .fieldset-wrap .row dt {margin-bottom: 8px; color: #999;} .regist-mov-wrap .cont-box .fieldset-wrap .row dt label {font-size: 1.4rem; font-weight: 400; color: #999;} .regist-mov-wrap .cont-box .fieldset-wrap .row dd {} /* 셀러매물등록/완료 ========== */ .regist-step-final {width: 612px; margin: 56px auto 40px;} .regist-step-final .thumb-box {} .regist-step-final .thumb-box .thumb {display: block;} .regist-step-final .thumb-box .thumb img {width: 100%; border-radius: 10px;} /* 셀러매물등록/소유차량번호 입력 및 조회 ========== */ /* 등록방법 팁 */ .reg-tip-info {} .reg-tip-info ul {display: flex; margin: 0 -12px;} .reg-tip-info ul li {flex: 1; margin: 0 12px; padding: 24px; border-radius: 8px; border: 1px solid #E8E8E9; background-repeat: no-repeat; background-position: 24px 24px;} .reg-tip-info ul li .title {margin: 84px 0 8px; font-weight: 700; color: #000;} .reg-tip-info ul li .text {} /* 사진 */ .reg-tip-info.picture ul li.cate-1 {background-image: url('../images/sp/tip-info-ic-pic-1.png?ver=202610221000');} .reg-tip-info.picture ul li.cate-2 {background-image: url('../images/sp/tip-info-ic-pic-2.png?ver=202610221000');} .reg-tip-info.picture ul li.cate-3 {background-image: url('../images/sp/tip-info-ic-pic-3.png?ver=202610221000');} .reg-tip-info.picture ul li.cate-4 {background-image: url('../images/sp/tip-info-ic-pic-4.png?ver=202610221000');} .reg-tip-info.picture ul li.cate-5 {background-image: url('../images/sp/tip-info-ic-pic-5.png?ver=202610221000');} /* 영상 */ .reg-tip-info.mov ul li.cate-1 {background-image: url('../images/sp/tip-info-ic-mov-1.png?ver=202610221000');} .reg-tip-info.mov ul li.cate-2 {background-image: url('../images/sp/tip-info-ic-mov-2.png?ver=202610221000');} .reg-tip-info.mov ul li.cate-3 {background-image: url('../images/sp/tip-info-ic-mov-3.png?ver=202610221000');} .reg-tip-info.mov ul li.cate-4 {background-image: url('../images/sp/tip-info-ic-mov-4.png?ver=202610221000');} .reg-tip-info.mov ul li.cate-5 {background-image: url('../images/sp/tip-info-ic-mov-5.png?ver=202610221000');} /* 매물등록/1. 소유차량 번호 입력 및 조회/매물 등록 ========== */ /* 사진등록TIP */ .reg-tip-pic-ex {} .reg-tip-pic-ex ul {} .reg-tip-pic-ex ul li {display: flex; justify-content: space-between; align-items: center; padding: 24px 0; border-bottom: 1px solid #E8E8E9;} .reg-tip-pic-ex ul li:first-child {padding-top: 0;} .reg-tip-pic-ex ul li .info-box {display: flex; flex-direction: column;} .reg-tip-pic-ex ul li .info-box .title {margin-bottom: 8px; font-weight: 700; color: #DA291C;} .reg-tip-pic-ex ul li .info-box .text {} .reg-tip-pic-ex ul li .thumb-box {display: flex;} .reg-tip-pic-ex ul li .thumb-box .item {display: flex; margin-left: 8px;} /* 동영상등록TIP */ .reg-tip-pic-part {} .reg-tip-pic-part ul {} .reg-tip-pic-part ul li {padding: 24px 0; border-bottom: 1px solid #E8E8E9;} .reg-tip-pic-part ul li:first-child {padding-top: 0;} .reg-tip-pic-part ul li .info-box {margin-bottom: 16px;} .reg-tip-pic-part ul li .info-box .title {font-weight: 700;} /* 팝업/ */ .search-car-result { margin: 0 -20px; text-align: center;} .search-car-result .choice-text-wrap {margin: 0 0 24px;} .search-car-result .thumb-box {padding: 40px 0 0 0; border-top: 1px solid #ddd;} .search-car-result .text {margin-bottom: 16px; font-size: 1.6rem; font-weight: 700; color: #000;} .search-car-result .thumb-box .thumb {margin: 0 45px;} .search-car-result .thumb-box .thumb img {width: 100%;} /* 동영상업로드 방법 */ .reg-tip-mov {} .reg-tip-mov ul {display: flex; margin: 0 -20px;} .reg-tip-mov ul li {display: flex; flex-direction: column; justify-content: space-between; margin: 0 20px;} .reg-tip-mov ul li .info-box {display: flex; flex-direction: column; align-items: stretch; margin-bottom: 24px;} .reg-tip-mov ul li .info-box .step {margin-bottom: 4px; font-size: 1.2rem; font-weight: 800; color: #DA291C;} .reg-tip-mov ul li .info-box .title {margin-bottom: 12px; font-weight: 700; color: #000;} .reg-tip-mov ul li .info-box .text {} .reg-tip-mov ul li .thumb-box {padding: 16px; border-radius: 8px; background-color: #F5F6F8;} /*================================================== 내차사기 ==================================================*/ /* 내차사기/목록 ========== */ /* 내차사기/내차사는방법 */ .accordion-wrap.buy-user-guide {margin: 48px 0 56px;} .accordion-wrap.buy-user-guide .acc-header {justify-content: center; height: 80px; padding-left: 155px; background: rgb(217,40,27); background: linear-gradient(90deg, rgba(217,40,27,1) 0%, rgba(183,21,9,1) 100%);} .accordion-wrap.buy-user-guide .acc-header::before {content: ''; position: absolute; left: 30px; top:0; width: 105px; height: 100%; background: url('../images/BY/user-guide-bg.png?ver=202610221000') no-repeat center center;} .accordion-wrap.buy-user-guide .acc-header::after {opacity: 1; right: 36px; background-image: url('../images/icon/accordion-dw-white.png?ver=202610221000');} .accordion-wrap.buy-user-guide .acc-header .title {font-size: 2.4rem; font-weight: 400; color: #FFF;} .accordion-wrap.buy-user-guide .acc-header .title strong {font-weight: 700; color: inherit;} .accordion-wrap.buy-user-guide .acc-container {padding: 20px; background-color: #F5F6F8;} .buy-user-guide .list {display: flex; flex-wrap: wrap; align-items: stretch; margin: -16px;} .buy-user-guide .list li {flex: 0 0 calc(50% - 32px); margin: 16px; padding: 18px 18px 18px 98px; border-radius: 8px; background-color: #FFF; background-repeat: no-repeat; background-position: left 18px center;} .buy-user-guide .list li em {margin-bottom: 6px; font-size: 1.2rem; font-weight: 700; color: #DA291C;} .buy-user-guide .list li strong {margin-bottom: 6px;font-size: 1.6rem; font-weight: 700; color: #000;} .buy-user-guide .list li span {color: #999;} .buy-user-guide .list li.step-1 {background-image: url('../images/BY/guide-step-1.png?ver=202610221000');} .buy-user-guide .list li.step-2 {background-image: url('../images/BY/guide-step-2.png?ver=202610221000');} .buy-user-guide .list li.step-3 {background-image: url('../images/BY/guide-step-3.png?ver=202610221000');} .buy-user-guide .list li.step-4 {background-image: url('../images/BY/guide-step-4.png?ver=202610221000');} .buy-user-guide .list li.step-5 {background-image: url('../images/BY/guide-step-5.png?ver=202610221000');} .buy-user-guide .list li.step-6 {background-image: url('../images/BY/guide-step-6.png?ver=202610221000');} .buy-user-guide .list li.step-7 {background-image: url('../images/BY/guide-step-7.png?ver=202610221000');} /* 221025 추가 */ .buy-user-box {display:flex; justify-content: center; background-color:#F5F6F8; border-radius: 10px; padding:20px 25px; margin-bottom: 20px;} .buy-user-box dl {display:flex; width:100%;} .buy-user-box dl dt {position:relative; font-size:1.6rem; font-weight:600; color:#000; margin-right:20px; padding-left:30px; } .buy-user-box dl dt::before {content: ''; position: absolute; left: 0; top:0; width: 20px; height: 20px; background: url('../images/icon/title-speaker.png?ver=202610221000') no-repeat left center;} .buy-user-box dl dd {font-size:1.4rem; flex:1;} .buy-user-box dl dd ol {margin-left:60px;} .buy-user-box dl dd ol li {line-height:1.8;} .buy-user-box > .choice-text-wrap {display:inline-block; } .buy-user-box > .choice-text-wrap .text-value {font-size:1.6rem;} .buy-user-box > .choice-text-wrap input {width:450px; margin-right:10px; } .buy-user-box > .choice-text-wrap button {height: 60px; padding: 0 60px; font-size:1.6rem; border-color: #DA291C; color: #fff; background-color: #DA291C;} /* 내차사기/filter */ .accordion-wrap.filter .acc-item {border-bottom: 1px solid #000;} .accordion-wrap.filter .acc-item + .acc-item {margin-top: 10px;} .accordion-wrap.filter .acc-item .acc-header {padding-top: 12px; padding-bottom: 12px;} .accordion-wrap.filter .acc-item .acc-header .title {} .accordion-wrap.filter .acc-item .acc-header .btn-toggle {} .accordion-wrap.filter .acc-item > .acc-container {padding: 0 0 20px;} .accordion-wrap.filter .acc-item.is-active .acc-header .btn-toggle {} .accordion-wrap.filter .acc-item.is-active > .acc-container {} .accordion-wrap.filter .acc-container .accordion-wrap .acc-item {border-bottom: 0;} .accordion-wrap.filter .acc-container .acc-item .acc-header {display: inline-flex; flex-direction: row; align-items: center; padding-top: 12px; padding-bottom: 12px;} .accordion-wrap.filter .acc-container .acc-item .acc-header::after {top: 10px; right: initial; left: 8px; position: relative;} .accordion-wrap.filter .acc-container .acc-item .acc-header .title {font-size: 1.2rem; font-weight: 600;} .accordion-wrap.filter .acc-container .acc-item .acc-header .btn-toggle {} .accordion-wrap.filter .acc-container .accordion-wrap .acc-container {padding-bottom: 0;} .accordion-wrap.filter .filter-box.scroll {max-height: 260px;} .accordion-wrap.filter .filter-box .choice-text-wrap {margin-top:0} /* .accordion-wrap.filter .filter-box .choice-text-wrap label {margin-top: 4px; margin-bottom: 4px;} */ .accordion-wrap.filter .filter-box .btn-more {height: 28px; padding: 4px 20px 2px; border-radius: 2px; border: 1px solid #E0E0E0; font-weight: 600; color: #87899C; background-color: #FFF;} .accordion-wrap.filter .filter-box .btn-more::after {content: '+'; margin-left: 8px;} .accordion-wrap.filter .filter-box.scroll::-webkit-scrollbar {width:4px} .accordion-wrap.filter .filter-box.scroll::-webkit-scrollbar-thumb, .accordion-wrap.filter .filter-box.scroll::-webkit-scrollbar-track {border-radius: 4px;} .accordion-wrap.filter .filter-box.scroll::-webkit-scrollbar-thumb {background-color: #DA291C;} .accordion-wrap.filter .filter-box.scroll::-webkit-scrollbar-track {background-color:#E8E8E9;} /* 내차사기/상세보기 ========== */ /* 내차사기/상세보기/비쥬얼swiper */ .view-visual-wrap {display: flex; flex-direction: column; overflow: hidden;} .view-visual-wrap .model-info {width: 100%;} .view-visual-wrap .model-info .thumb-wrap {margin-right: 0; border-radius: 0;} .view-visual-wrap .model-info .swiper-button-prev.round, .view-visual-wrap .model-info .swiper-button-next.round {width:68px; height: 58px;} .view-visual-wrap .model-info .swiper-view-visual .swiper-pagination {display: flex; justify-content: center; align-items: center; position: static; z-index: initial; right: initial; bottom: initial; left:initial; width: initial; height: 48px; margin: 0 10px; padding: 0 30px; border-radius: 24px; color: #C1C1C1; background-color: rgba(0, 0, 0, .5);} /* 내차사기/상세보기/swiper/visual */ .swiper-view-visual {} /* 내차사기/상세보기/swiper/thumb */ .swiper-view-visual-thumb {padding: 0 50px; background-color: #000; max-width: 100%; width: 100%; box-sizing: border-box;} .swiper-view-visual-thumb .swiper-wrapper {height: 100px;} .swiper-view-visual-thumb .swiper-slide {justify-content:center; align-items:center; position: relative; float: left; opacity: .5; overflow: hidden; cursor: pointer; width: auto; height: 120px;} .swiper-view-visual-thumb .swiper-slide .thumb {display: flex; justify-content: center; align-items: center;} .swiper-view-visual-thumb .swiper-slide img {object-fit: cover; display: block; width: 100%; height: 100px;} .swiper-view-visual-thumb .swiper-slide-thumb-active {opacity: 1;} .swiper-view-visual-thumb .swiper-button-prev, .swiper-view-visual-thumb .swiper-button-next {display: flex; position: absolute; z-index: 1; top: initial; right: initial; bottom: 0; width: 50px; height: 100px; background-color: #000;} .swiper-view-visual-thumb .swiper-button-prev {left: 0;} .swiper-view-visual-thumb .swiper-button-next {right: 0;} .swiper-view-visual-thumb .swiper-button-prev::after, .swiper-view-visual-thumb .swiper-button-next::after {transform: rotate(360deg); font-size: 2.0rem; color: #FFF;} .swiper-view-visual-thumb .swiper-button-prev.swiper-button-disabled, .swiper-view-visual-thumb .swiper-button-next.swiper-button-disabled {opacity: 1;} .swiper-view-visual-thumb .swiper-button-prev.swiper-button-disabled::after, .swiper-view-visual-thumb .swiper-button-next.swiper-button-disabled::after {opacity: .5;} /*================================================== 바이어 마이페이지 ==================================================*/ /* 바이어 마이페이지/배송지관리 ========== */ .address-manage {margin: 56px 0 0;} .address-manage .address-item {display: flex; justify-content: space-between; padding: 44px 40px 40px; border-radius: 10px; border: 1px solid #E0E0E0; background-color: #FFF;} .address-manage .address-item + .address-item {margin-top: 20px;} .address-manage .address-item.is-active {background-color: #F5F6F8;} .address-manage .address-item .info-box {} .address-manage .address-item .info-box .title-box {display: flex; align-items: center;} .address-manage .address-item .info-box .title-box .title {font-size: 1.8rem; font-weight: 700; color: #000;} .address-manage .address-item .info-box .title-box .badge {height: 28px; margin-left: 8px; padding: 6px 16px; border-radius: 2px; border: 1px solid #FA3F20; font-size: 1.2rem; font-weight: 600; color: #DA291C} .address-manage .address-item .info-box .basic-box {display: flex; flex-direction: column; margin-top: 4px;} .address-manage .address-item .info-box .basic-box span {margin-top: 16px;} .address-manage .address-item .util-box {} .address-manage .address-item .util-box .btn2 {margin-left: 4px; border-radius: 6px;} .address-manage .address-item .util-box .btn-side {height: 36px; margin-left: 4px; padding: 0 20px; border-radius: 6px;} /* 커스텀 */ .address-manage .page-button-wrap {margin-top: 40px; padding-top: 0; border-top: none;} /* 마이페이지 공통/주문목록/진행상태 ========== */ .option-box {padding: 24px 20px; border-radius: 8px; background-color: #F5F6F8;} .option-box .state-box dl.dlist {} .option-box .state-box dl.dlist > .row {display: flex; align-items: baseline;} .option-box .state-box dl.dlist > .row > dt {flex: 0 0 100px; position: relative; margin-right: 20px; font-weight: 700;} .option-box .state-box dl.dlist > .row > dt::after {content: ''; position: absolute; right: 0; top: 0; height: 18px; border-left: 1px solid #E0E0E0;} .option-box .state-box dl.dlist > .row > dd {flex: 1;} /* 진행상태 */ .option-box .state-box .progress-wrap {display: flex; justify-content: space-between; align-items: center; color: #000;} .option-box .state-box .progress-wrap .title-box {flex: 1; display: flex; margin: 6px 0;} .option-box .state-box .progress-wrap .title-box .badge-order {margin-right: 8px;} .option-box .state-box .progress-wrap .side-box {} .option-box .state-box .progress-wrap .side-box .btn2, .option-box .state-box .progress-wrap .side-box .btn-side {height: 32px; padding: 0 12px; border-radius: 4px;} /* 만료일 */ .option-box .state-box .expiry-wrap {flex: 0 0 100%; width: 100%;} .option-box .state-box .expiry-wrap dl {font-size: 1.2rem; } .option-box .state-box .expiry-wrap dl > .row {display: flex; align-items: baseline;} .option-box .state-box .expiry-wrap dl > .row dt {margin-right: 4px; padding-left: 12px; color: #999; background: url('../images/icon/side-clock.png?ver=202610221000') no-repeat left center;} .option-box .state-box .expiry-wrap dl > .row dd {color: #000;} /* 배송정보 */ .option-box .state-box .delivery-info {} .option-box .state-box .delivery-info dl {} .option-box .state-box .delivery-info dl .row {display: flex; margin-top: 8px;} .option-box .state-box .delivery-info dl .row dt {margin-right: 8px; margin-left: 30px;} .option-box .state-box .delivery-info dl .row dt:first-child {margin-left: 0;} .option-box .state-box .delivery-info dl .row dt::before {content: '·'; margin-right: 4px;} .option-box .state-box .delivery-info dl .row dt::after {content: ':'; margin-left: 4px;} .option-box .state-box .delivery-info dl .row dd {} /* */ .option-box .upload-wrap {} .option-box .upload-wrap .choice-btn-wrap.check ul li {width: 146px;} /* qna */ .option-box .qna-wrap {margin-left: 120px;} .option-box .qna-wrap .fieldset-wrap {margin: 16px 0 0;} .option-box .qna-wrap dl .row {position: relative;} .option-box .qna-wrap dl .question dt {position: absolute; z-index: 2; left: 16px; top: 19px; font-size: 1.6rem; font-weight: 700; color: #000;} .option-box .qna-wrap dl .question .form-mix input {padding-left: 32px; font-weight: 700; color: #000;} .option-box .qna-wrap dl .question .form-mix .form-bdr {background-color: #FFF;} .option-box .qna-wrap dl .answer dt {font-size: 1px; text-indent: -9999em;} .option-box .qna-wrap dl .answer dt::before {content: ''; position: absolute; left: 8px; top: 14px; width: 10px; height: 10px; border: solid #999; border-width: 0 0 1px 1px;} .option-box .qna-wrap dl .answer dd {padding-left: 24px;} /* 주문내역목록/메모입력 ========== */ .regist-note {} .regist-note .fieldset-wrap.row {margin: 0;} .regist-note .fieldset-wrap.row > dl > .row > dt {flex: 0 0 auto; padding-right: 32px; font-weight: 700;} /*================================================== 경매 ==================================================*/ /* 경매/경매현황 ========== */ .auction-condition {display: flex; align-items: stretch; border-radius: 8px; border: 1px solid #E8E8E9; margin-bottom:70px;} /* 경매현황/이달의경매현황 */ .auction-condition .calendar-box {flex: 1;flex-direction: column; padding: 48px 56px; background-color: #F5F6F8;} .auction-condition .calendar-box .title-wrap.h-3 {margin-bottom: 16px; padding-bottom: 0; border-bottom: 0;} .auction-condition .calendar-box .inner-box {flex: 1; padding: 28px 40px; border-radius: 8px; background-color: #FFF;} /* 경매현황/실시간 경매가 있는 경우_221115 */ .auction-live {display:flex;text-align:center; flex-direction: column; margin-bottom:40px; border-radius: 8px; background:#000 url('../images/AU/bg_auction_live.png?ver=202610221000') center center no-repeat; padding:50px;} .auction-live .bubble-box {font-size:3.2rem; font-weight:600; color:#fff;} .auction-live .onair-wrap {width: 250px; height: 61px; margin: 30px auto 30px; background: url(../images/AU/auction-onair.png?ver=202610221000) no-repeat left top;} .auction-live .onair-wrap p {display: none;} .auction-live button.btn-livego {margin:auto; width:320px; height:52px; padding:15px 10px; font-size:1.6rem; font-weight:700; border-radius: 8px;} .auction-live.none, .auction-condition .schedule-box .info-wrap .detail-box dl .row.none, .auctiontab.none, .auction-condition .schedule-box.none, .auction-condition.none {display:none;} /* datepicker */ .auction-condition .calendar-box .inner-box .ui-datepicker {width: 100%; padding: 0; border: none;} .auction-condition .calendar-box .inner-box .ui-datepicker .ui-datepicker-header {} .auction-condition .calendar-box .inner-box .ui-datepicker .ui-datepicker-title {height: 40px; margin: 0 0 24px; padding: 8px 0; font-size: 2.0rem;} .auction-condition .calendar-box .inner-box .ui-datepicker .ui-datepicker-title .ui-datepicker-month {} .auction-condition .calendar-box .inner-box .ui-datepicker .ui-datepicker-title .ui-datepicker-year {font-weight: 400;} .auction-condition .calendar-box .inner-box .ui-datepicker .ui-datepicker-prev, .auction-condition .calendar-box .inner-box .ui-datepicker .ui-datepicker-next {width: 40px; height: 40px;} .auction-condition .calendar-box .inner-box .ui-datepicker thead th {height: 50px; font-size: 1.6rem;} .auction-condition .calendar-box .inner-box .ui-datepicker tbody td {padding: 4px 0;} .auction-condition .calendar-box .inner-box .ui-datepicker td .ui-state-default {width: 48px; height: 48px; line-height: 48px; font-size: 1.8rem; } .auction-condition .calendar-box .inner-box .ui-datepicker td .ui-state-highlight {position:relative; color: #DA291C; background-color:transparent;} /*예정경매*/ .auction-condition .calendar-box .inner-box .ui-datepicker td .ui-state-highlight:before {content:''; position:absolute; top:8px; right:5px; width:6px; height:6px; border-radius: 3px; background:#DA291c; } .auction-condition .calendar-box .inner-box .ui-datepicker td .ui-state-default.ui-state-active {color: #fff; background-color: #000; } /*오늘*/ .auction-condition .calendar-box .inner-box .ui-datepicker td.ui-datepicker-other-month {opacity: .1;} .auction-condition .calendar-box .title-box {margin-top:5px; } /* 경매현황/향후경매일정 */ .auction-condition .schedule-box {flex: 0 0 587px; padding: 48px 56px;} .auction-condition .schedule-box .title-wrap {display:flex; align-items:center; margin-top:5px; margin-bottom: 20px; padding-bottom: 0; border-bottom: 0;} .auction-condition .schedule-box .title-wrap.h-3 .title-box {margin:0;} .auction-condition .schedule-box .title-wrap.h-3 .title-box .title {font-weight: 400; color: #54585A;} .auction-condition .schedule-box .title-wrap.h-3 .d-day {height: 30px; padding: 0 16px; border-radius: 15px; background-color: #DA291C; font-size: 1.2rem; font-weight: 700; color: #fff; line-height: 30px;} .auction-condition .schedule-box .date-box {display: flex; justify-content: space-between; align-items: center; padding-bottom: 24px; border-bottom: 1px solid #000;} .auction-condition .schedule-box .date-box select {height: 32px; padding: 0 60px 0 0; border: none; font-size: 2.4rem; font-weight: 700; width:100%;} .auction-condition .schedule-box .info-wrap {} .auction-condition .schedule-box .info-wrap .state-box {margin-top:0px} .auction-condition .schedule-box .info-wrap .state-box .item {display: inline-flex; align-items: center; position: relative; height: 20px; margin: 3px 0; padding: 0 12px 0 24px; border-radius: 202px; border-width: 1px; border-style: solid; font-size: 1.1rem; font-weight: 700; line-height: 19px; background-color: #FFF;} .auction-condition .schedule-box .info-wrap .state-box .item::before {content:''; position: absolute; left: -2px; top: -3px; width: 24px; height: 24px; margin-right: 8px; border-radius: 24px; background-repeat: no-repeat; background-position: center center;} /* 경매/경매현황/상태 */ .auction-condition .schedule-box .info-wrap .state-box .item.ready {border-color: #32B71E; color: #32B71E;} .auction-condition .schedule-box .info-wrap .state-box .item.ready:before {background-color: #32B71E; background-image: url('../images/icon/auction-state-ready.png?ver=202610221000');} .auction-condition .schedule-box .info-wrap .state-box .item.waiting {border-color: #FC7600; color: #FC7600;} .auction-condition .schedule-box .info-wrap .state-box .item.waiting:before {background-color: #FC7600; background-image: url('../images/icon/auction-state-waiting.png?ver=202610221000');} .auction-condition .schedule-box .info-wrap .state-box .item.onair {border-color: #DA291C; color: #DA291C;} .auction-condition .schedule-box .info-wrap .state-box .item.onair:before {background-color: #DA291C; background-image: url('../images/icon/auction-state-onair.png?ver=202610221000');} .auction-condition .schedule-box .info-wrap .state-box .item.end {padding-left: 12px; border-color: #C1C1C1; color: #FFF; background-color: #C1C1C1;} .auction-condition .schedule-box .info-wrap .state-box .item.end:before {content: none;} /* 경매/경매일정이 없는 경우 */ .auction-ready {border-radius: 12px; margin-top:30px; padding:265px 80px 60px 80px; background:#2a2c2d url('../images/AU/img-auction-ready.png?ver=202610221000') no-repeat center top 70px; color:#fff; text-align:center;} .auction-ready strong {font-size:2.4rem; margin:25px 0;} .auction-ready p { font-size:1.6rem; font-weight:400; line-height:20px;} /* 경매/경매현황/상세정보 */ .auction-condition .schedule-box .info-wrap .detail-box {margin-top: 16px;} .auction-condition .schedule-box .info-wrap .detail-box dl {min-height:180px;} .auction-condition .schedule-box .info-wrap .detail-box dl .row {display: flex; align-items: baseline; height: 60px; padding: 20px 24px;} .auction-condition .schedule-box .info-wrap .detail-box dl .row + .row {margin-top: 0px;} .auction-condition .schedule-box .info-wrap .detail-box dl .row > dt {flex: 0 0 124px; position: relative; margin-right: 24px; font-weight: 700;} .auction-condition .schedule-box .info-wrap .detail-box dl .row > dt:after {content: ''; position: absolute; right: 0; top: 50%; height: 16px; margin-top: -8px; border-left: 1px solid #E0E0E0;} .auction-condition .schedule-box .info-wrap .detail-box dl .row > dd {flex: 1; font-size: 1.6rem; font-weight: 700; color: #000;} .auction-condition .schedule-box .info-wrap .count-box {margin-top: 10px; padding: 20px 16px; border-radius: 8px; background-color: #000;} .auction-condition .schedule-box .info-wrap .count-box dl {display: flex; justify-content: space-around; color: #FFF;} .auction-condition .schedule-box .info-wrap .count-box dl .row {flex: 1; display: flex; flex-direction: column; align-items: center; position: relative; padding: 12px 0;} .auction-condition .schedule-box .info-wrap .count-box dl .row + .row::before {content: ''; opacity: .2; position: absolute; top: 20px; bottom: 20px; left: 0; border-left: 1px solid #FFF;} .auction-condition .schedule-box .info-wrap .count-box dl .row > dt {opacity: .7; margin-bottom: 4px;} .auction-condition .schedule-box .info-wrap .count-box dl .row > dd {font-size: 1.6rem;} .auction-condition .schedule-box .info-wrap .count-box dl .row > dd strong {font-size: 2.0rem; font-weight: 700;} .auction-condition .schedule-box .info-wrap .inform-text-wrap {margin-bottom:0;} .data-table.fz14 thead th, .data-table tbody th, .data-table tbody td {font-size:1.4rem;} .au-text-wrap {display:flex; justify-content: center;} .au-text-wrap button.btn-auctionlst {height:60px; margin:40px 0; padding:0 60px; font-size:1.6rem;}/*20221209*/ /* 경매현황/myauction */ .contents > .outter.auc {max-width: none; margin:40px 0; padding:55px 0; background-color: #F5F6F8;} .contents > .outter.auc .inner {width: 1254px; margin: 0 auto;} .auction-state-my {display: flex;} .auction-state-my .my-box {flex: 0 0 400px; margin-right: 56px; padding: 36px; border-radius: 12px; border: 1px solid #E8E8E9; box-shadow: 2px 6px 8px rgba(0, 0, 0, .05); background-color: #FFF; } .auction-state-my .my-box .title-box {display: flex; justify-content: center; margin: 28px 0 40px;} .auction-state-my .my-box .title-box .title {display: flex; align-items: center; font-size: 2.4rem; font-weight: 700;} .auction-state-my .my-box .title-box .title::before {content: ''; width: 32px; height: 32px; margin-right: 16px; background: url('../images/icon/title-auction.png?ver=202610221000') no-repeat left center;} .auction-state-my .my-ban {display:flex; align-items:center; margin-right:55px; border-radius:12px; border:1px solid #E8E8E9; background-color:#fff;} .auction-state-my .my-ban .linkban-b1 {position:relative; display:block; padding:35px 110px; font-size:1.6rem; font-weight:600; color:#000; } .auction-state-my .my-ban .linkban-b1::before {content:''; position:absolute; left:40px; top:50%; transform: translateY(-50%); width:49px; height:48px; background: url('../images/AU/icon-linkbanB1.png?ver=202610221000') no-repeat left center;} .auction-state-my .my-ban .linkban-b1::after {content:''; position:absolute; right:30px; top:50%; transform: translateY(-50%); width:16px; height:8px; background: url('../images/AU/icon-linkbanarr.png?ver=202610221000') no-repeat left center;} .auction-state-my .my-box ul {} .auction-state-my .my-box ul li + li {margin-top: 12px;} .auction-state-my .my-box ul li a {display: block; height: 60px; padding: 20px 0 20px 24px; border-radius: 12px; font-size: 1.6rem; font-weight: 600; color: #000; background: #F5F6F8 url('../images/icon/side-more.png?ver=202610221000') no-repeat right 24px center;} .auctiontab {margin-top:-20px;} /* 경매현황/인터넷경매참여 */ .auction-state-my .guide-box {flex: 1;} .auction-state-my .guide-box .title-wrap.border.h-4 {margin: 12px 0 30px; padding-bottom: 8px; border-color: #E0E0E0;} .auction-state-my .guide-box .text-box {margin: 28px 0; font-size: 1.8rem; text-align: center;} .auction-state-my .guide-box .list-guide {display: flex; margin: 0 -8px;} .auction-state-my .guide-box .list-guide li {flex: 1; margin: 0 8px;} .auction-state-my .guide-box .list-guide li a {display: flex; justify-content: center; align-items: center; height: 100px; padding-left: 96px; border-radius: 8px; border: 1px solid #E8E8E9; font-size: 1.6rem; font-weight: 700; color: #000; text-align: center; background-color: #FFF; background-repeat: no-repeat; background-position: left 30px center;} .auction-state-my .guide-box .list-guide li a.btn-pdf {background-image: url('../images/icon/auction-guide-pdf.png?ver=202610221000');} .auction-state-my .guide-box .list-guide li a.btn-vod {background-image: url('../images/icon/auction-guide-vod.png?ver=202610221000');} .auction-state-my .guide-box .list-guide li a.btn-adobe {background-image: url('../images/icon/auction-guide-adobe.png?ver=202610221000');} .auction-state-my .guide-box .inform-text-wrap {display: flex; justify-content: space-between; margin:0px;} .auction-state-my .guide-box .inform-text-wrap > p {color:#000; line-height:24px;} .auction-state-my .guide-box .inform-text-wrap > .side-box {border-radius: 8px; color:#000; font-weight:600; font-size:1.6rem; text-align:center; background-color:#fff;} .auction-state-my .guide-box .inform-text-wrap > .side-box .btn-down {position:relative; padding:25px 45px 25px 100px; border-radius: 8px; border: 1px solid #E8E8E9; color:#000; font-weight:600; font-size:1.6rem; text-align:center;} .auction-state-my .guide-box .inform-text-wrap > .side-box .btn-down::before {content:''; position:absolute; left:30px; top:50%; transform: translateY(-50%); width:60px; height:60px; background: url('../images/AU/icon-banpc.png?ver=202610221000') no-repeat left center;} /* 경매/실시간 진행현황 ========== */ .live-auction-condition {margin-bottom:50px;} .live-auction-condition .title-box {font-size:1.8rem; margin-bottom:15px; padding:10px 25px;} .live-auction-condition .title-box .title {margin-right:25px;} .live-auction-condition .title-box .date {margin-right:5px;} .live-auction-condition .title-box .mark {color:#DA291C;} /* 경매/실시간 진행현황/경매일정정보 */ .live-auction-condition .date-info {display: flex; align-items: center; margin: 40px 0 28px; padding: 0 24px;} .live-auction-condition .date-info .mark {height: 40px; margin-right: 16px; padding: 8px 20px; border-radius: 8px; font-size: 2.0rem; font-weight: 700; color: #DA291C; background-color: #F5F6F8;} .live-auction-condition .date-info .date {font-size: 2.0rem;} /* 경매/실시간 진행현황/경매상세정보 */ .live-auction-condition .detail-info {display: flex; padding: 48px 56px; border-radius: 24px; background-color: #C1C1C1;} .live-auction-condition .detail-info .info-wrap {flex: 1; display: flex; flex-direction: column; } .live-auction-condition .detail-info .info-wrap .state {flex: 0 0 auto; display: inline-flex; align-items: center; align-self: flex-start; width: auto; height: 32px; margin-bottom: 24px; padding: 8px 12px; border-radius: 32px; font-size: 1.4rem; font-weight: 700; color: rgba(255, 255, 255, .2); background-color: #999;} .live-auction-condition .detail-info .info-wrap .state::before {content: ''; width: 8px; height: 12px; margin-right: 6px; background: url('../images/icon/auction-live-state-off.png?ver=202610221000') no-repeat center center;} .live-auction-condition .detail-info .info-wrap .title {margin-bottom: 24px; font-size: 3.2rem; font-weight: 700; color: #FFF; line-height: 1.2;} .live-auction-condition .detail-info .info-wrap .time-box {margin-bottom: 32px;} .live-auction-condition .detail-info .info-wrap .time-box dl {} .live-auction-condition .detail-info .info-wrap .time-box dl dt {margin-bottom: 4px; font-size: 1.6rem; color: #F5F6F8; } .live-auction-condition .detail-info .info-wrap .time-box dl dd {padding-left: 28px; font-size: 1.8rem; color: #F5F6F8; background: url('../images/icon/side-clock-wht.png?ver=202610221000') no-repeat left center;} .live-auction-condition .detail-info .info-wrap .price-box {color: #FA3F20; margin-top:60px;} .live-auction-condition .detail-info .info-wrap .price-box dl {display: flex; align-items: baseline; justify-content: space-between;} .live-auction-condition .detail-info .info-wrap .price-box dl dt {margin-right: 12px; font-size: 1.6rem;} .live-auction-condition .detail-info .info-wrap .price-box dl dd {font-size: 2.4rem; font-weight: 700;} .live-auction-condition .detail-info .inform-text-wrap.border {margin: auto 0 0; border-color: rgba(255, 255, 255, .2);} .live-auction-condition .detail-info .inform-text-wrap.border > p {color: #999;} /* 경매/실시간 진행현황/thumb */ .live-auction-condition .detail-info .thumb-wrap {flex: 0 0 610px; display: flex; justify-content: center; align-items: center; overflow: hidden; position: relative; width: 610px; height: 390px; border-radius: 10px; background-color: #54585A;} .live-auction-condition .detail-info .thumb-wrap .thumb {flex: 1; display: flex; justify-content: center; align-items: center; position: relative; height: 100%;} .live-auction-condition .detail-info .thumb-wrap .thumb img {position:relative; object-fit: cover; width: 100%; height: 100%; } .live-auction-condition .detail-info .thumb-wrap .thumb::before {content: ''; z-index:999; position:absolute; left:20px; top:20px; width: 30px; height: 24px; border-radius: 8px; padding:6px 12px 6px 40px; color:#fff;} .live-auction-condition .detail-info .thumb-wrap .thumb.bid::before {content: '낙찰'; display:flex; align-items: center; background:#437DF1 url('../images/AU/icon-auction-bid.png?ver=202610221000') no-repeat left 15px center;} .live-auction-condition .detail-info .thumb-wrap .thumb.fail::before {content: '유찰'; display:flex; align-items: center; background:#54585A url('../images/AU/icon-auction-fail.png?ver=202610221000') no-repeat left 15px center;} .live-auction-condition .detail-info .thumb-wrap .text {font-size: 1.6rem; font-weight: 600; color: #999; text-align: center;} .live-auction-condition .detail-info .thumb-wrap .text::before {content: ''; display: block; width: 56px; height: 56px; margin: 0 auto 16px; background: url('../images/icon/nodata2-auction.png?ver=202610221000') no-repeat center center;} /* 경매/실시간경매/상태 - 진행중 */ .live-auction-condition.is-active {} .live-auction-condition.is-active .detail-info {background-color: #000;} .live-auction-condition.is-active .detail-info .info-wrap {margin-left:50px;} .live-auction-condition.is-active .detail-info .info-wrap .state {color: #FFF; background-color: #FA3F20; text-transform:uppercase;} .live-auction-condition.is-active .detail-info .info-wrap .state::before {background-image: url('../images/icon/auction-live-state-on.png?ver=202610221000');} .live-auction-condition.is-active .detail-info .info-wrap .txt01 {font-size:1.6rem; font-weight:600; color:#999;} .live-auction-condition.is-active .detail-info .info-wrap .txt01 span + span:nth-child(2) {position:relative; padding-left:20px;} .live-auction-condition.is-active .detail-info .info-wrap .txt01 span + span:nth-child(2)::before {content: ''; position:absolute; left:10px; top:0; bottom:0; margin:auto; width: 1px; height:17px; background-color:#999;} .live-auction-condition.is-active .detail-info .info-wrap .title {font-size:3.2rem; margin-bottom:0; line-height:40px;} .live-auction-condition.is-active .detail-info .info-wrap .time-box {} .live-auction-condition.is-active .detail-info .info-wrap .time-box dl {} .live-auction-condition.is-active .detail-info .info-wrap .time-box dl dt {color: #999;} .live-auction-condition.is-active .detail-info .info-wrap .time-box dl dd {color: #FFF;} .live-auction-condition .detail-info .inform-text-wrap.border > p {color: #E8E8E9;} /* 경매/공통/경매진행일자 ========== */ .auction-schedule-box {position:relative; display: flex; margin: 24px 0 40px; } .auction-schedule-box::after {content: ''; position:absolute; bottom:-20px; width: 100%; height:1px; background-color:#E0E0E0;} .auction-schedule-box .item {flex: 2; display: flex; flex-direction:column; padding: 28px 25px; border-radius: 10px; background-color: #F5F6F8; } .auction-schedule-box.extra .item {flex: 1; display: flex; flex-direction:row; align-items:center; } /*221122*/ .auction-schedule-box .item .title-box {display: block; font-size:1.8rem; font-weight:600; color:#000; margin-bottom:30px;} .auction-schedule-box .item + .item {margin-left: 20px;} .auction-schedule-box .item.md {flex: 1; display:flex; } .auction-schedule-box.extra .item.md {flex: 1.5; } /*221122*/ .auction-schedule-box .item.md ul.lst {width:300px; height:135px; font-size:1.4rem; color:#000;} /*221209*/ .auction-schedule-box .item.md ul.lst li {border-radius: 4px; padding:8px 10px; background-color:transparent; margin-right:10px;} .auction-schedule-box .item.md ul.lst li:hover {background-color:#fff;} .auction-schedule-box .item.lg {flex: 4;} /*221118*/ .auction-schedule-box .item select {width: 100%;} .auction-schedule-box .item .txt-box {display:flex; justify-content:space-between; } .auction-schedule-box .item .txt-box.txt {color:#54585A; font-size:1.6rem; font-weight:400; line-height:20px; margin-top:30px;} .auction-schedule-box .item .txt-box .row {padding:15px 0;} .auction-schedule-box .item .txt-box dl:nth-child(2) .row {padding-left:25px; border-left:1px solid #C1C1C1;} .auction-schedule-box .item .txt-box .row > dt {font-size:1.6rem; font-weight:600; margin-bottom:15px;} .auction-schedule-box .item .txt-box .row > dd {font-size:1.8rem; font-weight:400; text-align:right;} .auction-schedule-box dl {display:flex; flex-direction:column; width: 100%; height: 100%;} /*221122*/ .auction-schedule-box.extra dl {display:block;} /*221122*/ .auction-schedule-box dl .row.w100 {width:100%;} /*221118*/ .auction-schedule-box dl .row.w100 dt {margin-bottom:10px;} /*221118*/ .auction-schedule-box dl .row.w100 .text-sm {margin-top:5px;} /*221118*/ .auction-schedule-box dl .row > dt {margin-bottom: 20px; font-size: 2.0rem; color :#000;} .auction-schedule-box dl .row > dt.with-icon {display: flex; justify-content: flex-start; align-items: center;} .auction-schedule-box dl .row > dt.with-icon::before {content: ''; width: 40px; height: 40px; margin-right: 12px;} .auction-schedule-box dl .row > dt.with-icon.date::before {background: url('../images/icon/title-calendar.png?ver=202610221000') no-repeat left center;} .auction-schedule-box dl .row > dt.with-icon.bidding + dd, .auction-schedule-box dl .row > dt.with-icon.success + dd {display:flex; flex-direction:column;} /*221118*/ .auction-schedule-box dl .row > dt.with-icon.bidding::before {background: url('../images/icon/title-bidding.png?ver=202610221000') no-repeat left center;} .auction-schedule-box dl .row > dt.with-icon.success::before {background: url('../images/icon/title-success.png?ver=202610221000') no-repeat left center;} .auction-schedule-box dl .row > dd {font-size: 2.4rem; font-weight: 700; color: #000; text-align: right; line-height: 1.2; } .auction-schedule-box dl .row > dd strong {color: #DA291C;} .auction-schedule-box dl .row > dd span {margin-left:20px;} .auction-schedule-box dl .row > dd .c-2 {color: #000;} .auction-schedule-box dl .row > dd .text-sm {font-size: 1.8rem; color: #54585A;} .auction-schedule-box dl.con1 {background: url('../images/AU/icoBidding_1.png?ver=202610221000') no-repeat left top; padding-left:80px;} .auction-schedule-box dl.con2 {background: url('../images/AU/icoBidding_2.png?ver=202610221000') no-repeat left top; padding-left:80px;} .auction-schedule-box dl.con3 {background: url('../images/AU/icoBidding_3.png?ver=202610221000') no-repeat left top; padding-left:80px;} .auction-schedule-box + .search-bg-wrap {padding: 45px 200px;} .auction-schedule-box dl.alRt .row > dt, .auction-schedule-box dl.alRt .row > dd {text-align:right;} .col-red {color:#DA291C !important;} .col-gry {color:#54585A !important;} .col-blk {color:#000000 !important;} /* 경매/경매참여이력 */ .auction-history-box {position:relative; display:flex; justify-content: space-between; align-items:center; margin:30px 0 60px; } .auction-history-box::before {content:''; position:absolute; bottom:-30px; width:100%; height:1px; background-color:#E8E8E9;} .auction-history-box .title-box {flex:1.2;} .auction-history-box .title-box .title {font-size:1.8rem; font-weight:600; color:#000; margin-right:15px; line-height:22px; } .auction-history-box .history-box {flex:2; display:flex; justify-content: space-between; align-items:center; border-radius:8px; padding:16px 32px; background-color:#F5F6F8;} .auction-history-box .history-box .lst {display:flex; flex:1; justify-content: space-between; align-items:center;} .auction-history-box .history-box .lst .tlt {flex:1; position:relative; font-size:1.8rem; color:#000; line-height:52px; padding-left:60px; margin-right:35px;} .auction-history-box .history-box .lst .txt {flex:2;} .auction-history-box .history-box .lst .txt dl {display:flex; justify-content: space-between; flex:1;} .auction-history-box .history-box .lst .txt dl dt {color:#999;} .auction-history-box .history-box .lst .txt dl dd {font-weight:600; color:#000; } .auction-history-box .history-box .lst {} .auction-history-box .history-box .lst.bid {margin-right:55px; } .auction-history-box .history-box .lst.bid .tlt {background: url('../images/AU/icon-bidbox.png?ver=202610221000') left center no-repeat; font-weight:600; } .auction-history-box .history-box .lst.pic .tlt {background: url('../images/AU/icon-picbox.png?ver=202610221000') left center no-repeat; font-weight:600; color: #DA291C} .auction-history-box .history-box .lst.pic .txt dl dd {color: #DA291C} /* 경매/공통/summary정보 ========== */ .auction-count-box {margin: 56px 0; padding-bottom: 40px; border-bottom: 8px solid #F5F6F8;} .auction-count-box dl {display: flex;} .auction-count-box dl .row {flex: 1; display: flex; justify-content: space-between; align-items: center; position: relative; padding: 0 56px;} .auction-count-box dl .row + .row::before {content: ''; position: absolute; left: 0; height: 32px; border-left: 1px solid #E0E0E0;} .auction-count-box dl dt {font-size: 1.8rem; font-weight: 600;} .auction-count-box dl dd {font-size: 2.4rem; font-weight: 700;} .auction-count-box dl dd strong {color: #DA291C;} .border-btm {position:relative; margin-bottom:40px;} .border-btm::after {content:''; position:absolute; bottom:-20px; width:100%; height:1px; background-color:#E0E0E0;} .model-info.column .info-row.border-btm {position:relative; margin-bottom:15px;} .model-info.column .info-row.border-btm::after {content:''; position:absolute; bottom:-15px; width:100%; height:1px; background-color:#E0E0E0;} /*================================================== 낙찰,입찰 ==================================================*/ /* 상세보기/상단 */ .exhibits-detail-visual {margin-bottom: 40px;} .exhibits-detail-visual .model-info {} .exhibits-detail-visual .model-info .thumb-wrap {border-radius: 10px 10px 0 0;} .exhibits-detail-visual .model-info .thumb-wrap .thumb {} .exhibits-detail-visual .model-info .info-box {padding: 32px 40px; color: #FFF; border-radius: 0 0 10px 10px; background-color: #DA291C;} .exhibits-detail-visual .model-info .info-box .title.other {font-size:2.4rem;} .exhibits-detail-visual .model-info .info-box .title.other a {height:auto;} .exhibits-detail-visual + .cont-box-other {} .exhibits-detail-visual + .cont-box-other .anchor-menu {position: sticky; z-index: 10; top: -40px; background-color: #FFF;} .exhibits-detail-visual + .cont-box-other .article {margin: 20px 0;} .exhibits-detail-visual + .cont-box-other .article .option-detail-list {margin:0;} .exhibits-detail-visual + .cont-box-other .data-table-wrap .title-wrap.h-3 {margin-top:-20px; margin-bottom: 0;} .exhibits-detail-visual + .cont-box-other .data-table.mt00 {margin-top:-21px;} .exhibits-detail-visual + .cont-box-other .repair-part .remark-box { display:block; text-align:left; margin-top: 40px; padding: 0; border-radius:0; background-color:#fff;} .exhibits-detail-visual + .cont-box-other .repair-part .remark-box .title { margin-bottom:5px;} .exhibits-detail-visual + .cont-box-other .repair-part .remark-box .item-box {display: flex; justify-content: flex-start;} .exhibits-detail-visual + .cont-box-other .repair-part .remark-box .item-box dl .row:first-child {margin-left:0;} .exhibits-detail-visual + .cont-box-other .repair-part .remark-box .item-box2 {margin-top:7px; padding:15px; font-size:1.4rem; line-height:20px; background-color:#F5F6F8; } .exhibits-detail-visual + .cont-box-other .repair-part .temp-ready {margin-top:10px; padding: 40px; font-size: 1.8rem; font-weight: 700; text-align: center; background: #fff; border-bottom:1px solid #E0E0E0;} .exhibits-detail-visual .model-info .info-box .info-row { justify-content: flex-end;} .exhibits-detail-visual .model-info .info-box .info-row + .info-row {margin-top: 20px; padding-top: 20px; border-top: 1px solid rgba(0, 0, 0, .1);} .exhibits-detail-visual .model-info .info-box .info-row .side-area {display:flex; flex-direction:column;} .exhibits-detail-visual .model-info .info-box .info-row .side-txt {position:relative; display:flex; justify-content:flex-end; align-items: center; margin-top:35px; } .exhibits-detail-visual .model-info .info-box .info-row .side-txt strong {position:relative; font-size:2.4rem; font-weight:600; height:32px; margin-left:30px;} .exhibits-detail-visual .model-info .info-box .info-row .side-txt strong::before {content: ''; position:absolute; left:-15px; height:100%; width:1px; background-color:rgba(255, 255, 255, .5);} .exhibits-detail-visual .model-info .info-box .info-row .side-wrap {} .exhibits-detail-visual .model-info .info-box .info-row .side-wrap .btn2 {margin-left:5px;} /* 2023.07.17 background image 제거 */ .exhibits-detail-visual .model-info .info-box .info-row .side-wrap .btn2.btn2-url {border-color: #000; color: #FFF; display: flex; justify-content: center; background:#000 no-repeat left 30px center;} .exhibits-detail-visual .model-info .etc-box {margin: 8px 0 8px;} .exhibits-detail-visual .model-info .etc-box .lst-1 {display:flex; } .exhibits-detail-visual .model-info .etc-box .lst-1 dt {margin-right:30px; color:rgba(255, 255, 255, .7);} .exhibits-detail-visual .model-info .etc-box .lst-1 dd {margin-right:40px;} .exhibits-detail-visual .model-info .etc-box .text-email {color: inherit;} .exhibits-detail-visual .model-info .etc-box .text-email::before {background-image: url('../images/icon/side-email-wht.png?ver=202610221000');} .exhibits-detail-visual .model-info .basic-wrap .title {color: inherit;} .exhibits-detail-visual .model-info .basic-wrap .info-list ul {margin-top: 8px; color: inherit;} .exhibits-detail-visual .model-info .dlist-wrap dl .row {} .exhibits-detail-visual .model-info .dlist-wrap dl .row + .row {margin-top: 8px;} .exhibits-detail-visual .model-info .dlist-wrap dl .row > dt {opacity: .7; margin-right: 28px;} .exhibits-detail-visual .model-info .dlist-wrap dl .row > dd {font-weight: 700;} .exhibits-detail-visual .model-info .price-wrap.exhibits {margin-top: 0;} .exhibits-detail-visual .model-info .price-wrap.exhibits dt {color:#fff;} .exhibits-detail-visual .model-info .price-wrap.exhibits .price .unit {color: #fff;} .exhibits-detail-visual .model-info .price-wrap.exhibits .price strong {color: #fff;} /*================================================== 내차팔기 ==================================================*/ /* 내차팔기/내차팔기안내 ========== */ /* 상단비쥬얼영역 */ .se-userguide-visual {overflow: hidden; height: 350px; margin-bottom: 56px; border-radius: 18px;} .se-userguide-visual .swiper-slide {} .se-userguide-visual .swiper-pagination-bullets {bottom: 30px; left: 100px; width: auto;} .se-userguide-visual .thumb-wrap {position: relative; height: 100%;} .se-userguide-visual .thumb-wrap .thumb {} .se-userguide-visual .thumb-wrap .title {position: absolute; top: 110px; left: 100px; font-size: 2.4rem; font-weight: 700; color: #FFF;} .se-userguide-visual .thumb-wrap .text {position: absolute; top: 196px; left: 100px; font-size: 1.6rem; color: #FFF;} /* userguide */ .se-userguide {margin: 56px 0 0 0;} .se-userguide .inform-box {min-height: 175px; background-repeat: no-repeat; background-position: right 186px bottom;} .se-userguide .inform-box .title {margin-bottom: 24px; font-size: 1.8rem; font-weight: 700; color: #000;} .se-userguide .inform-box .title strong {color: #DA291C;} .se-userguide .inform-box ul {} .se-userguide .inform-box ul li {position: relative; padding-left: 10px;} .se-userguide .inform-box ul li + li {margin-top: 8px;} .se-userguide .inform-box ul li::before {content: ''; position: absolute; top: 6px; left: 0; width: 4px; height: 4px; border-radius: 50%; background-color: #54585A;} .se-userguide .inform-box ul li .title {margin-bottom: 0; font-size: inherit;} .se-userguide .inform-box ul li span {font-size: 1.2rem; color: #999;} .se-userguide .inform-box ul li strong {color: #DA291C;} .se-userguide .inform-box ul li strong.c-2 {color: #000;} /* 가입절차 */ .se-userguide .step-box {margin-top: 56px;} .se-userguide .step-box .title {margin-bottom: 12px; font-size: 1.6rem; font-weight: 700; color: #000;} .se-userguide .step-box ul {display: flex;} .se-userguide .step-box ul li {flex: 1; display: flex; flex-direction: column; padding: 24px; border-radius: 8px; border: 1px solid #E8E8E9; background-color: #FFF; background-repeat: no-repeat;} .se-userguide .step-box ul li + li {margin-left: 24px;} .se-userguide .step-box ul li em {font-size: 1.2rem; font-weight: 700; color: #DA291C;} .se-userguide .step-box ul li strong {margin-top: 4px; font-weight: 700; color: #000;} .se-userguide .step-box ul li span {font-size: 1.2rem; color: #999;} /* 내차팔기/내차팔기안내/셀러맴버십안내 */ .se-userguide.membership .inform-box {background-image: url('../images/SE/guide-bg-1.png?ver=202610221000');} .se-userguide.membership .step-box ul li {background-position: right 24px top 24px;} .se-userguide.membership .step-box ul li em {margin-top: 12px;} .se-userguide.membership .step-box ul li strong {} .se-userguide.membership .step-box ul li span {margin-top: 24px;} .se-userguide.membership .step-box ul li.cate-1 {background-image: url('../images/SE/step-membership-1.png?ver=202610221000');} .se-userguide.membership .step-box ul li.cate-2 {background-image: url('../images/SE/step-membership-2.png?ver=202610221000');} .se-userguide.membership .step-box ul li.cate-3 {background-image: url('../images/SE/step-membership-3.png?ver=202610221000');} .se-userguide.membership .step-box ul li.cate-4 {background-image: url('../images/SE/step-membership-4.png?ver=202610221000');} /* 내차팔기/내차팔기안내/내차팔기 */ .se-userguide.sell .inform-box {background-image: url('../images/SE/guide-bg-2.png?ver=202610221000');} .se-userguide.sell .step-box ul li { background-position: left 24px top 76px;} .se-userguide.sell .step-box ul li em {} .se-userguide.sell .step-box ul li strong {} .se-userguide.sell .step-box ul li span {margin-top: 88px;} .se-userguide.sell .step-box ul li.cate-1 {background-image: url('../images/SE/step-sell-1.png?ver=202610221000');} .se-userguide.sell .step-box ul li.cate-2 {background-image: url('../images/SE/step-sell-2.png?ver=202610221000');} .se-userguide.sell .step-box ul li.cate-3 {background-image: url('../images/SE/step-sell-3.png?ver=202610221000');} .se-userguide.sell .step-box ul li.cate-4 {background-image: url('../images/SE/step-sell-4.png?ver=202610221000');} .se-userguide.sell .step-box ul li.cate-5 {background-image: url('../images/SE/step-sell-5.png?ver=202610221000');} .se-userguide.sell .step-box ul li.cate-6 {background-image: url('../images/SE/step-sell-6.png?ver=202610221000');} /*================================================== 고객센터 ==================================================*/ /* 고객센터/고객리뷰 ========== */ /* 고객센터/고객리뷰/review-box */ .review-box {display: flex;} .review-box .thumb-wrap {margin-right: 20px;} .review-box .thumb-wrap .thumb {display: flex; justify-content: center; align-items: center; width: 100%; height: 100%;} .review-box .thumb-wrap .thumb img {object-fit: cover; width: 100%; height: 100%;} .review-box .thumb-wrap .view-box {width: 290px; height: 194px;} .review-box .thumb-wrap .view-box .thumb {border: 1px solid #E0E0E0;} .review-box .thumb-wrap .view-box .thumb img {} .review-box .thumb-wrap .list-box {margin-top: 4px;} .review-box .thumb-wrap .list-box ul {display: flex;} .review-box .thumb-wrap .list-box ul li {width: 46px; height: 30px;border: 1px solid #E0E0E0;} .review-box .thumb-wrap .list-box ul li a {} .review-box .thumb-wrap .list-box ul li a.is-active {border-color: #000;} .review-box .text-wrap {} .review-box .text-wrap .title-box {} .review-box .text-wrap .title-box .brand {margin-bottom: 8px; font-size: 2rem; font-weight: 700; color: #000;} .review-box .text-wrap .title-box .title {margin-bottom: 16px; font-size: 1.6rem; color: #000;} .review-box .text-wrap .text-box {overflow-y: auto; height: 118px; padding: 12px; border-radius: 6px; background-color: #FFF;} .review-box .text-wrap .text-box p {font-size: 1.6rem; color: #000} /* 고객센터/메인 ========== */ .global-guide-list {} .global-guide-list ul {display: flex; flex-wrap: wrap; align-items: stretch; margin: -10px;} .global-guide-list ul li {flex: 0 0 calc(50% - 20px); margin: 10px;} .global-guide-list ul li a {display: flex; align-items: center; padding: 40px 12px 40px 144px; border-radius: 8px; border: 1px solid #E8E8E9; font-size: 1.6rem; font-weight: 700; color: #000; background-repeat: no-repeat; background-position: left 30px center;} .global-guide-list ul li a.cate-1 {background-image: url('../images/CU/global-guide-01.png?ver=202610221000');} .global-guide-list ul li a.cate-2 {background-image: url('../images/CU/global-guide-02.png?ver=202610221000');} .global-guide-list ul li a.cate-3 {background-image: url('../images/CU/global-guide-03.png?ver=202610221000');} .global-guide-list ul li a.cate-4 {background-image: url('../images/CU/global-guide-04.png?ver=202610221000');} /* 고객센터/메인 */ .customer-center {} .customer-center .top-box {display: flex; flex-wrap: wrap; margin: 0;} .customer-center .global-guide-wrap {flex: 1; margin-right: 50px;} .customer-center .notice-wrap {flex: 1;} .customer-center .list-review {margin-top: 68px;} /* */ .customer-menu {margin-top: 56px;} .customer-menu ul {display: flex; flex-wrap: wrap; align-items: stretch; margin: 0 -25px;} .customer-menu ul li {flex: 0 0 calc(50% - 50px); margin: 0 25px;} .customer-menu ul li .item {display: flex; align-items: center; height: 100%; padding: 24px 12px 24px 110px; border-radius: 8px; border: 1px solid #E8E8E9; } .customer-menu ul li .qna {flex-direction: column; justify-content: center; align-items: flex-start; background-repeat: no-repeat; background-position: left 30px center, right 20px center; background-image: url('../images/CU/customer-qna.png?ver=202610221000'), url('../images/icon/chevron-r-16.png?ver=202610221000');} .customer-menu ul li .qna .title {font-weight: 700; color: #000;} .customer-menu ul li .qna .text {margin-top: 12px;} .customer-menu ul li .call {background-repeat: no-repeat; background-position: left 30px center; background-image: url('../images/CU/customer-call.png?ver=202610221000');} .customer-menu ul li .call .title-box {margin-right: 28px; padding-right: 28px; border-right: 1px solid #E0E0E0; } .customer-menu ul li .call .title-box .title {font-weight: 700; color: #000;} .customer-menu ul li .call .title-box .text {font-size: 2.0rem; font-weight: 700; color: #DA291C; white-space: nowrap;} .customer-menu ul li .call .info-box {} .customer-menu ul li .call .info-box .title {font-weight: 700; color: #000;} .customer-menu ul li .call .info-box .text {margin-top: 5px; } /* 고객센터/Global Guide */ .guide-wrap {padding:0 20px;} .guide-wrap .guide-img {margin-bottom:20px;} .guide-wrap .guide-txt {margin-bottom:20px; font-size:1.6rem;} .guide-wrap .guide-txt p.vt {display:flex; align-items:center; margin-bottom:20px; font-size:1.6rem;} .guide-wrap .guide-txt p.vt img {margin:0 5px;} .guide-wrap .guide-box {background-color:#F5F6F8; border-radius: 8px; padding:40px 60px; margin-bottom:30px;} .guide-wrap .guide-box .acc-container {} .guide-wrap .guide-box .tlt-box {} .guide-wrap .guide-box .tlt-box > .title {font-size: 1.6rem; font-weight: 700; color: #000;} .guide-wrap .guide-box .tlt-box > .title strong {color: #DA291C;} .guide-wrap .guide-box .stp-area {display:flex; margin-top:10px;} .guide-wrap .guide-box .stp-area li {position:relative; width:145px; border:2px solid #54585A; border-radius: 8px; box-sizing: border-box; padding:10px; margin-left:50px;} .guide-wrap .guide-box .stp-area li:first-child {margin-left:0;} .guide-wrap .guide-box .stp-area li strong {display:block; background-color:#999; border-radius: 12px; text-align:center; color:#fff; font-size:1.2rem; font-weight:700; line-height:25px;} .guide-wrap .guide-box .stp-area li span {display:flex; align-items: center; justify-content: center; text-align:center; height:45px; font-size:1.4rem; line-height:20px; margin-top:5px; letter-spacing: -1px;} .guide-wrap .guide-box .stp-area li::before {content: ''; position: absolute; z-index: 1; left: -32px; top: 50%; transform: translateY(-50%); width: 12px; height: 12px; background:url('../images/icon/side-link.png?ver=202610221000') no-repeat center;} .guide-wrap .guide-box .stp-area li:first-child::before {background:none;} .guide-wrap .guide-box .one-red {position:relative; margin:0 auto; width:100px; height:100px; border:3px solid #DA291C; border-radius: 50px; background-color:#fff; } .guide-wrap .guide-box .one-red span {position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); color:#000; font-size:1.8rem; font-weight:700; line-height:2.4rem; text-align:center;} .guide-wrap .borderTp {border-top: 1px solid #E8E8E9;} .guide-wrap > .tab-wrap {margin-top:40px;} .guide-wrap > .tab-wrap .depth-3 {display:flex; justify-content: center; margin-bottom:60px;} .guide-wrap > .tab-wrap .depth-3 ul li { margin: 0 20px;} .guide-wrap > .tab-wrap .depth-3 ul li button {position:relative; font-weight: 700; width:115px; height:135px; line-height:17px; border-radius: 8px; border:2px solid transparent; opacity: .5; padding-top:65px; background:center 15px no-repeat;} /*221117*/ .guide-wrap > .tab-wrap .depth-3 ul li button.is-active {border:2px solid #000; box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16); color: #000; opacity: 1;} .guide-wrap > .tab-wrap .depth-3 ul li + li button::before {content: ''; position: absolute; top: 50%; left: -20px; height: 20px; margin-top: -10px; border-left: 1px solid #999;} .guide-wrap > .tab-wrap .depth-3 ul li + li button.is-active::before {opacity: .5;} .guide-wrap > .tab-wrap .depth-3 ul li button.icoBuyer {background-image: url('../images/CU/global/icoBuyer.png?ver=202610221000');} .guide-wrap > .tab-wrap .depth-3 ul li button.icoSeller {background-image: url('../images/CU/global/icoSeller.png?ver=202610221000');} .guide-wrap > .tab-wrap .depth-3 ul li button.icoLive_car {background-image: url('../images/CU/global/icoLive_car.png?ver=202610221000');} .guide-wrap > .tab-wrap .depth-3 ul li button.icoHand_car {background-image: url('../images/CU/global/icoHand_car.png?ver=202610221000');} .guide-wrap > .tab-wrap .depth-3 ul li button.icoCar_check {background-image: url('../images/CU/global/icoCar_check.png?ver=202610221000');} .guide-wrap > .tab-wrap .depth-3 ul li button.icoBuyStep1 {background-image: url('../images/CU/global/icoBuyStep1.png?ver=202610221000');} .guide-wrap > .tab-wrap .guideView {} .guide-wrap > .tab-wrap .guideView .swiper {padding-top:50px;} .guide-wrap > .tab-wrap .guideView .swiper .swiper-slide {display:flex; flex-direction:column; padding:40px 100px; z-index:1; background-color:#F5F6F8; height:875PX;} /*221117*/ .guide-wrap > .tab-wrap .guideView .swiper .swiper-slide .title {position:absolute; top:-50px; left:0; z-index:2; font-size:2.2rem; font-weight:700; color:#000;} .guide-wrap > .tab-wrap .guideView .swiper .swiper-slide .title strong {color:#DA291C;} .guide-wrap > .tab-wrap .guideView .swiper .swiper-slide .thumb {width:100%; height:680px; margin:auto; background-color:#E8E8E9;} .guide-wrap > .tab-wrap .guideView .swiper .swiper-slide .thumb img {width:inherit; height:inherit; object-fit:cover; border:1px solid #C1C1C1;} .guide-wrap > .tab-wrap .guideView .swiper .swiper-slide .text {border-top:1px solid #E0E0E0; padding-top:20px; margin-top:60px; } .guide-wrap > .tab-wrap .guideView .swiper .swiper-slide .text span {position:relative; display:block; padding-left:25px; margin:6px 0;} .guide-wrap > .tab-wrap .guideView .swiper .swiper-slide .text span::before {content: ''; color:#000; position:absolute; left:0; top:2px; font-size:1.3rem; width:15px; line-height:15px; text-align:center; border-radius:8px; border:1px solid #000;} .guide-wrap > .tab-wrap .guideView .swiper .swiper-slide .text span:nth-child(1)::before {content: '1';} .guide-wrap > .tab-wrap .guideView .swiper .swiper-slide .text span:nth-child(2)::before {content: '2'; } .guide-wrap > .tab-wrap .guideView .swiper .swiper-slide .text span:nth-child(3)::before {content: '3'; } .guide-wrap > .tab-wrap .guideView .swiper .swiper-button-prev {left:30px;} .guide-wrap > .tab-wrap .guideView .swiper .swiper-button-next {right:30PX;} .guide-wrap > .tab-wrap .guideView .swiper .swiper-pagination {position:absolute; top:785px;} .guide-wrap > .tab-wrap .guideView .swiper .swiper-pagination .swiper-pagination-bullet {width: 12px; height: 12px; background-color: #E0E0E0; margin:0 7px;} .guide-wrap > .tab-wrap .guideView .swiper .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {width:12px; height:12px; background-color:#fff; border-radius:6px; border:2px solid #F04040;} /* .swiper {} .swiper-slide {padding: 20px; border: 1px solid #CCC; text-align: center; background-color: #EEE;} .swiper.swiper-grid {height: 300px;} .swiper.swiper-grid .swiper-slide {height: calc(100% / 3);} */ /*================================================== 마이페이지 ==================================================*/ /* 마이페이지/ ========== */ .suggest-slogan-box {} .suggest-slogan-box.my-banner {height: 80px; margin: 40px 0; padding: 24px 20px 20px 154px; background: url('../images/MY/sugest-bg.png?ver=202610221000') no-repeat 15px center;} .suggest-slogan-box.my-banner p {font-size: 2.4rem; color: #FFF;} .suggest-slogan-box.my-banner p strong {font-weight: 700;} .suggest-slogan-box.my-banner.seller {background-color: #B9160A;} .suggest-slogan-box.my-banner.buyer {background-color: #437DF1;} .suggest-slogan-box.thumb {padding: 56px 0; border-top: 1px solid #000;} .suggest-slogan-box.thumb .box {display: flex; justify-content: space-between; align-items: center; padding: 0 80px;} .suggest-slogan-box.thumb .text-box {flex: 1; display: flex; flex-direction: column; position: relative;} .suggest-slogan-box.thumb .text-box .title {font-size: 2.4rem;} .suggest-slogan-box.thumb .text-box .title strong {color: #B9160A;} .suggest-slogan-box.thumb .text-box .text {font-weight: 600;} .suggest-slogan-box.thumb .page-button-wrap {margin-top: 56px;} .suggest-slogan-box.thumb.membership {} .suggest-slogan-box.thumb.membership .box {} .suggest-slogan-box.thumb.membership .box::after {content: ''; flex: 0 0 288px; width: 288px; height: 193px; background: url('../images/MY/suggest-member-bg.png?ver=202610221000') no-repeat;} /*================================================== footer메뉴 ==================================================*/ /* footer메뉴/사이트맵 */ .sitemap-wrap {border-top: 1px solid #000;} .sitemap-wrap > ul {display: flex; flex-wrap: wrap; } .sitemap-wrap > ul > li {flex: 0 0 20%; margin: 40px 0 20px 0;} /*221020*/ .sitemap-wrap > ul > li > ul {margin-top: 24px; margin-right:35px; } /*221020*/ .sitemap-wrap > ul > li > ul:first-child {margin-top: 0;} .sitemap-wrap > ul > li > ul > li {} .sitemap-wrap > ul > li > ul > li + li {margin-top: 6px;} .sitemap-wrap > ul a {font-size: 1.8rem; color: #000;} .sitemap-wrap > ul a:hover {color: #DA291C;} .sitemap-wrap > ul strong {font-size: 2.0rem; font-weight: 700; color: #000;} .sitemap-wrap > ul strong a {font-size: inherit;} /* footer메뉴/브랜드소개 */ .intro-brand-visual {height: 350px; margin-bottom: 56px; border-radius: 18px; background: url('../images/GM/intro-brand-visual-bg.png?ver=202610221000') no-repeat 0 0;} .intro-brand-visual .text-box {display: flex; flex-direction: column; padding: 145px 0 0 100px;} .intro-brand-visual .text {margin-bottom: 12px; font-size: 1.6rem; color: rgba(255, 255, 255, .7); animation-name: textFlow1; animation-duration: 2s; animation-delay: 0.5s; animation-fill-mode: backwards;} .intro-brand-visual .title {font-size: 2.4rem; font-weight: 700; color: #FFF; animation-name: textFlow1; animation-duration: 2s;} @keyframes textFlow1 { from { opacity: 0; margin-left: 50px; } to { opacity: 100%; margin-left: 0; } } .intro-brand {margin-top: 0;} /*221031 : 기존 56px*/ .intro-brand .title-box {display: flex; justify-content: center;} .intro-brand .title-box .title {margin: 32px 0 24px; font-size: 2.6rem; font-weight: 700; color: #000;} .intro-brand.intro-0 {margin-bottom:60px;} .intro-brand.intro-0 .title-box .title {font-size:3.0rem; margin-top: 0;} .intro-brand.intro-0 .title-box .title strong {font-weight: 700; color: #DA291C;} .intro-brand.intro-0 .text-box .text {text-align:center; font-size:1.8rem; color:#000;} .intro-brand.intro-0 .text-box .text strong {font-weight:700;} .intro-brand.intro-0 ul {display:flex; justify-content: center; margin-top:55px;} .intro-brand.intro-0 ul li {border:1px solid #E8E8E9; border-radius: 8px; padding: 93px 25px 22px; width:291px; margin-left:30px; text-align:center;} .intro-brand.intro-0 ul li:first-child {margin-left:0;} .intro-brand.intro-0 ul li:nth-child(1) {background:url('../images/GM/intro-brand-2-1.png?ver=202610221000') center top 30px no-repeat;} .intro-brand.intro-0 ul li:nth-child(2) {background:url('../images/GM/intro-brand-1-3.png?ver=202610221000') center top 23px no-repeat;} .intro-brand.intro-0 ul li:nth-child(3) {background:url('../images/GM/intro-brand-0-3.png?ver=202610221000') center top 25px no-repeat;} .intro-brand.intro-0 ul li strong {display:block; font-size:1.6rem; font-weight:600; color:#000; margin-bottom:3px;} .intro-brand.intro-1 {position:relative; height:890px; background:#F5F6F8 url('../images/GM/intro_brand_worldmap.png?ver=202610221000') center top no-repeat; } .intro-brand.intro-1::before {content: ''; position:absolute; right:0; bottom:0; width:1236px; height:361px; background:url('../images/GM/intro_brand_visual.png?ver=202610221000') 0 0 no-repeat; } .intro-brand.intro-1 > .inner {width: 1254px; margin: 0 auto;} .intro-brand.intro-1 .title-box .title {position:relative; display:inline-block; padding:12px 10px; font-size:3.0rem; margin-top:40px;} .intro-brand.intro-1 .title-box .title::before {content: ''; display: block; position: absolute; right: 0; bottom: 0; left: 0; height: 3px; background-color: #DA291C; transform: skewX(35deg);} .intro-brand.intro-1 .text-box {font-size:1.8rem; color:#000; font-weight:400; text-align:center;} .intro-brand.intro-1 .text-box.circle {position: relative; margin:70px auto; width:580px; height:580px; background:url('../images/GM/intro_brand_circle.png?ver=202610221000') center bottom no-repeat;} .intro-brand.intro-1 .text-box.circle > .tlt_ct {position:absolute; bottom:240px; z-index:1; transform: translateX(-50%); font-size:3.0rem; font-weight:700; line-height:3.8rem;} .intro-brand.intro-1 .text-box.circle > ul {position: absolute; left:0; right:0; top:0; width:inherit; height:inherit;} .intro-brand.intro-1 .text-box.circle > ul li {position:absolute; display:flex; flex-direction: column; justify-content: center; align-items: center; font-size:1.6rem; font-weight:600; width:156px; height:150px; border-radius: 50%; box-shadow: 0px 3px 8px #e8e8e9; background-color:#fff;} .intro-brand.intro-1 .text-box.circle > ul li:nth-child(1) {left:0; right:0; margin:0 auto;} .intro-brand.intro-1 .text-box.circle > ul li:nth-child(2) {left:10px; bottom:85px;} .intro-brand.intro-1 .text-box.circle > ul li:nth-child(3) {right:10px; bottom:85px;} .intro-brand.intro-1 .text-box.circle > ul li > span {margin-top:10px;} .intro-brand.intro-2 {margin:70px 0;} .intro-brand.intro-2 .title-box .title {margin-top: 0; margin-bottom:30px;} .intro-brand.intro-2 .text-box {display: flex; justify-content: center; align-items: stretch; margin: 0 -15px;} .intro-brand.intro-2 .item {display: flex; flex-direction: column; width:291px;} .intro-brand.intro-2 .item + .item {margin-left:30px;} .intro-brand.intro-2 .item .title {padding:25px 20px; width:291px; height:228px; border-radius:8px; font-size:2.4rem; font-weight: 700; color: #fff; box-sizing: border-box; overflow:hidden;} .intro-brand.intro-2 .item.cate-1 .title {background-image: url('../images/GM/intro-brand-3-1.png?ver=202610221000');} .intro-brand.intro-2 .item.cate-2 .title {background-image: url('../images/GM/intro-brand-3-2.png?ver=202610221000');} .intro-brand.intro-2 .item.cate-3 .title {background-image: url('../images/GM/intro-brand-3-3.png?ver=202610221000');} .intro-brand.intro-2 .item .text {margin-top:20px; font-size:1.6rem; line-height:20px;} /* 아랍어용 */ :lang(ar) .login-wrap .util-box ul li + li {margin-left: 0;margin-right: 10px; padding-left: 0;padding-right: 10px;} :lang(ar) .login-wrap .util-box ul li + li::before {left: initial; right: 0;} :lang(ar) .option-box .state-box dl.dlist > .row > dt{margin: 0 0 0 20px;} :lang(ar) .option-box .state-box dl.dlist > .row > dt::after {left: 0; right: initial; border-left: 0 none; border-right: 1px solid #E0E0E0;} :lang(ar) .option-box .state-box .progress-wrap .title-box .badge-order {margin: 0 0 0 8px;} :lang(ar) .option-box .qna-wrap dl .question dt {left: initial; right:16px;} :lang(ar) .option-box .qna-wrap dl .question .form-mix input{margin: 0 32px 0 0;} /* 202310 아랍어 상세 화면 */ :lang(ar) .view-visual-wrap .model-info .swiper-button-prev.round, :lang(ar) .board-detail .view-summary .model-info .thumb-wrap .swiper .swiper-button-prev{right:0;left:inherit;transform:rotate(-180deg);} :lang(ar) .view-visual-wrap .model-info .swiper-button-prev.round::after, :lang(ar) .board-detail .view-summary .model-info .thumb-wrap .swiper .swiper-button-prev::after{transform:rotate(180deg);} :lang(ar) .view-visual-wrap .model-info .swiper-button-next.round, :lang(ar) .board-detail .view-summary .model-info .thumb-wrap .swiper .swiper-button-next{left:0;right:inherit;transform:rotate(-180deg);} :lang(ar) .view-visual-wrap .model-info .swiper-button-next.round::after, :lang(ar) .board-detail .view-summary .model-info .thumb-wrap .swiper .swiper-button-next::after{transform:rotate(180deg);} :lang(ar) .board-detail .view-body .view-summary{padding:30px 30px 0 0;} :lang(ar) .board-detail .view-summary .total-price-wrap .page-button-wrap.column .btn2 + .btn2.btn2-primary{margin-right:0;}