/* 로그인, 회원가입, 마이페이지, 서비스소개, 커뮤니티, 고객센터, 이벤트, 게시판 등 부가 페이지 css */ /* main */ .main{width:100%; margin-bottom:100px;} /* main 공통 */ .main-section{padding-top:100px; box-sizing:border-box; width:100%; } .main-section .main-title{height:44px; display:flex; align-items: center; justify-content: center; font-size:36px; font-weight:500; letter-spacing: -0.2px; } .main-section .main-title span{font-size:36px; font-weight:500; letter-spacing: -0.2px; color:#666; padding-left:5px; } .main-section .main-section-form{margin-top:50px;} .main-section .main-text{height:26px; display:flex; align-items: center; justify-content: center; font-size:18px; font-weight:400; letter-spacing: -0.2px; color:#666; margin-top:10px; } .main-quick + .main-section{ padding-top:150px; } /* main banner */ .main-banner{width:100%; height:400px; position: relative;} .main-banner .main-banner-box{width:100%; position:relative;} .main-banner .main-banner-box .main-banner-visual{width:100%;} .main-banner .main-banner-box .main-banner-visual .main-visual-box .main-visual-con .banner-visual{display:block; width:1200px; margin:0 auto;} .main-banner .main-banner-list-form{width:100%; height:80px; background:rgba(0,0,0,0.3); position: absolute; left:0; bottom:0; z-index: 9;} .main-banner .main-banner-list-form .main-banner-list-box{width:1200px; height:100%; padding:0 40px; box-sizing:border-box; position:relative; margin:0 auto;} .main-banner .main-banner-list-form .main-banner-list-box .main-banner-list-dom{width:100%; height:100%; position:relative;} .main-banner .main-banner-list-form .main-banner-list-box .main-banner-list-con{width:100%; height:100%; display:flex; align-items: center; position:relative;} .main-banner .main-banner-list-form .main-banner-list-box .main-banner-list-con .main-banner-list{ width:100%; height:100%; position:relative;} .main-banner .main-banner-list-form .main-banner-list-box .main-banner-list-con .main-banner-list .main-banner-list-timer{width:calc( 100% - 2px ); height:3px; background:rgba(255,255,255,0.3); position: absolute; left:1px; top:0; } .main-banner .main-banner-list-form .main-banner-list-box .main-banner-list-con .main-banner-list .main-banner-list-timer .banner-timer-bar{width:100%; height:3px; background:#fff; } .main-banner .main-banner-list-form .main-banner-list-box .main-banner-list-con .main-banner-list .main-banner-list-txt{width:100%; height:100%; display:flex; align-items: center; cursor:pointer; padding:0 11px; box-sizing:border-box; font-size:15px; font-weight:400; color:#fff; letter-spacing: -0.2px; line-height:1.3; } .main-banner .main-banner-list-form .main-banner-list-box .main-banner-list-con .main-banner-list:hover .main-banner-list-txt{background:rgba(0,0,0,0.2);} .main-banner .main-banner-list-form .main-banner-list-box .main-banner-list-con .main-banner-list.active .main-banner-list-txt{font-weight:700;} .main-banner .main-banner-list-form .main-banner-list-box .main-banner-list-con .main-banner-list.active:hover .main-banner-list-txt{background:rgba(0,0,0,0);} .main-banner .main-banner-list-form .main-banner-list-box .main-banner-active-bg{width:100%; height:100%; background:rgba(0,0,0,0.2); position:absolute; left:0; top:0;} .main-banner .main-banner-list-form .main-banner-list-box .main-banner-list-dom .main-banner-control{position:absolute; right:-30px; top:0;} .main-banner .main-banner-list-form .main-banner-list-box .main-banner-list-dom .main-banner-control .main-banner-stop{cursor:pointer;} .main-banner .main-banner-list-form .main-banner-list-box .main-banner-list-dom .main-banner-control .main-banner-play{cursor:pointer; display:none; } /* main quick contents */ .main-quick{width:1200px; margin:75px auto 0px auto; display:flex; align-items: center; justify-content: center;} /* 기존 메인 quick 주석처리 25.06 개선 작업 */ /*.main-quick .main-quick-box{ width:calc( 50% - 20px ); background:#fff; box-shadow: 0px 16px 22px rgba(0,0,0,0.08) ; height:140px; } .main-quick .main-quick-box .main-quick-list{padding:20px; box-sizing:border-box; display:flex; align-items: center; justify-content: space-between; } .main-quick .main-quick-box .main-quick-list .main-quick-con{width:100px; height:100px;} .main-quick .main-quick-box .main-quick-list .main-quick-con .main-quick-link{display:flex; flex-direction: column; align-items: center; justify-content: space-between; width:100%; height:100%; padding:0 5px; box-sizing:border-box;} .main-quick .main-quick-box .main-quick-list .main-quick-con .main-quick-link .main-quick-txt{ font-size:18px; font-weight:500; letter-spacing: -0.5px; } .main-quick .main-quick-box .main-quick-list .main-quick-con .main-quick-link:hover .main-quick-txt{font-weight:700;} .main-quick .main-usp-form{ width:calc( 50% - 20px ); background:#fff; box-shadow: 0px 16px 22px rgba(0,0,0,0.08) ; height:140px; position:relative; } .main-quick .main-usp-form .main-usp-box{width:100%; height:100%; position:relative;} .main-quick .main-usp-form .main-usp-box .main-usp-list{width:100%; height:100%;} .main-quick .main-usp-form .main-usp-box .main-usp-list .main-usp-con{ width:100%; height:100%; } .main-quick .main-usp-form .main-usp-box .main-usp-list .main-usp-con .main-usp-link{display:flex; align-items: center; width:100%; height:100%; padding:0 60px; box-sizing:border-box; border:1px solid #fff; } .main-quick .main-usp-form .main-usp-box .main-usp-list .main-usp-con .main-usp-link .main-usp-ico{ width:80px; height:80px; border-radius: 80px; background:#f6f6f6; display:flex; align-items: center; justify-content: center; margin-right:20px; } .main-quick .main-usp-form .main-usp-box .main-usp-list .main-usp-con .main-usp-link .main-usp-info .main-usp-title{font-size:24px; letter-spacing: -0.2px; font-weight:700; } .main-quick .main-usp-form .main-usp-box .main-usp-list .main-usp-con .main-usp-link .main-usp-info .main-usp-title span{font-size:24px; letter-spacing: -0.2px; font-weight:700; color:#666; } .main-quick .main-usp-form .main-usp-box .main-usp-list .main-usp-con .main-usp-link .main-usp-info .main-usp-txt{font-size:16px; letter-spacing: -0.2px; font-weight:500; color:#666; margin-top:10px; } .main-quick .main-usp-form .main-usp-box .main-usp-list .main-usp-con .main-usp-link:active{border:1px solid #131313; box-sizing:border-box;} .main-quick .main-usp-form .main-usp-box .main-usp-pagination .swiper-pagination-bullet{width:6px; height:6px; border-radius: 6px; background:rgba(0,0,0,0.2); opacity: 1; margin:0 2px; } .main-quick .main-usp-form .main-usp-box .main-usp-pagination .swiper-pagination-bullet-active{ width:20px; height:6px; border-radius: 6px; background:#131313; opacity: 1; } .main-quick .main-usp-form .main-usp-box .main-usp-pagination{bottom:14px;} .main-quick .main-usp-form .main-usp-prev{position:absolute; left: -20px; top:50%; transform: translate( -0, -50% ); z-index: 1; width:40px; height:40px; } .main-quick .main-usp-form .main-usp-next{position:absolute; right: -20px; top:50%; transform: translate( -0, -50% ); z-index: 1; width:40px; height:40px; } .main-quick .main-usp-form .main-usp-btn{ width:40px; height:40px; border:1px solid #ddd; box-sizing:border-box; border-radius: 40px; display:flex; align-items: center; justify-content: center; position:relative; background:#fff; cursor: pointer; overflow:hidden; } .main-quick .main-usp-form .main-usp-btn img{position:relative; z-index: 2;} .main-quick .main-usp-form .main-usp-btn:hover::after{content:""; display:block; width:100%; height:100%; background:rgba(0,0,0,0.06); position: absolute; left:0; top:0; z-index: 1; } .main-quick .main-usp-form .main-usp-btn:active::after{content:""; display:block; width:100%; height:100%; background:rgba(0,0,0,0.1); position: absolute; left:0; top:0; z-index: 1; } .main-quick .main-quick-box:hover, .main-quick .main-usp-form:hover{ box-shadow: 0px 8px 15px rgba(0,0,0,0.08) ; } */ /* 25.06 메인 개선 */ .main-quick{ position:relative; } .main-quick .main-quick-box{ display:flex; padding-right:49px; position:relative; } .main-quick .main-quick-box::after{ content:""; display:blokc; width:1px; height:80px; background:#eee; position:absolute; right:0; top:5px; } .main-quick .main-quick-box .main-quick-list{ display:flex; align-items:center; gap:48px; } .main-quick .main-quick-box .main-quick-list .main-quick-con{ width:max-content; position:relative; } .main-quick .main-quick-box .main-quick-list .main-quick-con .main-quick-link{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:11px; } .main-quick .main-quick-box .main-quick-list .main-quick-con .main-quick-link .main-quick-ico{ width:56px; height:56px; display:flex; align-items:center; justify-content:center; } .main-quick .main-quick-box .main-quick-list .main-quick-con .main-quick-link .main-quick-ico img{ width:44px; transition:all .3s; } .main-quick .main-quick-box .main-quick-list .main-quick-con .main-quick-link .main-quick-txt{ font-size:16px; font-weight:400; color:#515151; display:flex; align-items:center; justify-content:center; } .main-quick .main-quick-box .main-quick-list .main-quick-con:nth-child(1) .main-quick-link .main-quick-txt, .main-quick .main-quick-box .main-quick-list .main-quick-con:nth-child(2) .main-quick-link .main-quick-txt{ font-size:16px; font-weight:700; color:#131313; } .main-quick .main-quick-box .main-quick-list .main-quick-con .main-quick-link:hover .main-quick-ico img{ width:100%; } .main-quick .main-quick-box .main-quick-list .main-quick-con .main-quick-link:hover .main-quick-txt{ text-decoration:underline; } .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy .main-quick-ico .quick-buy-img{ display:none; } .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy .main-quick-ico .quick-ico-txt { width: 56px; position:relative; display:none; } .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy .main-quick-ico .quick-ico-txt span { font-size: 22px; font-weight: 800; color: #579aff; letter-spacing: -4px; opacity: 0; display: inline-block; line-height:1.2; } .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy.ico-move .main-quick-ico .quick-buy-img{ display:block; animation: quickBuyMotion 1s linear infinite; animation-delay: 1s; } .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy.ico-move .main-quick-ico .quick-ico-txt{ display:none !important; } .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy.txt-move .main-quick-ico .quick-ico-txt{ display:block; } .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy.txt-move .main-quick-ico .quick-buy-img{ display:none !important; } .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy.txt-move .main-quick-ico .quick-ico-txt span{ animation: quickTxtFadeIn .1s forwards; } .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy.ico-hover .main-quick-ico .quick-buy-img{ display:block; } .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy.ico-hover .main-quick-ico .quick-ico-txt{ display:none !important; } /* 순차적으로 나타나는 글자들 */ .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy .main-quick-ico .quick-ico-txt span:nth-child(1) { animation-delay: 0.7s; } .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy .main-quick-ico .quick-ico-txt span:nth-child(2) { animation-delay: 1.2s; } .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy .main-quick-ico .quick-ico-txt span:nth-child(3) { animation-delay: 1.7s; } .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy .main-quick-ico .quick-ico-txt span:nth-child(4) { animation-delay: 2.2s; } .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy .main-quick-ico .quick-ico-txt span:nth-child(5) { animation-delay: 2.7s; } .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy .main-quick-ico .quick-ico-txt span:nth-child(6) { animation-delay: 3.2s; } @keyframes quickBuyMotion { 0% { transform: scaleX(1); } 30%{ transform: scaleX(1); } 50% { transform: scaleX(0); } 70% { transform: scaleX(1); } 100% { transform: scaleX(1); } } @keyframes quickTxtFadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } /* 입력선 깜빡이기 효과 */ .main-quick .main-quick-box .main-quick-list .main-quick-con.quick-buy .main-quick-ico .quick-ico-txt .quick-txt-line{ width:2px; height:22px; background:#579aff; position: absolute; left:0px; top: 2px; left: 100%; font-size: 22px; color: #579aff; animation: blink 1s step-start infinite; transition: transform 0.2s ease-in-out; } @keyframes blink { 50% { opacity: 0; } } .quick-sale-form{ position:absolute; bottom:-84px; left:48px; } .quick-sale-form .quick-sale-box{ display:flex; align-items:center; position:relative; padding:14px 15px 14px 39px; background:#fdfdfd; border:1px solid #f0f0f0; border-radius:5px; } .quick-sale-form .quick-sale-box::after{ content:""; display:block; width:14px; height:8px; background:url(../images/contents/quick_sale_arrow.png) no-repeat center; position:absolute; top:-8px; left:78px; } .quick-sale-form .quick-sale-box .quick-sale-list{ display:flex; align-items:center; gap:28px; padding-right:38px; margin-right:20px; position:relative; } .quick-sale-form .quick-sale-box .quick-sale-list::after{ content:""; display:block; width:1px; height:20px; background:#f0f0f0; position:absolute; right:0; } .quick-sale-form .quick-sale-box .quick-sale-list .quick-sale-con{ display:flex; align-items:center; } .quick-sale-form .quick-sale-box .quick-sale-list .quick-sale-con a{ display:flex; align-items:center; gap:6px; width:max-content; } .quick-sale-form .quick-sale-box .quick-sale-list .quick-sale-con a .txt{ font-size:14px; font-weight:700; color:#515151; } .quick-sale-form .quick-sale-box .quick-sale-all{ } .quick-sale-form .quick-sale-box .quick-sale-all a{ display:flex; align-items:center; gap:6px; width:max-content; } .quick-sale-form .quick-sale-box .quick-sale-all a .txt{ font-size:14px; font-weight:700; color:#515151; } .main-usp-form{ width:374px; margin-left:48px; position:relative; } .main-usp-form .main-usp-box{ width:100%; } .main-usp-form .main-usp-box .main-usp-list .main-usp-con{ width:100%; display:flex; align-items:center; justify-content:center; } .main-usp-form .main-usp-box .main-usp-list .main-usp-con .main-usp-link{ display:flex; align-items:center; padding:0 40px; width:340px; height:93px; border:1px solid #eee; border-radius:5px; background:#fff; gap:8px; } .main-usp-form .main-usp-box .main-usp-list .main-usp-con .main-usp-link .main-usp-ico{ width:52px; } .main-usp-form .main-usp-box .main-usp-list .main-usp-con .main-usp-link .main-usp-info .main-usp-title{ font-size:16px; font-weight:700; color:#131313; } .main-usp-form .main-usp-box .main-usp-list .main-usp-con .main-usp-link .main-usp-info .main-usp-txt{ font-size:14px; font-weight:500; color:#666; margin-top:8px; } .main-usp-form .main-usp-prev, .main-usp-form .main-usp-next{ top:50%; position:absolute; transform: translate(-0, -50%); z-index:2; } .main-usp-form .main-usp-prev{ left:2px; } .main-usp-form .main-usp-next{ right:2px; } .main-usp-form .main-usp-btn{ width:28px; height:28px; border-radius:28px; border:1px solid #ddd; background:#fafbfd; display:flex; align-items:center; justify-content:center; cursor:pointer; position:relative; overflow:hidden; } .main-usp-form .main-usp-btn img{ position:relative; z-index:1; } .main-usp-form .main-usp-btn:hover::after{ content:""; display:block; width:100%; height:100%; background:rgba(0,0,0,0.015); position:absolute; left:0; top:0; } .main-usp-form .main-usp-pagination{ bottom:-15px; } .main-usp-form .main-usp-pagination .swiper-pagination-bullet{ width:6px; height:6px; border-radius:6px; background:rgba(0,0,0,0.2); margin:0 2px; opacity:1; } .main-usp-form .main-usp-pagination .swiper-pagination-bullet-active{ width:20px; background:#131313; } /* 맞춤 정보 설정 팝업 */ #carSearchCustomPop{height:695px; display:none;} #carSearchCustomPop .layer-pop-body{padding-bottom:0px !important;} #carSearchCustomPop .car-custom-form{width:100%; height:100%; display:flex; flex-direction: column; justify-content: space-between; } #carSearchCustomPop .car-custom-form .car-custom-step-box{display:none;} #carSearchCustomPop .car-custom-form .car-custom-step-box.active{display:flex;} #carSearchCustomPop .car-custom-form .car-custom-step01{flex-direction: column; align-items: center; justify-content: center; padding-top:137px; box-sizing:border-box; } #carSearchCustomPop .car-custom-form .car-custom-step01 .car-custom-ico{ display:flex; align-items: center; justify-content: center; width:100px; height:100px; border-radius: 100px; background:#f4f9ff; } #carSearchCustomPop .car-custom-form .car-custom-step01 .car-custom-title{margin-top:32px; font-size: 24px; font-weight:700; letter-spacing: -0.2px; } #carSearchCustomPop .car-custom-form .car-custom-step01 .car-custom-txt{margin-top:13px; font-size: 18px; font-weight:400; letter-spacing: -0.2px; line-height:1.4; color:#666; text-align: center; } #carSearchCustomPop .car-custom-form .car-custom-step02{height:calc( 100% - 60px );} #carSearchCustomPop .car-custom-form .car-custom-step03{height:calc( 100% - 60px );} #carSearchCustomPop .car-custom-form .car-custom-step-box .car-custom-chk-form .car-custom-chk-hd{display:flex; align-items: center; justify-content: space-between; margin-top:40px; } #carSearchCustomPop .car-custom-form .car-custom-step-box .car-custom-chk-form .car-custom-chk-hd .title{font-size:18px; letter-spacing: -0.2px; } #carSearchCustomPop .car-custom-form .car-custom-step-box .car-custom-chk-form .car-custom-chk-hd .txt{font-size:16px; letter-spacing: -0.2px; color:#999; } #carSearchCustomPop .car-custom-form .car-custom-step-box .car-custom-chk-form .car-custom-chk-box{margin-top:35px;} #carSearchCustomPop .car-custom-form .car-custom-step-box .car-custom-chk-form .car-custom-chk-box .check-btn-box .check-btn{width:calc( 50% - 5px ); margin-bottom:10px; } #carSearchCustomPop .car-custom-form .car-custom-step-box .car-custom-chk-form .car-custom-chk-box .check-btn-box .check-btn label span{font-size:14px;} #carSearchCustomPop .car-custom-form .car-custom-info-txt{width:100%; height:50px; display:none; align-items: center; justify-content: center; background:#f9f9f9; font-size:14px; letter-spacing: -0.2px; color:#515151; } #carSearchCustomPop .car-custom-form .car-custom-info-txt b{font-size:14px; letter-spacing: -0.2px; color:#515151; padding-left:3px; } #carSearchCustomPop .car-custom-form .car-custom-step04{flex-direction: column; align-items: center; justify-content: center; box-sizing:border-box; height:100%; } #carSearchCustomPop .car-custom-form .car-custom-step04 .car-custom-ico{ display:flex; align-items: center; justify-content: center; width:100px; height:100px; border-radius: 100px; background:#f4f9ff; } #carSearchCustomPop .car-custom-form .car-custom-step04 .car-custom-title{margin-top:32px; font-size: 18px; font-weight:700; letter-spacing: -0.2px; } #carSearchCustomPop .car-custom-form .car-custom-step04 .car-custom-txt{margin-top:10px; font-size: 16px; font-weight:400; letter-spacing: -0.2px; line-height:1.4; color:#666; text-align: center; } #carSearchCustomPop .car-custom-form .car-custom-alert{flex-direction: column; align-items: center; justify-content: center; box-sizing:border-box; height:100%; } #carSearchCustomPop .car-custom-form .car-custom-alert .car-custom-ico{ display:flex; align-items: center; justify-content: center; width:100px; height:100px; border-radius: 100px; background:#ffecec; } #carSearchCustomPop .car-custom-form .car-custom-alert .car-custom-title{margin-top:32px; font-size: 18px; font-weight:700; letter-spacing: -0.2px; } #carSearchCustomPop .car-custom-form .car-custom-alert .car-custom-txt{margin-top:10px; font-size: 16px; font-weight:400; letter-spacing: -0.2px; line-height:1.4; color:#666; text-align: center; } #carSearchCustomPop .car-custom-form .car-custom-progress{width:100%; position:relative; display:none; margin-bottom:1px;} #carSearchCustomPop .car-custom-form .car-custom-progress .car-ico{position: absolute; left:0; bottom:0;} #carSearchCustomPop .car-custom-form .car-custom-progress .bar{width:0%; height:2px; background:#0061FD;} #carSearchCustomPop .layer-pop-head .layer-pop-close .custom-pop-close-btn{width:24px; height:24px; position:relative; cursor: pointer; } #carSearchCustomPop .layer-pop-head .layer-pop-close .custom-pop-close-btn::before{content:""; display:block; width:1px; height:24px; background:#131313; transform: rotate( 45deg ); position: absolute; left:12px; top:0; } #carSearchCustomPop .layer-pop-head .layer-pop-close .custom-pop-close-btn::after{content:""; display:block; width:1px; height:24px; background:#131313; transform: rotate( 135deg ); position: absolute; left:12px; top:0; } /* main 검색영역 */ .main-search-form{width:1200px;margin:0 auto; display:flex; align-items: center; justify-content: space-between; } .main-search-form .main-search-box{width:calc( 50% - 10px ); height:335px; border:1px solid #ddd; box-sizing:border-box; } .main-search-form .main-search-box .main-default-search{width:100%; height:100%; padding:71px 49px 39px 49px; box-sizing:border-box; } .main-search-form .main-search-box .main-default-search .default-search-title{ height:26px; display:flex; align-items: center; font-size:22px; font-weight:500; letter-spacing: -0.2px; } .main-search-form .main-search-box .main-default-search .default-search-box{height:40px; margin-top:12px;} .main-search-form .main-search-box .main-default-search .default-search-box .seach-box{width:100%; height:40px; border-bottom: 2px solid #131313; box-sizing:border-box; position:relative; padding: 0px 14px 0px 14px; display:flex; align-items: center; } .main-search-form .main-search-box .main-default-search .default-search-box .seach-box .main-search-inpt{width:calc( 100% - 60px ); height:100%; font-size:18px; font-weight:400; color:#131313; letter-spacing: -0.2px; border:0px; outline: none; } .main-search-form .main-search-box .main-default-search .default-search-box .seach-box .main-search-inpt::placeholder{font-size:18px; font-weight:400; color:#999; letter-spacing: -0.2px;} .main-search-form .main-search-box .main-default-search .default-search-box .seach-box .search-btn-box{display:flex; align-items: center; margin-left:10px; width:50px; justify-content: flex-end; } .main-search-form .main-search-box .main-default-search .default-search-box .seach-box .search-btn-box .main-search-delete{width:16px; height:16px; border-radius: 16px; background:#ddd; cursor:pointer; display:none; align-items: center; justify-content: center; margin-right:10px; position:relative; overflow:hidden; } .main-search-form .main-search-box .main-default-search .default-search-box .seach-box .search-btn-box .main-search-delete.active{display:flex;} .main-search-form .main-search-box .main-default-search .default-search-box .seach-box .search-btn-box .main-search-delete:hover::before{content:""; width:100%; height:100%; display:block; background:rgba(0,0,0,0.06); position:absolute; left:0; top:0; } .main-search-form .main-search-box .main-default-search .default-search-box .seach-box .search-btn-box .main-search-delete:active::before{content:""; width:100%; height:100%; display:block; background:rgba(0,0,0,0.1); position:absolute; left:0; top:0; } .main-search-form .main-search-box .main-default-search .default-search-box .seach-box .search-btn-box .main-search-delete img{z-index: 2; position:relative; } .main-search-form .main-search-box .main-default-search .default-search-list{margin-top:20px; width:100%; display:flex; align-items: center;} .main-search-form .main-search-box .main-default-search .default-search-list .search-list-form{width:calc( 100% - 59px ); } .main-search-form .main-search-box .main-default-search .default-search-list .search-list-form .search-list-box{width:100%; display:flex; align-items: center;} .main-search-form .main-search-box .main-default-search .default-search-list .search-list-form .search-list-box .search-list-con{margin-right:6px; display:flex; align-items: center; justify-content: center; background:#fff; height:44px; padding:0 10px; border:1px solid #ddd; box-sizing:border-box; border-radius: 2px; width:auto; } .main-search-form .main-search-box .main-default-search .default-search-list .search-list-form .search-list-box .search-list-con a{font-size:16px; letter-spacing: -0.2px; color:#515151; white-space: nowrap; display:flex; align-items: center; justify-content: center;width:100%; height:100%;} .main-search-form .main-search-box .main-default-search .default-search-list .search-list-form .search-list-box .search-list-con:hover{border:1px solid #cde0ff; background:#f4f9ff;} .main-search-form .main-search-box .main-default-search .default-search-list .search-list-form .search-list-box .search-list-con:hover a{color:#579aff;} .main-search-form .main-search-box .main-default-search .default-search-list .search-list-form .search-list-box .search-list-con:active{border:1px solid #131313; background:#fff;} .main-search-form .main-search-box .main-default-search .default-search-list .search-list-form .search-list-box .search-list-con:active a{color:#333;} .main-search-form .main-search-box .main-default-search .default-search-list .search-list-arrow{ width:59px; display:flex; align-items: center; } .main-search-form .main-search-box .main-default-search .default-search-list .search-list-arrow .search-list-btn{display:flex; align-items: center;} .main-search-form .main-search-box .main-default-search .default-search-list .search-list-arrow .search-list-btn::after{ content:""; width:1px; height:12px; background:#ddd; display:block; margin:0 5px; } .main-search-form .main-search-box .main-default-search .default-search-list .search-list-arrow .search-list-btn:last-child::after{display:none;} .main-search-form .main-search-box .main-default-search .default-search-list .search-list-arrow .search-list-btn .search-list-prev{width:24px; height:24px; cursor: pointer; background:url(../images/contents/cycle_prev.png) no-repeat center; } .main-search-form .main-search-box .main-default-search .default-search-list .search-list-arrow .search-list-btn .search-list-next{width:24px; height:24px; cursor: pointer; background:url(../images/contents/cycle_next.png) no-repeat center;} .main-search-form .main-search-box .main-default-search .default-search-list .search-list-arrow .search-list-btn .search-list-prev.swiper-button-disabled{background:url(../images/contents/cycle_prev_disabled.png) no-repeat center;} .main-search-form .main-search-box .main-default-search .default-search-list .search-list-arrow .search-list-btn .search-list-next.swiper-button-disabled{background:url(../images/contents/cycle_next_disabled.png) no-repeat center;} .main-search-form .main-search-box .main-default-search .default-search-btn{margin-top:32px;} .main-search-form .main-search-box .main-default-search .default-search-btn .btn-box .main-car-search{margin-right:0px;} .main-search-form .main-search-box .main-default-search .default-search-btn .btn-box .btn span{font-size:16px;} /* 메인 검색 영역 텝 */ .main-search-form .main-search-box .main-detail-search{width:100%; height:100%;} .main-search-form .main-search-box .main-detail-search .main-detail-tab{width:100%; display:flex; align-items: center; height:52px; } .main-search-form .main-search-box .main-detail-search .main-detail-tab .main-detail-tab-con{width:196px; height:52px; border-bottom:1px solid #ddd; border-right:1px solid #ddd; display:flex; align-items: center; justify-content: center; background:#f6f6f6; box-sizing:border-box; cursor: pointer; font-size:16px; font-weight:500; letter-spacing: -0.2px; color:#333; } .main-search-form .main-search-box .main-detail-search .main-detail-tab .main-detail-tab-con:last-child{border-right:0px;} .main-search-form .main-search-box .main-detail-search .main-detail-tab .main-detail-tab-con.active{ background:#fff; border-bottom:#fff; border-right:0px; color:#131313; font-weight:700; } .main-search-form .main-search-box .main-detail-search .main-detail-tab .main-detail-tab-con.active-next{ border-left:1px solid #ddd; border-radius: 0px 0px 0px 5px; } .main-search-form .main-search-box .main-detail-search .main-detail-tab .main-detail-tab-con.active-prev{ border-radius: 0px 0px 5px 0px; } .main-search-form .main-search-box .main-detail-search .main-detail-form{ width:100%; padding:0px 50px 40px 50px; box-sizing:border-box; height:calc( 100% - 52px ); } .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box{ width:100%; height:100%; } .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con{width:100%; height:calc( 100% - 48px ); display:flex; flex-direction: column; align-items: center; justify-content: center; } .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .main-detail-con-tit{width:100%; font-size:14px; letter-spacing: -0.2px; font-weight:500; } .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .main-detail-select{width:100%; display:flex; align-items: center; justify-content: space-between; margin-top:10px; } .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .main-detail-select .select-box{width:156px;} .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-btn-box{width:100%; display:flex; align-items: center; justify-content: space-between;} .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-btn-box .btn-blue{width:334px;} .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-btn-box .btn-ico{width:151px; margin-left:5px;} .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .btn span{font-size:16px;} .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .detail-pay-tit{width:100%; display:flex; align-items: center; justify-content: space-between; } .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .detail-pay-tit .pay-tit{font-size:14px; font-weight:500; letter-spacing: -0.2px; color:#333;} .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .detail-pay-tit .pay-txt{font-size:14px; letter-spacing: -0.2px; color:#333;} .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .detail-pay-tit .pay-txt span{font-size:14px; letter-spacing: -0.2px; color:#333;} .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .detail-pay-select{width:100%; display:flex; align-items: center; justify-content: space-between; margin-top:10px;} .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .detail-pay-select .select-box:first-child{width:calc(50% - 16px);} .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .detail-pay-select .select-box:last-child{width:calc(50% - 16px);} .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .detail-pay-select span{font-size:16px; letter-spacing: -0.2px; font-weight:700; } .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .detail-pay-bar-box{width:100%; position:relative; margin-top:17px; height:18px; display:flex; } .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .detail-pay-bar-box .detail-pay-bar{position: relative; width:calc( 100% - 18px ); height:4px; background:#f3f3f3; border:0px; margin-left:6px;} .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .detail-pay-bar-box .ui-widget-header{ background:#0061FD; } .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .detail-pay-bar-box .ui-slider-handle{cursor: pointer; position: absolute; width:18px; height:18px; border-radius: 18px; background:#fff; border:1px solid #131313; box-sizing:border-box; top:-7px; } .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .detail-bar-status{display:flex; align-items: center; justify-content: space-between; width:100%;} .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .main-detail-con .detail-bar-status span{font-size:12px; color:#999; letter-spacing: -0.2px; font-weight:500;} .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .check-btn-box{justify-content: flex-start;margin-top:6px;} .main-search-form .main-search-box .main-detail-search .main-detail-form .main-detail-box .check-btn-box .check-btn-s{margin-right:6px; margin-bottom:6px;} /* 메인 이벤트 배너 */ .main-event-banner{width:100%; height:280px;} .main-event-banner .main-event-banner-box{width:100%; height:100%; position:relative; } .main-event-banner .main-event-banner-box .main-event-banner-con{width:100%; height:100%; text-align: center;} .main-event-banner .main-event-banner-box .main-event-banner-con a{margin:0 auto; text-align: center; display:block; cursor: pointer;} .main-event-banner .main-event-banner-box .main-event-banner-con a img{margin:0 auto; width:1200px; max-width:unset;} .main-event-banner .main-event-banner-paging{width:1200px; margin:0 auto; position:relative;} .main-event-banner .main-event-banner-paging .event-banner-pagination{left:69px; bottom:37px; text-align: left;} .main-event-banner .main-event-banner-paging .event-banner-pagination .swiper-pagination-bullet{width:6px; height:6px; border-radius: 6px; background:rgba(0,0,0,0.2); opacity: 1; margin:0 2px; } .main-event-banner .main-event-banner-paging .event-banner-pagination .swiper-pagination-bullet-active{ width:20px; height:6px; border-radius: 6px; background:#131313; opacity: 1; } /* 메인 loop 배너 */ /* 메인 lp */ .main-lp-form{width:1200px; margin:0 auto; position:relative;} .main-lp-form .main-lp-box{margin-top:20px;} .main-lp-form .main-lp-box .lp-form .lp-box{flex-wrap: nowrap;} .main-lp-form .main-lp-tab{position: relative;} .main-lp-form .main-lp-tab .main-lp-btn{ display:none; align-items: center; font-size:14px; letter-spacing: -0.2px; color:#666; position:absolute; right:0; top:50%; transform: translate( -0, -49.99% ); } .main-lp-form .main-lp-tab .main-lp-btn::before{content:""; display:block; width:24px; height:24px; background:url(../images/contents/main_lp_plus.png) no-repeat center; margin-right:8px; } .main-lp-form .main-lp-tab .main-lp-btn.active{display:flex;} .main-lp-form .main-lp-box .lp-form .lp-box{gap:unset;} .main-promotion-form .lp-form .lp-box{gap:unset;} .main-finance-form .lp-form .lp-box{gap:unset;} .main-lp-form .main-lp-box .loop-btn-box{margin-top:50px;} /* 메인 프로모션 */ .main-promotion-form{width:100%;} .main-promotion-form .main-promotion-box{width:1200px;margin:30px auto 0 auto;} .main-promotion-form .main-promotion-box .main-promotion-banner{ width:100%; height:140px; background-repeat: no-repeat; background-position: center center; display:flex; align-items: center; justify-content: space-between; padding:0 47px 0 66px; box-sizing:border-box; } .main-promotion-form .main-promotion-box .main-promotion-banner .main-promotion-title{font-size:28px; font-weight:500; letter-spacing: -0.2px;} .main-promotion-form .main-promotion-box .main-promotion-banner .main-promotion-more{height:48px;} .main-promotion-form .lp-form{margin-top:30px;} .main-promotion-form .lp-form .lp-box{flex-wrap: nowrap;} .main-promotion-form .main-promotion-view{display:flex; flex-direction: column; align-items: center; justify-content: center; width:100%; height:208px; border-radius: 4px; background:#f9f9f9; } .main-promotion-form .main-promotion-view .view-more-ico{width:80px; height:80px; border-radius: 80px; background:#fff; display:flex; align-items: center; justify-content: center; } .main-promotion-form .main-promotion-view .view-more-txt{ margin-top:14px; font-size:14px; font-weight:500; color:#666; letter-spacing: -0.2px; } .main-promotion-form .main-promotion-box .loop-btn-box{margin-top:50px;} /* 메인 후기 */ .main-review-section{padding:100px 0; box-sizing:border-box; background:#f9f9f9; margin-top:100px;} .main-review-form{width:1200px; margin:0 auto;} .main-review-form .main-review-usp-form{width:100%; display:flex; align-items: center; gap:20px;} .main-review-form .main-review-usp-form .main-review-usp-box{display:flex; width:calc(50% - 10px); align-items: center; justify-content: space-between; height:150px; box-sizing:border-box; } .main-review-form .main-review-usp-form .main-review-usp-box .main-review-usp-con .main-review-usp-txt{ font-size:18px; font-weight:500; letter-spacing: -0.5px; } .main-review-form .main-review-usp-form .main-review-usp-box .main-review-usp-con .main-review-usp-title{ font-size:24px; font-weight:700; letter-spacing: -0.5px; margin-top:10px; } .main-review-form .main-review-usp-form .main-review-usp-box .main-review-usp-con .main-review-usp-more{ font-size:14px; font-weight:500; letter-spacing: -0.5px; margin-top:15px; color:rgba(0,0,0,0.7); } .main-review-form .main-review-usp-form .main-review-usp-box .main-review-usp-img{margin-top:5px;} .main-review-form .main-review-usp-form .main-review-usp-box.care .main-review-usp-con .main-review-usp-txt{ color:#fff; } .main-review-form .main-review-usp-form .main-review-usp-box.care .main-review-usp-con .main-review-usp-title{ color:#fff; } .main-review-form .main-review-usp-form .main-review-usp-box.care .main-review-usp-con .main-review-usp-more{ color:rgba(255,255,255,0.7); } .main-review-form .main-review-box{margin-top:80px;} .main-review-form .main-review-box .main-review-tab{position:relative;} .main-review-form .main-review-box .main-review-tab .review_view_more{position:absolute; right:0; top:50%; transform: translate( -0, -49.99% ); font-size:14px; letter-spacing: -0.2px; color:#666; } .main-review-form .main-review-box .main-review-tab .review_view_more span{font-size:14px; letter-spacing: -0.2px; color:#666; } .main-review-form .main-review-box .main-review-container{width:100%; margin-top:40px; position:relative;} .main-review-form .main-review-box .main-review{width:100%; position:relative;} .main-review-form .main-review-box .main-review .main-review-list{width:100%; display:flex; align-items: center;} .main-review-form .main-review-box .main-review .main-review-list .main-review-con{width:360px; height:250px;} .main-review-form .main-review-box .main-review .main-review-list .main-review-con .main-review-card{width:100%; height:100%; display:flex; flex-direction: column; background:#fff; padding:40px; box-sizing:border-box;} .main-review-form .main-review-box .main-review .main-review-list .main-review-con .main-review-card .main-review-head{width:100%; height:24px; display:flex; align-items: center; justify-content: space-between; } .main-review-form .main-review-box .main-review .main-review-list .main-review-con .main-review-card .main-review-head .car-name{ width:calc( 100% - 100px ); font-size: 16px; font-weight:500; letter-spacing: -0.2px; } .main-review-form .main-review-box .main-review .main-review-list .main-review-con .main-review-card .main-review-head .star-count{width:88px; height:16px; display:flex; justify-content: space-between;} .main-review-form .main-review-box .main-review .main-review-list .main-review-con .main-review-card .main-review-head .star-count span{display:block; width:16px; height:16px; background:url(../images/contents/review_star.png) no-repeat center; } .main-review-form .main-review-box .main-review .main-review-list .main-review-con .main-review-card .main-review-head .star-count span.star{background:url(../images/contents/review_star_on.png) no-repeat center;} .main-review-form .main-review-box .main-review .main-review-list .main-review-con .main-review-card .main-review-body{ width:100%; height:84px; margin-top:20px; } .main-review-form .main-review-box .main-review .main-review-list .main-review-con .main-review-card .main-review-body .main-review-title{height:26px; display:flex; align-items: center; width:100%; font-size:18px; letter-spacing: -0.2px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .main-review-form .main-review-box .main-review .main-review-list .main-review-con .main-review-card .main-review-body .main-review-summery{ width:100%; display: -webkit-box; align-items: center; font-size: 16px; letter-spacing: -0.2px; margin-top:10px; line-height:1.4; word-break: break-all; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .main-review-form .main-review-box .main-review .main-review-list .main-review-con .main-review-card .main-review-ft{width:100%; height:22px; display:flex; align-items: center; justify-content: space-between; margin-top:20px; } .main-review-form .main-review-box .main-review .main-review-list .main-review-con .main-review-card .main-review-ft .main-review-user{font-size:14px; letter-spacing: -0.2px; color:#999;} .main-review-form .main-review-box .main-review .main-review-list .main-review-con .main-review-card .main-review-ft .main-review-user span{font-size:14px; letter-spacing: -0.2px; color:#131313;} .main-review-form .main-review-box .main-review .main-review-list .main-review-con .main-review-card .main-review-ft .main-review-date{font-size:14px; letter-spacing: -0.2px; color:#999;} /* 메인 렌트 / 구독 */ .main-rent-section{width:100%; padding-top:100px; height:740px; box-sizing:border-box; background:#000 url(../images/contents/bg_main_rent.png) no-repeat center; } .main-rent-section .main-title{color:#fff; position: relative; width:1200px; margin:0 auto; } .main-rent-section .main-title a{ position:absolute; right:0; top:50%; transform: translate( -0, -49.99% ); color:#fff; font-size:14px; letter-spacing: -0.2px; } .main-rent-form{width:1200px; margin:0 auto; } .main-rent-form .lp-infos .lp-summery li{color:#acacac;} .main-rent-form .lp-infos .lp-car-model .lp-car-name{color:#fff;} .main-rent-form .lp-infos .lp-car-model .lp-car-trim{color:#fff;} .main-rent-form .lp-infos .lp-rent-pay{ display:flex; align-items: center; height:26px; margin-top:12px;} .main-rent-form .lp-infos .lp-rent-pay .discount{color:#999; font-size:14px; letter-spacing: -0.2px; position:relative; margin-right:4px; } .main-rent-form .lp-infos .lp-rent-pay .discount::after{content:""; width:100%; height:1px; background:#999; position:absolute; left:0; top:50%; transform: translate(-0, -50%);} .main-rent-form .lp-infos .lp-rent-pay .rent-pay{font-size:18px; letter-spacing: -0.2px; color:#0061FD; } .main-rent-form .lp-infos .lp-rent-pay .rent-pay span{font-size:18px; letter-spacing: -0.2px; color:#0061FD; font-weight:700;} .main-rent-form .lp-infos .lp-rent-vat{ height:16px; display:flex; align-items: center; margin-top:2px; font-size:12px; letter-spacing: -0.2px; color:#999; } .main-rent-form .lp-infos .lp-bage .bage{background:rgba(255,255,255,0.2); color:#fff; } /* 메인 금융 */ .main-finance-form .main-finance-box{width:1200px; margin:0 auto; clear: both;} .main-finance-form .main-finance-box .main-finance-banner{margin:20px auto; width:100%; display: none; align-items: center; justify-content: center; height: 60px; } .main-finance-form .main-finance-box .main-finance-banner .main-finance-logo{margin-right:20px;} .main-finance-form .main-finance-box .main-finance-banner .main-finance-title{font-size:16px; font-weight:300;} .main-finance-form .main-finance-box .main-finance-banner .main-finance-title font{font-size:16px;} .main-finance-form .main-finance-box .main-finance-banner .main-finance-title span{font-size:16px; font-weight:700;} .main-finance-form .main-finance-box .main-finance-banner .main-finance-title b{font-size:16px; font-weight:700;} .main-finance-form .main-finance-box .main-finance-banner .main-finance-more span{ font-size:16px; font-weight:300; } .main-finance-form .main-finance-box .main-finance-banner.active{display:flex;} .main-finance-form .main-finance-box .main-finance-banner a{display:flex; align-items: center;} .main-finance-form .main-finance-box .main-finance-banner a::before{content:""; display:block; width:1px; height:20px; background:#ddd; margin:0 20px; } .main-finance-form .lp-form .lp-box{flex-wrap: nowrap;} .main-finance-form .main-finance-box .loop-btn-box{margin-top:50px;} /* 메인 추천영상 */ .main-video-section .main-title{position: relative; width:1200px; margin:0 auto; } .main-video-section .main-title a{ position:absolute; right:0; top:50%; transform: translate( -0, -49.99% ); color:#666; font-size:14px; letter-spacing: -0.2px; } .main-video-form{width:1200px; margin:0 auto;} .main-video-form .main-video-box{width:100%;} .main-video-form .main-video-box .main-video-list{width:100%; display:flex; justify-content: space-between;} .main-video-form .main-video-box .main-video-list .main-video-con{width:276px;} .main-video-form .main-video-box .main-video-list .main-video-con .video-box{display:block; width:100%;} .main-video-form .main-video-box .main-video-list .main-video-con .video-box .video-thumnail{ width:100%; height:154px; position: relative; overflow: hidden; } .main-video-form .main-video-box .main-video-list .main-video-con .video-box .video-thumnail img{position: absolute; left:50%; top:50%; transform: translate( -50% , -50% );} .main-video-form .main-video-box .main-video-list .main-video-con .video-box .video-title{font-size:16px; letter-spacing: -0.2px; line-height:1.3; width:100%; overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2 ; margin-top:16px; } .main-video-form .main-video-box .main-video-list .main-video-con .video-box .video-name{font-size:14px; letter-spacing: -0.2px; color:#666; display:flex; align-items: center; margin-top:10px;} .main-video-form .main-video-box .main-video-list .main-video-con .video-box .video-name::before{content:""; display:block; width:20px; height:20px; background:url(../images/contents/ic_youtube.png) no-repeat center; margin-right:4px;} /* 메인 제조사 swiepr */ .main-brand-form{width:100%; overflow: hidden; } .main-brand-form .main-brand-box{width:1200px; margin:0 auto; overflow:visible;} .main-brand-form .main-brand-box .main-brand-list .main-brand-con{width:200px;} .main-brand-form .main-brand-box .main-brand-list .main-brand-con .brand-box{display:block; width:100%; cursor: pointer; border:1px solid #ddd; box-sizing:border-box;} .main-brand-form .main-brand-box .main-brand-list .main-brand-con .brand-box .brand-thumnail{width:100%; height:74px; display:flex; align-items: center; justify-content: center;} .main-brand-form .main-brand-box .main-brand-list .main-brand-con .brand-box .brand-thumnail img{scale:0.55;} .main-brand-form .main-brand-box .main-brand-list .main-brand-con .brand-box .brand-name{ width:100%; height:38px; display:flex; align-items: center; justify-content: center; background:#f9f9f9; overflow: hidden; position:relative; } .main-brand-form .main-brand-box .main-brand-list .main-brand-con .brand-box:hover .brand-name::after{content:""; display:block; width:100%; height:100%; background:rgba(0,0,0,0.06); position:absolute; left:0; top:0; z-index: 1; } .main-brand-form .main-brand-box .main-brand-list .main-brand-con .brand-box:active .brand-name::after{content:""; display:block; width:100%; height:100%; background:rgba(0,0,0,0.1); position:absolute; left:0; top:0; z-index: 1; } .main-brand-form .main-brand-box .main-brand-list .main-brand-con .brand-box .brand-name span{position:relative; z-index: 2; font-size:14px; letter-spacing: -0.2px; font-weight:500; } .main-brand-form .main-brand-control{width:1200px; height:24px; position:relative; margin:20px auto 0 auto; display:flex; align-items: center; justify-content: space-between; } .main-brand-form .main-brand-control .main-brand-btn{width:59px; display: flex; align-items: center;} .main-brand-form .main-brand-control .main-brand-btn div img{cursor: pointer;} .main-brand-form .main-brand-control .main-brand-btn .main-brand-prev{display:flex; align-items: center;} .main-brand-form .main-brand-control .main-brand-btn .main-brand-prev::after{content:""; display:block; width:1px; height:12px; background:#ddd; margin:0 5px; } .swiper-pagination-progressbar.main-brand-paging{ position:relative; width:calc( 100% - 79px ); background:#e3e3e3; height:2px; } .swiper-pagination-progressbar.main-brand-paging .swiper-pagination-progressbar-fill{ background:#131313; } /* 입고 알림 신청 */ .car-wait-header{width:100%; display:flex; align-items: center; justify-content: center; height:80px;} .car-wait-header .car-wait-ico{ width:32px; height: 32px; border-radius: 32px; background:#f6f6f6; display:flex; align-items: center; justify-content: center; } .car-wait-header .car-wait-txt{font-size:16px; margin-left:8px; } .car-wait-header .car-wait-txt span{font-size:16px; font-weight:700;} .car-wait-info{width:100%; padding:20px; box-sizing:border-box; background: #f9f9f9; } .car-wait-info .car-name{ font-size:24px; font-weight:700; width:100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .car-wait-info .car-info{width:100%; display:flex; align-items: center; margin-top:10px; } .car-wait-info .car-info li{font-size:14px; color:#666; white-space: nowrap; padding-right:15px; box-sizing:border-box; position:relative;} .car-wait-info .car-info li::after{content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#ddd; position: absolute; right:6px; top:50%; transform: translate( -0, -50% ); } .car-wait-info .car-info li:last-child{overflow: hidden; text-overflow: ellipsis; padding-right:0px; } .car-wait-info .car-info li:last-child::after{display:none;} .car-wait-form{width:100%; padding-bottom:30px; box-sizing:border-box; margin-top:30px; background:#fff; } .car-wait-form.car-ty{margin-top:0px;} .car-wait-form .car-wait-title{width:100%; display:flex; align-items: center; justify-content: space-between;} .car-wait-form .car-wait-title .title{font-size:18px; font-weight:700;} .car-wait-form .car-wait-title .sub-txt{ font-size:14px; color:#515151; display:flex;} .car-wait-form .car-wait-title .sub-txt span{font-size:14px;} .car-wait-form .car-wait-box{width:100%; margin-top:24px; border-top:1px solid #131313; box-sizing:border-box; } .car-wait-form .car-wait-box .car-wait-con{width:100%; display:flex; padding:10px 0px; box-sizing:border-box; border-bottom:1px solid #eee;} .car-wait-form .car-wait-box .car-wait-con .car-wait-con-th{margin-top:10px; font-size:15px; height:24px; font-weight:500; width:145px; display:flex; align-items: center; } .car-wait-form .car-wait-box .car-wait-con .car-wait-con-th::after{font-size:16px; font-weight:700;} .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td{width:calc( 100% - 145px ); display:flex; align-items: center; flex-wrap: wrap; } .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .select-box .select-choice{height:44px; font-size:14px; } .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .select-box .select-list{top:44px;} .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .wait-country-ty{width:160px; margin-right:10px;} .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .wait-brand-ty{width:calc( 100% - 170px );} /* 입고알림 신청 주행거리 */ .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-mileage-select {width:100%; display:flex; align-items: center; justify-content: space-between;} .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-mileage-select .select-box:first-child{width:calc(50% - 16px);} .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-mileage-select .select-box:last-child{width:calc(50% - 16px);} .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-mileage-select span{font-size:16px; letter-spacing: -0.2px; font-weight:700; } .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-mileage-bar-box{width:100%; position:relative; margin-top:17px; height:18px; display:flex; } .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-mileage-bar-box .car-wait-mileage-bar{position: relative; width:calc( 100% - 18px ); height:4px; background:#f3f3f3; border:0px; margin-left:6px;} .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-mileage-bar-box .ui-widget-header{ background:#0061FD; } .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-mileage-bar-box .ui-slider-handle{cursor: pointer; position: absolute; width:18px; height:18px; border-radius: 18px; background:#fff; border:1px solid #131313; box-sizing:border-box; top:-7px; } .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-mileage-bar-status{display:flex; align-items: center; justify-content: space-between; width:100%;} .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-mileage-bar-status span{font-size:12px; color:#999; letter-spacing: -0.2px; font-weight:500;} /* 입고알림 가격대 */ .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-pay-select {width:100%; display:flex; align-items: center; justify-content: space-between;} .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-pay-select .select-box:first-child{width:calc(50% - 16px);} .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-pay-select .select-box:last-child{width:calc(50% - 16px);} .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-pay-select span{font-size:16px; letter-spacing: -0.2px; font-weight:700; } .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-pay-bar-box{width:100%; position:relative; margin-top:17px; height:18px; display:flex; } .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-pay-bar-box .car-wait-pay-bar{position: relative; width:calc( 100% - 18px ); height:4px; background:#f3f3f3; border:0px; margin-left:6px;} .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-pay-bar-box .ui-widget-header{ background:#0061FD; } .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-pay-bar-box .ui-slider-handle{cursor: pointer; position: absolute; width:18px; height:18px; border-radius: 18px; background:#fff; border:1px solid #131313; box-sizing:border-box; top:-7px; } .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-pay-bar-status{display:flex; align-items: center; justify-content: space-between; width:100%;} .car-wait-form .car-wait-box .car-wait-con .car-wait-con-td .car-wait-pay-bar-status span{font-size:12px; color:#999; letter-spacing: -0.2px; font-weight:500;} /* 입고알림 알림 기간 */ .car-wait-con-td .check-btn-box{width:100%; } .car-wait-con-td .check-btn-box .check-btn{ width:100%; max-width:calc( 33.33% - 7px ); } /* 입고알림 - 약관 동의 */ .car-wait-form .car-wait-box .car-wait-policy{width:100%;} .car-wait-form .car-wait-box .car-wait-policy .wait-policy-title{height:46px; display:flex; align-items: center; box-sizing:border-box; justify-content: space-between; } .car-wait-form .car-wait-box .car-wait-policy .wait-policy-title.policy-all{border-bottom:1px solid #ddd;} .car-wait-form .car-wait-box .car-wait-policy .wait-policy-title.policy-all label span{font-size:15px; font-weight:500;} .car-wait-form .car-wait-box .car-wait-policy .wait-policy-title label span strong{font-size:14px; font-weight:500;} .car-wait-form .car-wait-box .car-wait-policy .wait-policy-title .wait-policy-arrow{cursor: pointer;} .car-wait-form .car-wait-box .car-wait-policy .wait-policy-title .wait-policy-arrow{transform: rotate( 180deg ); } .car-wait-form .car-wait-box .car-wait-policy .wait-policy-title.active .wait-policy-arrow{transform: rotate(0deg); } .car-wait-form .car-wait-box .car-wait-policy .wait-policy-summery{width:100%; padding:20px; box-sizing:border-box; background:#f9f9f9; } .car-wait-form .car-wait-box .car-wait-policy .wait-policy-summery .wait-policy-list{width:100%;} .car-wait-form .car-wait-box .car-wait-policy .wait-policy-summery .wait-policy-list li{display:flex; width:100%; margin-top:12px; } .car-wait-form .car-wait-box .car-wait-policy .wait-policy-summery .wait-policy-list li:first-child{margin-top:0px;} .car-wait-form .car-wait-box .car-wait-policy .wait-policy-summery .wait-policy-list li .wait-policy-sum-tit{ width:160px; font-size: 14px; font-weight:700; color:#888; padding-left:16px; box-sizing:border-box; position: relative; } .car-wait-form .car-wait-box .car-wait-policy .wait-policy-summery .wait-policy-list li .wait-policy-sum-tit::before{content:"";display:block; width:4px; height:4px; border-radius: 4px; background:#888; position: absolute; left:4px; top:4px; } .car-wait-form .car-wait-box .car-wait-policy .wait-policy-summery .wait-policy-list li .wait-policy-sum-txt{ width:calc( 100% - 180px ); font-weight:400; font-size: 14px; color:#888; margin-left:20px; line-height:1.3; word-break: keep-all; } .car-wait-form .wait-policy-info{font-size:14px; font-weight:700; color:#888; margin-top:12px; } .car-wait-summery{padding:40px 0px; width:100%; box-sizing:border-box; border-top:1px solid #ddd;} .car-wait-summery .wait-summery-list li{font-size:14px; color:#666; padding-left:15px; box-sizing:border-box; width:100%; line-height:1.3; margin-top: 8px; position: relative; } .car-wait-summery .wait-summery-list li:first-child{margin-top:0px;} .car-wait-summery .wait-summery-list li::before{content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:8px; } /* 입고알림 팝업 */ #waitApplication .wait-ok-title{display:flex; justify-content: center;} #waitApplication .wait-ok-title .wait-ok-title-txt{font-size:18px; font-weight:700;} #waitApplication .wait-ok-txt{font-size:18px; line-height:1.3; text-align: center; margin-top:25px;} /* 차량 비교 하기 */ .compare-section{width: 1200px; margin:50px auto 0 auto; padding-bottom:130px; } .compare-form{width:100%; display:flex; border:1px solid #acacac; box-sizing:border-box; margin-top:40px; } .compare-form .compare-info .compare-none-type{margin-top:24px; height:26px; display:flex; align-items: center; font-size:18px; line-height:1.3; display:none; } .compare-form .compare-info{width:228px; padding:0 20px 24px 20px; box-sizing:border-box; border-right:1px solid #acacac; } .compare-form .compare-info .compare-title{margin-top:24px; height:26px; display:flex; align-items: center; font-size:18px; line-height:1.3; } .compare-form .compare-info .compare-line-txt{font-size:14px; color:#666; padding:10px 0px; box-sizing:border-box; min-height:20px; display:flex; justify-content: center; flex-direction: column; margin-bottom:0px; } .compare-form .compare-info .compare-line-txt .compare-line-sub{display:flex; align-items: center; margin-top:4px;} .compare-form .compare-info .compare-line-txt .compare-line-sub .compare-line-sub-txt{font-size:12px; color:#888; margin-right:4px;} .compare-form .compare-info .compare-line-txt.car-pay-line{height:44px;} .compare-form .compare-info .compare-line-txt.car-compare-pay-line{height:40px;} .compare-form .compare-info .compare-line-txt.car-plan-line{padding-bottom:48px; padding-top:18px; box-sizing:border-box;} .compare-form .compare-info .compare-line-txt.slide-type{justify-content: space-between;cursor:pointer; flex-direction: row; transition: all 0.4s; } .compare-form .compare-info .compare-line-txt.slide-type::after{ content:""; display:block; width:16px; height:16px; background:url(../images/contents/compare_option_arrow.png) no-repeat center; transition: all 0.2s; } .compare-form .compare-info .compare-line-txt.slide-type.active::after{ content:""; display:block; width:16px; height:16px; background:url(../images/contents/compare_option_arrow.png) no-repeat center; transform: rotate(180deg); transition: all 0.2s; } .compare-form .compare-info .compare-car .compare-car-model .compare-title{margin-bottom:216px;} .compare-form .compare-info .compare-car-info{border-top:1px solid #ddd; width:100%; margin-top:24px;} .compare-form .compare-info .compare-car-option{border-top:1px solid #ddd; width:100%; margin-top:24px;} .compare-form .compare-box{width:calc( 100% - 228px ); display:flex; position: relative;} .compare-form .compare-box .compare-con{border-right:1px solid #acacac; width: 25%; box-sizing:border-box; position: relative; order:3;} .compare-form .compare-box .compare-con:last-child{border-right:0px;} .compare-form .compare-box .compare-con .compare-add{padding:68px 20px; box-sizing:border-box; width:100%;} .compare-form .compare-box .compare-con .compare-add .compare-add-btn{width:100%; height:152px; display:flex; flex-direction: column; align-items: center; justify-content: center; background:#f6f6f6; } .compare-form .compare-box .compare-con .compare-add .compare-add-btn .compare-add-txt{ font-size:16px; font-weight:700; color:#888; margin-top:10px; } .compare-form .compare-box .compare-con.active{cursor:move; order:2;} .compare-form .compare-box .compare-con.active .compare-add{display:none;} .compare-form .compare-box .compare-con.fixed-type{background:#f9f9f9;cursor:default; order:1;} .compare-form .compare-box .compare-con.fixed-type::before{content:""; display:block; width:100%; height:4px; background:#333; position:absolute; left:0; top:0; } .compare-box .compare-con.dragging {opacity: 1;} .compare-form .compare-box .compare-con .compare-car .compare-car-model{width:100%;padding:24px 20px; box-sizing:border-box; border-bottom:1px solid #ddd;} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-head{width:100%; display:flex; align-items: center; justify-content: space-between; height:26px;} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-head .car-head-info{display:flex; align-items: center;} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-head .car-head-info .car-fixed-dot{width:20px; height:20px; background:url(../../resources/images/smartbuy/fixed_dot_off.png) no-repeat center;} .compare-form .compare-box .compare-con.fixed-type .compare-car .compare-car-model .car-head .car-head-info .car-fixed-dot{width:20px; height:20px; background:url(../../resources/images/smartbuy/fixed_dot_on.png) no-repeat center;} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-head .car-head-info .car-num{margin-left:2px; font-size:14px; font-weight:500; color:#666; } .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-head .car-head-info .time-bage{display:flex; width:57px; height:24px; align-items: center; justify-content: center; background:#fef3f3; font-size:12px; font-weight:500; color:#cd0000; margin-left:6px; } .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-head .car-head-info .time-bage::before{content:""; display:block; width:12px; height:12px; background:url(../images/contents/lp_bage_timedeal.png) no-repeat center; margin-right:2px; } .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-head .car-delete{width:16px; height:16px; position:relative; cursor: pointer;} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-head .car-delete::before{content:""; display:block; width:16px; height:1px; background:#131313; transform: rotate(45deg); position: absolute; top:8px;left:0; } .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-head .car-delete::after{content:""; display:block; width:16px; height:1px; background:#131313; transform: rotate(135deg); position: absolute; top:8px;left:0; } .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-thumnail{width:100%; height:152px; position: relative; background:#000; overflow:hidden; margin-top:10px; } .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-thumnail img{position: absolute; left:50%; top:50%; transform: translate( -50%, -50% );} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-name{height:40px; margin-top:10px;} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-name .name{width:100%; font-size:16px; height:20px; line-height:20px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; } .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-name .model{width:100%; font-size:16px; height:20px; line-height:20px; overflow:hidden; text-overflow: ellipsis; white-space: nowrap; } .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-pay{height:44px; display:flex; align-items: center;} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-pay .pay{font-size:18px;} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-pay .pay span{font-size:18px; font-weight:700;} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-pay .discount{font-size:14px; color:#999; text-decoration: line-through; margin-left:4px; } .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-compare-pay{height:40px; display:flex; align-items: center; border-top:1px solid #ddd; border-bottom:1px solid #ddd; box-sizing:border-box; font-size:16px; } .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-compare-pay::before{content:""; display:block; width:16px; height:16px; margin-right:2px; } .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-compare-pay.fixed{color:#0061FD;} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-compare-pay.fixed::before{background:url(../images/contents/compare_fixed.png) no-repeat center;} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-compare-pay.up{color:#ff3f3f;} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-compare-pay.up::before{background:url(../images/contents/compare_up.png) no-repeat center;} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-compare-pay.down{color:#0263f4;} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-compare-pay.down::before{background:url(../images/contents/compare_down.png) no-repeat center;} .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-plan-pay{height:40px; display:flex; align-items: center; font-size:16px; color:#0061FD; } .compare-form .compare-box .compare-con .compare-car .compare-car-model .car-plan-pay span{font-size:16px; font-weight:700; color:#0061FD; } .compare-form .compare-box .compare-con .compare-car .compare-car-model .btn-box{margin-top:16px;} .compare-form .compare-box .compare-title{margin-top:24px; height:26px; display:flex; align-items: center; font-size:18px; line-height:1.3; text-indent: -999999px; } .compare-form .compare-box .compare-car-info{width:100%; padding: 0 20px; box-sizing:border-box; } .compare-form .compare-box .compare-car-info .compare-car-info-list{width:100%; } .compare-form .compare-box .compare-car-info .compare-car-info-list li{padding:10px 0px; min-height:20px; display:flex; align-items: center; font-size:14px; } .compare-form .compare-box .compare-car-option{border-top:1px solid #ddd; padding:0 20px; box-sizing:border-box;margin-top:24px;} .compare-form .compare-box .compare-car-option .compare-option-count{padding:10px 0px; min-height:20px; display:flex; align-items: center; font-size:14px; } .compare-form .compare-box .compare-car-option .compare-option-count span{font-size:14px;} .compare-form .compare-box .compare-car-option .compare-option-count span.count-num{font-weight:700; margin-right:3px;} .compare-form .compare-box .compare-car-option .compare-option-count span.list-all{margin-left:3px;} .compare-form .compare-box .compare-car-option .compare-option-list{width:100%;} .compare-form .compare-box .compare-car-option .compare-option-list li{height:30px; display:flex; align-items: center; color:#acacac; font-size:14px;} .compare-form .compare-box .compare-car-option .compare-option-list li::before{content:""; display:block; width:16px; height:16px; margin-right:5px;} .compare-form .compare-box .compare-car-option .compare-option-list li.active{height:30px; display:flex; align-items: center; color:#131313; font-size:14px;} .compare-form .compare-box .compare-car-option .compare-option-list li.active::before{content:""; display:block; width:16px; height:16px; margin-right:5px; background:url(../images/common/tab_ty04_check.png) no-repeat center;} .compare-section .compare-summery{width:100%; margin-top:20px;} .compare-section .compare-summery li{font-size:14px; color:#666; position: relative; padding-left:15px; box-sizing:border-box;margin-top:5px; line-height:1.3;} .compare-section .compare-summery li:first-child{margin-top:0px;} .compare-section .compare-summery li::before{content:""; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:7px; } .compare-section .compare-share-btn{margin:50px auto 0 auto;} .compare-section .compare-share-btn .btn{width:200px;} /* 차량 비교하기 스크롤시 상단 고정 */ .compare-fixed-form{width:100%; position: fixed; left:0; top:79px; background:#fff; border-bottom:1px solid #ddd; box-sizing:border-box; z-index: 99; display:none; } .compare-fixed-form .compare-fixed-box{width:1200px; margin:0 auto;border-left:1px solid #acacac; border-right:1px solid #acacac; display:flex; box-sizing:border-box; } .compare-fixed-form .compare-fixed-box .compare-fixed-info{width:228px; border-right:1px solid #acacac; box-sizing:border-box;padding:24px 20px;} .compare-fixed-form .compare-fixed-box .compare-fixed-info .compare-fixed-title{font-size:18px;} .compare-fixed-form .compare-fixed-box .compare-fixed-list{width:calc( 100% - 228px ); display:flex;} .compare-fixed-form .compare-fixed-box .compare-fixed-list li{width:25%; border-right:1px solid #acacac; box-sizing:border-box;padding:20px;} .compare-fixed-form .compare-fixed-box .compare-fixed-list li:last-child{border-right:0px;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con{order:3;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con.active{order:2;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con.fixed-type{order:1;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-head{width:100%; display:flex; align-items: center; justify-content: space-between; height:26px;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-head .car-head-info{display:flex; align-items: center;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-head .car-head-info .car-fixed-dot{width:20px; height:20px; background:url(../../resources/images/smartbuy/fixed_dot_off.png) no-repeat center;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con.fixed-type .compare-car .car-head .car-head-info .car-fixed-dot{width:20px; height:20px; background:url(../../resources/images/smartbuy/fixed_dot_on.png) no-repeat center;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-head .car-head-info .car-num{margin-left:2px; font-size:14px; font-weight:500; color:#666; } .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-head .car-head-info .time-bage{display:flex; width:57px; height:24px; align-items: center; justify-content: center; background:#fef3f3; font-size:12px; font-weight:500; color:#cd0000; margin-left:6px; } .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-head .car-head-info .time-bage::before{content:""; display:block; width:12px; height:12px; background:url(../images/contents/lp_bage_timedeal.png) no-repeat center; margin-right:2px; } .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-head .fixed-car-delete{width:16px; height:16px; position:relative; cursor: pointer;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-head .fixed-car-delete::before{content:""; display:block; width:16px; height:1px; background:#131313; transform: rotate(45deg); position: absolute; top:8px;left:0; } .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-head .fixed-car-delete::after{content:""; display:block; width:16px; height:1px; background:#131313; transform: rotate(135deg); position: absolute; top:8px;left:0; } .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-name{height:66px; margin-top:5px; } .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-name .name{font-size:14px; line-height:1.4; width:100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-name .model{font-size:14px; line-height:1.4; width:100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-pay{height:26px; display:flex; align-items: center;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-pay .pay{font-size:18px;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-pay .pay span{font-size:18px; font-weight:700;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-pay .discount{font-size:14px; color:#999; text-decoration: line-through; margin-left:4px; } .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-compare-pay{height:20px; display:flex; align-items: center; box-sizing:border-box; font-size:12px; } .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-compare-pay::before{content:""; display:block; width:12px; height:12px; margin-right:2px; background-size: contain; } .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-compare-pay.fixed{color:#0061FD;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-compare-pay.fixed::before{background:url(../images/contents/compare_fixed.png) no-repeat center;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-compare-pay.up{color:#ff3f3f;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-compare-pay.up::before{background:url(../images/contents/compare_up.png) no-repeat center;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-compare-pay.down{color:#0263f4;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-car .car-compare-pay.down::before{background:url(../images/contents/compare_down.png) no-repeat center;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-add{box-sizing:border-box; width:100%;} .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-add .compare-add-btn{width:100%; height:152px; display:flex; flex-direction: column; align-items: center; justify-content: center; background:#f6f6f6; } .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con .compare-add .compare-add-btn .compare-add-txt{ font-size:16px; font-weight:700; color:#888; margin-top:10px; } .compare-fixed-form .compare-fixed-box .compare-fixed-list .compare-fixed-con.active .compare-add{display:none;} #comparePop{display:none;} #comparePop .lp-form{margin:20px 0px;} #comparePop .lp-form .lp-box{gap:60px 39px;} #comparePop .lp-form .lp-box .lp-thum-btn-box .lp-thum_btn.lp_favorit_btn{display:none;} #comparePop .lp-form .lp-box .lp-thum-btn-box .lp-thum_btn.lp_vs_btn{display:flex;} #comparePop .compare-lp-btn{display:flex; align-items: center; justify-content: space-between; height:40px; margin-top:10px; } #comparePop .compare-lp-btn .btn{width:80px; height:40px;} #comparePop .compare-chk-count{padding:0 3px;} #comparePop .compare-lp-none{ display:none; width:100%; height:590px; display:flex; flex-direction: column; align-items: center; justify-content: center;} #comparePop .compare-lp-none .compare-lp-none-txt{font-size:18px; font-weight:700; margin-top:20px;} #comparePop .tab-container{margin-top:20px;} /* 로그인 */ .login-section{ width:335px; margin:60px auto 0 auto; padding-bottom:150px; box-sizing:border-box;} .login-section .page-title{justify-content: center;} .login-section .page-title .page-title-txt{align-items: center; height:auto; flex-direction: column; align-items: center; justify-content: center; } .login-section .page-title .page-title-txt .main-txt{font-weight:700; width:100%; text-align: center;} .login-section .page-title .page-title-txt .sub-txt{text-align: center; margin-top:10px; font-size:16px; line-height: 1.4; } .login{width:100%; margin-top:30px;} .login .login-inpt{width:100%;} .login .login-inpt .pass-inpt{margin-top:10px;} .login .login-inpt .id-save-inpt{margin-top:12px;} .login .login-inpt .id-save-inpt label span{font-size:12px;} .login .login-btn-box{margin-top:22px;} .login .login-btn-box .btn{height:50px;} .login .login-btn-box .btn span{font-size:16px; font-weight:500;} .login .login-menu{display:flex; margin:20px auto 0 auto; align-items: center; justify-content: center; } .login .login-menu li{display:flex; align-items: center;} .login .login-menu li::after{content:""; display:block; width:1px; height:12px; margin:0 10px; background:#ddd; } .login .login-menu li:last-child::after{display:none;} .login .login-menu li a{font-size:12px; font-weight:500; } .sns-login{ margin:30px auto 0 auto; width:335px; } .sns-login .sns-login-title{position: relative; width:100%; height:16px; display:flex; align-items: center; justify-content: center; } .sns-login .sns-login-title span{font-size:12px; color:#888; background:#fff; padding:0 10px; box-sizing:border-box; position: relative; z-index: 2; } .sns-login .sns-login-title::before{content:""; display:block; width:100%; height:1px; background:#eee; position: absolute; left:0 ; top:50%; transform: translate( -0, -50% ); z-index: 1; } .sns-login .sns-login-form .sns-login-box{ margin-top:10px; } .sns-login .sns-login-form .sns-login-box:first-child{margin-top:30px;} .sns-login .sns-login-form .sns-login-box .sns-login-btn .sns-ico{position: absolute; width:20px; height:20px; display:flex; align-items: center; justify-content: center; left:14px; top:50%; transform: translate( -0, -50% );} /* 아이디 찾기 */ .find-form{width:100%; margin-top:40px;} .find-form .input-form{width:100%;} .find-form .input-form .find-id-box{margin-top:20px;} .find-form .input-form .find-phon-box{margin-top:20px;} .find-form .find-btn-box{margin-top:20px;} .find-form .find-btn-box .btn{height:50px;} .find-form .find-btn-box .btn span{font-size:16px; font-weight:500;} .find-form .find-id-list{width:100%; margin-top:40px; padding-bottom:20px; } .find-form .find-id-list .find-id-con{width:100%; height:48px; display:flex; align-items: center; padding:0 16px; box-sizing:border-box; background:#f9f9f9; font-size:14px; margin-top:10px;} .find-form .find-id-list .find-id-con:first-child{margin-top:0px;} .find-form .find-id-list .find-id-con::before{content:""; display:block; width:24px; height:24px; border-radius: 24px; margin-right:8px; } .find-form .find-id-list .find-id-con.reborn::before{background:url(../images/contents/find_reborn_ico.png) no-repeat center;} .find-form .find-id-list .find-id-con.apple::before{background:url(../images/contents/find_apple_ico.png) no-repeat center;} .find-form .find-id-list .find-id-con.kakao::before{background:url(../images/contents/find_kakao_ico.png) no-repeat center;} .find-form .find-id-list .find-id-con.naver::before{background:url(../images/contents/find_naver_ico.png) no-repeat center;} .find-none{width:100%;} .find-none .find-none-box{display:flex; align-items: center; justify-content: center; flex-direction: column; padding:70px 0px 60px 0px; box-sizing:border-box; } .find-none .find-none-box .find-none-txt{font-size:16px; color:#666; margin-top:25px; } .find-none .find-none-btn .btn-txt{margin-top:10px;} .find-none .find-none-btn .btn{height:50px;} .find-none .find-none-btn .btn span{font-size:16px; font-weight:500;} .find-form .input-form .find-phon-box .find-phon-check{display:flex; align-items: center; flex-wrap: wrap;} .find-form .input-form .find-phon-box .find-phon-check .find-phon-check-inpt{width:calc( 100% - 130px ); position:relative; } .find-form .input-form .find-phon-box .find-phon-check .find-phon-check-inpt .confirm-count{font-size:14px; font-weight:500; color:#ff3f3f; position: absolute; right:12px; top:50%; transform: translate( -0, -50% ); } .find-form .input-form .find-phon-box .find-phon-check .btn{width:120px; margin-left:10px; height:44px;font-size:15px; font-weight:500;} .find-form .input-form .find-phon-box .find-phon-check.confirm{margin-top:8px;display:none;} .find-form .input-form .find-phon-box .find-phon-check.confirm.active{display:flex;} .find-form .input-form .find-phon-box .find-phon-check.confirm .input-box{padding-right:60px;} .find-form .input-form .new-pass-re-box{margin-top:20px;} /* 회원가입 */ .join-section{ margin:60px auto 0 auto; padding-bottom:150px; box-sizing:border-box;} .join-section.join-step01{padding-bottom:0px;} .join-section .page-title{justify-content: center;} .join-section .page-title .page-title-txt{align-items: center; height:auto; flex-direction: column; align-items: center; justify-content: center; } .join-section .page-title .page-title-txt .main-txt{font-weight:700; width:100%; text-align: center;} .join-section .page-title .page-title-txt .sub-txt{text-align: center; margin-top:10px; font-size:16px; line-height: 1.4; } .join-section .join{width:335px; margin:30px auto 0 auto; } .join-section .join .btn{height:50px;} .join-section .join .btn span{font-size:16px; font-weight:500;} .join-service{width: 100%; padding:40px 0px; box-sizing: border-box; background:#f4f4f4; margin-top:150px; } .join-service .join-service-list{width:1200px; margin:0 auto; display:flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap:20px; } .join-service .join-service-list .join-service-con{ width:calc( 50% - 10px ); background:#fff; height:140px; display:flex; align-items: center; padding:0 40px; box-sizing:border-box; } .join-service .join-service-list .join-service-con .join-service-ico{width:92px; height:92px; border-radius: 92px; background:#f9f9f9; display:flex; align-items: center; justify-content: center; } .join-service .join-service-list .join-service-con .join-service-sum{margin-left:40px;} .join-service .join-service-list .join-service-con .join-service-sum .join-service-title{font-size:20px; font-weight:700;} .join-service .join-service-list .join-service-con .join-service-sum .join-service-txt{font-size:14px; color:#666; line-height:1.3; margin-top:5px; } .join-service .join-service-list .join-service-con .join-service-sum .join-service-txt span{font-size:14px; color:#131313;} .join-form{width:620px; margin:80px auto 0 auto;} .join-form:nth-child(3){margin-top:60px;} .join-form:nth-child(4){margin-top:60px;} .join-form .join-head{width:100%; display:flex; align-items: center; justify-content: space-between; height:22px; } .join-form .join-head .join-title{ font-size:18px; font-weight:700; } .join-form .join-head .join-txt{font-size:14px; color:#515151;} .join-form .join-body{width:100%; margin-top:24px; border-top:1px solid #131313; } .join-form .join-body .join-list{width:100%;} .join-form .join-body .join-list .join-box{width:100%; display:flex; padding:10px 0px; box-sizing:border-box; border-bottom:1px solid #ddd;} .join-form .join-body .join-list .join-box .join-con-title{height:44px; display:flex; align-items: center; width:145px;} .join-form .join-body .join-list .join-box .join-con-title span{font-size:15px; font-weight:500; display:flex;} .join-form .join-body .join-list .join-box .join-con-title span.require::after{font-size:16px;} .join-form .join-body .join-list .join-box .join-con-title .tooltip{margin-left:4px;} .join-form .join-body .join-list .join-box .join-con{width:calc( 100% - 145px ); display:flex; flex-wrap: wrap; align-items: center;} .join-form .join-body .join-list .join-box .join-con .input-box{height:44px;} .join-form .join-body .join-list .join-box .join-con .join-phone{width:100%; display:flex; align-items: center; flex-wrap: wrap;} .join-form .join-body .join-list .join-box .join-con .join-phone .btn{width:120px; height:44px; margin-left:10px;} .join-form .join-body .join-list .join-box .join-con .join-phone .join-phone-check-box{width:calc( 100% - 130px ); position: relative;} .join-form .join-body .join-list .join-box .join-con .join-phone .join-phone-check-box .join-number-check-count{position: absolute; right:12px; top:50%; transform: translate( -0, -50% ); font-size:14px; color:#ff3f3f; font-weight:500;} .join-form .join-body .join-list .join-box .join-con .join-number-check{margin-top:10px;display:none;} .join-form .join-body .join-list .join-box .join-con .join-number-check.active{display:flex;} .join-form .join-body .join-list .join-box .join-date{justify-content: space-between;} .join-form .join-body .join-list .join-box .join-date .input-box{width:151px;} .join-form .join-body .join-list .join-box .join-date .select-box{width:151px; height:44px;} .join-form .join-body .join-list .join-box .join-date .select-box .select-choice{height:44px; font-size:14px;} .join-form .join-body .join-list .join-box .join-date .select-box .select-list{top:44px;} .join-form .join-body .join-list .join-box .join-date .select-box .select-list li{font-size:14px;} .join-form .join-body .join-list .join-box .join-gender .select-box{width:240px;} .join-form .join-body .join-list .join-box .join-gender .select-box .select-choice{height:44px; font-size:14px;} .join-form .join-body .join-list .join-box .join-gender .select-box .select-list{top:44px;} .join-form .join-body .join-list .join-box .join-gender .select-box .select-list li{font-size:14px;} .join-form .join-body .join-list .join-box .join-add .postal-code{ width: calc( 100% - 130px ); } .join-form .join-body .join-list .join-box .join-add .add-search-btn{width:120px; margin-left:10px; height:44px;} .join-form .join-body .join-list .join-box .join-add .add-search-btn span{font-size:15px; font-weight:500;} .join-form .join-body .join-list .join-box .join-add .main-add{margin-top:10px;} .join-form .join-body .join-list .join-box .join-add .sub-add{margin-top:10px;} .join-form .join-policy{width:100%; margin-top:24px; border-top:1px solid #131313; padding-bottom:30px; border-bottom:1px solid #eee;} .join-form .join-policy .join-policy-all{display:flex; align-items: center; justify-content: space-between; height:48px; border-bottom:1px solid #eee; box-sizing: border-box; } .join-form .join-policy .join-policy-all label span{font-size:15px; font-weight:700;} .join-form .join-policy .join-policy-body{width:100%;} .join-form .join-policy .join-policy-body .join-policy-title{display:flex; align-items: center; justify-content: space-between; height:46px;} .join-form .join-policy .join-policy-body .link-type{transform: rotate(90deg);} .join-form .join-policy .join-policy-body .slide-type.off{transform: rotate(180deg); transition: all 0.2s;} .join-form .join-policy .join-policy-body .policy-summery{width:100%; padding:20px; background:#f9f9f9; max-height:200px; overflow-y: auto; } .join-form .join-policy .join-policy-body .policy-summery p{font-size:14px; color:#888; line-height:1.5 !important;} .join-form .join-policy .join-policy-body .policy-summery p.title{font-weight:700; margin-bottom:4px; margin-top:8px;} .join-form .join-policy .join-policy-body .policy-summery p:first-child{margin-top:0px;} .join-form .join-policy .join-policy-body .policy-summery p span{font-size:14px !important; color:#888 !important; } .join-form .join-policy .join-policy-body .policy-summery b{font-size:14px; color:#888;} .join-form .join-policy .join-policy-body .policy-summery h2{font-weight:400;} .join-form .join-policy .join-policy-body .policy-summery .policy-list{width:100%;} .join-form .join-policy .join-policy-body .policy-summery .policy-list li{display:flex; width:100%; margin-top:12px; } .join-form .join-policy .join-policy-body .policy-summery .policy-list li:first-child{margin-top:0px;} .join-form .join-policy .join-policy-body .policy-summery .policy-list li .policy-sum-tit{ width:160px; font-size: 14px; font-weight:700; color:#888; padding-left:16px; box-sizing:border-box; position: relative; } .join-form .join-policy .join-policy-body .policy-summery .policy-list li .policy-sum-tit::before{content:"";display:block; width:4px; height:4px; border-radius: 4px; background:#888; position: absolute; left:4px; top:4px; } .join-form .join-policy .join-policy-body .policy-summery .policy-list li .policy-sum-txt{ width:calc( 100% - 180px ); font-weight:400; font-size: 14px; color:#888; margin-left:20px; line-height:1.3; word-break: keep-all; } .join-form .join-policy .join-policy-summery{font-size:14px; font-weight:700; color:#888; margin-top:10px;} .join-form .join-btn{margin:50px auto 0 auto; height:50px;} .join-form .join-btn span{font-size:16px; font-weight:500;} .join-tooltip .tooltip-form{right:auto; left:50%; transform: translate( -50% , -0 );} .join-tooltip .tooltip-form .tooltip-box{width:319px; } .join-tooltip .tooltip-form .tooltip-box::before{right:auto; left:50%; transform: translate( -50% , -0 );} .join-tooltip .tooltip-form .tooltip-box .tool-list{padding:5px 18px 0px 16px; } .join-tooltip .tooltip-form .tooltip-box .tool-list li{list-style: auto; margin-top:5px; word-break: keep-all;} .join-tooltip .tooltip-form .tooltip-box .tool-list li:first-child{margin-top:0px;} /* 회원가입 완료 */ .join-comple{padding-top:70px; box-sizing:border-box; display:flex; flex-direction: column; align-items: center; justify-content: center;} .join-comple .join-comple-ico{width:80px; height:80px; border-radius: 80px; background:#f4f9ff; display:flex; align-items: center; justify-content: center; } .join-comple .join-comple-title{font-size:26px; font-weight:500; line-height:1.4; margin-top:24px;text-align: center;} .join-comple .join-comple-title span{font-size:26px; font-weight:500; color:#0061FD; } .join-comple .join-info{ width:100%; max-width:335px; margin:50px auto 0 auto; } .join-comple .join-info .join-info-txt{ font-size:14px; color:#888; text-align: center; } .join-comple .join-info .join-info-id{width:100%; height:48px; display:flex; align-items: center; justify-content: center; background:#f9f9f9; margin-top:10px; font-size:14px; color:#333; } .join-comple .join-info .btn{margin-top:20px;} /* 비밀번호 변경 팝업 */ #passChangePop{display:none;} #passChangePop .layer-pop-head{height:auto; padding: 18px 0px; box-sizing:border-box; align-items: flex-start;} #passChangePop .main-tit{line-height:1.3;} #passChangePop .pass-change-form{padding:20px 0px; box-sizing:border-box;} #passChangePop .pass-change-form .new-pass-check-box{margin-top:10px;} #passChangePop .pass-change-form .new-pass-re-check-box{margin-top:10px;} #passChangePop .pass-change-info{padding-bottom:40px; box-sizing: border-box;} #passChangePop .pass-change-info .pass-change-info-title{width:100%; height:22px; display:flex; align-items: center; color:#888; font-size:14px; font-weight:700;} #passChangePop .pass-change-info ul li{font-size:14px; color:#666; padding-left:15px; box-sizing:border-box; position:relative; margin-top:5px; } #passChangePop .pass-change-info ul li::before{ content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:6px; } #passChangePop .btn-box .pass-change-ok{display:none;} #passChangePop .btn-box.active .pass-change-ok{display:flex;} #passChangePop .btn-box.active .pass-change-delay{display:none;} #passChangePop .btn-box.active .pass-change-btn{display:none;} #passChangePop .pass-change-summery{width:100%; flex-direction: column; align-items: center; justify-content: center; height:100%; padding:75px 0px; display:none;} #passChangePop .pass-change-summery.active{display:flex;} #passChangePop .pass-change-summery .pass-change-summery-ico{ width:80px; height:80px; border-radius: 80px; display:flex; align-items: center; justify-content: center; background:#f4f9ff; } #passChangePop .pass-change-summery .pass-change-summery-txt{font-size:16px; color:#666; margin-top:24px; line-height:1.4; text-align: center; } /* 리뷰 */ .review-section{width:1200px; margin:50px auto 130px auto; box-sizing:border-box; } .review-list-form{margin-top:40px;} .review-list-form .review-list-tab .tab-box .tab-con{width:calc( 33.33% + 1px );} .review-list-form .review-list-tab .tab-box .tab-con a{font-size:16px; color:#888; display:flex; align-items: center; justify-content: center; width:100%; height:100%; } .review-list-form .review-list-tab .tab-box .tab-con a span{font-size:16px; color:#888; margin-left:4px;} .review-list-form .review-list-tab .tab-box .tab-con.active a{font-size:16px; color:#131313;} .review-list-form .review-list-tab .tab-box .tab-con.active a span{font-size:16px; color:#131313;} .review-section .review-banner{width:100%; margin-top:40px;} .list-filter{width:100%; display:flex; align-items: center; justify-content: space-between; margin-top:30px; margin-bottom:9px; } .list-filter .list-search{width:280px; height:44px; display:flex; position:relative;} .list-filter .list-search .list-search-box{ width:280px; height:44px; border:1px solid #ddd; box-sizing:border-box; background:#fff; padding:0 12px; display:flex; align-items: center; justify-content: space-between; position: relative; } .list-filter .list-search .list-search-box input[type=text] {width:calc( 100% - 30px ); height:100%; font-size: 14px; outline: none; border:0px; } .list-filter .list-search .list-search-box:hover{border:1px solid #131313;} .list-filter .list-search .list-search-box.focus{border:1px solid #131313;} .list-filter .list-search .list-search-box .list-search-delete{width:16px; height:16px; border-radius: 16px; display:flex; align-items: center; justify-content: center; background:#ddd; cursor: pointer; display:none; position: absolute; right:38px; top:50%; transform: translate( -0, -50% ); } .list-filter .list-search .list-search-box .list-search-delete.active{display:flex; margin-right:5px;} .list-filter .list-search .list-search-box .list-search-btn{width:24px !important; height:24px !important;} .list-filter .list-filter-box{display:flex; align-items: center;} .list-filter .list-filter-box .list-filter-list{display:flex; align-items: center; } .list-filter .list-filter-box .list-filter-list::after{content:""; display:block; width:1px; height:12px; background:#ddd; margin-right:20px; } .list-filter .list-filter-box .list-filter-list li{cursor:pointer; margin-right:18px; font-size:14px; color:#666;} .list-filter .list-filter-box .list-filter-list li:last-child{margin-right:20px;} .list-filter .list-filter-box .list-filter-list li.active{font-weight:700; color:#131313;} .list-filter .list-filter-box .list-filter-reflash{display:flex; align-items: center; font-size:14px; color:#666; cursor:pointer; } .list-filter .list-filter-box .list-filter-reflash img{margin-left:10px;} /* 리뷰 lp */ .review-list-form .review-list-box{width:100%; display:flex; gap:50px 13px; flex-wrap: wrap;} .review-list-form .review-list-box .review-list-con{width:290px; display:block;} .review-list-form .review-list-box .review-list-con .review-thumnail{width:100%; height:216px; overflow: hidden; background:url(../images/contents/pc_review_thumbnail.png) no-repeat center; background-size:contain;} .review-list-form .review-list-box .review-list-con .review-thumnail img{min-width:290px;} .review-list-form .review-list-box .review-list-con .review-info{border:1px solid #eee; box-sizing:border-box; padding:24px 16px;} .review-list-form .review-list-box .review-list-con .review-info .review-car{font-size:16px; font-weight:700; width:100%; height:24px; line-height:24px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .review-list-form .review-list-box .review-list-con .review-info .review-user{font-size:14px; color:#999; width:100%; height:22px; line-height:22px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top:6px; } .review-list-form .review-list-box .review-list-con .review-info .review-user span{color:#131313;font-size:14px;} .review-list-form .review-list-box .review-list-con .review-info .review-star{display:flex; margin-top:20px; width:100%; height:16px; align-items: center; } .review-list-form .review-list-box .review-list-con .review-info .review-star li{width:16px; height:16px; background:url(../images/contents/star_off_s.png) no-repeat center; margin-right:2px; } .review-list-form .review-list-box .review-list-con .review-info .review-star li.star{background:url(../images/contents/star_on_s.png) no-repeat center; } .review-list-form .review-list-box .review-list-con .review-info .review-title{font-size:16px; height:24px; line-height:24px; margin-top:10px; font-weight:700; width:100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .review-list-form .review-list-box .review-list-con .review-info .review-summery{ margin-top:10px; display:-webkit-box; font-size: 14px; color:#515151; line-height:22px; height:88px; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient:vertical; -webkit-line-clamp: 4; word-break: break-all; } .review-list-form .review-list-box .review-list-con .review-info .review-ft{margin-top:20px; display:flex; width:100%; align-items: center; justify-content: space-between; height:22px; } .review-list-form .review-list-box .review-list-con .review-info .review-ft .review-date{font-size:14px; color:#999;} .review-list-form .review-list-box .review-list-con .review-info .review-ft .review-count{display:flex; align-items: center;} .review-list-form .review-list-box .review-list-con .review-info .review-ft .review-count div{display:flex; align-items: center; font-size:14px; color:#515151; } .review-list-form .review-list-box .review-list-con .review-info .review-ft .review-count .review-goods-count{ margin-right:12px; } .review-list-form .review-list-box .review-list-con .review-info .review-ft .review-count .review-goods-count::before{content:""; display:block; width:18px; height:18px; background:url(../images/contents/good_ico.png) no-repeat center; margin-right:4px; } .review-list-form .review-list-box .review-list-con .review-info .review-ft .review-count .review-comment-count::before{content:""; display:block; width:18px; height:18px; background:url(../images/contents/review_comment.png) no-repeat center; margin-right:4px; } /* 리뷰 팝업 */ .review-pop-form{display:none;} .review-pop-form::before{content:""; display:block;width:100%; height:100%; background:rgba(0,0,0,0.6); position: fixed; top:0; left:0; z-index: 9999; } .review-pop-form .review-pop-box{position: absolute; left:50%; top:100px; transform: translate( -50% , -0 ); z-index: 99999;} .review-pop-form .review-pop-box .review-pop-con{position: relative;} .review-pop-form .review-pop-box .review-pop-con .review-pop-close{position: absolute; top:0; right:-50px; width:50px; height:50px; display:flex; align-items: center; justify-content: center; background:#fff; cursor:pointer;} .review-pop-form .review-pop-box .review-pop-con .review-pop-close .review-pop-close-btn{position: relative; width:100%; height:100%; width:22px; height:22px;} .review-pop-form .review-pop-box .review-pop-con .review-pop-close .review-pop-close-btn::before{content:""; display:block; width:22px; height:2px; background:#000; transition: all 0.2s; position: absolute; left:0; top:10px; transform: rotate(45deg) ; } .review-pop-form .review-pop-box .review-pop-con .review-pop-close .review-pop-close-btn::after{content:""; display:block; width:22px; height:2px; background:#000; transition: all 0.2s; position: absolute; left:0; top:10px; transform: rotate(135deg); } .review-pop-form .review-pop-box .review-pop-con .review-pop-close:hover .review-pop-close-btn::before{content:""; display:block; width:22px; height:2px; background:#000; transition: all 0.2s; position: absolute; left:0; top:10px; transform: rotate(225deg) ; } .review-pop-form .review-pop-box .review-pop-con .review-pop-close:hover .review-pop-close-btn::after{content:""; display:block; width:22px; height:2px; background:#000; transition: all 0.2s; position: absolute; left:0; top:10px; transform: rotate(315deg) ; } /* 구매후기 */ .review-pop-form .review-pop-box .review-pop-con .buy-review-btn{display:block; position: absolute; left:50%; bottom:50px; transform: translate( -50% , -0 ); width:343px; height:60px; } /* 판매후기 */ .review-pop-form .review-pop-box .review-pop-con .sell-review-btn{display:block; position: absolute; left:50%; bottom:60px; transform: translate( -50% , -0 ); width:351px; height:60px; } /* 렌트 구독 후기 */ .review-pop-form .review-pop-box .review-pop-con .rent-review-pop-bottom{position: relative;} .review-pop-form .review-pop-box .review-pop-con .rent-review-btn{display:block; position: absolute; left:50%; bottom:40px; transform: translate( -50% , -0 ); width:482px; height:70px; } .review-pop-form .review-pop-box .review-pop-con .rent-review-pop-body{width:100%; background:#EAEDFC; padding:0 70px; box-sizing:border-box; } .review-pop-form .review-pop-box .review-pop-con .rent-review-pop-body .rent-review-inpt-form{width:100%; display:flex; flex-direction: column; align-items: center; padding:0 25px; box-sizing:border-box; justify-content: space-between; gap:16px 0px; } .review-pop-form .review-pop-box .review-pop-con .rent-review-pop-body .rent-review-inpt-form .rent-review-inpt-box{display:flex; align-items: center;border:2px solid #2e3546; width:414px; border-radius: 5px; } .review-pop-form .review-pop-box .review-pop-con .rent-review-pop-body .rent-review-inpt-form .rent-review-inpt-box .title{font-size:22px; font-weight:600; width:150px; text-align: center; height:54px; display:flex; align-items: center; justify-content: center; background:#2e3546; color:#fff; border-radius: 0px;} .review-pop-form .review-pop-box .review-pop-con .rent-review-pop-body .rent-review-inpt-form .rent-review-inpt-box input[type="text"]{ width:264px; height:54px; padding:0 25px; font-size:22px; font-weight:600; box-sizing:border-box; outline: none; border-radius: 0px; border:0px;} /* 리뷰 view */ .review-view-form{width:100%; margin-top:60px;} .review-view-form .review-view-car{ width:100%; display:flex; align-items: center; font-size:18px; color:#666; } .review-view-form .review-view-car span{font-size:18px; font-weight: 700; color:#131313; margin-right: 10px;} .review-view-form .review-view-head{width:100%; display:flex; align-items: flex-end; justify-content: space-between; margin-top:20px; padding-bottom:24px; border-bottom:1px solid #131313; box-sizing:border-box; } .review-view-form .review-view-head .review-view-title{width:calc( 100% - 140px );} .review-view-form .review-view-head .review-view-title .review-title{ font-size:30px; font-weight:500; color:#131313; width:100%; line-height:1.3; } .review-view-form .review-view-head .review-view-title .review-info{margin-top:12px; display:flex; align-items: center;} .review-view-form .review-view-head .review-view-title .review-info li{font-size:14px; color:#666; overflow: hidden;} .review-view-form .review-view-head .review-view-title .review-info li::after{content:""; float: right; display:block; width:1px; height: 12px; background:#acacac; margin:0 8px; } .review-view-form .review-view-head .review-view-title .review-info li:last-child::after{display: none;} .review-view-form .review-view-head .review-view-title .review-info li span{font-size:14px; color:#666; font-weight:700;} .review-view-form .review-view-head .review-view-btn{margin-left:10px; display:flex; align-items: center; } .review-view-form .review-view-head .review-view-btn .review-goods-btn .review-goods-btn-con{ padding:0px 12px; margin-right:8px; box-sizing:border-box; border:1px solid #ddd; height:32px; display:flex; align-items: center; justify-content: center; background:#fff; border-radius: 32px; } .review-view-form .review-view-head .review-view-btn .review-goods-btn .review-goods-btn-con .review-goods-ico{ margin-right:2px; } .review-view-form .review-view-head .review-view-btn .review-goods-btn .review-goods-btn-con .review-goods-ico img{display:none;} .review-view-form .review-view-head .review-view-btn .review-goods-btn .review-goods-btn-con .review-goods-ico::after{content:""; display:block; width:18px; height:18px; background:url(../images/contents/good_ico.png) no-repeat center; } .review-view-form .review-view-head .review-view-btn .review-goods-btn:hover .review-goods-btn-con .review-goods-ico::after{background:url(../images/contents/good_ico_b.png) no-repeat center;} .review-view-form .review-view-head .review-view-btn .review-goods-btn.active .review-goods-btn-con .review-goods-ico::after{background:url(../images/contents/good_ico_b.png) no-repeat center;} .review-view-form .review-view-head .review-view-btn .review-goods-btn .review-goods-btn-con .review-goods-count{ font-size:12px; color:#515151; } .review-view-form .review-view-head .review-view-btn .review-goods-btn:hover .review-goods-btn-con{border:1px solid #131313;} .review-view-form .review-view-head .review-view-btn .review-goods-btn:hover .review-goods-btn-con .review-goods-count{color:#131313;} .review-view-form .review-view-head .review-view-btn .review-goods-btn.active .review-goods-btn-con{border:1px solid #131313;} .review-view-form .review-view-head .review-view-btn .review-goods-btn.active .review-goods-btn-con .review-goods-count{color:#131313;} .review-goods-btn .review-goods-tooltip{top:36px; right:auto; left:50%; transform: translate( -50% , -0 ); } .review-goods-btn .review-goods-tooltip .tooltip-box{width:max-content;} .review-goods-btn .review-goods-tooltip .tooltip-box::before{display:none;} .review-view-form .review-view-head .review-view-btn .review-share-btn{ padding:0px 12px; box-sizing:border-box; border:1px solid #ddd; height:32px; display:flex; align-items: center; justify-content: center; background:#fff; border-radius: 32px; } .review-view-form .review-view-head .review-view-btn .review-share-btn .review-share-ico{ margin-right:2px; } .review-view-form .review-view-head .review-view-btn .review-share-btn .review-share-ico img{display:none;} .review-view-form .review-view-head .review-view-btn .review-share-btn .review-share-ico::before{content:""; display: block; width:11px; height:12px; background:url(../images/contents/share_ico.png) no-repeat center; } .review-view-form .review-view-head .review-view-btn .review-share-btn .review-share-txt{ font-size:12px; color:#515151; } .review-view-form .review-view-head .review-view-btn .review-share-btn:hover .review-share-ico::before{background:url(../images/contents/share_ico_on.png) no-repeat center; } .review-view-form .review-view-head .review-view-btn .review-share-btn:hover .review-share-txt{color:#131313;} .review-view-form .review-view-head .review-view-btn .review-share-btn:active .review-share-ico::before{background:url(../images/contents/share_ico_on.png) no-repeat center; } .review-view-form .review-view-head .review-view-btn .review-share-btn:active .review-share-txt{color:#131313;} .review-view-form .review-view-head .review-view-btn .review-share-btn:hover{border:1px solid #131313;} .review-view-form .review-view-head .review-view-btn .review-share-btn:hover .review-share-txt{color:#131313;} .review-view-form .review-view-con{padding:54px 0px 60px 0px; box-sizing:border-box; border-bottom:1px solid #ddd; width:100%;} .review-view-form .review-view-con .review-summery{width:100%; display:flex; align-items: flex-start; justify-content: space-between;} .review-view-form .review-view-con .review-summery .review-view{width: calc( 100% - 360px ); font-size:16px; color:#333; line-height:1.4; white-space: pre-line;} .review-view-form .review-view-con .review-summery .review-view p{font-size:16px; color:#333; line-height:1.4;} .review-view-form .review-view-con .review-summery .review-view span{font-size:16px; color:#333; line-height:1.4;} .review-view-form .review-view-con .review-summery .review-view b{font-size:16px; color:#333; line-height:1.4;} .review-view-form .review-view-con .review-summery .review-view strong{font-size:16px; color:#333; line-height:1.4;} .review-view-form .review-view-con .review-summery .review-score{width:318px; height:auto; border-radius: 2px; border:1px solid #eee; box-sizing:border-box; display:flex; align-items: center; padding:20px; } .review-view-form .review-view-con .review-summery .review-score .review-total-score{ width:88px; height:100%; display:flex; align-items: center; justify-content: center; flex-direction: column; } .review-view-form .review-view-con .review-summery .review-score .review-total-score .total-score-title{font-size:14px; font-weight:700; height:22px; display:flex; align-items: center; justify-content: center; text-align: center;} .review-view-form .review-view-con .review-summery .review-score .review-total-score .total-score{font-size:36px; font-weight:500; height:44px; display:flex; align-items: center; justify-content: center; text-align: center;} .review-view-form .review-view-con .review-summery .review-score .review-total-score .review-star{ display:flex; align-items: center; } .review-view-form .review-view-con .review-summery .review-score .review-total-score .review-star li{ width:16px; height:16px; background:url(../..../images/contents/star_off_s.png) no-repeat center; } .review-view-form .review-view-con .review-summery .review-score .review-total-score .review-star li.star{background:url(../images/contents/star_on_s.png) no-repeat center;} .review-view-form .review-view-con .review-summery .review-score .score-list{width:172px; padding-left:18px; margin-left:18px; border-left:1px solid #eee; box-sizing:border-box;} .review-view-form .review-view-con .review-summery .review-score .score-list .score-list-con{display:flex; align-items: center; justify-content: space-between; margin-top:7px; padding:2px 0px; box-sizing:border-box; } .review-view-form .review-view-con .review-summery .review-score .score-list .score-list-con:first-child{margin-top:0px;} .review-view-form .review-view-con .review-summery .review-score .score-list .score-list-con .title{ font-size:14px; color:#333; line-height:1.3; word-break:keep-all; } .review-view-form .review-view-con .review-summery .review-score .score-list .score-list-con .score-count{display:flex; align-items: center; } .review-view-form .review-view-con .review-summery .review-score .score-list .score-list-con .score-count .score-bar{ width:50px; height:6px; border-radius: 6px; background:#f0f0f0; margin-right:8px; position: relative; overflow: hidden; } .review-view-form .review-view-con .review-summery .review-score .score-list .score-list-con .score-count .score-bar span{width:100%; height:100%; background:#0061FD; position: absolute; left:0; top:0; } .review-view-form .review-view-con .review-summery .review-score .score-list .score-list-con .score-count .score-num{ font-size:14px; font-weight:700; color:#333; } .review-view-form .review-view-con .review-img{width:100%; display:flex; flex-wrap: wrap; gap: 20px 13px ; margin-top:50px;} .review-view-form .review-view-con .review-img .review-img-box{width:290px;height:auto;} .review-view-form .review-btn-box{margin-top:50px;} .review-view-form .review-btn-box .btn{width:250px; } .review-comment-form{width:100%; margin-top:55px; } .review-comment-form .comment-list-count{ font-size:18px; font-weight:700; padding-bottom:11px; border-bottom:1px solid #131313; box-sizing:border-box; } .review-comment-form .comment-list-count span{ font-size:18px; font-weight:700; } .review-comment-form .comment-inpt{width:100%; margin-top:20px; border:1px solid #ddd; box-sizing:border-box; padding:16px 10px 10px 16px; background:#fff;} .review-comment-form .comment-inpt.active{border:1px solid #131313;} .review-comment-form .comment-inpt textarea{width:100%; min-height:22px; overflow: hidden; outline: none; resize:none; border:none; font-size:14px; line-height:1.4; background:none; } .review-comment-form .comment-inpt .comment-info{display:flex; align-items: center; justify-content: flex-end; height:40px; } .review-comment-form .comment-inpt .comment-info .comment-count-box{font-size:14px; color:#999; margin-right:10px;} .review-comment-form .comment-inpt .comment-info .comment-count-box span{font-size:14px; color:#999;} .review-comment-form .comment-inpt .comment-info .btn{width:80px; height:40px;} .review-comment-form .comment-list-form{width:100%;} .review-comment-form .comment-list-form .comment-list-box{width:100%;} .review-comment-form .comment-list-form .comment-list-box .comment-list-con{padding:20px 0px; box-sizing:border-box; display:flex; border-bottom:1px solid #ddd; } .review-comment-form .comment-list-form .comment-list-box .comment-list-con .comment-id{width:154px; height:22px; display:flex; align-items: center; font-size:14px; font-weight:700; color:#515151;} .review-comment-form .comment-list-form .comment-list-box .comment-list-con .comment-summery{margin-left:14px; width:calc( 100% - 340px );} .review-comment-form .comment-list-form .comment-list-box .comment-list-con .comment-summery .comment-txt{font-size:14px; line-height:1.5;} .review-comment-form .comment-list-form .comment-list-box .comment-list-con .comment-summery .comment-txt .reply-id{font-size:14px; font-weight:700;} .review-comment-form .comment-list-form .comment-list-box .comment-list-con .comment-summery .comment-btn{width:100%; display:flex; align-items: center; margin-top:15px; height:16px; } .review-comment-form .comment-list-form .comment-list-box .comment-list-con .comment-summery .comment-btn .comment-delete-box{display:flex; align-items: center;} .review-comment-form .comment-list-form .comment-list-box .comment-list-con .comment-summery .comment-btn .comment-delete-box::after{content:""; display:block; width:1px; height:12px; background:#ddd; margin: 0 10px; } .review-comment-form .comment-list-form .comment-list-box .comment-list-con .comment-summery .comment-btn .comment-delete-box .comment-delete{font-size:12px; color:#666; } .review-comment-form .comment-list-form .comment-list-box .comment-list-con .comment-summery .comment-btn .comment-reply{display:flex; align-items: center; font-size:12px; color:#666; } .review-comment-form .comment-list-form .comment-list-box .comment-list-con .comment-summery .comment-btn .comment-reply img{margin-right:4px;} .review-comment-form .comment-list-form .comment-list-box .comment-list-con .comment-date{ width:172px; text-align: right; padding-right:10px; box-sizing:border-box; font-size:12px; color:#666; } /* 대댓글 */ .review-comment-form .comment-list-form .comment-list-box .comment-list-con.reply{background:#f6f6f6; padding-left:153px; box-sizing:border-box; } .review-comment-form .comment-list-form .comment-list-box .comment-list-con.reply .comment-id{padding-left:15px; box-sizing: border-box; position: relative; } .review-comment-form .comment-list-form .comment-list-box .comment-list-con.reply .comment-id::before{content:""; display:block; width:8px; height:8px; background:url(../images/contents/comment_depth_ico.png) no-repeat center; position: absolute; left:0; top:7px; } .review-comment-form .reply-comment{ padding:12px 0px 12px 168px; box-sizing:border-box; border-bottom:1px solid #ddd; display:none; } .review-comment-form .reply-comment .reply-comment-inpt{width:100%; background:#fff; border:1px solid #ddd; box-sizing:border-box; padding:16px 10px 10px 16px;} .review-comment-form .reply-comment .reply-comment-inpt.active{border:1px solid #131313;} .review-comment-form .reply-comment .reply-comment-inpt textarea{width:100%; min-height:22px; overflow: hidden; outline: none; resize:none; border:none; font-size:14px; line-height:1.4; } .review-comment-form .reply-comment .reply-comment-inpt .comment-info{display:flex; align-items: center; justify-content: flex-end; height:40px; } .review-comment-form .reply-comment .reply-comment-inpt .comment-info .comment-count-box{font-size:14px; color:#999; margin-right:10px;} .review-comment-form .reply-comment .reply-comment-inpt .comment-info .comment-count-box span{font-size:14px; color:#999;} .review-comment-form .reply-comment .reply-comment-inpt .comment-info .btn{width:80px; height:40px; margin-right:5px; } .review-comment-form .reply-comment .reply-comment-inpt .comment-info .btn:last-child{margin-right:0px;} /* 리뷰 작성 */ .review-write-form{width:100%; display:flex; margin-top:30px; padding-top:20px; padding-bottom:30px; border-bottom:1px solid #ddd; border-top:1px solid #131313; box-sizing:border-box; } .review-write-form .review-write-box{width:calc( 100% - 274px ); } .review-write-form .review-write-box .title-box .review-title-inpt{font-size:14px;} .review-write-form .review-write-box .summery-box{width:100%; margin-top:10px; position: relative;} .review-write-form .review-write-box .summery-box .review-summery-inpt{width:100%; height:300px; border:1px solid #ddd; outline: none; resize: none; padding: 8px 12px 40px 12px; box-sizing:border-box; font-size:14px; } .review-write-form .review-write-box .summery-box .review-summery-inpt::placeholder{color:#999;} .review-write-form .review-write-box .summery-box .review-text-count{font-size:14px; color:#999; position: absolute; right:18px; bottom:12px;} .review-write-form .review-write-box .summery-box .review-text-count span{font-size:14px; color:#999;} .photo-notice-text {font-size: 14px;color: #666;font-weight: normal;padding-left: 15px;position: relative;margin-top: 10px;} .photo-notice-text:before {content: '';position:absolute; left: 0;width: 3px;height: 3px;border-radius: 3px;overflow: hidden;background-color: #666;left: 4px;top: 6px;} .review-write-form .review-write-box .photo-insert-form{width:100%; margin-top:20px; } .review-write-form .review-write-box .photo-insert-form input[type="file"]{display:none;} .review-write-form .review-write-box .photo-insert-form input[type="file"] + label {display:flex; flex-direction: column; cursor:pointer; align-items: center; justify-content: center; border:1px dashed #ccc; box-sizing:border-box; background:#f9f9f9; height:140px; position: relative;} .review-write-form .review-write-box .photo-insert-form .photo-insert-box .photo-insert-title{ margin-top:10px; color:#515151; font-size:14px; font-weight:500; } .review-write-form .review-write-box .photo-insert-form .photo-insert-box .photo-insert-txt{ margin-top:5px; color:#999; font-size:14px; } .review-write-form .review-write-box .photo-insert-form .photo-insert-box:hover::before{content:""; display:block; width:100%; height:100%; position: absolute; left:0; top:0; background:rgba(0,0,0,0.06);} .review-write-form .review-write-box .photo-list-form{width:100%;margin-top:30px;} .review-write-form .review-write-box .photo-list-form .photo-list-box{display:flex; gap: 10px 10px; width:100%; flex-wrap: wrap; position: relative;} .review-write-form .review-write-box .photo-list-form .photo-list-box .photo-list-con{width:224px; position: relative; } .review-write-form .review-write-box .photo-list-form .photo-list-box .photo-list-con .photo-number{ width:24px; height:24px; background:rgba(19,19,19,0.3); font-size:14px; font-weight:700; color:#fff; display:flex; align-items: center; justify-content: center; position: absolute; left:0; top:0; } .review-write-form .review-write-box .photo-list-form .photo-list-box .photo-list-con .photo-delete-btn{ width:24px; height:24px; background:#333; position: absolute; right: 0; top:0; cursor: pointer; display:flex; align-items: center; justify-content: center; } .review-write-form .review-write-box .photo-list-form .photo-list-box .photo-list-con .photo-delete-btn .photo-delete-ico{position: relative; width:12px; height:12px; } .review-write-form .review-write-box .photo-list-form .photo-list-box .photo-list-con .photo-delete-btn .photo-delete-ico::before{content:""; width:12px; height: 1px; background:#fff; display:block; transform: rotate(45deg); position: absolute; left:0; top:5px; } .review-write-form .review-write-box .photo-list-form .photo-list-box .photo-list-con .photo-delete-btn .photo-delete-ico::after{content:""; width:12px; height: 1px; background:#fff; display:block; transform: rotate(135deg); position: absolute; left:0; top:5px; } .review-write-form .review-write-box .photo-list-form .photo-comment{width:100%; height:22px; display:flex; align-items: center ; margin-top:10px; font-size:14px; color:#999;} /* 리뷰작성 별점 체크 */ .review-write-form .review-score-form{width:246px; height:454px; margin-left:28px; padding:30px 18px; box-sizing:border-box; border:1px solid #ddd; } .review-write-form .review-score-form .review-score-title{height:26px; display:flex; align-items: center; font-size:18px; font-weight:700; padding-left:6px; } .review-write-form .review-score-form .review-score-list{margin-top:16px;} .review-write-form .review-score-form .review-score-list .review-score-con{padding:20px 0px 20px 6px; box-sizing:border-box; border-bottom:1px solid #eee; } .review-write-form .review-score-form .review-score-list .review-score-con:first-child{padding-top:0px;} .review-write-form .review-score-form .review-score-list .review-score-con:last-child{border-bottom:0px; padding-bottom:0px;} .review-write-form .review-score-form .review-score-list .review-score-con .review-scroe-con-title{height:22px; display:flex; align-items: center; font-size:14px; font-weight:500; letter-spacing: -0.5px; } .review-write-form .review-score-form .review-score-list .review-score-con .review-score-chk{display:flex; align-items: center; gap:0px 8px; height:30px; margin-top:6px; } .review-write-form .review-score-form .review-score-list .review-score-con .review-score-chk .score-star{appearance: none; padding:1px;} .review-write-form .review-score-form .review-score-list .review-score-con .review-score-chk .score-star::after{content:""; display:block; width:30px; height:30px; background:url(../images/contents/star_off_b.png) no-repeat center; cursor: pointer; } /* .review-write-form .review-score-form .review-score-list .review-score-con .review-score-chk .score-star:hover::after{background:url(../images/contents/star_on_b.png) no-repeat center;} .review-write-form .review-score-form .review-score-list .review-score-con .review-score-chk .score-star:has( ~ .score-star:hover )::after{background:url(../images/contents/star_on_b.png) no-repeat center}; .review-write-form .review-score-form .review-score-list .review-score-con .review-score-chk .score-star:checked::after, .review-write-form .review-score-form .review-score-list .review-score-con .review-score-chk .score-star:has( ~ .score-star:checked )::after {background:url(../images/contents/star_on_b.png) no-repeat center;} */ .review-write-form .review-score-form .review-score-list .review-score-con .review-score-chk .score-star.active::after{background:url(../images/contents/star_on_b.png) no-repeat center;} .review-reword{width:100%; margin-top:20px; padding:30px; box-sizing:border-box; background:#f9f9f9; display:flex; align-items: flex-start; } .review-reword .review-reword-title{width:250px; display:flex; align-items: center; font-size: 18px; font-weight:700; color:#333; } .review-reword .review-reword-title::before{content:""; width:24px; height:24px; display:block; background:url(../images/contents/review_care_ico.png) no-repeat center; margin-right:6px;} .review-reword .review-reword-summery{width:calc( 100% - 254px ); margin-left:4px; } .review-reword .review-reword-summery .summery-txt{font-size:16px; color:#515151;} .review-reword .review-reword-summery ul{margin-top:10px; width:100%;} .review-reword .review-reword-summery ul li{padding-left:15px; width:100%; box-sizing:border-box; position: relative; font-size:14px; color:#666; margin-top:10px; } .review-reword .review-reword-summery ul li::before{content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:5px; } .review-write-btn-box{margin-top:50px;} .review-write-btn-box .btn{width:240px;} /* 내차팔기 */ .buy-section{width:550px; margin:0 auto; padding:50px 0px 0px 0px; box-sizing:border-box; } .buy-section .buy-title{width:100%; text-align: center;} .buy-section .buy-title .title{font-size:38px; font-weight:500; line-height:1.4;} .buy-section .buy-title .title span{ font-size:38px; font-weight:700;} .buy-section .buy-car-number{ width:402px; height:93px; margin:30px auto 0 auto; position: relative; } .buy-section .buy-car-number .buy-car-number-box{width:402px; height:93px; background:url(../images/smartbuy/buy_car_number_bg.png) no-repeat center; padding:6px 6px 6px 51px; box-sizing:border-box; } .buy-section .buy-car-number .buy-car-number-box.box-move{position: relative;} .buy-section .buy-car-number .buy-car-number-box.box-move::after{content:""; display:block; width:0px; height:81px; background:#fff; position: absolute; top:6px; right:7px; animation-name: number_box_move ; animation-duration: 2s; animation-iteration-count: 1; } .buy-section .buy-car-number .buy-car-number-box input[type=text]{width:100%;height:100%; border:0px; outline: none; font-size:52px; text-align: center; font-weight:700; } .buy-section .buy-car-number .buy-car-number-box input[type=text]::placeholder{color:#ddd;} .buy-section .buy-car-number .buy-car-number-box input[type="text"]:disabled{color:#131313;} .buy-section .buy-view-form{width:100%;} .buy-section .buy-view-form .buy-view-main-obj{width:100%; height:426px; position: relative;} .buy-section .buy-view-form .buy-view-main-obj .car-obj01{position: absolute; right: 0; bottom:0px; opacity: 1; animation-name: main_object_move01 ; animation-duration: 2s; animation-iteration-count: 1;} .buy-section .buy-view-form .buy-view-main-obj .car-obj02{position: absolute; right: 3px; bottom:89px; opacity: 1; animation-name: main_object_move02 ; animation-duration: 2s; animation-iteration-count: 1; } .buy-section .buy-view-form .buy-event{width:100%; padding:90px 30px; box-sizing:border-box; background:#0061fd; position: relative; z-index: 2; } .buy-section .buy-view-form .buy-event .buy-event-box-title{position: relative; width:100%;} .buy-section .buy-view-form .buy-event .buy-event-box-title .buy-event-bage{width:108px; height:33px; display:flex; align-items: center; justify-content: center; font-size:16px; border:1px solid #fff; color:#fff; border-radius: 33px; font-weight:500; } .buy-section .buy-view-form .buy-event .buy-event-box-title .title{font-size:33px; color:#fff; line-height:1.2; margin-top:15px;} .buy-section .buy-view-form .buy-event .buy-event-box-title .title span{font-weight: 700; font-size:33px; color:#fff;} .buy-section .buy-view-form .buy-event .buy-event-box-title .buy-event-obj{position: absolute; right:0; top:0;} .buy-section .buy-view-form .buy-event .buy-event-box{margin-top:60px;display: flex; flex-wrap: wrap;} .buy-section .buy-view-form .buy-event .buy-event-box .buy-event-title{font-size:25px; font-weight:700; color:#fff;} .buy-section .buy-view-form .buy-event .buy-event-box .buy-event-con{width:100%; margin-top:30px;display:flex; align-items: center;} .buy-section .buy-view-form .buy-event .buy-event-box .buy-event-con .buy-event-summery{width:435px; padding:30px; box-sizing:border-box; background:#fff; border-radius: 12px; } .buy-section .buy-view-form .buy-event .buy-event-box .buy-event-con .buy-event-summery .summery-title{font-size:25px; font-weight:500; line-height:1.2;} .buy-section .buy-view-form .buy-event .buy-event-box .buy-event-con .buy-event-summery .summery-title span{font-size:25px; font-weight:700;} .buy-section .buy-view-form .buy-event .buy-event-box .buy-event-con .buy-event-summery .summery-list{width:100%; margin-top:24px;} .buy-section .buy-view-form .buy-event .buy-event-box .buy-event-con .buy-event-summery .summery-list li{font-size:20px; margin-top:10px; position: relative; padding-left:10px; box-sizing:border-box; word-break: keep-all; } .buy-section .buy-view-form .buy-event .buy-event-box .buy-event-con .buy-event-summery .summery-list li::before{content:"·"; font-size:20px; position: absolute; left:0; top:0; } .buy-section .buy-view-form .buy-event .buy-event-box .buy-event-con .buy-event-summery .summery-list li:first-child{margin-top:0px;} .buy-section .buy-view-form .buy-event .buy-event-box .buy-event-con .buy-event-pay{width:calc( 100% - 435px ); border-radius: 12px; position: relative; height:100%; display:flex; align-items: center; } .buy-section .buy-view-form .buy-event .buy-event-box .buy-event-con .buy-event-pay.buy-event01{background:#15c9ff;} .buy-section .buy-view-form .buy-event .buy-event-box .buy-event-con .buy-event-pay.buy-event02{background:#042281;} .buy-section .buy-view-form .buy-event .buy-event-box .buy-event-con .buy-event-pay.buy-event03{background:#131313;} .buy-section .buy-view-form .buy-event .buy-event-box .buy-event-con .buy-event-pay .buy-event-pay-txt{color:#fff; font-size:22px; position: absolute; left:50%; top:50%; transform: translate( -50%, -50% ) rotate(90deg); white-space: nowrap; font-weight:700; } .buy-section .buy-view-form .buy-review-box{width:100%; position: relative; box-sizing:border-box; background:#fff; } .buy-section .buy-view-form .buy-review-box .buy-review-title{padding:96px 0px 0px 30px; box-sizing:border-box; } .buy-section .buy-view-form .buy-review-box .buy-review-title .title{font-size:30px; font-weight:500; line-height:1.2;} .buy-section .buy-view-form .buy-review-box .buy-review-title .title span{font-size:30px; font-weight:700;} .buy-section .buy-view-form .buy-review-box .buy-review-title .txt{margin-top:18px; font-size:22px; color:#666; } .buy-section .buy-view-form .buy-review-box .buy-review-title .txt span{font-size:22px; color:#666; font-weight:700; } .buy-section .buy-view-form .buy-review-box .buy-review-swiper{width:100%; margin-top:48px; position: relative; padding-bottom:87px; box-sizing:border-box;} .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box{} .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con{width:390px; display:block; margin-left:30px;} .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con .review-thumnail{width:100%; height:292px; position: relative; overflow: hidden; background:url(../images/contents/pc_review_thumbnail.png) no-repeat center; background-size:contain; } .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con .review-thumnail img{position: absolute; left:50%; top:50%; transform: translate( -50%, -50% ); } .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con .review-info{margin-top:30px;} .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con .review-info .review-info-top{width:100%; display:flex; align-items: center; justify-content: space-between;} .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con .review-info .review-info-top .score-box{display:flex; align-items: center;} .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con .review-info .review-info-top .score-box .review-score{display:flex; align-items: center;} .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con .review-info .review-info-top .score-box .review-score li{width:30px; height:30px; background: url(../images/smartbuy/buy_star_off.png) no-repeat center; margin-right:3px; } .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con .review-info .review-info-top .score-box .review-score li:last-child{margin-right:0px;} .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con .review-info .review-info-top .score-box .review-score li.star{background: url(../images/smartbuy/buy_star_on.png) no-repeat center;} .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con .review-info .review-info-top .score-box .score-txt{font-size:20px; margin-left:7px; font-weight:700; } .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con .review-info .review-info-top .review-user{ font-size:16px; color:#999; } .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con .review-info .review-info-top .review-user span{color:#131313; font-size:16px;} .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con .review-info .review-title{ font-size:20px; font-weight:700; margin-top:15px; } .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con .review-info .review-txt{ font-size:16px; margin-top:15px; line-height:1.2; display:-webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient:vertical; -webkit-line-clamp: 2; word-break: break-all; } .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-swiper-box .buy-review-con .review-info .review-date{ font-size:14px; margin-top:15px; color:#999; } .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-pagination{top:auto; bottom:0; left:50%; transform: translate( -50%, -0 ); width:180px; height:3px; border-radius: 3px; background:#eee; } .buy-section .buy-view-form .buy-review-box .buy-review-swiper .buy-review-pagination .swiper-scrollbar-drag{background:#131313; border-radius: 3px;} .buy-section .buy-view-form .buy-review-box .buy-review-more{width:100%; height:90px; border-top:1px solid #ddd; border-bottom:1px solid #ddd; box-sizing:border-box; margin-top:60px; } .buy-section .buy-view-form .buy-review-box .buy-review-more .buy-review-more-btn{width:100%; height:100%; display:flex; align-items: center; justify-content: center; font-size:24px; font-weight:500; color:#666; } .buy-section .buy-view-form .buy-review-box .buy-review-more .buy-review-more-btn span{font-size:24px; font-weight:500; margin-right:4px; } .buy-section .buy-view-form .buy-step-form{width:100%; padding:72px 0px 0px 0px; box-sizing: border-box; background:#f6f6f6; } .buy-section .buy-view-form .buy-step-form .buy-step-title{width:100%;} .buy-section .buy-view-form .buy-step-form .buy-step-title .txt{ color:#0061FD; font-size:22px; text-align: center;} .buy-section .buy-view-form .buy-step-form .buy-step-title .title{ font-weight:700; font-size:33px; margin-top:10px; text-align: center; } .buy-section .buy-view-form .buy-step-form .buy-step-box{width:100%; margin-top:36px; position: relative; } .buy-section .buy-view-form .buy-step-form .buy-step-box .buy-step-list .buy-step-con{display:flex; flex-direction: column; align-items: center; justify-content: center; background: #f6f6f6; } .buy-section .buy-view-form .buy-step-form .buy-step-box .buy-step-list .buy-step-con .buy-step-con-num{display:flex; align-items: center; justify-content: center; font-size:22px; } .buy-section .buy-view-form .buy-step-form .buy-step-box .buy-step-list .buy-step-con .buy-step-con-num span{display:flex; align-items: center; justify-content: center; width:26px; height:26px; border-radius: 26px; font-size:18px; font-weight:700; color:#fff; background:#0061FD; margin-right:9px; } .buy-section .buy-view-form .buy-step-form .buy-step-box .buy-step-list .buy-step-con img{margin-top:24px;} .buy-step-next.swiper-button-disabled, .buy-step-prev.swiper-button-disabled{opacity: 0;} .buy-step-next:after, .buy-step-prev:after{content:""; display:block; width:60px; height:60px; } .buy-step-next:after{background:url(../images/smartbuy/buy_service_next.png) no-repeat center;} .buy-step-prev:after{background:url(../images/smartbuy/buy_service_prev.png) no-repeat center;} .buy-section .buy-view-form .buy-step-form .buy-step-summery{padding:30px 0px; box-sizing:border-box; background:#333; color:#fff; line-height:1.3; text-align: center; font-size:22px; } .buy-section .buy-view-form .buy-faq-form{width:100%; padding-top:96px; box-sizing:border-box;} .buy-section .buy-view-form .buy-faq-form .buy-faq-title{width:100%; padding:0 30px; box-sizing:border-box; font-size:33px; font-weight:700; } .buy-section .buy-view-form .buy-faq-form .buy-faq-list{width:100%;padding:0 30px; box-sizing:border-box; margin-top:24px;} .buy-section .buy-view-form .buy-faq-form .buy-faq-list .buy-faq-con{border-bottom:1px solid #eee; box-sizing:border-box;} .buy-section .buy-view-form .buy-faq-form .buy-faq-list .buy-faq-con:first-child{border-top:1px solid #131313;} .buy-section .buy-view-form .buy-faq-form .buy-faq-list .buy-faq-con .buy-faq-tit{padding:30px 0px; box-sizing:border-box; display:flex; align-items: center; justify-content: space-between; cursor:pointer;} .buy-section .buy-view-form .buy-faq-form .buy-faq-list .buy-faq-con .buy-faq-tit .title{ width:calc( 100% - 30px );font-size:22px; color:#333; line-height:1.2; position: relative; display:flex; align-items: flex-start; word-break: keep-all; } .buy-section .buy-view-form .buy-faq-form .buy-faq-list .buy-faq-con .buy-faq-tit .title span{font-size:22px; font-weight:700; margin-right:15px; } .buy-section .buy-view-form .buy-faq-form .buy-faq-list .buy-faq-con .buy-faq-tit::after{content:""; display:block; width:26px; height:26px; background:url(../images/smartbuy/buy_faq_arrow.png) no-repeat center; transform: rotate(0deg); transition: all 0.2s; } .buy-section .buy-view-form .buy-faq-form .buy-faq-list .buy-faq-con .buy-faq-tit.active .title{font-weight:700;} .buy-section .buy-view-form .buy-faq-form .buy-faq-list .buy-faq-con .buy-faq-tit.active::after{transform: rotate(180deg);} .buy-section .buy-view-form .buy-faq-form .buy-faq-list .buy-faq-con .buy-faq-summery{padding:48px 30px; box-sizing:border-box; background:#f9f9f9; font-size:22px; color:#666; line-height: 1.3; white-space: pre-line; display:none; } .buy-section .buy-view-form .buy-faq-form .buy-faq-list .buy-faq-con .buy-faq-summery p{font-size:22px; color:#666; line-height: 1.3; white-space: pre-line; } .buy-section .buy-view-form .buy-faq-form .buy-faq-list .buy-faq-con .buy-faq-summery span{font-size:22px; color:#666; line-height: 1.3; white-space: pre-line; } .buy-section .buy-view-form .buy-faq-form .buy-faq-more{width:100%; height:90px; border-top:1px solid #ddd; border-bottom:1px solid #ddd; box-sizing:border-box; margin-top:60px; } .buy-section .buy-view-form .buy-faq-form .buy-faq-more .buy-faq-more-btn{width:100%; height:100%; display:flex; align-items: center; justify-content: center; font-size:24px; font-weight:500; color:#666; } .buy-section .buy-view-form .buy-faq-form .buy-faq-more .buy-faq-more-btn span{font-size:24px; font-weight:500; margin-right:4px; } .buy-section .buy-customer-form{width:100%; height:180px; padding:0 30px; box-sizing:border-box; background:#f4f9ff url(../images/smartbuy/buy_call_bg.png) no-repeat right 20px; display:flex; flex-direction: column; justify-content: center; } .buy-section .buy-customer-form .buy-customer-title{font-size:30px; color:#333; line-height:1.2;} .buy-section .buy-customer-form .buy-customer-title span{font-size:30px; color:#333; font-weight:700;} .buy-section .buy-customer-form .buy-customer-txt{font-size:20px; color:#333; margin-top:15px;} .buy-section .buy-fixed-btn-form{width:100%; height:141px;} .buy-section .buy-fixed-btn-form .buy-fixed-btn{width:100%; display:flex; align-items: center; justify-content: space-between; padding:24px 25px; background:#fff; box-sizing:border-box; position:relative; } .buy-section .buy-fixed-btn-form .buy-fixed-btn.fixed{position:fixed; left:50%; bottom:0; transform: translate( -50% , -0 ); width:550px; z-index: 9; } .buy-section .buy-fixed-btn-form .buy-fixed-btn .share-btn{width:93px; height:93px; border-radius: 6px; margin-left:0px; background:#fff; border:1px solid #ccc;box-sizing: border-box; display:flex; align-items: center; justify-content: center; } .buy-section .buy-fixed-btn-form .buy-fixed-btn .car-num-btn{width:calc( 100% - 100px); height:93px; background:url(../images/smartbuy/buy_car_number_bg.png) no-repeat center; padding:6px 6px 6px 51px; box-sizing: border-box; font-size:52px; font-weight:700; color:#ddd; } .buy-section .buy-fixed-btn-form .page-prev{height:78px;} .buy-section .buy-fixed-btn-form .page-prev span{font-size:26px;} .buy-section .buy-fixed-btn-form .page-next{height:78px; } .buy-section .buy-fixed-btn-form .page-next span{font-size:26px;} .buy-section .buy-fixed-btn-form .save-next{height:78px; width:100%;} .buy-section .buy-fixed-btn-form .save-next span{font-size:26px;} /* 가치보장으로 내차 팔기 */ .buy-section .buy-car-info{width:100%;} .buy-section .buy-car-info .buyback-car-info{width:100%; border-bottom:1px solid #ddd; display:flex; gap:0px 30px; padding-bottom:30px;} .buy-section .buy-car-info .buyback-car-info .car-thumbnail{width:180px; height:135px; background: url(../../resources/images/smartbuy/); display:flex; flex-direction: column; align-items: center; justify-content: center; overflow: hidden; position:relative; background:#e3e3e3; } .buy-section .buy-car-info .buyback-car-info .car-thumbnail::before{content:"";display:block; width:48px; height:48px; border-radius: 48px; background:#fff url(../images/contents/lp_thum_none.png) no-repeat center; } .buy-section .buy-car-info .buyback-car-info .car-thumbnail::after{content:"차량 사진 준비중 입니다."; font-size:16px; letter-spacing: -0.2px; font-weight:700; margin-top:10px; color:#acacac; } .buy-section .buy-car-info .buyback-car-info .car-info{width:calc( 100% - 210px );} .buy-section .buy-car-info .buyback-car-info .car-info .car-name{font-size:22px; line-height:1.4;} .buy-section .buy-car-info .buyback-car-info .car-info .car-model{font-size:22px; line-height:1.4;} .buy-section .buy-car-info .buyback-car-info .car-info .car-infos{display:flex; flex-wrap: wrap; align-items: center; gap:6px 12px; margin-top:6px;} .buy-section .buy-car-info .buyback-car-info .car-info .car-infos li{font-size:20px; color:#888; } .buy-section .buy-car-info .buyback-car-info .car-info .car-pay{font-size:22px; margin-top:6px; line-height: 1.4;} .buy-section .buy-car-info .buyback-car-info .car-info .car-pay span{font-size:22px; font-weight:700;} .buy-section .buy-car-info .buyback-date{ width:100%; margin-top:60px; /*margin-bottom:75px;*/ } .buy-section .buy-car-info .buyback-date .buyback-date-title{display:flex; align-items: center; justify-content: center; font-size:27px; } .buy-section .buy-car-info .buyback-date .buyback-date-title span{font-size:27px; font-weight:700; margin:0 6px;} .buy-section .buy-car-info .buyback-date .buyback-date-title::before{content:""; display: block; width:36px; height:36px; background:url(../images/smartbuy/buyback_buy_date_check.png) no-repeat center; margin-right:12px; } .buy-section .buy-car-info .buyback-date .buyback-pay{width:100%; text-align: center; margin-top:40px; font-size:24px; line-height:1.3;} .buy-section .buy-car-info .buyback-date .buyback-pay span{font-size:24px; font-weight:700;} .buy-section .buy-car-info .buyback-date .buyback-date-comment{font-size:24px; color:#888; margin-top:15px; text-align: center;} .buy-section .buy-car-info .buyback-date .buyback-summary{width:100%; padding:20px; background:#f9f9f9; border:1px solid #eee; border-radius:10px; line-height:1.4; font-size:20px; text-align:center; margin-top:40px;} .buy-section .buy-car-info .buyback-date .buyback-summary span{font-weight:700;} .buy-section .buy-car-info .buyback-date .buyback-btn-box{width:100%; margin-top:40px;} .buy-section .buy-car-info .buyback-date .buyback-btn-box .btn{width:100%; height:78px;} .buy-section .buy-car-info .buyback-date .buyback-btn-box .btn span{font-size:26px;} .buy-section .buyback-faq{border-top:15px solid #f0f0f0; margin-bottom:60px;} .buyback-section{margin-bottom:120px;} .buyback-section .buy-fixed-btn-form .btn{width:100%;} /* 가치보장 팝업 */ .buyback-pop{position: fixed; z-index: 99999; left:50%; top:50%; transform: translate( -50%, -50% ); } .buyback-pop .buyback-pop-form{background:#fff; border:1px solid #131313; width:400px;} .buyback-pop .buyback-pop-form .buyback-pop-cont{padding:40px 20px 16px 20px; border-bottom:1px solid #ddd;} .buyback-pop .buyback-pop-form .buyback-pop-cont .buyback-pop-title{font-size:26px; line-height:1.3;} .buyback-pop .buyback-pop-form .buyback-pop-cont .buyback-pop-title span{font-size:26px; font-weight:700;} .buyback-pop .buyback-pop-form .buyback-pop-cont .buyback-pop-obj{margin:0 auto; display:flex; align-items: center; justify-content: center; } .buyback-pop .buyback-pop-form .buyback-pop-cont .buyback-pop-info{width:100%; margin-top:2px;} .buyback-pop .buyback-pop-form .buyback-pop-cont .buyback-pop-info .title{display:flex; align-items: center; justify-content: space-between;} .buyback-pop .buyback-pop-form .buyback-pop-cont .buyback-pop-info .title .txt{font-size:18px; font-weight:700;} .buyback-pop .buyback-pop-form .buyback-pop-cont .buyback-pop-info .title a{font-size:16px; color:#333;} .buyback-pop .buyback-pop-form .buyback-pop-cont .buyback-pop-info .buyback-info-list{margin-top:8px;} .buyback-pop .buyback-pop-form .buyback-pop-cont .buyback-pop-info .buyback-info-list li{display:flex; align-items: center; font-size:16px; font-weight:500; color:#666;} .buyback-pop .buyback-pop-form .buyback-pop-cont .buyback-pop-info .buyback-info-list li::before{content:""; display:block; width:24px; height:24px; background:url(../images/smartbuy/blue_check_dot.png) no-repeat center; margin-right:2px; } .buyback-pop .buyback-pop-form .buyback-pop-btn{width:100%; padding:24px;} .buyback-pop .buyback-pop-form .buyback-pop-btn .btn{width:100%; height:56px;} .buyback-pop .buyback-pop-form .buyback-pop-btn .btn span{font-size:20px; font-weight:500;} .buyback-pop .buyback-pop-form .buyback-pop-ft{display:flex; align-items: center; justify-content: space-between; height:40px; padding:0 24px; background:#333;} .buyback-pop .buyback-pop-form .buyback-pop-ft button{font-size:14px; color:#fff;} /* 내차팔기 신규 추가 */ #carBuyTypePop{} #carBuyTypePop .buy-type-form{ width:100%; margin-top:20px; } #carBuyTypePop .buy-type-form .buy-type-txt{ font-size:16px; color:#333; line-height:1.4; word-break:keep-all; } #carBuyTypePop .buy-type-form .buy-type-txt span{ font-size:16px; font-weight:700; color:#333; } #carBuyTypePop .buy-type-form .buy-type-list{ display:flex; flex-direction:column; gap:10px; margin-top:20px; } #carBuyTypePop .buy-type-form .buy-type-list .buy-type-con{ width:100%; padding:15px; border-radius:5px; background:#f9f9f9; } #carBuyTypePop .buy-type-form .buy-type-list .buy-type-con .cont{ display:flex; align-items:center; gap:16px; } #carBuyTypePop .buy-type-form .buy-type-list .buy-type-con .cont .ico{ width:60px; } #carBuyTypePop .buy-type-form .buy-type-list .buy-type-con .cont .box .title{ font-size:18px; font-weight:700; color:#131313; } #carBuyTypePop .buy-type-form .buy-type-list .buy-type-con .cont .box .txt{ font-size:14px; color:#666; margin-top:6px; } #carBuyTypePop .buy-type-form .buy-type-list .buy-type-con .cont .box .txt span{ font-size:14px; font-weight:700; color:#131313; } #carBuyTypePop .buy-type-form .buy-type-list .buy-type-con .cont-btn{ margin-top:10px; width:100%; } #carBuyTypePop .buy-type-form .buy-type-list .buy-type-con .cont-btn .btn{ width:100%; height:50px; } #carBuyTypePop .buy-type-form .buy-type-list .buy-type-con .cont-btn .btn span{ font-size:14px; } #carBuyTypePop .buy-type-form .buy-type-summary{ width:100%; margin-top:26px; } #carBuyTypePop .buy-type-form .buy-type-summary li{ font-size:14px; color:#666; position:relative; line-height:1.3; padding-left:14px; } #carBuyTypePop .buy-type-form .buy-type-summary li::before{ content:""; display:block; width:3px; height:3px; border-radius:3px; background:#999; position:absolute; left:3px; top:7px; } #carBuyTypePop .buy-type-form .buy-type-summary li span{ font-size:14px; color:#666; font-weight:700; } #carBuyTypePop .buy-type-form .buy-type-summary li + li{ margin-top:10px; } /* 내차팔기 애니메이션 */ @keyframes number_box_move{ 0% { width:343px; } 100%{ width:0px; } } @keyframes main_object_move01{ 0%, 20% { bottom: -30px; opacity: 0; } 100%{ bottom:0px; opacity: 1; } } @keyframes main_object_move02{ 0%, 40% { bottom: 70px; opacity: 0; } 100%{ bottom:89px; opacity: 1; } } /* 내차팔기 확인 팝업 */ #carBuyCheckPop{} #carBuyCheckPop .buy-scroll-btn{width:189px;} #carBuyCheckPop .buy-check-ok{width:140px; display:none; } #carBuyCheckPop .buy-check-ok.active{display:flex;} #carBuyCheckPop .car-buy-check{padding:40px 0px; box-sizing:border-box; border-bottom:1px solid #eee;} #carBuyCheckPop .car-buy-check:last-child{border-bottom:0px;} #carBuyCheckPop .car-buy-check .car-buy-check-ico{width:48px; height:48px; display:flex; align-items: center; justify-content: center; margin:0 auto;} #carBuyCheckPop .car-buy-check .car-buy-check-title{width:100%;text-align: center; font-size:20px; font-weight:700; margin-top:12px; line-height:1.3; } #carBuyCheckPop .car-buy-check .car-buy-check-txt{width:100%;text-align: center; font-size:16px; margin-top:24px; line-height:1.3;} #carBuyCheckPop .car-buy-check .car-buy-check-txt span{font-weight:700;font-size:16px;} #carBuyCheckPop .car-buy-check .car-buy-check-sum{width:100%; margin-top:30px; background:#f6f6f6; border:1px solid #eee; border-radius: 8px; padding:10px 0px; box-sizing: border-box; font-size:14px; color:#666; line-height:1.3; text-align: center; } #carBuyCheckPop .car-buy-check .car-buy-check-sum span{font-size:14px; font-weight:700; color:#666;} #carBuyCheckPop .car-buy-check .car-buy-check-photo{width:335px; display:flex; flex-wrap: wrap; margin:30px auto 0 auto; gap:16px 10px; } #carBuyCheckPop .car-buy-check .car-buy-check-photo .check-photo-con{width:105px;} #carBuyCheckPop .car-buy-check .car-buy-check-photo .check-photo-con .photo-txt{margin-top:10px; font-size:12px; font-weight:500; text-align: center;} #carBuyCheckPop .car-buy-check .car-buy-sum-list{ margin-top:24px; width:100%; } #carBuyCheckPop .car-buy-check .car-buy-sum-list .car-buy-sum-list-con{padding-left:24px; box-sizing:border-box; position: relative; margin-top:16px;} #carBuyCheckPop .car-buy-check .car-buy-sum-list .car-buy-sum-list-con:first-child{margin-top:0px;} #carBuyCheckPop .car-buy-check .car-buy-sum-list .car-buy-sum-list-con::before{content:""; display: block; width:20px; height:20px; background:url(../images/smartbuy/buy_li_ico.png) no-repeat center; position: absolute; left:0; top:-2px; } #carBuyCheckPop .car-buy-check .car-buy-sum-list .car-buy-sum-list-con .title{font-size:16px; font-weight:700; } #carBuyCheckPop .car-buy-check .car-buy-sum-list .car-buy-sum-list-con .txt{font-size:14px; line-height:1.2; margin-top:6px; word-break: keep-all; } #carBuyCheckPop .car-buy-check .car-buy-sum-list .car-buy-sum-list-con .txt:first-child{margin-top:0px;} #carBuyCheckPop .car-buy-check .car-buy-sum-list .car-buy-sum-list-con .txt .depth02{padding-left:10px; box-sizing:border-box; position: relative; font-size:14px; margin-top:3px; } #carBuyCheckPop .car-buy-check .car-buy-sum-list .car-buy-sum-list-con .txt .depth02::before{content:"·"; font-size:14px; position: absolute; left:0; top:0; } /* 내차팔기 모델선택 추가 */ #carModelPop{display:none;} #carModelPop .layer-pop-body{} #carModelPop .car-model-form{width:100%;} #carModelPop .car-model-form .car-name{width:100%; font-size:18px; font-weight:700; color:#131313; padding:20px 0 18px 0; } #carModelPop .car-model-form .car-model-tbl{width:100%;border-top:1px solid #131313; height:270px; overflow-y:auto; } #carModelPop .car-model-form .car-model-tbl .car-model-select{width:100%; display:flex; align-items:center; padding:10px 20px; gap:0 20px; border-bottom:1px solid #ddd;} #carModelPop .car-model-form .car-model-tbl .car-model-select .model-name{font-size:16px; color:#131313; width:calc( 100% - 100px ); } #carModelPop .car-model-form .car-model-tbl .car-model-select .btn-box{width:80px;} #carModelPop .car-model-form .car-model-tbl .car-model-select .btn-box .btn{height:40px;} #carModelPop .car-model-form .car-model-tbl .car-model-select .btn-box .btn span{font-size:16px; font-weight:500;} /* 내차팔기 소유주 확인 */ .buy-user-form{width:100%;} .buy-user-form .buy-user-inpt{width:402px; height:93px; margin:15px auto 0 auto; padding:3px; box-sizing:border-box;} .buy-user-form .buy-user-inpt .buy-name-inpt{width:100%; height:100%; border:3px solid #131313; box-sizing:border-box; border-radius: 4px; text-align: center; font-size:52px; font-weight:700; } .buy-user-form .buy-user-inpt .buy-name-inpt::placeholder{color:#eee;} .buy-user-form .name-qa{display:flex; align-items: center; justify-content: flex-end; width:402px; margin:16px auto 0 auto;} .buy-user-form .name-qa .name-qa-txt{font-size:20px; color:#666; margin-right:6px; } .buy-user-form .buy-user-summery{width:100%; margin-top:75px; background:#f9f9f9; padding:45px 30px; box-sizing: border-box; } .buy-user-form .buy-user-summery .buy-user-title{font-size:22px; font-weight:700;} .buy-user-form .buy-user-summery .buy-user-txt{font-size:20px; color:#666; line-height:1.3; margin-top:18px; word-break:keep-all; } .buy-user-form .buy-policy-form{ width:100%; margin-top:96px; } .buy-user-form .buy-policy-form .buy-policy-title{ width:100%; padding:0 30px; box-sizing:border-box; font-size:22px; font-weight:700; } .buy-user-form .buy-policy-form .buy-policy-all-box{width:100%; height:87px; display:flex; align-items: center; padding:0 30px; box-sizing:border-box; border-bottom:1px solid #ddd; margin-top:12px; } .buy-user-form .buy-policy-form .buy-policy-box{width:100%; padding:0 30px; box-sizing: border-box;} .buy-user-form .buy-policy-form .buy-policy-box .buy-plicy-con{width:100%; display:flex; align-items: center; justify-content: space-between; height:66px; } .buy-user-form .buy-policy-form .buy-policy-box .buy-plicy-con .buy-policy-arrow{content:""; display:block; width:24px; height:24px; background:url(../images/common/arrow_ico_b.png) no-repeat center; transform: rotate(0deg); transition: all 0.2s; cursor: pointer; } .buy-user-form .buy-policy-form .buy-policy-box .buy-plicy-con.active .buy-policy-arrow{transform: rotate(180deg);} .buy-user-form .buy-policy-form .buy-policy-box .buy-policy-summery{width:100%; padding:30px 24px; box-sizing:border-box; background:#f9f9f9; } .buy-user-form .buy-policy-form .buy-policy-box .buy-policy-summery:first-child{margin-top:0px;} .buy-user-form .buy-policy-form .buy-policy-box .buy-policy-summery .buy-policy-sum-title{padding-left: 24px; box-sizing:border-box; font-weight:700; color:#888; position:relative; font-size:20px; margin-top:24px; } .buy-user-form .buy-policy-form .buy-policy-box .buy-policy-summery .buy-policy-sum-title::before{content:""; display:block; width:6px; height:6px; border-radius: 6px; background:#999; position: absolute; left:6px; top: 7px; } .buy-user-form .buy-policy-form .buy-policy-box .buy-policy-summery .buy-policy-sum-txt{padding-left:24px; box-sizing:border-box; color:#888; font-size:20px; line-height:1.4; margin-top:5px; } .buy-user-form .buy-policy-form .buy-policy-box .buy-policy-summery ol.buy-policy-sum-list{padding-left:43px; box-sizing:border-box;} .buy-user-form .buy-policy-form .buy-policy-box .buy-policy-summery ol.buy-policy-sum-list li{font-size:20px; color:#888; line-height:1.4; list-style: auto; box-sizing:border-box; margin-top:5px;} .buy-user-form .buy-plicy-sub-sum{padding:18px 30px 30px 30px; box-sizing:border-box; } .buy-user-form .buy-plicy-sub-sum .txt{display:flex; align-items: flex-start; font-size:20px; color:#666; line-height:1.4;} .buy-user-form .buy-plicy-sub-sum .txt::before{content:"※"; margin-right:4px;} /* 내차팔기 차량 정보 확인 */ .buy-car-info{width:100%;padding:0 30px; margin-top:75px; box-sizing:border-box;} .buy-car-info .buy-car-info-view{padding:30px 0px; box-sizing: border-box; border-top:1px solid #131313; border-bottom:1px solid #eee; } .buy-car-info .buy-car-info-view .buy-car-info-list{display:flex; align-items: flex-start; margin-top:15px; } .buy-car-info .buy-car-info-view .buy-car-info-list:first-child{margin-top:0px;} .buy-car-info .buy-car-info-view .buy-car-info-list .buy-car-info-title{font-size:22px; width:150px; color:#666;} .buy-car-info .buy-car-info-view .buy-car-info-list .buy-car-info-txt{font-size:22px; width:calc( 100% - 150px ); font-weight:500; line-height:1.3;} .buy-car-info .buy-car-info-qa{display:flex; align-items: center; margin-top:15px;margin-bottom:60px; } .buy-car-info .buy-car-info-qa .car-info-qa-txt{font-size:20px; color:#666;} .car-info-tooltip{margin-left:6px;} .car-info-tooltip .tooltip-form .tooltip-box{width:max-content;} /* 휴대폰 인증 */ .buy-user-phone{width:100%; padding:45px 30px; box-sizing:border-box;} .buy-user-phone .buy-user-phone-chk{width:100%; height:225px; border-radius: 4px; display:flex; align-items: center; justify-content: center; flex-direction: column; border:1px solid #ddd;} .buy-user-phone .buy-user-phone-chk .user-phone-chk-txt{font-size:22px; font-weight:500;} .buy-section .user-phone-sum{padding:45px 30px;} .buy-section .user-phone-sum .user-phone-sum-title{font-size:22px;} .buy-section .user-phone-sum .user-phone-sum-list li{font-size:20px; padding-left:22px;} .buy-section .user-phone-sum .user-phone-sum-list li::before{width:6px; height:6px; top:10px;} /* 내차팔기 차량 정보 입력 */ .buy-progress-form{width:100%; margin-top:45px; height:45px;} .buy-progress-form .buy-progress-box{width:100%;} .buy-progress-form .buy-progress-box.fixed{position: fixed; width:550px; left:50%; top:79px; background:#fff; transform: translate( -50% , -0 ); z-index: 3; } .buy-progress-form .buy-progress-box .buy-progress-car{width:100%;height:42px; position: relative;} .buy-progress-form .buy-progress-box .buy-progress-car img{position: absolute; left:52%; transition: all 0.2s;} .buy-progress-form .buy-progress-box .buy-progress-car .buy-progress-count{position: absolute; right:0; top:50%; transform: translate( -0, -50% ); font-size:22px; color:#0061FD; } .buy-progress-form .buy-progress-box .buy-progress-car .buy-progress-count span{font-size:22px; color:#0061FD;} .buy-progress-form .buy-progress-box .buy-progress-bar{width:100%; height:3px; background:#e3e3e3;} .buy-progress-form .buy-progress-box .buy-progress-bar .bar{height:3px; width:66%; background:#0061FD; transition: all 0.2s;} .buy-info-form{width:100%;} .buy-info-form .buy-info-box{width:100%; padding:75px 30px; box-sizing:border-box; border-bottom:1px solid #eee; } .buy-info-form .buy-info-box:last-child{border-bottom:0px;} .buy-info-form .buy-info-box .buy-info-title{font-size:27px; font-weight:600; display:flex; align-items: center; justify-content: space-between; } .buy-info-form .buy-info-box .buy-info-title span{font-size:20px; color:#515151; font-weight:400;} .buy-info-form .buy-info-box .buy-info-con{width:100%; margin-top:12px; } .buy-info-form .buy-info-box .buy-info-con:nth-child(2){margin-top:36px;} .buy-info-form .buy-info-box .buy-info-con .buy-info-con-title{font-size:22px; padding:6px 0px; box-sizing:border-box; display:flex; align-items: center; justify-content: space-between; } .buy-info-form .buy-info-box .buy-info-con .buy-info-con-inpt{width:100%; position: relative; margin-top:12px; } .buy-info-form .buy-info-box .buy-info-con .buy-info-con-inpt input[type="text"]{width:100%; height:72px; padding:0 18px; box-sizing:border-box; font-size:22px; outline: none; border:1px solid #ddd; } .buy-info-form .buy-info-box .buy-info-con .buy-info-con-inpt .buy-info-con-inpt-txt{position:absolute; font-size:22px; right:18px; top:50%; transform: translate( -0, -50% ); } .buy-info-form .buy-info-box .buy-info-con .buy-info-choice-box{width:100%; display:flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap:12px 12px;} .buy-info-form .buy-info-box .buy-info-con .buy-info-choice-box.buy-file-check{margin-top: 36px;} .buy-info-form .buy-info-box .buy-info-con .buy-info-choice-box .buy-chocie-con{} .buy-info-form .buy-info-box .buy-info-con .buy-info-choice-box .buy-chocie-con.choice-type01{width:calc( 50% - 6px ); height:84px;} .buy-info-form .buy-info-box .buy-info-con .buy-info-choice-box .buy-chocie-con.choice-type02{width:calc( 33.33% - 8px ); height:120px;} .buy-info-form .buy-info-box .buy-info-con .buy-info-choice-box .buy-chocie-con input[type="radio"]{display:none;} .buy-info-form .buy-info-box .buy-info-con .buy-info-choice-box .buy-chocie-con input[type="checkbox"]{display:none;} .buy-info-form .buy-info-box .buy-info-con .buy-info-choice-box .buy-chocie-con input + label{width:100%; height:100%; background:#fff; display: flex; align-items: center; justify-content: center; box-sizing:border-box; position: relative; text-align: center; border:1px solid #ddd; border-radius: 2px; cursor:pointer; } .buy-info-form .buy-info-box .buy-info-con .buy-info-choice-box .buy-chocie-con input + label span{font-size:22px; font-weight:500; color:#515151; position: relative; z-index: 2; line-height:1.4; word-break: keep-all;} .buy-info-form .buy-info-box .buy-info-con .buy-info-choice-box .buy-chocie-con input + label:hover::before{content:""; display:block; width:100%; height:100%; background:rgba(0,0,0,0.06); position: absolute; left:0; top:0; } .buy-info-form .buy-info-box .buy-info-con .buy-info-choice-box .buy-chocie-con input:checked + label{border:1px solid #131313;} .buy-info-form .buy-info-box .buy-info-con .buy-info-choice-box .buy-chocie-con input:checked + label::after{content:""; display:block; width:30px; height:30px; background:url(../images/smartbuy/buy_box_check_ico.png) no-repeat center; position: absolute; right:-12px; top: -12px; } .buy-info-form .buy-info-box .buy-info-con .buy-info-choice-box .buy-chocie-con input[type="checkbox"]:checked + label::after{display:none;} .buy-info-form .buy-info-box .buy-info-con .buy-info-choice-box .buy-chocie-con input:checked + label span{color:#131313; font-weight:700;} .buy-info-form .buy-info-box .buy-info-con .accident-form{ width:100%; margin-top:25px; position: relative; padding:24px; box-sizing:border-box; border-radius: 8px; background:#f9f9f9; display:none; } .buy-info-form .buy-info-box .buy-info-con .accident-form::before{content:""; display: block; width: 32px ; height: 14px; background:url(../images/smartbuy/accident_arrow.png) no-repeat center; position: absolute; left:60px; top:-13px; } .buy-info-form .buy-info-box .buy-boast-count{width:100%; display:none; height:87px; align-items: center; justify-content: center; font-size:22px; font-weight:700; background:#f9f9f9; margin-top:36px; } .buy-info-form .buy-info-box .buy-boast-count.active{display:flex;} .buy-info-form .buy-info-box .buy-car-area{width:100%; margin-top:36px;} .buy-info-form .buy-info-box .buy-car-area textarea{width:100%; resize: none; height:240px; padding:18px; box-sizing:border-box; border:1px solid #ddd; outline: none; font-size:20px; line-height:1.3;} .buy-info-form .buy-info-box .buy-car-area textarea:focus{border:1px solid #131313;} .buy-info-form .buy-info-box .buy-info-con .buy-car-photo-txt{margin-top:36px;} .buy-info-form .buy-info-box .buy-info-con .buy-car-photo-txt .txt{font-size:20px; margin-top:12px; } .buy-info-form .buy-info-box .buy-info-con .buy-car-photo-txt .txt:first-child{margin-top:0px;} .buy-info-form .buy-info-box .buy-info-con .buy-car-photo-txt .txt span{font-size:20px; font-weight:700; line-height:1.3;} .buy-info-form .buy-info-box .buy-info-con .buy-car-photo-sample{width:100%; margin-top:45px;} .buy-info-form .buy-info-box .buy-info-con .buy-car-photo-sample .sample-list{display:flex; flex-wrap: wrap; gap: 24px 15px; } .buy-info-form .buy-info-box .buy-info-con .buy-car-photo-sample .sample-list li{width:calc( 33.33% - 10px );} .buy-info-form .buy-info-box .buy-info-con .buy-car-photo-sample .sample-list li .sample-txt{width:100%; text-align: center; line-height: 1.3; margin-top:12px; font-size:16px; font-weight:500; } .buy-info-form .buy-info-box .buy-info-con .buy-car-photo-giude{padding:15px 0px; box-sizing:border-box; width:100%; margin-top:45px; background:#f6f6f6; border:1px solid #eee; border-radius: 8px;} .buy-info-form .buy-info-box .buy-info-con .buy-car-photo-giude .guide-title{text-align: center; font-weight:600; color:#666; font-size:20px; } .buy-info-form .buy-info-box .buy-info-con .buy-car-photo-giude .guide-txt{text-align: center; color:#666; font-size:20px; line-height:1.3; margin-top:6px; } .buy-info-form .buy-info-box .photo-count-title{font-size:27px;font-weight:600;} .buy-info-form .buy-info-box .photo-count-title span{font-size:27px;color:#131313; font-weight:400;} .buy-info-form .buy-info-box .photo-count-title span.photo-count{font-weight:600;} .buy-info-form .buy-info-box .photo-count-title + .buy-info-con{margin-top:15px;} .buy-info-form .buy-info-box .buy-info-con .photo-insert-guide{color:#666; font-size:22px; } .buy-info-form .buy-info-box .buy-info-con .photo-insert-guide span{color:#666; font-size:22px; font-weight:700;} .buy-info-form .buy-info-box .buy-info-con .photo-insert-box{margin-top:36px; width:100%; display:flex; flex-wrap: wrap; gap:15px 15px; } .buy-info-form .buy-info-box .buy-info-con .photo-insert-box li{width:calc(33.33% - 10px); height:105px;} .buy-info-form .buy-info-box .buy-info-con .photo-insert-box .photo-file-box{border:1px solid #ddd; border-radius: 4px; background:#f9f9f9; box-sizing:border-box;} .buy-info-form .buy-info-box .buy-info-con .photo-insert-box .photo-file-box input[type="file"]{display:none;} .buy-info-form .buy-info-box .buy-info-con .photo-insert-box .photo-file-box input[type="file"] + label{width:100%; height:100%; display:flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer; } .buy-info-form .buy-info-box .buy-info-con .photo-insert-box .photo-file-box input[type="file"] + label .car-photo-txt{margin-top:3px; font-size:22px; font-weight:500; } .buy-info-form .buy-info-box .buy-info-con .photo-insert-box .photo-list-con{position: relative; overflow: hidden;} .buy-info-form .buy-info-box .buy-info-con .photo-insert-box .photo-list-con .photo-delete{position: absolute; right:0; top:0; width:30px; height:30px; background:#333; display:flex; align-items: center; justify-content: center; z-index: 2; } .buy-info-form .buy-info-box .buy-info-con .photo-insert-box .photo-list-con .photo-delete .photo-delete-ico{ width:18px; height:18px; position: relative; cursor:pointer;} .buy-info-form .buy-info-box .buy-info-con .photo-insert-box .photo-list-con .photo-delete .photo-delete-ico::before{content:""; display:block; width:18px; height:1px; background:#fff; position: absolute; left:0; top:8px; transform: rotate( 45deg ); } .buy-info-form .buy-info-box .buy-info-con .photo-insert-box .photo-list-con .photo-delete .photo-delete-ico::after{content:""; display:block; width:18px; height:1px; background:#fff; position: absolute; left:0; top:8px; transform: rotate( 135deg ); } .buy-info-form .buy-info-box .buy-info-con .photo-insert-box .photo-list-con img{position: absolute; left:50%; top:50%; transform: translate( -50%, -50% ); } .buy-info-form .buy-info-box .buy-info-con .buy-file-insert-box{margin-top:25px; position: relative; padding:24px; box-sizing:border-box; border-radius: 8px; background:#f9f9f9; display:none; } .buy-info-form .buy-info-box .buy-info-con .buy-file-insert-box::before{content:""; display: block; width: 32px ; height: 14px; background:url(../images/smartbuy/accident_arrow.png) no-repeat center; position: absolute; left:21%; top:-13px; } .buy-info-form .buy-info-box .buy-info-con .buy-file-insert-box .buy-file-box{width:100%; display:flex; align-items: center; position: relative; } .buy-info-form .buy-info-box .buy-info-con .buy-file-insert-box .buy-file-box .file_name{width:calc( 100% - 132px ); font-size:19px; border:1px solid #ddd; box-sizing:border-box; height:72px; outline: none; padding:0 18px; box-sizing: border-box; } .buy-info-form .buy-info-box .buy-info-con .buy-file-insert-box .buy-file-box .file_name.active{padding-left:54px;} .buy-info-form .buy-info-box .buy-info-con .buy-file-insert-box .buy-file-box input[type="file"]{display:none;} .buy-info-form .buy-info-box .buy-info-con .buy-file-insert-box .buy-file-box label{display:flex; align-items: center; justify-content: center; width:120px; height:72px; margin-left:12px; background:#0061FD; border-radius: 4px;; } .buy-info-form .buy-info-box .buy-info-con .buy-file-insert-box .buy-file-box label span{color:#fff; font-size:22px; font-weight:500;} .buy-info-form .buy-info-box .buy-info-con .buy-file-insert-box .buy-file-box .file-delete{width:30px; height:30px; background:#131313; position: absolute; left:18px; top:50%; transform: translate( -0, -50% ); display:none; align-items: center; justify-content: center; cursor: pointer;} .buy-info-form .buy-info-box .buy-info-con .buy-file-insert-box .buy-file-box .file-delete.active{display:flex;} .buy-info-form .buy-info-box .buy-info-con .buy-file-insert-box .buy-file-box .file-delete .file-delete-ico{ width:18px; height:18px; position: relative; } .buy-info-form .buy-info-box .buy-info-con .buy-file-insert-box .buy-file-box .file-delete .file-delete-ico::before{content:""; display:block; width:18px; height:2px; background:#fff; position: absolute; left:0; top:8px; transform: rotate( 45deg ); } .buy-info-form .buy-info-box .buy-info-con .buy-file-insert-box .buy-file-box .file-delete .file-delete-ico::after{content:""; display:block; width:18px; height:2px; background:#fff; position: absolute; left:0; top:8px; transform: rotate( 135deg ); } .buy-info-form .buy-info-box .buy-info-con .buy-car-file-guide{margin-top:24px;} .buy-info-form .buy-info-box .buy-info-con .buy-car-file-guide li{font-size:20px; padding-left:22px; width:100%; box-sizing: border-box; color:#666; position: relative; margin-top:8px; line-height: 1.3; word-break: keep-all;} .buy-info-form .buy-info-box .buy-info-con .buy-car-file-guide li:first-child{margin-top:0px;} .buy-info-form .buy-info-box .buy-info-con .buy-car-file-guide li::before{content:""; display:block; width:6px; height:6px; border-radius: 3px; background:#999; position: absolute; top:10px; left:4px;} #carPhotoSavePop{display:none;} #carPhotoSavePop .car-buy-check{padding:40px 0px; box-sizing:border-box; border-bottom:1px solid #eee;} #carPhotoSavePop .car-buy-check:last-child{border-bottom:0px;} #carPhotoSavePop .car-buy-check .car-buy-check-ico{width:48px; height:48px; display:flex; align-items: center; justify-content: center; margin:0 auto;} #carPhotoSavePop .car-buy-check .car-buy-check-title{width:100%;text-align: center; font-size:20px; font-weight:700; margin-top:12px; line-height:1.3; } #carPhotoSavePop .car-buy-check .car-buy-check-txt{width:100%;text-align: center; font-size:16px; line-height:1.3;} #carPhotoSavePop .car-buy-check .car-buy-check-txt span{font-weight:700;font-size:16px;} #carPhotoSavePop .car-buy-check .car-buy-check-txt.text01{margin-top:12px;} #carPhotoSavePop .car-buy-check .car-buy-check-txt.text02{margin-top:8px;} #carPhotoSavePop .car-buy-check .car-buy-check-txt.text03{margin-top:30px;padding-top:30px; border-top:1px solid #eee; box-sizing: border-box;;} #carPhotoSavePop .car-buy-check .car-buy-check-sum{width:100%; margin-top:30px; background:#f6f6f6; border:1px solid #eee; border-radius: 8px; padding:10px 0px; box-sizing: border-box; font-size:14px; color:#666; line-height:1.3; text-align: center; } #carPhotoSavePop .car-buy-check .car-buy-check-sum span{font-size:14px; font-weight:700; color:#666;} #carPhotoSavePop .car-buy-check .car-buy-check-photo{width:335px; display:flex; flex-wrap: wrap; margin:30px auto 0 auto; gap:16px 10px; } #carPhotoSavePop .car-buy-check .car-buy-check-photo .check-photo-con{width:105px;} #carPhotoSavePop .car-buy-check .car-buy-check-photo .check-photo-con .photo-txt{margin-top:10px; font-size:12px; font-weight:500; text-align: center;} /* 바로팔기 완료 및 임시저장*/ .buy-section .buy-view-form .buy-last-view{margin-top:10px; width:100%;} .buy-section .buy-view-form .buy-last-view .buy-list-view-ico{width:100%; display:flex; align-items: center; justify-content: center;} .buy-section .buy-view-form .buy-last-view .buy-list-view-title{font-size:32px; line-height:1.3; font-weight:500; text-align: center; margin-top:18px; } .buy-section .buy-view-form .buy-last-view .buy-list-view-title span{font-size:32px; font-weight:700;} .buy-section .buy-view-form .buy-last-view .buy-list-view-sum{width:100%; height:207px; display:flex; align-items: center; justify-content: center; text-align: center; flex-direction: column; margin-top:48px; font-size:22px; line-height:1.4; background:#f9f9f9; } .buy-section .buy-view-form .buy-last-view .buy-list-view-sum span{font-size:20px; margin-top:15px; color:#666;} /* 휴대폰 인증 유의사항 공통 */ .user-phone-sum{width:100%;padding:30px 20px; box-sizing:border-box; background:#f9f9f9; } .user-phone-sum .user-phone-sum-title{font-size:18px; font-weight:700;} .user-phone-sum .user-phone-sum-list{width:100%; margin-top:12px;} .user-phone-sum .user-phone-sum-list li{ padding-left:15px; width:100%; box-sizing: border-box; font-size:14px; color:#666; position: relative; margin-top:8px; line-height: 1.3; word-break: keep-all; } .user-phone-sum .user-phone-sum-list li:first-child{margin-top:0px;} .user-phone-sum .user-phone-sum-list li::before{content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:7px; } .user-phone-sum .user-phone-sum-list li.red-txt{color:#ff3f3f;} .user-phone-sum .user-phone-sum-list li.red-txt::before{background:#ff3f3f;} /* 휴대폰 인증 유의사항 팝업 */ .phone-success-pop{padding:0px;} .phone-success-pop .phone-success-form{width:100%; padding:64px 0px; box-sizing:border-box;} .phone-success-pop .phone-success-form .phone-success-ico{margin:0 auto; width:48px;} .phone-success-pop .phone-success-form .phone-success-txt{font-size:22px; font-weight:700; text-align: center; margin-top:12px;} .phone-success-pop .window-pop-body{height:calc( 100vh - 84px );} .phone-success-pop .window-pop-bt{border-top:0px; height:84px;padding:0 20px; box-sizing:border-box;} .phone-success-pop .window-pop-bt .btn{height:52px; width:100%;margin:0px;} .phone-success-pop .window-pop-bt .btn span{font-size:16px;} .phone-success-pop .customer-form{width:100%; height:120px; padding:0 20px; box-sizing:border-box; background:#f4f9ff url(../images/smartbuy/buy_call_bg_s.png) no-repeat right bottom; display:flex; flex-direction: column; justify-content: center; } .phone-success-pop .customer-form .customer-title{font-size:20px; color:#333; line-height:1.2;} .phone-success-pop .customer-form .customer-title span{font-size:20px; color:#333; font-weight:700;} .phone-success-pop .customer-form .customer-txt{font-size:14px; color:#333; margin-top:15px;} /* 1:1 상담 */ .consult-section{width:620px;margin:60px auto 130px auto;} .consult-section .page-title{align-items: center; justify-content: center;} .consult-section .page-title .page-title-txt{flex-direction: column; align-items: center; justify-content: center; height:auto;} .consult-section .page-title .page-title-txt .main-txt{font-weight:700;} .consult-section .page-title .page-title-txt .sub-txt{margin-top:10px; font-size:16px;} .consult-section .consult-login-form{width:100%; margin-top:40px; margin-bottom:35px; padding:12px 0px; box-sizing:border-box; background:#f9f9f9; } .consult-section .consult-login-form .consult-login-txt{height:32px; line-height:32px; font-size:16px; color:#515151; text-align: center; } .consult-section .consult-login-form .consult-login-txt span{font-size:16px; color:#515151; font-weight:700;} .consult-section .consult-login-form .consult-login-box{display:flex; align-items: center; justify-content: center; height:30px; margin-top:6px;} .consult-section .consult-login-form .consult-login-box .consult-login{display:flex; align-items: center;} .consult-section .consult-login-form .consult-login-box .consult-login::after{content:""; width:1px; height:12px; background:#ddd; margin:0 20px;} .consult-section .consult-login-form .consult-login-box .consult-login a{font-size:16px; font-weight:500; color:#666; display: flex; align-items: center;} .consult-section .consult-login-form .consult-login-box .consult-login a::before{content:""; display:block; width:24px; height:24px; background:url(../images/contents/consolt_login_ico.png) no-repeat center; margin-right:4px; } .consult-section .consult-login-form .consult-login-box .consult-join a{font-size:16px; font-weight:500; color:#666; display: flex; align-items: center;} .consult-section .consult-login-form .consult-login-box .consult-join a::before{content:""; display:block; width:24px; height:24px; background:url(../images/contents/consolt_join_ico.png) no-repeat center; margin-right:4px; } .consult-section .consult-car-info{width:100%; margin-bottom:8px;} .consult-section .consult-car-info .consult-car-num{height:22px; padding:0 12px; box-sizing:border-box; display:flex; align-items: center; justify-content: center; position: relative; font-size:14px; font-weight:700; color:#579aff; border:1px solid #0061FD; border-radius: 5px; background:#f4f9ff; width: max-content; } .consult-section .consult-car-info .consult-car-num::before{content:""; display:block; width:2px; height:2px; border-radius: 2px; background:#0061FD; position: absolute; left:6px; top:50%; transform: translate( -0, -50% ); } .consult-section .consult-car-info .consult-car-num::after{content:""; display:block; width:2px; height:2px; border-radius: 2px; background:#0061FD; position: absolute; right:6px; top:50%; transform: translate( -0, -50% ); } .consult-section .consult-car-info .consult-car-title{width:100%; display:flex; justify-content: space-between; align-items: flex-end; margin-top:10px;} .consult-section .consult-car-info .consult-car-title .consult-car-model{font-size:24px; font-weight:700; line-height:1.3; width:480px;margin-right:20px;} .consult-section .consult-car-info .consult-car-title .consult-car-pay{font-size:12px; color:#515151;width:calc( 100% - 500px );line-height:1.3; text-align: right;} .consult-section .consult-car-info .consult-car-title .consult-car-pay span{font-size:24px; font-weight:700; color:#131313;} .consult-section .consult-car-info .consult-car-sum{width:100%; display:flex; align-items: center; margin-top:10px; } .consult-section .consult-car-info .consult-car-sum li{font-size:14px; color:#666; display:flex; align-items: center; } .consult-section .consult-car-info .consult-car-sum li::after{content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#ddd; margin:0 6px; } .consult-section .consult-car-info .consult-car-sum li:last-child::after{display:none;} .consult-section .consult-inpt-form{width:100%;} .consult-section .consult-inpt-form .consult-inpt-require{width:100%;text-align: right; font-size:14px; color:#515151; } .consult-section .consult-inpt-form .consult-inpt-box{margin-top:16px; border-top:1px solid #131313; box-sizing:border-box;} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con{padding:10px 0px; box-sizing:border-box; border-bottom:1px solid #eee; display:flex;} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt-title{ width:145px; height:32px; display:flex; align-items: center; margin-top:6px; } .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt-title span{font-size:15px; font-weight:500; display:flex; } .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt{width:calc( 100% - 145px );} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .select-box{width:100%;} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .select-box .select-choice{height:44px;} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .select-box .select-list{top:44px;} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .phone-type{width:100%; display:flex; align-items: center; margin-top:10px; flex-wrap: wrap;} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .phone-type:first-child{margin-top:0px;} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .phone-type .input-form{width:345px; margin-right:10px; position: relative;} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .phone-type .btn{width:calc( 100% - 355px ); height:44px;} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .phone-type .input-form .consult-phoen-delete{width:16px; height:16px; border-radius: 16px; display:none; align-items: center; justify-content: center; background:#ddd; cursor: pointer; position: absolute; right:56px; top:50%; transform: translate( -0, -50% ); } .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .phone-type .input-form .consult-phoen-delete.active{display:flex;} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .phone-type .input-form .consult-phoen-count{font-size:14px; font-weight:500; color:#ff3f3f; position: absolute; right:12px; top:50%; transform: translate( -0, -50% ); } .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .phone-num-check{display:none;} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .consult-radio-form{width:100%; display:flex; align-items: center; height:44px; } .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .consult-radio-form .radio-box{margin-right:10px;} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .consult-radio-form .radio-box label span{font-size:15px; color:#131313;} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt textarea{width:100%; margin-top:0px; resize:none; height:160px; border:1px solid #ddd; padding:8px 12px; box-sizing:border-box; outline: none; font-size:14px; } .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt textarea:focus{border:1px solid #131313;} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .consult-summery-info{margin-top:8px; color:#ff3f3f; font-size:12px; line-height:1.3;} .consult-section .consult-inpt-form .consult-inpt-box .consult-inpt-con .consult-inpt .consult-summery-info span{display:flex; align-items: center; height:22px; color:#ff3f3f; font-size:14px; } .consult-section .consult-policy-form{margin-top:60px; padding-bottom:30px; box-sizing:border-box; border-bottom:1px solid #acacac; } .consult-section .consult-policy-form .title{font-size:18px; font-weight:700; padding-bottom:24px; border-bottom:1px solid #131313; box-sizing:border-box;} .consult-section .consult-policy-form .consult-policy-all{width:100%; height:46px; border-bottom:1px solid #eee; box-sizing:border-box; display: flex; align-items: center;} .consult-section .consult-policy-form .consult-policy-all label span{font-size:15px; font-weight:500;} .consult-section .consult-policy-form .consult-policy-box{width:100%;} .consult-section .consult-policy-form .consult-policy-box .consult-policy-con{width:100%;} .consult-section .consult-policy-form .consult-policy-box .consult-policy-con .consult-policy-title{display:flex; align-items: center; justify-content: space-between; height:46px; } .consult-section .consult-policy-form .consult-policy-box .consult-policy-con .consult-policy-title .policy-arrow{cursor:pointer; transform: rotate(180deg); transition: all 0.2s; } .consult-section .consult-policy-form .consult-policy-box .consult-policy-con.active .consult-policy-title .policy-arrow{transform: rotate(0deg);} .consult-section .consult-policy-form .consult-policy-box .consult-policy-con .policy-summery{width:100%; padding:20px; background:#f9f9f9; max-height:200px; overflow-y: auto; } .consult-section .consult-policy-form .consult-policy-box .consult-policy-con .policy-summery p{font-size:14px; color:#888; line-height:1.4;} .consult-section .consult-policy-form .consult-policy-box .consult-policy-con .policy-summery p.title{font-weight:700; margin-bottom:4px; margin-top:8px;} .consult-section .consult-policy-form .consult-policy-box .consult-policy-con .policy-summery p:first-child{margin-top:0px;} .consult-section .consult-policy-form .consult-policy-box .consult-policy-con .policy-summery .policy-list{width:100%;} .consult-section .consult-policy-form .consult-policy-box .consult-policy-con .policy-summery .policy-list li{display:flex; width:100%; margin-top:12px; } .consult-section .consult-policy-form .consult-policy-box .consult-policy-con .policy-summery .policy-list li:first-child{margin-top:0px;} .consult-section .consult-policy-form .consult-policy-box .consult-policy-con .policy-summery .policy-list li .policy-sum-tit{ width:160px; font-size: 14px; font-weight:700; color:#888; padding-left:16px; box-sizing:border-box; position: relative; } .consult-section .consult-policy-form .consult-policy-box .consult-policy-con .policy-summery .policy-list li .policy-sum-tit::before{content:"";display:block; width:4px; height:4px; border-radius: 4px; background:#888; position: absolute; left:4px; top:4px; } .consult-section .consult-policy-form .consult-policy-box .consult-policy-con .policy-summery .policy-list li .policy-sum-txt{ width:calc( 100% - 180px ); font-weight:400; font-size: 14px; color:#888; margin-left:20px; line-height:1.3; word-break: keep-all; } .consult-section .consult-policy-form .consult-policy-summery{font-size:14px; font-weight:700; color:#888; margin-top:10px;} .consult-section .btn-box{margin-top:40px;} /* 25.05.30 1:1상담 추가 */ .consult-cs-form{ width:100%; margin-bottom:40px; } .consult-cs-form .consult-cs-box{ width: 100%; padding-bottom:16px; border-bottom:1px solid #eee; } .consult-cs-form .consult-cs-box .consult-cs-txt{ width:100%; text-align:center; font-size:14px; color:#666; } .consult-cs-form .consult-cs-box .consult-cs-con{ width:100%; display:flex; align-items:center; justify-content:center; margin-top:8px; gap:8px; } .consult-cs-form .consult-cs-box .consult-cs-con i{ display:flex; align-items:center; justify-content:center; width:24px; height:24px; border-radius:24px; background:#0061FD; } .consult-cs-form .consult-cs-box .consult-cs-con .cs-number{ display:flex; align-items:center; gap:6px; } .consult-cs-form .consult-cs-box .consult-cs-con .cs-number .txt{ font-size:16px; font-weight:700; color:#515151; } .consult-cs-form .consult-cs-box .consult-cs-con .cs-number .num{ font-size:16px; color:#515151; font-weight:900; } .consult-cs-form .consult-cs-box .consult-cs-con .cs-time{ font-size:14px; color:#888; } .consult-cs-form .cs-faq-arrow-box{ width:100%; margin-top:12px; display:flex; align-items:center; justify-content:center; } .consult-cs-form .cs-faq-arrow-box a{ display:flex; align-items:center; justify-content:center; font-size:14px; color:#666; height:22px; width:max-content; } .consult-cs-form .cs-faq-arrow-box a span{ color:#515151; font-size:14px; font-weight:700; margin-right:4px; } .consult-cs-form .cs-faq-arrow-box a::after{ content:""; display:block; width:18px; height:18px; border-radius:18px; background:#f6f6f6 url(../images/contents/cs_faq_arrow.png) no-repeat center; margin-left:6px; } .consult-cs-form .cs-faq-arrow-box a:hover{ color:#131313; } .consult-cs-form .cs-faq-arrow-box a:hvoer span{ color:#131313; } .consult-cs-form .cs-faq-arrow-box a:hover::after{ background:#515151 url(../images/contents/cs_faq_arrow_hover.png) no-repeat center; } .consult-faq-form{ width:100%; margin-top:60px; } .consult-faq-form .consult-faq-title{ width:100%; display:flex; align-items:center; justify-content:space-between; height:34px; margin-bottom:18px; } .consult-faq-form .consult-faq-title .title{ font-size:18px; font-weight:700; color:#131313; } .consult-faq-form .consult-faq-title a{ font-size:14px; font-weight:500; color:#888; } .consult-faq-form .btn-box .cs-arrow-btn{ width:306px; } .consult-faq-form .btn-box .cs-arrow-btn span{ gap:8px; } .consult-faq-form .btn-box .cs-arrow-btn span::after{ content:""; display:block; width:18px; height:18px; background:url(../images/contents/cs_arrow_ico.png) no-repeat center; } /* 상담신청 완료 */ .consult-section.complete .page-title .title-ico{width:48px; height:48px;} .consult-section.complete .page-title .page-title-txt .main-txt{margin-top:20px; font-size:24px;} .consult-section.complete .page-title .page-title-txt .sub-txt{font-size:14px;} .consult-section .consult-complete-form{width:100%; margin-top:40px;} .consult-section .consult-complete-form .consult-complete-box{width:100%; border-top:1px solid #131313; box-sizing:border-box;} .consult-section .consult-complete-form .consult-complete-box .consult-complete-con{width:100%; display:flex; border-bottom:1px solid #eee; box-sizing:border-box;} .consult-section .consult-complete-form .consult-complete-box .consult-complete-con .complete-title{height:24px; display:flex; align-items: center; margin:20px 0px;box-sizing:border-box; width:104px; font-size:15px; line-height:1.3; color:#666; } .consult-section .consult-complete-form .consult-complete-box .consult-complete-con .complete-txt{min-height:24px; display:flex; align-items: center; padding:20px 0px; box-sizing:border-box; font-size:16px; line-height:1.3; width:calc(100% - 104px); } .consult-section .consult-complete-form .consult-complete-box .consult-complete-con .complete-txt.summery-txt{white-space: pre-line;} .consult-section .consult-complete-form .consult-complete-box .consult-complete-con .complete-txt span{font-size:16px; font-weight:700;} .consult-section .consult-complete-form .consult-complete-box .consult-complete-con .complete-txt .rent-deposit-list{width:100%;} .consult-section .consult-complete-form .consult-complete-box .consult-complete-con .complete-txt .rent-deposit-list li{font-size:16px; padding-left:15px; position: relative; margin-top:8px; } .consult-section .consult-complete-form .consult-complete-box .consult-complete-con .complete-txt .rent-deposit-list li:first-child{margin-top:0px;} .consult-section .consult-complete-form .consult-complete-box .consult-complete-con .complete-txt .rent-deposit-list li::before{content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#131313; position: absolute; left:4px; top:9px; } .consult-section .consult-complete-form .consult-complete-box .consult-complete-con .complete-txt .car-number{height:22px; padding:0 12px; box-sizing:border-box; display:flex; align-items: center; justify-content: center; position: relative; font-size:14px; font-weight:700; color:#579aff; border:1px solid #0061FD; border-radius: 5px; background:#f4f9ff; width: max-content; margin-right:8px; white-space: nowrap } .consult-section .consult-complete-form .consult-complete-box .consult-complete-con .complete-txt .car-number::before{content:""; display:block; width:2px; height:2px; border-radius: 2px; background:#0061FD; position: absolute; left:6px; top:50%; transform: translate( -0, -50% ); } .consult-section .consult-complete-form .consult-complete-box .consult-complete-con .complete-txt .car-number::after{content:""; display:block; width:2px; height:2px; border-radius: 2px; background:#0061FD; position: absolute; right:6px; top:50%; transform: translate( -0, -50% ); } .consult-section .consult-rent-comment{margin-top:12px; color:#888; font-size:14px;} .consult-section.complete .btn-box{margin:50px auto 0 auto;} .consult-summery{width:100%; margin-top:80px;} .consult-summery .consult-summery-tit{font-size:20px; font-weight:700;} .consult-summery .consult-summery-form{width:100%; margin-top:26px;} .consult-summery .consult-summery-form .consult-summery-list{width:100%; display:flex; align-items: center;} .consult-summery .consult-summery-form .consult-summery-list .consult-summery-con{width:170px; border-right:1px solid #eee; display:flex; align-items: center; justify-content: center;} .consult-summery .consult-summery-form .consult-summery-list .consult-summery-con:last-child{width:calc( 100% - 340px ); padding-left:20px; display:block; border-right:0px; } .consult-summery .consult-summery-form .consult-summery-list .consult-summery-con a{display: flex; flex-direction: column; align-items: center; justify-content: center; } .consult-summery .consult-summery-form .consult-summery-list .consult-summery-con a .ico-txt{font-size:16px; font-weight:700; margin-top:10px;} .consult-summery .consult-summery-form .consult-summery-list .consult-summery-con .consult-sum-txt{font-size:16px; font-weight:700;} .consult-summery .consult-summery-form .consult-summery-list .consult-summery-con .consult-sum-num{font-size:26px; font-weight:800; margin-top:10px;} .consult-summery .consult-summery-form .consult-summery-list .consult-summery-con .consult-sum-time{font-size:15px; font-weight:500; color:#888; margin-top:15px; display:flex; align-items: center;} .consult-summery .consult-summery-form .consult-summery-list .consult-summery-con .consult-sum-time::before{content:""; display: block; width:16px; height:16px; margin-right:5px; background:url(../images/common/ic_footer_time.png) no-repeat center; } /* 차량 견적서 출력 팝업 */ .car-ex-coast-pop .window-pop-body{max-height:639px; margin-top:20px;} .ex_coast_form{width:100%;box-sizing:border-box;max-width:1000px;margin:0 auto; } .ex_coast_form .ex_coast_hd{width:100%;display:flex;align-items: flex-end;position:relative;padding:15px 0;box-sizing:border-box;border-bottom:1px solid #131313;} .ex_coast_form .ex_coast_hd .ex_coast_title{font-size:46px;font-weight:700;color:#131313;} .ex_coast_form .ex_coast_hd .ex_coast_title span{font-size:46px;font-weight:700;color:#0061FD;letter-spacing: -0.2px;} .ex_coast_form .ex_coast_hd .ex_coast_txt{margin-left:10px;} .ex_coast_form .ex_coast_hd .ex_coast_txt p{font-size:14px;color:#787878;letter-spacing: -0.2px;} .ex_coast_form .ex_coast_hd .ex_coast_date{padding:5px 10px;box-sizing:border-box;background:#fff;-webkit-print-color-adjust:exact; border:1px solid #707070;box-sizing:border-box;font-size:13px;letter-spacing: -0.2px;color:#131313;position: absolute;top:0;right:0;} .ex_coast_form .ex_coast_hd .ex_coast_date span{font-size:13px;letter-spacing: -0.2px;color:#131313;} .ex_coast_form .ex_coast_box{width:100%;box-sizing:border-box;display: flex;} .ex_coast_form .ex_coast_box .ex_coast_con{box-sizing:border-box; margin-top:10px;} .ex_coast_form .ex_coast_box .ex_coast_con:first-child{width:calc( 100% - 500px );padding:0px 40px 0px 0;} .ex_coast_form .ex_coast_box .ex_coast_con:last-child{width:500px;padding:0px 0px 0px 40px;border-left:1px solid #eee;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info{width:100%;margin-top:50px;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info:first-child{margin-top:0px;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_title{width:100%;height:34px;display:flex;align-items: center;background:#2e3546; -webkit-print-color-adjust:exact; color:#fff;font-size:16px;font-weight:700;letter-spacing: -0.2px;padding:0 10px;box-sizing:border-box;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_thum{width:100%;display:flex;align-items: center;justify-content: center;position:relative;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_thum img{max-width:100%;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_thum .ex_con_bat{position:absolute;height:40px;display:flex;align-items: center; justify-content: center;left:10px;top:10px;/*background:url(/resources/images/reborn/ico_list_type_reborn.png) no-repeat center center;background-size:100%; -webkit-print-color-adjust:exact;*/} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_thum .ex_con_bat span{display:flex; align-items: center;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_thum .ex_con_bat span img{width:36px;} /* 금융사 */ .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_thum .ex_con_bat.finance span::after{content:""; display:block; width:24px; height:24px; background:url(../images/contents/car_ex_coast_finance.png) no-repeat center;-webkit-print-color-adjust:exact;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_thum .ex_con_bat.hyundai::after{content:""; display:block; width:36px; height:36px; background:url(../images/smartbuy/vip_visual_hyundai.png) no-repeat center; background-size: contain; -webkit-print-color-adjust:exact;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_thum .ex_con_bat.woori::after{content:""; display:block; width:36px; height:36px; background:url(../images/smartbuy/vip_visual_woori.png) no-repeat center; background-size: contain; -webkit-print-color-adjust:exact;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_thum .ex_con_bat.sk::after{content:""; display:block; width:36px; height:36px; background:url(../images/smartbuy/vip_visual_sk.png) no-repeat center; background-size: contain; -webkit-print-color-adjust:exact;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_thum .ex_con_bat.hana::after{content:""; display:block; width:36px; height:36px; background:url(../images/smartbuy/vip_visual_hana.png) no-repeat center; background-size: contain; -webkit-print-color-adjust:exact;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_thum .ex_con_bat.mc::after{content:""; display:block; width:36px; height:36px; background:url(../images/smartbuy/vip_visual_mc.png) no-repeat center; background-size: contain; -webkit-print-color-adjust:exact;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_thum .ex_con_bat.shinhan::after{content:""; display:block; width:36px; height:36px; background:url(../images/smartbuy/vip_visual_shinhan.png) no-repeat center; background-size: contain; -webkit-print-color-adjust:exact;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_thum .ex_con_bat.bnk::after{content:""; display:block; width:36px; height:36px; background:url(../images/smartbuy/vip_visual_bnk.png) no-repeat center; background-size: contain; -webkit-print-color-adjust:exact;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box{width:100%;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box .ex_info{display:flex;box-sizing:border-box;border-bottom:1px solid #ddd;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box .ex_info .ex_info_title{width:100px;color:#131313;font-size:16px;font-weight:700;letter-spacing: -0.2px;padding:8px 0px 8px 10px;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box .ex_info .ex_info_txt{width:calc( 100% - 100px );color:#131313;font-size:16px;letter-spacing: -0.2px;word-break: keep-all;padding:8px 10px 8px 0px;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02{width:100%;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info{display:flex;box-sizing:border-box;border-bottom:1px solid #ddd;flex-wrap: wrap;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info.price-space .ex_info_title { width: calc(100% - 300px); } .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info.price-space .ex_info_txt { width: 300px; } .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info.price-space .ex_info_txt span{font-size:16px; font-weight:700;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info .ex_info_title{width:calc( 100% - 125px );color:#131313;font-size:16px;font-weight:700;letter-spacing: -0.2px;word-break: keep-all;display:flex;align-items: flex-start;padding:8px 0px 8px 10px;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info .ex_info_title .sup_txt{font-size:11px;font-weight:700;color:#131313;letter-spacing: -0.2px;margin-left:3px;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info .ex_info_txt{width:125px;color:#131313;font-size:16px;font-weight:700;letter-spacing: -0.2px;word-break: keep-all;text-align:right;padding:8px 10px 8px 0px;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info .ex_info_txt span{font-size:16px;font-weight:700;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info:last-child{border-bottom:1px solid #131313;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info.ex_opt { display: block; } .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info.ex_opt > .ex_inner, .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info.ex_opt .ex_item { display: flex; flex-wrap: wrap; width: 100%; } .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info.ex_opt .ex_item { padding: 4px 10px 4px 20px; } .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info.ex_opt .ex_sub { padding-bottom: 4px; } .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info.ex_opt .ex_sub .ex_info_title, .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info.ex_opt .ex_sub .ex_info_txt { padding: 0; font-size: 14px; font-weight: 400; color: #666; } .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info .ex_info_txt .money_free{color:#0061FD; font-size: 14px; font-weight: 400;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info .ex_info_depth02{width:100%;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info .ex_info_depth02 .info_depth02_box{width:100%;display:flex;min-height:32px;align-items: center;justify-content: space-between;padding:4px 10px 4px 15px;box-sizing:border-box;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info .ex_info_depth02 .info_depth02_box:nth-child(2n-1){background:#eee; -webkit-print-color-adjust:exact;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info .ex_info_depth02 .info_depth02_box .ex_info_title{font-size:14px;font-weight:400;color:#131313;letter-spacing: -0.5px;padding:0px;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_con_box_ty02 .ex_info .ex_info_depth02 .info_depth02_box .ex_info_txt{font-size:14px;font-weight:400;color:#131313;letter-spacing: -0.5px;padding:0px;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_info_total{width:100%;display:flex;align-items: center;justify-content: space-between;padding:0 10px;box-sizing:border-box;margin-top:15px;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_info_total .ex_info_total_txt{font-size:20px;font-weight:700;color:#131313;letter-spacing: -0.2px;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_info_total .ex_info_total_pay{font-size:28px; color:#0061FD;letter-spacing: -0.2px;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_info_total .ex_info_total_pay span{font-size:28px;font-weight:700;color:#0061FD;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_payment{width:100%; margin-top:10px; padding:0 10px; } .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_payment .ex_payment_summary{font-size:16px; color:#131313; line-height:1.3; font-weight:400; letter-spacing:-0.2px; font-family:'Pretendard' !important;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_payment .ex_payment_summary span{font-weight:700;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_payment .ex_payment_comment{position:relative; font-size:14px; color:#666;padding-left:10px;line-height:1.3; margin-top:10px; word-break:keep-all; font-family:'Pretendard' !important;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_payment .ex_payment_comment::before{content:"※"; font-size:14px; color:#666; position:absolute; left:0; top:-1px; font-family:'Pretendard' !important;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_payment .ex_payment_list{padding-left:10px; margin-top:10px;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_payment .ex_payment_list li{display:flex; align-items:center; gap:4px;} .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_payment .ex_payment_list li span{font-size:14px; font-weight:500; color:#131313; font-family:'Pretendard' !important; } .ex_coast_form .ex_coast_box .ex_coast_con .ex_con_info .ex_payment .ex_payment_list li + li{margin-top:5px;} .ex_coast_summery{width:100%;margin-top:20px;} .ex_coast_summery .ex_coast_sum_list{ } .ex_coast_summery .ex_coast_sum_list:first-child{padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid #ddd;box-sizing:border-box;} .ex_coast_summery .ex_coast_sum_list .ex_coast_sum_txt{font-size:13px;color:#666;letter-spacing: -0.2px;margin-top:10px;word-break: keep-all; line-height:1.4;} .ex_coast_summery .ex_coast_sum_list .ex_coast_sum_txt:first-child{margin-top:0px;} .ex_coast_summery .ex_coast_sum_list .ex_coast_sum_txt .ex_coast_sum_depth02{padding:5px 0 0 10px;box-sizing:border-box;} .ex_coast_summery .ex_coast_sum_list .ex_coast_sum_txt .ex_coast_sum_depth02 li{font-size:13px;color:#666; line-height:1.3;} .ex_coast_summery .ex_coast_sum_list.dotted li { position: relative; padding-left: 10px; } .ex_coast_summery .ex_coast_sum_list.dotted li:before { content: ''; position: absolute; left: 0; top: 6px; width: 3px; height: 3px; border-radius: 3px; background-color: #666; } .ex_coast_summery + .ex_con_info{margin-top:24px !important;} .ex_coast_ft{margin-top:40px; padding-top:30px; width:100%;display:flex;justify-content: space-between;padding-bottom:20px;box-sizing:border-box; border-top:1px solid #131313;} .ex_coast_ft .ex_coast_ft_box{display:flex;flex-direction: column;text-align: left;} .ex_coast_ft .ex_coast_ft_box .ex_coast_ft_con{display:flex;align-items: center;margin-right:40px;height:30px;} .ex_coast_ft .ex_coast_ft_box .ex_coast_ft_con:last-child{margin-right:0px;} .ex_coast_ft .ex_coast_ft_box .ex_coast_ft_con .ex_coast_ft_i{width:26px;height:26px;border-radius: 13px;display:flex;align-items: center;justify-content: center;margin-right:5px;margin-top:2px;} .ex_coast_ft .ex_coast_ft_box .ex_coast_ft_con .ex_coast_ft_i.ft_call_i{background:#333333 url(../images/contents/ex_coast_call_x3.png) no-repeat center center;background-size:14px auto;-webkit-print-color-adjust:exact;} .ex_coast_ft .ex_coast_ft_box .ex_coast_ft_con .ex_coast_ft_i.ft_hime_i{background:#333333 url(../images/contents/ex_coast_home_x3.png) no-repeat center center;background-size:13px auto;-webkit-print-color-adjust:exact;} .ex_coast_ft .ex_coast_ft_box .ex_coast_ft_con .ex_coast_ft_txt{color:#131313;font-size:20px;letter-spacing: -0.2px;margin-top:2px;} .ex_coast_ft .ex_coast_ft_box .ex_coast_ft_con .ex_coast_ft_txt span{font-weight:700;} .ex_coast_ft .ex_coast_ft_logo{width:100px;height:40px;background:url(../images/contents/ex_coast_qr_bi.png) no-repeat center center;background-size:100% auto;-webkit-print-color-adjust:exact;} .ex_coast_btn_form{width:100%;padding:0 40px;box-sizing:border-box;} .ex_coast_btn_form .ex_coast_btn_box{width:100%;display:flex;align-items: center;justify-content: center;border-top:1px solid #ddd;box-sizing:border-box;padding:20px 0 30px 0;} .ex_coast_btn_form .ex_coast_print_btn a{display:flex;align-items: center;justify-content: center;background:#0088FF;color:#fff;font-size:14px;border-radius: 5px;cursor: pointer;width:135px;height:45px;margin-right:10px;} .ex_coast_btn_form .ex_coast_close a{display:flex;align-items: center;justify-content: center;background:#fff;border:1px solid #DDDDDD;box-sizing:border-box;color:#131313;font-size:14px;border-radius: 5px;cursor: pointer;width:135px;height:45px;} .ex_coast_form .ex_coast_ft .ex_coast_ft_box .ex_company{margin-top:32px;} .ex_coast_form .ex_coast_ft .ex_coast_ft_box .ex_company .ex_company_con{display:flex;align-items: center;margin-top:10px; } .ex_coast_form .ex_coast_ft .ex_coast_ft_box .ex_company .ex_company_con:first-child{margin-top:0px;} .ex_coast_form .ex_coast_ft .ex_coast_ft_box .ex_company .ex_company_con .ex_company_ico{display: flex;align-items: center;justify-content: center; width:20px; height:20px; background:#333;} .ex_coast_form .ex_coast_ft .ex_coast_ft_box .ex_company .ex_company_con .ex_company_ico.call_ico{background:url(../images/smartbuy/coast_tel_i_new.png) no-repeat center center;background-size:16px 16px;-webkit-print-color-adjust:exact;} .ex_coast_form .ex_coast_ft .ex_coast_ft_box .ex_company .ex_company_con .ex_company_ico.home_ico{background:url(../images/smartbuy/coast_home_i_new.png) no-repeat center center;background-size:14px 14px;-webkit-print-color-adjust:exact;} .ex_coast_form .ex_coast_ft .ex_coast_ft_box .ex_company .ex_company_con .ex_company_txt{font-size:20px;font-weight:500;color:#333333;letter-spacing: -0.2px; display:flex; align-items:center; margin-left:16px;} .ex_coast_form .ex_coast_ft .ex_coast_ft_box .ex_company .ex_company_con .ex_company_txt span{font-weight:700; font-size:26px; margin-left:4px; color:#333333;} .ex_coast_ft .ex_coast_ft_box .ex_coast_qr_title{font-size:24px; font-weight:700; letter-spacing: -0.2px;margin-right:31px;color: #333;margin-top: 4px;} .ex_coast_ft .ex_coast_ft_box .ex_coast_qr{display:flex;} .ex_coast_ft .ex_coast_ft_box .ex_coast_qr .ex_coast_qr_con{box-sizing:border-box;position: relative;display:flex;align-items: center;flex-direction: column;} .ex_coast_ft .ex_coast_ft_box .ex_coast_qr .ex_coast_qr_con + .ex_coast_qr_con{padding-left: 25px;} /* .ex_coast_ft .ex_coast_ft_box .ex_coast_qr .ex_coast_qr_con + .ex_coast_qr_con::after{content:"";display:block;width:1px;height:15px;background:#aaa; position: absolute; left:0; top:50%; transform: translate( -0, -50% ); } */ .ex_coast_ft .ex_coast_ft_box .ex_coast_qr .ex_coast_qr_con .qr{width:140px;height:52px;} .ex_coast_ft .ex_coast_ft_box .ex_coast_qr .ex_coast_qr_con .qr.carrot{background:url(../images/contents/qr_carrot.png) no-repeat center;background-size: contain;} .ex_coast_ft .ex_coast_ft_box .ex_coast_qr .ex_coast_qr_con .qr.db{ width:140px;height:52px; /*background:url(../images/contents/qr_db.png) no-repeat center;background-size: contain; */} .ex_coast_ft .ex_coast_ft_box .ex_coast_qr .ex_coast_qr_con .qr_txt{font-size:16px; color:#131313; letter-spacing: -0.2px;margin-left:7px;} .ex_coast_ft .ex_coast_ft_box .ex_coast_qr .ex_coast_qr_con .qr.samsungfire{width:140px; height:152px;} /* aqi 팝업 */ .window-pop.aqi-pop .window-pop-body{padding-bottom:40px;} .window-pop.aqi-pop .window-pop-body{height:calc( 100vh - 60px );} .window-pop.aqi-pop.bottom-open .window-pop-body{height:calc( 100vh - 140px );} .window-pop.aqi-pop .window-pop-bt .btn{width:auto; padding:0 25px;} .car-aqi-form{width:100%;margin-top:30px;} .car-aqi-form .car-aqi-head{width:100%;} .car-aqi-form .car-aqi-head .title{font-size:18px; font-weight:700; color:#333; display:flex; align-items: flex-end; } .car-aqi-form .car-aqi-head .title span{ font-size:14px; font-weight:500; color:#333; margin-left:4px; } .car-aqi-form .car-aqi-head .aqi-car-info{margin-top:20px; width:100%; border-radius: 5px; background:#f9f9f9; display:flex; flex-direction: column; align-items: center; justify-content: center; padding:30px 0px; } .car-aqi-form .car-aqi-head .aqi-car-info .car-name{display:flex; padding :0 20px;} .car-aqi-form .car-aqi-head .aqi-car-info .car-name .car-number{display:flex; margin-right:6px; align-items: center; justify-content: center; padding:0 12px; height:22px; white-space: nowrap; border-radius:5px; border:1px solid #0061FD; background:#f4f9ff; color:#579aff; font-size:14px; font-weight:700; position: relative; } .car-aqi-form .car-aqi-head .aqi-car-info .car-name .car-number::before{content:""; width:2px; height:2px; border-radius: 2px; background:#0061FD; position: absolute; left: 6px; top:50%; transform: translate(-0, -50%);} .car-aqi-form .car-aqi-head .aqi-car-info .car-name .car-number::after{content:""; width:2px; height:2px; border-radius: 2px; background:#0061FD; position: absolute; right: 6px; top:50%; transform: translate(-0, -50%);} .car-aqi-form .car-aqi-head .aqi-car-info .car-name .name{font-size:18px; font-weight:700; color:#000; padding:2px 0px; width:100%; max-width:100%; text-align: center; } .car-aqi-form .car-aqi-head .aqi-car-info .car-infos{display: flex; align-items: center; justify-content: center; margin-top:10px; } .car-aqi-form .car-aqi-head .aqi-car-info .car-infos li{display:flex; align-items: center; padding:0 20px; position: relative; } .car-aqi-form .car-aqi-head .aqi-car-info .car-infos li::after{ content:""; display:block; width:1px; height:16px; background:#ddd; position: absolute; right:0px; top:50%; transform: translate( -0, -50% ); } .car-aqi-form .car-aqi-head .aqi-car-info .car-infos li:last-child::after{display:none;} .car-aqi-form .car-aqi-head .aqi-car-info .car-infos li .car-info-title{font-size:14px; font-weight:700;} .car-aqi-form .car-aqi-head .aqi-car-info .car-infos li .car-info-txt{font-size:16px; color:#666; margin-left:6px;} .car-aqi-form .car-aqi-body{width:100%; margin-top:20px;} .car-aqi-form .car-aqi-body table{width:100%; border:1px solid #ddd;} .car-aqi-form .car-aqi-body table thead tr th{height:54px; width:51px; background:#f6f6f6; vertical-align: middle; text-align: center; font-weight:400; border-right:1px solid #ddd; border-bottom:1px solid #ddd; font-size:12px; line-height:1.3; color:#000; } .car-aqi-form .car-aqi-body table thead tr th:last-child{border-right:0px;} .car-aqi-form .car-aqi-body table thead tr th:nth-child(1){width:260px; text-align: left; padding:0 15px; font-size:16px; font-weight:700; } .car-aqi-form .car-aqi-body table thead tr th:nth-child(5n){width:260px; text-align: left; padding:0 15px; font-size:16px; font-weight:700; } .car-aqi-form .car-aqi-body table thead tr th span{font-size:16px; color:#000;} .car-aqi-form .car-aqi-body table tbody tr th{width:310px; position: relative; height:54px; border-bottom:1px solid #ddd; border-right:1px solid #ddd; position: relative; text-align: left; padding:0px 7px 0px 10px; } .car-aqi-form .car-aqi-body table tbody tr th .title{font-size:14px; padding-right:19px; font-weight:400; width:100%; background:url(../images/contents/aqi_search_ico.png) no-repeat right center;} .car-aqi-form .car-aqi-body table tbody tr th span{display:inline-block; width:24px; height:24px; text-align: right; line-height:24px; font-size:14px; font-weight:700; margin-right:4px; } .car-aqi-form .car-aqi-body table tbody tr th:hover .title{font-weight:700;} .car-aqi-form .car-aqi-body table tbody tr th .title.aqi-notice{color:#00ABA1} .car-aqi-form .car-aqi-body table tbody tr td{border-right:1px solid #ddd; border-bottom:1px solid #ddd;} .car-aqi-form .car-aqi-body table tbody tr td span{display:block; width:18px; height:18px; border-radius: 18px; margin:0 auto; } .car-aqi-form .car-aqi-body table tbody tr td:nth-of-type(3n-2) span{background:#00D3FF url(../images/contents/aqi_check_ico.png) no-repeat center;} /*.car-aqi-form .car-aqi-body table tbody tr td:nth-of-type(4n-2) span{background:#0588FE url(../images/contents/aqi_check_ico.png) no-repeat center;}*/ .car-aqi-form .car-aqi-body table tbody tr td:nth-of-type(3n-1) span{background:#00ABA1 url(../images/contents/aqi_check_ico.png) no-repeat center;} .car-aqi-form .car-aqi-body table tbody tr td:nth-of-type(3n) span{background:#CCD2E3 url(../images/contents/aqi_check_ico.png) no-repeat center;} .car-aqi-form .car-aqi-body table tbody tr th .aqi-tooptip{position: absolute; display:none; left:0; z-index: 2; top:48px; width:566px; border:1px solid #131313; background:#fff; padding:25px; } .car-aqi-form .car-aqi-body table tbody tr th:nth-of-type(2n) .aqi-tooptip{right:-50%; left:auto; top:48px;} .car-aqi-form .car-aqi-body table tbody tr th:hover .aqi-tooptip{display:grid;} .car-aqi-form .car-aqi-body table tbody tr th .aqi-tooptip .aqi-toolbox{width:100%; display:flex; height:100%;} .car-aqi-form .car-aqi-body table tbody tr th .aqi-tooptip .aqi-toolbox .aqi-summery-box{width:50%;padding-right:30px; height:100%; border-right:1px solid #ddd;} .car-aqi-form .car-aqi-body table tbody tr th .aqi-tooptip .aqi-toolbox .aqi-summery-box:nth-child(2){padding-right:0px; padding-left:30px; border-right:0px;} .car-aqi-form .car-aqi-body table tbody tr th .aqi-tooptip .aqi-toolbox .aqi-summery-box .aqi-img{width:100%; border-radius: 5px; overflow: hidden;} .car-aqi-form .car-aqi-body table tbody tr th .aqi-tooptip .aqi-toolbox .aqi-summery-box .aqi-img .aqi-img-title{width:100%; height:40px; display:flex; align-items: center; justify-content: center; color:#fff; font-size:16px; font-weight:700; } .car-aqi-form .car-aqi-body table tbody tr th .aqi-tooptip .aqi-toolbox .aqi-summery-box.aqi-check .aqi-img .aqi-img-title{background:#515151;} .car-aqi-form .car-aqi-body table tbody tr th .aqi-tooptip .aqi-toolbox .aqi-summery-box.aqi-result .aqi-img .aqi-img-title{background:#0061FD;} .car-aqi-form .car-aqi-body table tbody tr th .aqi-tooptip .aqi-toolbox .aqi-summery-box .aqi-summery{width:100%; margin-top:12px;} .car-aqi-form .car-aqi-body table tbody tr th .aqi-tooptip .aqi-toolbox .aqi-summery-box .aqi-summery .aqi-summery-part{font-size:16px;font-weight:400;} .car-aqi-form .car-aqi-body table tbody tr th .aqi-tooptip .aqi-toolbox .aqi-summery-box .aqi-summery .aqi-summery-title{margin-top:20px; font-size:14px; font-weight:700;} .car-aqi-form .car-aqi-body table tbody tr th .aqi-tooptip .aqi-toolbox .aqi-summery-box .aqi-summery .aqi-summery-txt{font-size:16px; font-weight:400; line-height:1.3; margin-top:5px;} /* 성능 점검 기록 */ .prefomance-form{width:1000px;} .prefomance-form .window-pop-body{height:calc( 100vh - 60px );} .prefomance-form.bottom-open .window-pop-body{height:calc( 100vh - 140px );} .prefomance_head{width:100%; height:64px; display:flex; align-items: center; justify-content: space-between; padding:0 20px; background:#f6f6f6; margin-top:20px; margin-bottom:60px;} .prefomance_head .number{font-size:16px; font-weight:700;} .prefomance_head .txt{font-size:14px; color:#666;} .prefomance-form .window-pop-bt .btn{width:auto; padding:0 25px;} /* 사고이력 정보 */ .accident-form{width:1000px; } .accident-head{width:100%;margin:40px 0px 60px 0px; } .accident-head .accident-head-box{width:100%; padding:40px 20px; height:150px; display:flex; flex-direction: column; align-items: center ; justify-content: center; background:#f6f6f6; } .accident-head .accident-head-box .car-name{font-size:26px; font-weight:700;} .accident-head .accident-head-box .car-number{font-size:24px; color:#666; margin-top:8px;} .accident-head .accident-search-date{width:100%; text-align: right; font-size:14px; color:#666; margin-top:6px; } .accident-form .window-pop-body{height:unset; overflow:unset; padding-bottom:40px;} .accident-form .accident-list{margin-top:15px;} .accident-form .accident-list li{font-size:14px; color:#666; padding-left:12px; position: relative; margin-top: 5px; } .accident-form .accident-list li:first-child{margin-top:0px;} .accident-form .accident-list li::before{content:""; display:block; width:4px; height:4px; border-radius: 4px; background:#999; position: absolute; left:0; top:5px; } .accident-form .accident-list li span{font-size:14px; color:#131313;} .accident-form .focus{color:#579aff !important;} .accident-tooltip .tooltip-form{right:auto; left:-10px; top:24px;} .accident-tooltip .tooltip-form .tooltip-box{width:340px;} .accident-tooltip .tooltip-form .tooltip-box::before{display:none;} .accident-tooltip .tooltip-form .tooltip-box .tool-title{font-size:15px; font-weight:700;} .accident-tooltip .tooltip-form .tooltip-box .tool-txt{font-size:13px; font-weight:400; color:#515151; margin-top:10px;} .accident-tooltip .tooltip-form .tooltip-box .tool-txt span{font-size:13px; font-weight:400; color:#131313;} .accident-form .car-device-form{width:100%; margin-top:20px; } .accident-form .car-device-form .car-device-state{width:100%; text-align:right; font-size:14px; font-weight:400; color:#666; } .accident-form .car-device-form .car-device-list{width:100%; margin-top:21px; display:flex; flex-wrap:wrap; gap:0 9px;} .accident-form .car-device-form .car-device-list .car-device-con{width:calc( 33.33% - 6px ); border:1px solid #ddd; height:56px; margin-top:-1px; display:flex; align-items:center; } .accident-form .car-device-form .car-device-list .car-device-con .device-name{display:flex; align-items:center; gap:0 10px; padding:0 20px; width:calc( 100% - 56px ); background:#f9f9f9; height:100%; border-right:1px solid #ddd; } .accident-form .car-device-form .car-device-list .car-device-con .device-name i{display:block; width:32px; height:32px; } .accident-form .car-device-form .car-device-list .car-device-con .device-name .name-text{font-size:14px; font-weight:500; color:#888; } /* icon list */ .accident-form .car-device-form .car-device-list .car-device-con .device-name.abs i{background:url(../images/smartbuy/abs_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.acam i{background:url(../images/smartbuy/acam_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.acc i{background:url(../images/smartbuy/acc_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.aeb i{background:url(../images/smartbuy/aeb_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.afcw i{background:url(../images/smartbuy/afcw_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.afls i{background:url(../images/smartbuy/afls_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.apas i{background:url(../images/smartbuy/apas_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.bcam i{background:url(../images/smartbuy/bcam_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.bas i{background:url(../images/smartbuy/bas_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.bsd i{background:url(../images/smartbuy/bsd_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.btcam i{background:url(../images/smartbuy/btcam_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.drl i{background:url(../images/smartbuy/drl_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.esc i{background:url(../images/smartbuy/esc_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.fcw i{background:url(../images/smartbuy/fcw_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.hud i{background:url(../images/smartbuy/hud_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.ldws i{background:url(../images/smartbuy/ldws_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.lkas i{background:url(../images/smartbuy/lkas_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.tpms i{background:url(../images/smartbuy/tpms_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.psf i{background:url(../images/smartbuy/psf_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.spas i{background:url(../images/smartbuy/spas_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.bpsf i{background:url(../images/smartbuy/bpsf_off.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.lfa i{background:url(../images/smartbuy/lfa_off.svg) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.hdp i{background:url(../images/smartbuy/hdp_off.svg) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con .device-name.rspa i{background:url(../images/smartbuy/rspa_off.svg) no-repeat center; background-size:contain; } /* active */ .accident-form .car-device-form .car-device-list .car-device-con.active .device-name .name-text{color:#579aff; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.abs i{background:url(../images/smartbuy/abs_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.acam i{background:url(../images/smartbuy/acam_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.acc i{background:url(../images/smartbuy/acc_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.aeb i{background:url(../images/smartbuy/aeb_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.afcw i{background:url(../images/smartbuy/afcw_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.afls i{background:url(../images/smartbuy/afls_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.apas i{background:url(../images/smartbuy/apas_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.bcam i{background:url(../images/smartbuy/bcam_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.bas i{background:url(../images/smartbuy/bas_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.bsd i{background:url(../images/smartbuy/bsd_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.btcam i{background:url(../images/smartbuy/btcam_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.drl i{background:url(../images/smartbuy/drl_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.esc i{background:url(../images/smartbuy/esc_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.fcw i{background:url(../images/smartbuy/fcw_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.hud i{background:url(../images/smartbuy/hud_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.ldws i{background:url(../images/smartbuy/ldws_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.lkas i{background:url(../images/smartbuy/lkas_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.tpms i{background:url(../images/smartbuy/tpms_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.psf i{background:url(../images/smartbuy/psf_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.spas i{background:url(../images/smartbuy/spas_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.bpsf i{background:url(../images/smartbuy/bpsf_on.png) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.lfa i{background:url(../images/smartbuy/lfa_on.svg) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.hdp i{background:url(../images/smartbuy/hdp_on.svg) no-repeat center; background-size:contain; } .accident-form .car-device-form .car-device-list .car-device-con.active .device-name.rspa i{background:url(../images/smartbuy/rspa_on.svg) no-repeat center; background-size:contain; } /* state */ .accident-form .car-device-form .car-device-list .car-device-con .device-status{width:56px; height:100%; display:flex; align-items:center; justify-content:center; } .accident-form .car-device-form .car-device-list .car-device-con .device-status::before{content:""; font-size:14px; font-weight:500; color:#888; } .accident-form .car-device-form .car-device-list .car-device-con .device-status.install::before{content:"○"; color:#579aff;} .accident-form .car-device-form .car-device-list .car-device-con .device-status.choice::before{content:"△";} .accident-form .car-device-form .car-device-list .car-device-con .device-status.none::before{content:"-";} .accident-form .car-device-form .car-device-list .car-device-con .device-status.not::before{content:"X";} /* 수리이력 팝업 전개도 */ .accident-form .car-repair-box{width:100%; display:flex; border:1px solid #ddd;} .accident-form .car-repair-box .title{width:100%; height:56px; display:flex; align-items:center; justify-content:center; background:#f9f9f9; border-bottom:1px solid #ddd; } .accident-form .car-repair-box .car-repair-map{width:441px; border-right:1px solid #ddd; } .accident-form .car-repair-box .car-repair-map .repair-map{ width:100%; padding:50px 45px; } .accident-form .car-repair-box .car-repair-map .repair-map .car-map{position:relative; width:100%; height:100%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map{position:relative; width:100%; height:100%;} .accident-form .car-repair-box .car-repair-map .repair-map .dot-list{position:absolute; width:100%; height:100%; top:0; left:0;} .accident-form .car-repair-box .car-repair-map .repair-map .repair-state{display:flex; align-items:center; justify-content:center; margin-top:33px; gap:0 20px;} .accident-form .car-repair-box .car-repair-map .repair-map .repair-state .state-con{font-size:16px; color:#131313; display:flex; align-items:center; gap:0 8px;} .accident-form .car-repair-box .car-repair-map .repair-map .repair-state .state-con::before{content:""; display:block; width:26px; height:26px;} .accident-form .car-repair-box .car-repair-map .repair-map .repair-state .state-con.repair-type01::before{background:url(../images/smartbuy/repair_type01.png) no-repeat center;} .accident-form .car-repair-box .car-repair-map .repair-map .repair-state .state-con.repair-type02::before{background:url(../images/smartbuy/repair_type02.png) no-repeat center;} .accident-form .car-repair-box .car-repair-map .repair-map .repair-state .state-con.repair-type03::before{background:url(../images/smartbuy/repair_type03.png) no-repeat center;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .map-dot{ display:flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:26px; position:absolute; transform: translate( -50%, -50% ); text-indent:-99999999px; } .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .map-dot{ display:flex; align-items:center; justify-content:center; width:26px; height:26px; border-radius:26px; position:absolute; transform: translate( -50%, -50% ); text-indent:-99999999px; } .accident-form .car-repair-box .car-repair-map .repair-map .dot-list .map-dot.repair-type01{background:url(../images/smartbuy/repair_type01.png) no-repeat center;} .accident-form .car-repair-box .car-repair-map .repair-map .dot-list .map-dot.repair-type02{background:url(../images/smartbuy/repair_type02.png) no-repeat center;} .accident-form .car-repair-box .car-repair-map .repair-map .dot-list .map-dot.repair-type03{background:url(../images/smartbuy/repair_type03.png) no-repeat center;} /* 자량전개도 dot */ .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map01{left:50%; top:8.2%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map02{left:50%; top:99%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map03{left:50%; top:24%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map04{left:50%; top:93.5%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map05{left:50%; top:81%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map06{left:11.5%; top:44%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map07{left:88.5%; top:44%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map08{left:11.5%; top:56%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map09{left:88.5%; top:56%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map10{left:15%; top:27%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map11{left:85%; top:27%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map12{left:15%; top:74%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map13{left:85%; top:74%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map14{left:50%; top:38%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map15{left:50%; top:52%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map16{left:50%; top:62%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map17{left:11.5%; top:62%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map18{left:88.5%; top:62%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map19{left:50%; top:72%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map20{left:50%; top:3%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map21{left:37.3%; top:3%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map22{left:62.7%; top:3%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map23{left:37.3%; top:93.5%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map24{left:62.7%; top:93.5%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map25{left:4%; top:53%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map26{left:96%; top:53%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map27{left:21%; top:53%;} .accident-form .car-repair-box .car-repair-map .repair-map .car-map .dot-list .car-map28{left:79%; top:53%;} /* 화물차 전개도 dot */ .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map01{left:50%; top:2%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map02{left:38.3%; top:8%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map03{left:62.3%; top:8%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map04{left:30.8%; top:97.8%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map05{left:70.6%; top:97.8%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map06{left:20%; top:22%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map07{left:80%; top:22%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map08{left:29%; top:49%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map09{left:71%; top:49%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map10{left:40.5%; top:97.8%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map11{left:60.5%; top:97.8%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map12{left:18%; top:32%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map13{left:82%; top:32%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map14{left:18%; top:44%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map15{left:82%; top:44%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map16{left:34%; top:27%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map17{left:66%; top:27%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map18{left:50%; top:8%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map19{left:50%; top:14%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map20{left:50%; top:70%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map21{left:50%; top:50%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map22{left:50%; top:91%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map23{left:15%; top:71%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map24{left:85%; top:71%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map25{left:7%; top:47%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map26{left:93%; top:47%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map27{left:29%; top:38%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map28{left:71%; top:38%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map29{left:7%; top:25%;} .accident-form .car-repair-box .car-repair-map .repair-map .cargo-map .dot-list .cargo-map30{left:93%; top:25%;} .accident-form .car-repair-box .car-repair-list{width:calc( 100% - 441px );} .accident-form .car-repair-box .car-repair-list .repair-car-list{display:flex; flex-wrap:wrap;} .accident-form .car-repair-box .car-repair-list .repair-car-list .repair-list-con{width:50%; height:56px; border-bottom:1px solid #ddd; display:flex; align-items:center; justify-content:space-between; padding:0 20px; } .accident-form .car-repair-box .car-repair-list .repair-car-list .repair-list-con:nth-child(n+27){border-bottom:0px ;} .accident-form .car-repair-box .car-repair-list .repair-car-list .repair-list-con:nth-child(odd){border-right:1px solid #ddd;} .accident-form .car-repair-box .car-repair-list .repair-car-list .repair-list-con .list-name{font-size:14px; coloR:#515151; font-weight:400;} .accident-form .car-repair-box .car-repair-list .repair-car-list .repair-list-con .list-state{display:flex; align-items:center; gap:0 8px;} .accident-form .car-repair-box .car-repair-list .repair-car-list .repair-list-con .list-state .repair-type01{font-size:14px; color:#579aff; font-weight:400;} .accident-form .car-repair-box .car-repair-list .repair-car-list .repair-list-con .list-state .repair-type02{font-size:14px; color:#ff3f3f; font-weight:400;} .accident-form .car-repair-box .car-repair-list .repair-cargo-list{display:flex; flex-wrap:wrap;} .accident-form .car-repair-box .car-repair-list .repair-cargo-list .repair-list-con{width:50%; height:56px; border-bottom:1px solid #ddd; display:flex; align-items:center; justify-content:space-between; padding:0 20px; } .accident-form .car-repair-box .car-repair-list .repair-cargo-list .repair-list-con:nth-child(n+29){border-bottom:0px ;} .accident-form .car-repair-box .car-repair-list .repair-cargo-list .repair-list-con:nth-child(odd){border-right:1px solid #ddd;} .accident-form .car-repair-box .car-repair-list .repair-cargo-list .repair-list-con .list-name{font-size:14px; coloR:#515151; font-weight:400;} .accident-form .car-repair-box .car-repair-list .repair-cargo-list .repair-list-con .list-state{display:flex; align-items:center; gap:0 8px;} .accident-form .car-repair-box .car-repair-list .repair-cargo-list .repair-list-con .list-state .repair-type01{font-size:14px; color:#579aff; font-weight:400;} .accident-form .car-repair-box .car-repair-list .repair-cargo-list .repair-list-con .list-state .repair-type02{font-size:14px; color:#ff3f3f; font-weight:400;} /* 수리내역 리스트 */ .accident-form .car-repair-history{width:100%; margin-top:40px;} .accident-form .car-repair-history .repair-history-box{width:100%;} .accident-form .car-repair-history .repair-history-box .repair-history-head{width:100%; height:56px; display:flex; align-items:center; justify-content:center; background:#f9f9f9; border:1px solid #ddd; font-size:14px; color:#131313; font-weight:400; } .accident-form .car-repair-history .repair-history-box .repair-history-list{width:100%; display:flex; align-items:center; border:1px solid #ddd; margin-top:-1px;} .accident-form .car-repair-history .repair-history-box .repair-history-list .repair-history-con{width:50%; height:56px; border-right:1px solid #ddd; display:flex; align-items:center; justify-content:center; gap:0 10px;} .accident-form .car-repair-history .repair-history-box .repair-history-list .repair-history-con:last-child{border-right:0px;} .accident-form .car-repair-history .repair-history-box .repair-history-list .repair-history-con .repair-name{font-size:14px; color:#888;} .accident-form .car-repair-history .repair-history-box .repair-history-list .repair-history-con .repair-count{font-size:14px; color:#515151;} .accident-form .car-repair-history .repair-history-box .repair-history-list .repair-history-con .repair-count span{font-size:14px; color:#515151; font-weight:700;} .accident-form .car-repair-history .repair-summary-form{width:100%; margin-top:24px;} .accident-form .car-repair-history .repair-summary-form .repair-summary-list{width:100%; display:flex; flex-direction: column; gap:4px; } .accident-form .car-repair-history .repair-summary-form .repair-summary-list .repair-summary-box{width:100%; border:1px solid #ddd;} .accident-form .car-repair-history .repair-summary-form .repair-summary-list .repair-summary-box .repair-summary-head{display:flex; align-items:center; justify-content:center; border-bottom:1px solid #ddd; width:100%; height:46px; background:#f9f9f9; font-size:14px; color:#515151; } .accident-form .car-repair-history .repair-summary-form .repair-summary-list .repair-summary-box .repair-summary-con{width:100%; display:flex; flex-wrap:wrap;} .accident-form .car-repair-history .repair-summary-form .repair-summary-list .repair-summary-box .repair-summary-con .summary-head{width:200px; display:flex; align-items:center; justify-content:center; background:#f9f9f9; font-size:14px; font-weight:700; color:#131313; border-top:1px solid #ddd; border-right:1px solid #ddd; } .accident-form .car-repair-history .repair-summary-form .repair-summary-list .repair-summary-box .repair-summary-con .summary-con{width:calc( 100% - 200px ); font-size:14px; color:#515151; line-height:1.4; padding:20px 16px; border-top:1px solid #ddd; } .accident-form .car-repair-history .repair-summary-form .repair-summary-list .repair-summary-box .repair-summary-con div:nth-child(-n+2){border-top:0px;} .accident-form .car-repair-history .repair-summary-btn{width:100%; display:flex; align-items:center; justify-content:center; height:52px; font-size:14px; font-weight:700; color:#515151; border:1px solid #ddd; border-radius:0px 0px 10px 10px; margin-top:-1px; } .accident-form .car-repair-history .repair-summary-btn::after{content:""; display:block; width:24px; height:24px; background:url(../images/smartbuy/repair_history_arrow.png) no-repeat center; transition:all 0.4s; transform: rotate(0deg); } .accident-form .car-repair-history .repair-summary-btn.active::after{transition:all 0.4s; transform: rotate(180deg);} /* 팝업 공통 테이블 */ .pop-tbl-form{width:100%; } .pop-tbl-form .pop-tbl-box{width:100%; margin-top:60px;} .pop-tbl-form .pop-tbl-box:first-child{margin-top:0px;} .pop-tbl-form .pop-tbl-box .pop-tbl-title{font-size:22px; font-weight:500; display:flex; align-items: center;} .pop-tbl-form .pop-tbl-box .pop-tbl-title .accident-tooltip{margin-left:8px;} .pop-tbl-form .pop-tbl-box .pop-tbl-sub{font-size:16px; color:#666; margin-top:8px;} .pop-tbl-form .pop-tbl-box .pop-tbl{width:100%; border:1px solid #ddd; margin-top:20px;} .pop-tbl-form .pop-tbl-box .pop-tbl th{padding:12px 14px; min-height: 56px; vertical-align: middle; font-size: 14px; font-weight:400; line-height:1.3; background:#f9f9f9; border-right:1px solid #ddd; border-bottom:1px solid #ddd; text-align: left; word-break: keep-all; } .pop-tbl-form .pop-tbl-box .pop-tbl td{padding:12px 14px; min-height: 56px; vertical-align: middle; font-size: 14px; font-weight:400; line-height:1.3; color:#515151; border-right:1px solid #ddd; border-bottom:1px solid #ddd; text-align: left; word-break: keep-all; } .pop-tbl-form .pop-tbl-box .pop-tbl td.pay{text-align: right;} .pop-tbl-form .pop-tbl-box .pop-tbl td span{font-size: 14px; font-weight:400; color:#515151;} .pop-tbl-form .pop-tbl-box .accident-date-box + .accident-info-tbl{margin-top:40px;} .pop-tbl-form .pop-tbl-box .accident-date-box{width:100%; margin-top:15px;} .pop-tbl-form .pop-tbl-box .accident-date-box .accident-date-head{width:100%; height:56px; display:flex; align-items:center; justify-content:center; background:#f9f9f9; border:1px solid #ddd; font-size:14px; font-weight:400; color:#131313; } .pop-tbl-form .pop-tbl-box .accident-date-box .accident-date-list{width:100%; display:flex; flex-wrap:wrap;} .pop-tbl-form .pop-tbl-box .accident-date-box .accident-date-list .accident-date-con{width:50%; height:56px; border-right:1px solid #ddd; border-bottom:1px solid #ddd; display:flex; align-items:center; justify-content:center; font-size:14px; color:#515151; } .pop-tbl-form .pop-tbl-box .accident-date-box .accident-date-list .accident-date-con:nth-child(odd){border-left:1px solid #ddd;} .pop-tbl-form .pop-tbl-box .pop-tbl td ul li{font-size:14px; line-height:1.4;} .accident-form .pop-tbl-form .pop-tbl-box .pop-tbl td ul li:first-child{color:#579aff;} .pop-tbl-form .pop-tbl-box .pop-tbl td .check-list{display:flex; align-items: center; flex-wrap: wrap;} .pop-tbl-form .pop-tbl-box .pop-tbl td .check-list li{font-size:14px; color:#666; display:flex; height:26px; align-items: center; margin-right:20px;} .pop-tbl-form .pop-tbl-box .pop-tbl td .check-list li:last-child{margin-right:0px;} .pop-tbl-form .pop-tbl-box .pop-tbl td .check-list li::before{content:""; width:20px; height:20px; border-radius: 2px; background:#e3e3e3 url(../images/contents/pop_check_off.png) no-repeat center; margin-right:6px; } .pop-tbl-form .pop-tbl-box .pop-tbl td .check-list li.on{color:#515151;} .pop-tbl-form .pop-tbl-box .pop-tbl td .check-list li.on::before{background:#0061FD url(../images/contents/pop_check_on.png) no-repeat center;} .pop-tbl-form .pop-tbl-box .pop-tbl td .check-text-list{display:flex; align-items: center; flex-wrap: wrap;} .pop-tbl-form .pop-tbl-box .pop-tbl td .check-text-list li{font-size:14px; color:#888; height:26px; display:flex; align-items: center; margin-right:20px; } .pop-tbl-form .pop-tbl-box .pop-tbl td .check-text-list li:last-child{margin-right:0px;} .pop-tbl-form .pop-tbl-box .pop-tbl td .check-text-list li::before{content:""; display:block; width:16px; height:16px; background:url(../images/contents/pop_check_text_off.png) no-repeat center; margin-right:2px; } .pop-tbl-form .pop-tbl-box .pop-tbl td .check-text-list li.on{font-size:14px; color:#131313; font-weight:700;} .pop-tbl-form .pop-tbl-box .pop-tbl td .check-text-list li.on::before{background:url(../images/contents/pop_check_text_on.png) no-repeat center; } .pop-tbl-form .pop-tbl-box .pop-tbl td .check-text-list li .check-text-list li{margin-right:7px; margin-left:0px;} .pop-tbl-form .pop-tbl-box .pop-tbl td .check-text-list li .check-text-list li:last-child{margin-right:0px;} .pop-tbl-form .pop-tbl-box .pop-tbl-txt{font-size:16px; color:#666; margin-top:20px;} .pop-tbl-form .pop-tbl-box .pop-tbl-txt span{font-size:16px; color:#131313;} .pop-tbl-form .pop-tbl-box .pop-tbl.type02 tr th, .pop-tbl-form .pop-tbl-box .pop-tbl.type02 tr td{text-align: center;} .pop-tbl-form .pop-tbl-box .pop-tbl-txt + .pop-tbl{margin-top:15px;} .pop-tbl-form .pop-tbl-box .accident-info-tbl tr td:nth-child(n+2){text-align: left;} .pop-tbl-form .pop-tbl-box .accident-info-tbl tr td span{color:#131313;} .pop-tbl-form .pop-tbl-box .accident-info-tbl tr td .accident-info{margin-top:20px;} .pop-tbl-form .pop-tbl-box .accident-info-tbl tr td .accident-info:first-child{margin-top:0px;} .pop-tbl-form .pop-tbl-box .accident-info-tbl tr td .accident-info li{font-size:14px; color:#515151; margin-top:3px;} .pop-tbl-form .pop-tbl-box .accident-info-tbl tr td .accident-info li:first-child{margin-top:0px;} .pop-tbl-form .pop-tbl-box .performance-total{width:100%;} .pop-tbl-form .pop-tbl-box .performance-total .performance-total-title{width:100%; text-align: center; font-size:24px; display:flex; align-items: flex-end; justify-content: center; } .pop-tbl-form .pop-tbl-box .performance-total .performance-total-title span{display:flex; align-items: center; justify-content: center; font-size:24px; width:200px; border-bottom:1px solid #131313; margin:0 5px; } .pop-tbl-form .pop-tbl-box .performance-total .performance-total-txt{font-size:14px; margin-top:16px; width:100%; text-align: center; } .pop-tbl-form .pop-tbl-box .performance-total + .pop-tbl{margin-top:60px;} .pop-tbl-form .pop-tbl-box .performance-summery{width:100%; padding:40px; background:#f9f9f9; } .pop-tbl-form .pop-tbl-box .performance-summery .performance-summery-box{width:100%;} .pop-tbl-form .pop-tbl-box .performance-summery .performance-summery-box .title{margin-top:40px; font-size:20px; } .pop-tbl-form .pop-tbl-box .performance-summery .performance-summery-box .list{margin-top:20px; width:100%;} .pop-tbl-form .pop-tbl-box .performance-summery .performance-summery-box .list li{font-size:16px; color:#666; line-height:1.3; padding-left:12px; text-indent: -16px; margin-top:10px;} .pop-tbl-form .pop-tbl-box .performance-summery .performance-summery-box .list li .list-dash li{margin-top:5px; text-indent: 0; position: relative; padding-left:12px; } .pop-tbl-form .pop-tbl-box .performance-summery .performance-summery-box .list li .list-dash li::before{content:""; width:4px; height:4px; border-radius: 4px; background:#999; position: absolute; left:0; top:7px; } .pop-tbl-form .pop-tbl-box .performance-summery .performance-summery-box p{font-size:16px; color:#666; line-height:1.3; margin-top:20px; word-break: keep-all;} .pop-tbl-form .pop-tbl-box .performance-photo{width:100%; margin-top:20px;} .pop-tbl-form .pop-tbl-box .performance-photo img{margin-top:10px;} .pop-tbl-form .pop-tbl-box .performance-photo img:first-child{margin-top:0px;} .pop-tbl-form .pop-tbl-box .performance-sign-form{margin-top:20px; width:100%;} .pop-tbl-form .pop-tbl-box .performance-sign-form .performance-sign-summery{padding-top:10px; width:100%; text-align:center; font-size: 16px;} .pop-tbl-form .pop-tbl-box .performance-sign-form .performance-sign-summery span{font-size:16px;} .pop-tbl-form .pop-tbl-box .performance-sign-form .performance-date{margin-top:20px; width:100%; text-align: center; font-size:16px; color:#666; } .pop-tbl-form .pop-tbl-box .performance-sign-form .performance-sign-list{ width:100%;} .pop-tbl-form .pop-tbl-box .performance-sign-form .performance-sign-list li{width:100%; display:flex; align-items: center; justify-content: space-between; height:22px; margin-top:30px;} .pop-tbl-form .pop-tbl-box .performance-sign-form .performance-sign-list li .title{font-size:14px;} .pop-tbl-form .pop-tbl-box .performance-sign-form .performance-sign-list li .name{font-size:14px; color:#666; position: relative;} .pop-tbl-form .pop-tbl-box .performance-sign-form .performance-sign-list li .name.company-sign::before{content: ""; width:80px; height:80px; display:block; background:url(../images/common/img_car_perfomance_confirm.png) no-repeat center; background-size: contain; position: absolute; right:0; top:50%; transform: translate( -0, -50% ); } .pop-tbl-form .pop-tbl-box .performance-footer{margin-top:30px;padding-top:30px; border-top:1px solid #ddd; position: relative; padding-bottom:10px;} .pop-tbl-form .pop-tbl-box .performance-footer .performance-footer-txt{width:100%; text-align: center; font-size:16px;} .pop-tbl-form .pop-tbl-box .performance-footer .performance-sign-date{width:100%; text-align: center; font-size:16px; color:#666; margin-top:20px; } .pop-tbl-form .pop-tbl-box .performance-footer .performance-sign{font-size:14px; color:#666; position: absolute; right:0; bottom:10px;} .pop-tbl-form .pop-tbl-box .accident-summery{width:100%; padding:40px; background:#f9f9f9; } .pop-tbl-form .pop-tbl-box .accident-summery .accident-summery-box{width:100%;} .pop-tbl-form .pop-tbl-box .accident-summery .accident-summery-box .title{margin-top:40px; font-size:20px; } .pop-tbl-form .pop-tbl-box .accident-summery .accident-summery-box .title:first-child{margin-top:0px;} .pop-tbl-form .pop-tbl-box .accident-summery .accident-summery-box .list-dot{margin-top:20px;} .pop-tbl-form .pop-tbl-box .accident-summery .accident-summery-box .list-dot li{font-size:16px; color:#666; margin-top:6px; padding-left:14px; position: relative; line-height:1.3; } .pop-tbl-form .pop-tbl-box .accident-summery .accident-summery-box .list-dot li::before{content:""; display:block; width:4px; height:4px; border-radius: 4px; background:#999; position: absolute; left:0; top:7px; } .pop-tbl-form .pop-tbl-box .accident-summery .accident-summery-box .list-dot li:first-child{margin-top:0px;} .pop-tbl-form .pop-tbl-box .accident-summery .accident-summery-box .list-dot li span{font-size:16px; color:#131313;} .pop-tbl-form .pop-tbl-box .accident-summery .accident-summery-box .list-dot li .list-num li{font-size:14px; color:#888; list-style: auto; padding-left:0px; margin-left:14px; margin-top:4px;} .pop-tbl-form .pop-tbl-box .accident-summery .accident-summery-box .list-dot li .list-num li::before{display:none;} .pop-tbl-form .pop-tbl-box .accident-summery .accident-summery-box .list-dot li .list-num li .list-dash li{list-style: none; font-size:14px; color:#888;} .pop-tbl-form .accident-footer{width:100%; margin-top:40px; } .pop-tbl-form .accident-footer .txt{width:100%; text-align: center; line-height:1.3; font-size:18px; color:#131313; } .pop-tbl-form .accident-footer .txt a{font-size:18px; } .pop-tbl-form .accident-footer .date{width:100%; margin-top:20px; font-size:16px; color:#666; text-align: center; } /* 전개도 */ .pop-tbl-form .pop-tbl-box .figure-form{width:100%;margin-top:20px;} .pop-tbl-form .pop-tbl-box .figure-form + .pop-tbl{margin-top:0px;} .pop-tbl-form .pop-tbl-box .figure-form .figure-status{display:flex; align-items: center; justify-content: center; width:100%; height:86px; border:1px solid #eee; background:#fff; } .pop-tbl-form .pop-tbl-box .figure-form .figure-status .title{font-size:16px;} .pop-tbl-form .pop-tbl-box .figure-form .figure-status .figure-status-list{display:flex; align-items: center;} .pop-tbl-form .pop-tbl-box .figure-form .figure-status .figure-status-list li{margin-left:20px; font-size:16px; display:flex; align-items: center;} .pop-tbl-form .pop-tbl-box .figure-form .figure-status .figure-status-list li::before{content:""; display:flex; width:26px; height:26px; border-radius: 26px; align-items: center; justify-content: center; font-size:13px; font-weight:900; margin-right:8px; } .pop-tbl-form .pop-tbl-box .figure-form .figure-status .figure-status-list li.ico-x::before{content:"X"; border:2px solid #ff3f3f; color:#ff3f3f; } .pop-tbl-form .pop-tbl-box .figure-form .figure-status .figure-status-list li.ico-w::before{content:"W"; border:2px solid #579AFF; color:#579AFF; } .pop-tbl-form .pop-tbl-box .figure-form .figure-status .figure-status-list li.ico-a::before{content:"A"; border:2px solid #13B78B; color:#13B78B; } .pop-tbl-form .pop-tbl-box .figure-form .figure-status .figure-status-list li.ico-u::before{content:"U"; border:2px solid #FF9705; color:#FF9705; } .pop-tbl-form .pop-tbl-box .figure-form .figure-status .figure-status-list li.ico-c::before{content:"C"; border:2px solid #695FA9; color:#695FA9; } .pop-tbl-form .pop-tbl-box .figure-form .figure-status .figure-status-list li.ico-t::before{content:"T"; border:2px solid #FE3890; color:#FE3890; } .pop-tbl-form .pop-tbl-box .figure-form .car-map{width:100%; padding:80px 60px; position: relative;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos{width:26px; height:26px; font-size:16px; font-weight:700; position: absolute; display:flex; align-items: center; justify-content: center; } .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-01{top:120px; left:325px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-02-01{left:131px; top:125px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-02-02{left:750px; top:125px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-03-01{left:100px; top:243px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-03-02{left:100px; top:318px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-03-03{left:784px; top:243px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-03-04{left:784px; top:318px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-04{left:325px; top:455px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-05{left:564px; top:90px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-06-01{left:118px; top:422px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-06-02{left:763px; top:422px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-07{left:325px; top:287px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-08-01{left:65px; top:268px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-08-02{left:814px; top:280px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-09{left:564px; top:112px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-10{left:564px; top:220px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-11-01{left:509px; top:153px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-11-02{left:614px; top:153px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-12-01{left:532px; top:166px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-12-02{left:592px; top:166px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-12-03{left:532px; top:414px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-12-04{left:592px; top:414px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-13-01{left:509px; top:195px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-13-02{left:614px; top:195px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-13-03{left:509px; top:402px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-13-04{left:614px; top:402px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-14-01{left:165px; top:245px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-14-02{left:153px; top:291px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-14-03{left:165px; top:358px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-14-04{left:714px; top:245px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-14-05{left:729px; top:291px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-14-06{left:712px; top:358px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-15{left:564px; top:245px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-16{left:564px; top:312px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-17{left:564px; top:414px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-18{left:564px; top:448px;} .pop-tbl-form .pop-tbl-box .figure-form .car-map .pos.pos-19{left:564px; top:380px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map{width:100%; padding:80px 60px; position: relative;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos{width:26px; height:26px; font-size:16px; font-weight:700; position: absolute; display:flex; align-items: center; justify-content: center; } .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-01{left:334px; top:130px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-02-01{left:96px; top:214px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-02-02{left:785px; top:214px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-03-01{left:117px; top:192px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-03-02{left:131px; top:250px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-03-03{left:764px; top:192px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-03-04{left:747px; top:250px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-04{left:334px; top:400px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-05{left:547px; top:146px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-06-01{left:100px; top:282px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-06-02{left:782px; top:282px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-07{left:334px; top:237px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-08-01{left:100px; top:366px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-08-02{left:782px; top:366px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-09{left:547px; top:172px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-10{left:547px; top:198px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-11-01{left:499px; top:186px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-11-02{left:596px; top:186px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-12{left:547px; top:224px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-13-01{left:499px; top:267px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-13-02{left:596px; top:267px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-14-01{left:162px; top:228px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-14-02{left:720px; top:228px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-15{left:547px; top:247px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-16{left:547px; top:269px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-17{left:547px; top:291px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-18{left:547px; top:316px;} .pop-tbl-form .pop-tbl-box .figure-form .cargo-map .pos.pos-19{left:547px; top:394px;} .pop-tbl-form .pop-tbl-box .figure-form .pos.ico-x::before{content:"X"; display:flex; width:26px; height:26px; border-radius: 26px; align-items: center; justify-content: center; font-size:13px; font-weight:900; border:2px solid #ff3f3f; background:#fff; color:#ff3f3f; position: absolute; left:0; top:0; } .pop-tbl-form .pop-tbl-box .figure-form .pos.ico-w::before{content:"W"; display:flex; width:26px; height:26px; border-radius: 26px; align-items: center; justify-content: center; font-size:13px; font-weight:900; border:2px solid #579AFF; background:#fff; color:#579AFF; position: absolute; left:0; top:0; } .pop-tbl-form .pop-tbl-box .figure-form .pos.ico-a::before{content:"A"; display:flex; width:26px; height:26px; border-radius: 26px; align-items: center; justify-content: center; font-size:13px; font-weight:900; border:2px solid #13B78B; background:#fff; color:#13B78B; position: absolute; left:0; top:0; } .pop-tbl-form .pop-tbl-box .figure-form .pos.ico-u::before{content:"U"; display:flex; width:26px; height:26px; border-radius: 26px; align-items: center; justify-content: center; font-size:13px; font-weight:900; border:2px solid #FF9705; background:#fff; color:#FF9705; position: absolute; left:0; top:0; } .pop-tbl-form .pop-tbl-box .figure-form .pos.ico-c::before{content:"C"; display:flex; width:26px; height:26px; border-radius: 26px; align-items: center; justify-content: center; font-size:13px; font-weight:900; border:2px solid #695FA9; background:#fff; color:#695FA9; position: absolute; left:0; top:0; } .pop-tbl-form .pop-tbl-box .figure-form .pos.ico-t::before{content:"T"; display:flex; width:26px; height:26px; border-radius: 26px; align-items: center; justify-content: center; font-size:13px; font-weight:900; border:2px solid #FE3890; background:#fff; color:#FE3890; position: absolute; left:0; top:0; } /* 이벤트 */ .event-section{width:1200px; margin:50px auto 130px auto;} .event-section .page-title{align-items: center; justify-content: center;} .event-section .page-title .page-title-txt{flex-direction: column; align-items: center; justify-content: center; height:auto; } .event-section .page-title .page-title-txt .main-txt{font-size:36px; font-weight:500;} .event-section .page-title .page-title-txt .sub-txt{font-size:16px; color:#666; margin-top:10px;} .event-section .event-form{ margin-top:40px; width:100%;} .event-section .event-form .event-search-form{margin-top:30px; width:100%; display:flex; align-items: center; justify-content: space-between;} .event-section .event-form .event-search-form .search-box{width:280px; height:40px; position: relative;} .event-section .event-form .event-search-form .search-box input[type="text"]{width:100%; height:100%; border:1px solid #ddd; outline: none; font-size:14px; padding:0px 60px 0px 12px; } .event-section .event-form .event-search-form .search-box input[type="text"]:focus{border:1px solid #131313;} .event-section .event-form .event-search-form .search-box .event-search-delete{width:16px; height:16px; border-radius: 16px; display:flex; align-items: center; justify-content: center; background:#ddd; cursor: pointer; position: absolute; right:40px; top:50%; transform: translate(0px, -50%); display: none; } .event-section .event-form .event-search-form .search-box .event-search-delete.active{display:flex;} .event-section .event-form .event-search-form .search-box .event-search-btn{position: absolute; right:12px; top:50%; transform: translate(0px, -50%);} .event-section .event-form .event-search-form .reflash-box{} .event-section .event-form .event-search-form .reflash-box .reflash-btn{display:flex; align-items: center; font-size:14px; color:#666;} .event-section .event-form .event-search-form .reflash-box .reflash-btn::after{ content:""; display:block; width:15px; height:13px; background:url(../images/common/round_reflash.png) no-repeat center; background-size: contain; margin-left:10px; } .event-section .event-form .event-list-form{width:100%; margin-top:20px;} .event-section .event-form .event-list-form .event-list-box{width:100%; display:flex; gap:40px 37px; flex-wrap: wrap; } .event-section .event-form .event-list-form .event-list-box .event-list-con{width:375px; position: relative;} .event-section .event-form .event-list-form .event-list-box .event-list-con .event-thumnail{width:100%; height: 210px;} .event-section .event-form .event-list-form .event-list-box .event-list-con .event-info{width:100%; padding:20px 10px;} .event-section .event-form .event-list-form .event-list-box .event-list-con .event-info .event-status{width:100%; display:flex; align-items: center;} .event-section .event-form .event-list-form .event-list-box .event-list-con .event-info .event-status .bage{padding:0 10px; height:28px; border-radius: 28px; display: flex; align-items: center; justify-content: center; border:1px solid #0061FD; color:#0061FD; font-size:14px; font-weight:700; } .event-section .event-form .event-list-form .event-list-box .event-list-con .event-info .event-status .status{margin-left:8px; font-size:14px; font-weight:700; color:#0061FD; } .event-section .event-form .event-list-form .event-list-box .event-list-con .event-info .event-title{width:100%; margin-top:8px; line-height:1.3; font-size:18px; word-break: keep-all;} .event-section .event-form .event-list-form .event-list-box .event-list-con .event-info .event-date{margin-top:12px; font-size:14px; color:#888; } .event-section .event-form .event-list-form .event-list-box .event-list-con.end::after{content:""; display:block; width:100%; height:100%; background:rgba(0,0,0,0.6); position: absolute; left:0; top:0; z-index: 2; } .event-section .event-form .event-list-form .event-tbl-list{width:100%;} .event-section .event-form .event-list-form .event-tbl-list .event-tbl-con{display:flex; align-items: center; height:64px; border-bottom:1px solid #eee;} .event-section .event-form .event-list-form .event-tbl-list .event-tbl-con .list-number{font-size:14px; width:85px; text-align: center;} .event-section .event-form .event-list-form .event-tbl-list .event-tbl-con .event-title{font-size:14px; width:calc( 100% - 491px); text-align: left; padding:0 15px;} .event-section .event-form .event-list-form .event-tbl-list .event-tbl-con .event-title a{font-size:16px; display:block; color:#333; width:100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .event-section .event-form .event-list-form .event-tbl-list .event-tbl-con .event-title a:hover{text-decoration: underline; color:#131313;} .event-section .event-form .event-list-form .event-tbl-list .event-tbl-con .event-date{font-size:14px; width:274px; text-align: center; color:#888;} .event-section .event-form .event-list-form .event-tbl-list .event-tbl-con .prize-date{font-size:14px; width:132px; text-align: center; color:#888;} .event-section .event-form .event-list-form .event-tbl-list .event-tbl-con.head{display:flex; align-items: center; height:64px; border-top:1px solid #131313; border-bottom:1px solid #acacac;} .event-section .event-form .event-list-form .event-tbl-list .event-tbl-con.head .list-number{font-size:16px; width:85px; font-weight:700; color:#333; text-align: center;} .event-section .event-form .event-list-form .event-tbl-list .event-tbl-con.head .event-title{font-size:16px; width:calc( 100% - 491px); font-weight:700; color:#333; text-align: center; padding:0 15px;} .event-section .event-form .event-list-form .event-tbl-list .event-tbl-con.head .event-date{font-size:16px; width:274px; text-align: center; font-weight:700; color:#333;} .event-section .event-form .event-list-form .event-tbl-list .event-tbl-con.head .prize-date{font-size:16px; width:132px; text-align: center; font-weight:700; color:#333;} .event-section .event-form .event-list-form .pagination{margin-top:50px;} /* 이벤트 상세 페이지 */ .event-view-section{width:1200px; margin:40px auto 130px auto;} .event-view-section .event-view-form{width:100%;} .event-view-section .event-view-form .event-view-head{width:100%; display:flex; justify-content: space-between; align-items: flex-end;} .event-view-section .event-view-form .event-view-head .event-info{width: calc(100% - 100px);} .event-view-section .event-view-form .event-view-head .event-info .bage-box{display:flex; align-items: center;} .event-view-section .event-view-form .event-view-head .event-info .bage-box .bage{padding:0 10px; height:28px; border-radius: 28px; display: flex; align-items: center; justify-content: center; border:1px solid #0061FD; color:#0061FD; font-size:14px; font-weight:700; margin-right:8px; } .event-view-section .event-view-form .event-view-head .event-info .bage-box .bage:last-child{margin-right:0px;} .event-view-section .event-view-form .event-view-head .event-info .event-title{width:100%; margin-top:20px; font-size:30px; font-weight:500; line-height:1.3;} .event-view-section .event-view-form .event-view-head .event-info .event-info-list{width:100%; display:flex; align-items: center; margin-top:12px;} .event-view-section .event-view-form .event-view-head .event-info .event-info-list .event-info-list-con{display:flex; align-items: center;} .event-view-section .event-view-form .event-view-head .event-info .event-info-list .event-info-list-con::after{content:""; display:block; width:1px; height:12px; background:#acacac; margin:0 10px;} .event-view-section .event-view-form .event-view-head .event-info .event-info-list .event-info-list-con:last-child::after{display:none;} .event-view-section .event-view-form .event-view-head .event-info .event-info-list .event-info-list-con .title{font-size:14px; font-weight:700; color:#666;} .event-view-section .event-view-form .event-view-head .event-info .event-info-list .event-info-list-con .txt{font-size:14px; color:#666; margin-left:6px;} .event-view-section .event-view-form .event-view-head .event-share{width:60px; margin-left:40px;} .event-view-section .event-view-form .event-view-head .event-share button{width:60px; height:32px; border-radius: 32px; border:1px solid #ddd; background:#fff; display:flex; align-items: center; justify-content: center; } .event-view-section .event-view-form .event-view-head .event-share button:hover{border:1px solid #131313;} .event-view-section .event-view-form .event-view-head .event-share button:active{background:#fff; border:1px solid #131313;} .event-view-section .event-view-form .event-view-head .event-share button span{font-size:12px; color:#515151; display:flex; align-items: center; } .event-view-section .event-view-form .event-view-head .event-share button span::before{content:""; display:block; width:12px; height:12px; background:url(../images/contents/share_ico.png) no-repeat center; margin-right:4px; } .event-view-section .event-view-form .event-view-head .event-share button:hover span{color:#131313;} .event-view-section .event-view-form .event-view-head .event-share button:active span{color:#131313;} .event-view-section .event-view-form .event-view-head .event-share button:hover span::before{background:url(../images/contents/share_ico_on.png) no-repeat center; } .event-view-section .event-view-form .event-view-head .event-share button:active span::before{background:url(../images/contents/share_ico_on.png) no-repeat center; } .event-view-section .event-view-form .event-view-body{width:100%; margin-top:24px; padding:54px 0px 60px 0px; border-top:1px solid #131313; border-bottom:1px solid #ddd;} .event-view-section .event-view-form .event-view-body .cont{} .event-view-section .event-view-form .event-view-body .cont, .event-view-section .event-view-form .event-view-body .cont p, .event-view-section .event-view-form .event-view-body .cont b, .event-view-section .event-view-form .event-view-body .cont strong, .event-view-section .event-view-form .event-view-body .cont span{font-size:16px; font-weight:500; color:#666; line-height:1.5;} .event-view-section .event-view-form .event-view-body .cont img{margin:0 auto;} .event-view-section .event-list-btn{margin-top:50px; width:100%;} .event-view-section .event-list-btn .btn{width:250px; margin:0 auto;} .event-view-section .event-car-lp{width:100%; margin-top:105px;} .event-view-section .event-car-lp .event-car-title{font-size:24px; font-weight:700;margin-bottom:20px;} .event-view-section .event-car-lp .event-car-lp-list{width:100%; padding-top:4px;} .event-view-section .review-comment-form{margin-top:65px;} /* 이벤트 큐레이션 */ .event-curation{width:100%; margin-bottom:38px; } .event-curation .event-tab-form{width:100%;} .event-curation .event-tab-form .event-tab-box{width:100%; display:flex; align-items: center; overflow: hidden;} .event-curation .event-tab-form .event-tab-box .event-tab-con{width:100%; max-width:100%; height:48px; display:flex; align-items: center; justify-content: center; position: relative; background:#f9f9f9; font-size:16px; color:#666; border:1px solid #ddd; cursor:pointer; margin-left:-1px; } .event-curation .event-tab-form .event-tab-box .event-tab-con:first-child{margin-left:0px; border-radius:5px 0px 0px 5px ; } .event-curation .event-tab-form .event-tab-box .event-tab-con:last-child{border-radius:0px 5px 5px 0px ; } .event-curation .event-tab-form .event-tab-box .event-tab-con.active{background:#0061FD; z-index: 1; border:1px solid #0061FD; color:#fff; font-weight: 700; border-right:0px;} .event-curation .curation-title{width:100%; margin-top:25px; font-size:22px; } .event-curation .curation-title span{font-size:22px;} /* 렌트/구독 신청 */ .rent-sign-section{width:620px; margin:50px auto 130px auto;} .rent-sign-section{width:1200px; margin:60px auto 130px auto;} .rent-sign-section .page-title{align-items: center; justify-content: center;} .rent-sign-section .page-title .page-title-txt{flex-direction: column; align-items: center; justify-content: center; height:auto; } .rent-sign-section .page-title .page-title-txt .main-txt{font-size:26px; font-weight:700;} .rent-sign-section .page-title .page-title-txt .sub-txt{font-size:16px; color:#666; margin-top:10px;} .rent-sign-section{width:620px;margin:60px auto 130px auto;} .rent-sign-section .page-title{align-items: center; justify-content: center;} .rent-sign-section .page-title .page-title-txt{flex-direction: column; align-items: center; justify-content: center; height:auto;} .rent-sign-section .page-title .page-title-txt .main-txt{font-weight:700;} .rent-sign-section .page-title .page-title-txt .sub-txt{margin-top:10px; font-size:16px;} .rent-sign-section .rent-sign-sum-form{width:100%; margin-top:40px; margin-bottom:30px; padding:12px 0px; box-sizing:border-box; background:#f9f9f9; } .rent-sign-section .rent-sign-sum-form .rent-sign-sum-txt{ line-height:1.4; font-size:16px; color:#515151; text-align: center; } .rent-sign-section .rent-sign-sum-form .rent-sign-sum-txt span{font-size:16px; color:#515151; font-weight:700;} .rent-sign-section .rent-sign-car-info{width:100%; margin-bottom:8px;} .rent-sign-section .rent-sign-car-info .rent-sign-car-num{height:22px; padding:0 12px; box-sizing:border-box; display:flex; align-items: center; justify-content: center; position: relative; font-size:14px; font-weight:700; color:#579aff; border:1px solid #0061FD; border-radius: 5px; background:#f4f9ff; width: max-content; } .rent-sign-section .rent-sign-car-info .rent-sign-car-num::before{content:""; display:block; width:2px; height:2px; border-radius: 2px; background:#0061FD; position: absolute; left:6px; top:50%; transform: translate( -0, -50% ); } .rent-sign-section .rent-sign-car-info .rent-sign-car-num::after{content:""; display:block; width:2px; height:2px; border-radius: 2px; background:#0061FD; position: absolute; right:6px; top:50%; transform: translate( -0, -50% ); } .rent-sign-section .rent-sign-car-info .rent-sign-car-title{width:100%; display:flex; justify-content: space-between; align-items: flex-end; margin-top:10px;} .rent-sign-section .rent-sign-car-info .rent-sign-car-title .rent-sign-car-model{font-size:24px; font-weight:700; line-height:1.3; width:100%;margin-right:20px;} .rent-sign-section .rent-sign-car-info .rent-sign-car-sum{width:100%; display:flex; align-items: center; margin-top:10px; } .rent-sign-section .rent-sign-car-info .rent-sign-car-sum li{font-size:14px; color:#666; display:flex; align-items: center; } .rent-sign-section .rent-sign-car-info .rent-sign-car-sum li::after{content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#ddd; margin:0 6px; } .rent-sign-section .rent-sign-car-info .rent-sign-car-sum li:last-child::after{display:none;} .rent-sign-section .rent-sign-inpt-form{width:100%;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-require{width:100%;text-align: right; font-size:14px; color:#515151; } .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box{margin-top:16px; border-top:1px solid #131313; box-sizing:border-box;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con{padding:20px 0px; box-sizing:border-box; border-bottom:1px solid #eee; display:flex;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt-title{ width:145px; margin-top:0px; } .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt-title span{font-size:15px; font-weight:500; display:flex; } .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt-title span.require{margin-top:2px;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt-title strong{font-size:14px; color:#515151; font-weight:400; margin-top:7px; display:flex;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt{width:calc( 100% - 145px ); display:flex; align-items: center; flex-wrap: wrap;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .select-box{width:100%;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .select-box .select-choice{height:44px;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .select-box .select-list{top:44px;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .rent-sign-pay-text{font-size:15px; font-weight:700;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .rent-discount{font-size:14px; color:#999; text-decoration: line-through; margin-left:10px;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .phone-type{width:100%; display:flex; align-items: center; margin-top:10px; flex-wrap: wrap;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .phone-type:first-child{margin-top:0px;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .phone-type .input-form{width:345px; margin-right:10px; position: relative;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .phone-type .btn{width:calc( 100% - 355px ); height:44px;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .phone-type .input-form .rent-sign-phoen-delete{width:16px; height:16px; border-radius: 16px; display:none; align-items: center; justify-content: center; background:#ddd; cursor: pointer; position: absolute; right:56px; top:50%; transform: translate( -0, -50% ); } .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .phone-type .input-form .rent-sign-phoen-delete.active{display:flex;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .phone-type .input-form .rent-sign-phoen-count{font-size:14px; font-weight:500; color:#ff3f3f; position: absolute; right:12px; top:50%; transform: translate( -0, -50% ); } .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .phone-num-check{display:none;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .rent-sign-radio-form{width:100%; display:flex; align-items: center; } .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .rent-sign-radio-form .radio-box{margin-right:10px;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .rent-sign-radio-form .radio-box label span{font-size:15px; color:#131313;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt textarea{width:100%; resize:none; height:160px; border:1px solid #ddd; padding:8px 12px; box-sizing:border-box; outline: none; font-size:14px; } .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt textarea:focus{border:1px solid #131313;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .rent-sign-summery-info{margin-top:8px; color:#ff3f3f; font-size:12px; line-height:1.3;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .rent-sign-summery-info span{display:flex; align-items: center; height:22px; color:#ff3f3f; font-size:14px; } .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .rent-deposit-list{width:100%;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .rent-deposit-list li{font-size:15px; padding-left:15px; position: relative; margin-top:8px; } .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .rent-deposit-list li:first-child{margin-top:0px;} .rent-sign-section .rent-sign-inpt-form .rent-sign-inpt-box .rent-sign-inpt-con .rent-sign-inpt .rent-deposit-list li::before{content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#131313; position: absolute; left:4px; top:5px; } .rent-sign-section .rent-sign-policy-form{margin-top:60px; padding-bottom:30px; box-sizing:border-box; border-bottom:1px solid #acacac; } .rent-sign-section .rent-sign-policy-form .title{font-size:18px; font-weight:700; padding-bottom:24px; border-bottom:1px solid #131313; box-sizing:border-box;} .rent-sign-section .rent-sign-policy-form .rent-sign-policy-all{width:100%; height:46px; border-bottom:1px solid #eee; box-sizing:border-box; display: flex; align-items: center;} .rent-sign-section .rent-sign-policy-form .rent-sign-policy-all label span{font-size:15px; font-weight:500;} .rent-sign-section .rent-sign-policy-form .rent-sign-policy-box{width:100%;} .rent-sign-section .rent-sign-policy-form .rent-sign-policy-box .rent-sign-policy-con{width:100%;} .rent-sign-section .rent-sign-policy-form .rent-sign-policy-box .rent-sign-policy-con .rent-sign-policy-title{display:flex; align-items: center; justify-content: space-between; height:46px; } .rent-sign-section .rent-sign-policy-form .rent-sign-policy-box .rent-sign-policy-con .rent-sign-policy-title .policy-arrow{cursor:pointer; transform: rotate(180deg); transition: all 0.2s; } .rent-sign-section .rent-sign-policy-form .rent-sign-policy-box .rent-sign-policy-con.active .rent-sign-policy-title .policy-arrow{transform: rotate(0deg);} .rent-sign-section .rent-sign-policy-form .rent-sign-policy-box .rent-sign-policy-con .policy-summery{width:100%; padding:20px; background:#f9f9f9; max-height:200px; overflow-y: auto; } .rent-sign-section .rent-sign-policy-form .rent-sign-policy-box .rent-sign-policy-con .policy-summery p{font-size:14px; color:#888; line-height:1.4;} .rent-sign-section .rent-sign-policy-form .rent-sign-policy-box .rent-sign-policy-con .policy-summery p.title{font-weight:700; margin-bottom:4px; margin-top:8px;} .rent-sign-section .rent-sign-policy-form .rent-sign-policy-box .rent-sign-policy-con .policy-summery p:first-child{margin-top:0px;} .rent-sign-section .rent-sign-policy-form .rent-sign-policy-box .rent-sign-policy-con .policy-summery .policy-list{width:100%;} .rent-sign-section .rent-sign-policy-form .rent-sign-policy-box .rent-sign-policy-con .policy-summery .policy-list li{display:flex; width:100%; margin-top:12px; } .rent-sign-section .rent-sign-policy-form .rent-sign-policy-box .rent-sign-policy-con .policy-summery .policy-list li:first-child{margin-top:0px;} .rent-sign-section .rent-sign-policy-form .rent-sign-policy-box .rent-sign-policy-con .policy-summery .policy-list li .policy-sum-tit{ width:160px; font-size: 14px; font-weight:700; color:#888; padding-left:16px; box-sizing:border-box; position: relative; } .rent-sign-section .rent-sign-policy-form .rent-sign-policy-box .rent-sign-policy-con .policy-summery .policy-list li .policy-sum-tit::before{content:"";display:block; width:4px; height:4px; border-radius: 4px; background:#888; position: absolute; left:4px; top:4px; } .rent-sign-section .rent-sign-policy-form .rent-sign-policy-box .rent-sign-policy-con .policy-summery .policy-list li .policy-sum-txt{ width:calc( 100% - 180px ); font-weight:400; font-size: 14px; color:#888; margin-left:20px; line-height:1.3; word-break: keep-all; } .rent-sign-section .rent-sign-policy-form .rent-sign-policy-summery{font-size:14px; font-weight:700; color:#888; margin-top:10px;} .rent-sign-section .btn-box{margin-top:40px;} /* 오플 카페 */ .reborn-tv-section{width:100%; padding:10px 0 0px 0; } .reborn-tv-section .page-title{width:1200px; margin: 0 auto;} .reborn-tv-section .page-title .page-title-txt .sub-txt{font-size:14px;} .reborn-tv-section .reborn-tv-form{width:100%; margin-top:24px; background:#f9f9f9; } .reborn-tv-section .reborn-tv-form .channel-form{height:68px; width:100%; background:#2b333e; display:flex;align-items: center; justify-content: center;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box{width:1200px; margin:0 auto; display:flex; align-items: center; justify-content: space-between;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con{width:calc( 100% - 36px ); position: relative; } .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .channel-list-form{width:100%;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .channel-list-form .channel-list-box{width:100%; display:flex; align-items: center;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .channel-list-form .channel-list-box .channel-list-con{margin-right:20px; width:max-content; } .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .channel-list-form .channel-list-box .channel-list-con:last-child{margin-right:0px;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .channel-list-form .channel-list-box .channel-list-con .channel-cont{display:flex; align-items: center; padding:0px 16px 0px 6px; font-size:14px; font-weight:500; color:#fff; background:#474e58; height:44px; border-radius: 44px; } .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .channel-list-form .channel-list-box .channel-list-con .channel-cont.all-channel{padding:0 16px;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .channel-list-form .channel-list-box .channel-list-con .channel-cont.active{background:#0061FD;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .channel-list-form .channel-list-box .channel-list-con .channel-cont img{width:32px; margin-right:6px; border-radius: 32px; } .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .swiper-button-next{width:44px; height:44px; right:0;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .swiper-button-next::after{content:""; position: absolute; right:0; width:22px; height:44px; display:block; background:#2b333e;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .swiper-button-next .channel-arrow{width:44px; height:44px; border-radius: 44px; background:#757f8d url(../images/contents/banner_next_ico.png) no-repeat center; position: relative; z-index: 2;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .swiper-button-prev{width:44px; height:44px; left:0;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .swiper-button-prev::after{content:""; position: absolute; left:0; width:22px; height:44px; display:block; background:#2b333e;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .swiper-button-prev .channel-arrow{width:44px; height:44px; border-radius: 44px; background:#757f8d url(../images/contents/banner_prev_ico.png) no-repeat center; position: relative; z-index: 2;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .swiper-button-next.swiper-button-disabled, .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-con .swiper-button-prev.swiper-button-disabled{opacity: 0;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-more-box{width:20px; margin-left:16px; position: relative; } .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-more-box .channel-more-btn{width:20px; height:20px; display:flex; align-items: center; justify-content: center; opacity:0.2 ; } .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-more-box .channel-more-btn:hover{opacity: 1;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-more-box .channel-all-list-box{width:230px; display:none; z-index: 9; background:#fff; padding:20px; border:1px solid #acacac; position: absolute; top:44px; right: 0; max-height:480px; overflow-y: auto; } .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-more-box .channel-all-list-box .title{font-size:14px; color:#666;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-more-box .channel-all-list-box .all-list{width:100%;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-more-box .channel-all-list-box .all-list .all-list-con{margin-top:10px; display:flex; align-items: center;width:100%;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-more-box .channel-all-list-box .all-list .all-list-con a{display:flex; align-items: center; width:100%;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-more-box .channel-all-list-box .all-list .all-list-con a .ico{margin-right:6px; width:32px;} .reborn-tv-section .reborn-tv-form .channel-form .channel-box .channel-more-box .channel-all-list-box .all-list .all-list-con a .txt{font-size:14px; color:#666; width:calc( 100% - 42px ); word-break: keep-all; line-height:1.3; letter-spacing: -0.5px;} .reborn-tv-section .reborn-tv-visual-form{width:100%; height:310px; background:#191f28; display: flex; align-items: center;} .reborn-tv-section .reborn-tv-visual-form .reborn-tv-visual-box{width:1200px; height:310px; margin:0 auto; display:flex; align-items: center; position: relative;} .reborn-tv-section .reborn-tv-visual-form .reborn-tv-visual-box .visual-list-form{width:100%; display:flex; align-items: center; justify-content: center; height:-webkit-fill-available;} .reborn-tv-section .reborn-tv-visual-form .reborn-tv-visual-box .visual-list-form .visual-list-box{align-items: center; width:100%; transition: all 0.3s; } .reborn-tv-section .reborn-tv-visual-form .reborn-tv-visual-box .visual-list-form .visual-list-box .visual-list-con{width: 28%; margin:0 4%; display:flex; justify-content: center; transition: all 0.3s; position: relative; } .reborn-tv-section .reborn-tv-visual-form .reborn-tv-visual-box .visual-list-form .visual-list-box .visual-list-con.swiper-slide-active{ } .reborn-tv-section .reborn-tv-visual-form .reborn-tv-visual-box .visual-list-form .visual-list-box .visual-list-con a{width:336px; height:188px; border-radius:10px; overflow:hidden; display:flex; align-items: center; justify-content: center; cursor: pointer; position: absolute; left:50%; top:50%; transform: scale(1) translate( -50% , -50%); } .reborn-tv-section .reborn-tv-visual-form .reborn-tv-visual-box .visual-list-form .visual-list-box .visual-list-con.swiper-slide-active a{transform: scale(1.3303571428571) translate( -50% , -50%); left:65%; top:57%; } .reborn-tv-section .reborn-tv-visual-form .reborn-tv-visual-box .visual-list-form .visual-list-box .visual-list-con a img{width:100%;} .reborn-tv-section .reborn-tv-visual-form .reborn-tv-visual-box .swiper-button-next{width:44px; height:44px; border-radius: 44px; background:#fff url(../images/contents/cycle_next.png) no-repeat center; right:-22px; } .reborn-tv-section .reborn-tv-visual-form .reborn-tv-visual-box .swiper-button-next::after{display:none;} .reborn-tv-section .reborn-tv-visual-form .reborn-tv-visual-box .swiper-button-prev{width:44px; height:44px; border-radius: 44px; background:#fff url(../images/contents/cycle_prev.png) no-repeat center; left:-22px; } .reborn-tv-section .reborn-tv-visual-form .reborn-tv-visual-box .swiper-button-prev::after{display:none;} .reborn-tv-section .reborn-tv-visual-form .reborn-tv-visual-box .swiper-pagination{bottom:17px; } .reborn-tv-section .reborn-tv-visual-form .reborn-tv-visual-box .swiper-pagination-bullet{width:4px; height:4px; border-radius: 4px; background:#fff; opacity: 0.2; margin:0 2px; } .reborn-tv-section .reborn-tv-visual-form .reborn-tv-visual-box .swiper-pagination-bullet-active{width:20px; opacity: 1;} .reborn-tv-cont{width:1200px; margin:20px auto 130px auto;} .reborn-tv-cont .reborn-tv-search-form{width:580px; margin:0 auto; position: relative;} .reborn-tv-cont .reborn-tv-search-form .reborn-tv-search-box{width:100%; height:44px; position: relative;} .reborn-tv-cont .reborn-tv-search-form .reborn-tv-search-box .rbtv-search-inpt{width:100%; height:100%; border:1px solid #ddd; outline: none; padding:0 60px 0px 12px; font-size:14px;} .reborn-tv-cont .reborn-tv-search-form .reborn-tv-search-box .rbtv-search-inpt:focus{border:1px solid #131313;} .reborn-tv-cont .reborn-tv-search-form .reborn-tv-search-box .rbtv-search-delete{width:16px; height:16px; border-radius: 16px; display:flex; align-items: center; justify-content: center; background:#ddd; cursor: pointer; position: absolute; right:40px; top:50%; transform: translate(0px, -50%); display: none; } .reborn-tv-cont .reborn-tv-search-form .reborn-tv-search-box .rbtv-search-delete.active{display:flex;} .reborn-tv-cont .reborn-tv-search-form .reborn-tv-search-box .rbtv-search-btn{position: absolute; right:12px; top:50%; transform: translate(0px, -50%);} .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info-box{width:100%; display:flex;} .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info{width:100%;background:#fff; position: absolute; left:0; top:44px; box-shadow:0px 10px 24px rgba(0,0,0,0.08); z-index: 999; border-radius: 0px 0px 25px 25px; display:none; } .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info .rbtv-search-info-box .rbtv-search-info-title{display:flex; align-items: center; justify-content: space-between; height:24px;} .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info .rbtv-search-info-box .rbtv-search-info-title .text{display:flex; align-items: center; font-size:16px; font-weight:700; } .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info .rbtv-search-info-box .rbtv-search-info-title .text img{margin-right:6px;} .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info .rbtv-search-info-box .rbtv-search-info-title .rbtv-research-all-delete{ cursor: pointer; font-size:12px; font-weight:700; color:#666; } .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info .rbtv-search-info-box .rbtv-search-research{width:50%; border-right:1px solid #ddd; box-sizing:border-box; padding:32px 40px;} .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info .rbtv-search-info-box .rbtv-search-research .rbtv-search-research-list{width:100%; padding-top:20px; box-sizing:border-box; } .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info .rbtv-search-info-box .rbtv-search-research .rbtv-search-research-list .rbtv-research-con{ display:flex; align-items: center; justify-content: space-between; padding:5px 0px; } .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info .rbtv-search-info-box .rbtv-search-research .rbtv-search-research-list .rbtv-research-con a{ line-height:14px; font-size: 14px; display:block; width:calc( 100% - 32px ); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info .rbtv-search-info-box .rbtv-search-research .rbtv-search-research-list .rbtv-research-con .rbtv-research-delete{cursor:pointer;height:22px; display:flex; align-items: center; } .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info .rbtv-search-info-box .rbtv-search-research .rbtv-search-research-none{display:flex; flex-direction: column; align-items: center; justify-content: center; height:100%; } .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info .rbtv-search-info-box .rbtv-search-research .rbtv-search-research-none .rbtv-research-none-txt{font-size:16px; color:#666; margin-top:15px; } .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info .rbtv-search-info-box .rbtv-search-recommend{width:50%; box-sizing:border-box; padding:32px 40px;} .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info .rbtv-search-info-box .rbtv-search-recommend .rbtv-search-recommend-list{width:100%; padding-top:20px; box-sizing:border-box; } .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info .rbtv-search-info-box .rbtv-search-recommend .rbtv-search-recommend-list .rbtv-search-recommend-con{ display:flex; align-items: center; justify-content: space-between; padding:5px 0px; height:32px; } .reborn-tv-cont .reborn-tv-search-form .rbtv-search-info .rbtv-search-info-box .rbtv-search-recommend .rbtv-search-recommend-list .rbtv-search-recommend-con a{ line-height:14px; font-size: 14px; display:block; width:calc( 100% - 32px ); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .rbtv-list-form{width:100%; margin-top:20px;} .rbtv-list-form .rbtv-list-box{width:100%; display:flex; flex-wrap: wrap; gap:65px 32px; } .rbtv-list-form .rbtv-list-box .rbtv-list-con{display:block; width:calc( 25% - 24px ); } .rbtv-list-form .rbtv-list-box .rbtv-list-con .rbtv-list-thumnail{width:100%;} .rbtv-list-form .rbtv-list-box .rbtv-list-con .rbtv-list-info{width:100%; margin-top:16px; display:flex;} .rbtv-list-form .rbtv-list-box .rbtv-list-con .rbtv-list-info .rbtv-list-ico{width:32px; margin-right:12px;} .rbtv-list-form .rbtv-list-box .rbtv-list-con .rbtv-list-info .rbtv-list-ico img{border-radius:32px; overflow:hidden;} .rbtv-list-form .rbtv-list-box .rbtv-list-con .rbtv-list-info .rbtv-list-sum{width:calc( 100% - 44px );} .rbtv-list-form .rbtv-list-box .rbtv-list-con .rbtv-list-info .rbtv-list-sum .title{font-size:16px; line-height:1.3;} .rbtv-list-form .rbtv-list-box .rbtv-list-con .rbtv-list-info .rbtv-list-sum .channel-name{font-size:14px; color:#666; margin-top:6px;} .rbtv-list-form .rbtv-list-box .rbtv-list-con .rbtv-list-info .rbtv-list-sum .list-channel-name{font-size:14px; color:#666; margin-top:6px;} .rbtv-line-banner{width:100%; height:75px;} .rbtv-line-banner .rbtv-line-banner-con{width:100%; height:75px; z-index: 9; background:#393c3e;position: fixed; left:0; bottom:0; display:flex; align-items: center; justify-content: center;} .rbtv-line-banner .rbtv-line-banner-con.fixed-none{position: relative;} .rbtv-line-banner .rbtv-line-banner-con .tit{font-size:20px; color:#fff;} .rbtv-line-banner .rbtv-line-banner-con .tit span{font-size:20px; color:#fff; font-weight:700;} .rbtv-line-banner .rbtv-line-banner-con .rbtv-line-banner-btn{margin-left:40px; width:123px; height:45px; border-radius: 45px; background:#fff; display:flex; align-items: center; justify-content: center; font-size:14px; font-weight:700; } .rbtv-search-none-form{width:100%;} .rbtv-search-none-form .rbtv-search-none-box{width:1200px; margin:130px auto 170px auto; display:flex; flex-direction: column; align-items: center; justify-content: center; } .rbtv-search-none-form .rbtv-search-none-box .title{font-size:18px; font-weight:700; margin:20px auto;} .rbtv-search-none-form .rbtv-search-none-box .btn{width:225px; height:53px;} .rbtv-search-title{width:100%; margin-top:20px; font-size:18px; font-weight:700; } .rbtv-search-title span{font-size:18px; font-weight:700; color:#0061FD;} .rbtv-search-title + .rbtv-list-form{margin-top:15px;} /* 채널 정보 */ .rbtv-channel-visual-form{width:100%; margin-top:15px;} .rbtv-channel-visual-form .rbtv-channel-visual-box{width:1200px; margin:0 auto; border:1px solid #ddd;} .rbtv-channel-visual-form .rbtv-channel-visual-box .channel-visual-box{width:100%; height:200px; position: relative; overflow: hidden; border-bottom:1px solid #ddd;} .rbtv-channel-visual-form .rbtv-channel-visual-box .channel-visual-box .channel-visual{position: absolute; left:50%; top:50%; transform: translate( -50%, -50% ); width:auto; max-width:100%;} .rbtv-channel-visual-form .rbtv-channel-visual-box .channel-info-box{background:#fff; padding:24px 40px 20px 40px; display:flex;} .rbtv-channel-visual-form .rbtv-channel-visual-box .channel-info-box .channel-visual-ico{width:60px; height:60px; border-radius: 60px; overflow: hidden; margin-right:30px;} .rbtv-channel-visual-form .rbtv-channel-visual-box .channel-info-box .channel-info-con{width:calc( 100% - 90px ); display:flex; flex-direction: column; justify-content: center;} .rbtv-channel-visual-form .rbtv-channel-visual-box .channel-info-box .channel-info-con .channel-visual-name{font-size:20px; font-weight:700;} .rbtv-channel-visual-form .rbtv-channel-visual-box .channel-info-box .channel-info-con .channel-summery{width:100%; margin-top:8px;} .rbtv-channel-visual-form .rbtv-channel-visual-box .channel-info-box .channel-info-con .channel-summery .channel-visual-summery-txt{font-size:14px; font-weight:500; color:#666; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2;-webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; transition: all 0.4s; white-space:pre-line; } .rbtv-channel-visual-form .rbtv-channel-visual-box .channel-info-box .channel-info-con .channel-summery .channel-visual-summery-txt.more{-webkit-line-clamp:unset; height:auto; transition: all 0.4s; } .rbtv-channel-visual-form .rbtv-channel-visual-box .channel-info-box .channel-info-con .channel-summery .channel-visual-summery-more{margin-top:10px; height:22px; display:flex; font-size:14px; color:#666;} .rbtv-channel-visual-form .rbtv-channel-visual-box .channel-info-box .channel-info-con .channel-summery .channel-visual-summery-more::after{content:""; display:block; width:14px; height:14px; background:url(../images/smartbuy/btn_lp_filter_arrow.png) no-repeat center; margin-left:5px; transform: rotate(180deg); transition: all 0.2s; } .rbtv-channel-visual-form .rbtv-channel-visual-box .channel-info-box .channel-info-con .channel-summery .channel-visual-summery-more.active::after{transform: rotate(0deg); } .rbtv-list-form.channel-vedio-list .rbtv-list-box .rbtv-list-con .rbtv-list-info .rbtv-list-sum{width:100%;} .rbtv-list-form.channel-vedio-list .rbtv-list-box .rbtv-list-con .rbtv-list-info .rbtv-list-sum .channel-name{display:flex; align-items: center;} .rbtv-list-form.channel-vedio-list .rbtv-list-box .rbtv-list-con .rbtv-list-info .rbtv-list-sum .channel-name::before{content:""; display:block; width:20px; height:20px; background:url(../images/contents/tv_youtube_ico.png) no-repeat center; margin-right:6px; } .rbtv-list-form.channel-vedio-list .rbtv-list-box{gap:65px 12px;} .rbtv-list-form.channel-vedio-list .rbtv-list-box .rbtv-list-con{width:calc( 20% - 10px );} .rbtv-list-form.channel-vedio-list .rbtv-list-box .rbtv-list-con .rbtv-list-info .rbtv-list-sum .title{font-size:14px;} .rbtv-list-form.channel-vedio-list .rbtv-list-box .rbtv-list-con .rbtv-list-info .rbtv-list-sum .channel-name{font-size:12px; color:#666;} /* 오플 카페 VIEW 페이지 */ .rbtv-view-form{width:100%; background:#f9f9f9; padding:50px 0px 0px 0px;} .rbtv-view-form .rbtv-view-box{width:1200px; margin:0 auto; margin-bottom:130px; display:flex; gap:0px 20px;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont{width:856px;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-form{width:100%; margin-bottom:50px;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-form iframe{width:100%; height:483px;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info{width:100%; border:1px solid #ddd; border-top:0px; background:#fff; padding:25px 30px 20px 30px; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head{width:100%; display:flex; padding-bottom:17px; border-bottom:1px solid #eee; margin-bottom:17px;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-info{width:calc( 100% - 80px );} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-info .video-title{font-size:20px; font-weight:500; line-height:1.3;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-info .video-info-list{display:flex; align-items: center; margin-top:11px; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-info .video-info-list .video-info-list-con{display:flex; align-items: center;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-info .video-info-list .video-info-list-con::after{content:""; width:1px; height:13px; background:#ddd; margin:0 6px; display:block;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-info .video-info-list .video-info-list-con:last-child::after{display:none;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-info .video-info-list .video-info-list-con span{font-size:14px; font-weight:700; color:#666; display:flex; align-items: center;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-info .video-info-list .video-info-list-con button{font-size:14px; font-weight:700; color:#666; display:flex; align-items: center;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-info .video-info-list .video-info-list-con a{font-size:14px; font-weight:700; color:#666; display:flex; align-items: center;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-info .video-info-list .video-info-list-con.play-count span::before{content:""; display:block; width:18px; height:18px; background: url(../images/contents/rbtv_play_ico.png) no-repeat center; margin-right:2px; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-info .video-info-list .video-info-list-con.favorit-count button::before{content:""; display:block; width:18px; height:18px; background: url(../images/contents/rbtv_favorit_ico.png) no-repeat center; margin-right:2px; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-info .video-info-list .video-info-list-con.favorit-count button.active::before{content:""; display:block; width:18px; height:18px; background: url(../images/contents/rbtv_favorit_ico_on.png) no-repeat center; margin-right:2px; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-info .video-info-list .video-info-list-con.favorit-count button:hover::before{content:""; display:block; width:18px; height:18px; background: url(../images/contents/rbtv_favorit_ico_on.png) no-repeat center; margin-right:2px; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-info .video-info-list .video-info-list-con.comment-count a::before{content:""; display:block; width:18px; height:18px; background: url(../images/contents/rbtv_comment_ico.png) no-repeat center; margin-right:2px; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-share{width:60px; margin-left:20px;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-share button{display:flex; align-items: center; justify-content: center; width:100%; height:32px; border-radius: 32px; border:1px solid #ddd; background:#fff; font-size:12px; color:#515151; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-share button::before{content:""; display:block; width:12px; height:12px; background:url(../images/contents/share_ico.png) no-repeat center; margin-right:4px; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-share button:hover{border:1px solid #131313; color:#131313;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-share button:hover::before{background:url(../images/contents/share_ico_on.png) no-repeat center; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-share button:active{border:1px solid #131313; color:#131313;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-head .video-share button:active::before{background:url(../images/contents/share_ico_on.png) no-repeat center; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-body{width:100%;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-body .video-channel{width:100%; display:flex; align-items: center;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-body .video-channel .channel-name-box{display:flex; align-items: center; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-body .video-channel .channel-name-box::after{content:""; width:1px; height:13px; display:block; background:#ddd; margin:0 8px;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-body .video-channel .channel-name-box .channel-ico{ width:32px; height:32px; border-radius: 32px; overflow: hidden; margin-right:4px; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-body .video-channel .channel-name-box .channel-name{font-size:14px; font-weight:700;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-body .video-channel .channel-total-video{display:flex; align-items: center; font-size:14px; color:#666; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-body .video-channel .channel-total-video::before{content:""; display:block; width:18px; height:18px; background:url(../images/contents/rbtv_totalvideo_ico.png) no-repeat center; margin-right:4px; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-body .video-summery{width:100%; margin-top:13px;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-body .video-summery .video-summary-txt{white-space: pre-line; font-size:16px; color:#666; line-height:1.4; display:-webkit-box; -webkit-line-clamp:1;-webkit-box-orient:vertical; overflow:hidden; text-overflow:ellipsis; transition: all 0.4s; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-body .video-summery .video-summary-txt.more{-webkit-line-clamp:unset;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-body .video-summery .video-summary-more{margin-top:20px; height:22px; display:flex; font-size:14px; color:#666;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-body .video-summery .video-summary-more::after{content:""; display:block; width:14px; height:14px; background:url(../images/smartbuy/btn_lp_filter_arrow.png) no-repeat center; margin-left:10px; transform: rotate(180deg); transition: all 0.2s; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .rbtv-video-info .video-info-body .video-summery .video-summary-more.active::after{transform: rotate(0deg); } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .channel-list-section{width:100%; margin-bottom:70px;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .channel-list-section .channel-list-title{width:100%; display:flex; align-items: flex-end; justify-content: space-between;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .channel-list-section .channel-list-title .title{font-size:18px; font-weight:700;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .channel-list-section .channel-list-title .title span{font-size:18px; font-weight:700; color:#0061FD;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .channel-list-section .channel-list-title a{font-size:14px; font-weight:500; color:#888;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .channel-list-section .rbtv-list-form{width:100%; } .rbtv-view-form .rbtv-view-box .rbtv-view-cont .channel-list-section .rbtv-list-form .rbtv-list-box{width:100%; gap:50px 12px;} .rbtv-view-form .rbtv-view-box .rbtv-view-cont .channel-list-section .rbtv-list-form .rbtv-list-box .rbtv-list-con{width:calc(25% - 9px);} .rbtv-list-form.channel-vedio-list .rbtv-list-box .rbtv-list-con .rbtv-list-info .rbtv-list-sum .list-channel-name{display:flex; align-items: center;} .rbtv-list-form.channel-vedio-list .rbtv-list-box .rbtv-list-con .rbtv-list-info .rbtv-list-sum .list-channel-name::before{content:""; display:block; width:20px; height:20px; background:url(../images/contents/tv_youtube_ico.png) no-repeat center; margin-right:6px; } .rbtv-view-form .rbtv-view-box .rbtv-car-list-form{width:324px; background:#fff; border:1px solid #ddd; height:fit-content;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .rbtv-car-list-box{width:100%; height:50px; padding:0 20px; display:flex; align-items: center; border-bottom:1px solid #ddd;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .rbtv-car-list-box .title{font-size:16px;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form{padding:20px 19px;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-name{font-size:18px; font-weight:700; padding-bottom:5px;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-box{width:100%;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-box .car-list-cont{padding:15px 0px; border-bottom:1px solid #eee;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-box .car-list-cont:nth-child(n + 6) {display: none;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-box.list-more .car-list-cont:nth-child(n + 6) {display: block;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-box .car-list-cont a{width:100%; display:flex; gap:0px 15px; } .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-box .car-list-cont a .car-thumnail{width:90px; height:60px; position: relative; overflow: hidden;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-box .car-list-cont a .car-thumnail img{position: absolute; left:50%; top:50%; transform: translate( -50%, -50% );} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-box .car-list-cont a .car-info{width:181px;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-box .car-list-cont a .car-info .car-name{font-size:14px; line-height:1.3;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-box .car-list-cont a .car-info .car-trim{font-size:14px !important; line-height:1.3;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-box .car-list-cont a .car-info .car-infos{width:100%; display: flex; align-items: center; margin-top:5px;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-box .car-list-cont a .car-info .car-infos li{font-size:12px; color:#888; margin-right:8px;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-box .car-list-cont a .car-info .car-infos li:last-child{margin-right:0px;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-box .car-list-cont a .car-info .car-pay{font-size:14px; margin-top:7px;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .car-list-box .car-list-cont a .car-info .car-pay span{font-size:14px; font-weight:700;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .reborn-tv-car-btn{margin-top:15px;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .reborn-tv-car-btn .btn{width:100%;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .reborn-tv-car-btn .btn.tv-car-list-more span::after{content:""; width:12px; height:8px; display:block; background:url(../images/common/btn_blue_down_arrow.png) no-repeat center; margin-left:6px; } .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .reborn-tv-car-btn .btn.tv-car-more{display:none;} .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .reborn-tv-car-btn .btn.tv-car-more span::after{content:""; width:8px; height:12px; display:block; background:url(../images/common/btn_more_arrow.png) no-repeat center; margin-left:6px; } .rbtv-view-form .rbtv-view-box .rbtv-car-list-form .car-list-form .reborn-tv-car-btn .btn.active{display:flex;} /* 고객센터 */ .csutomer-section{width:1200px; margin:50px auto 130px auto; } .csutomer-section .page-title{justify-content: center;} .csutomer-section .page-title .page-title-txt .main-txt{font-size:36px; font-weight:500;} .csutomer-section .custormer-form{width:100%; margin-top:59px;} .csutomer-section .custormer-form .custormer-main-head{width:100%;} .csutomer-section .custormer-form .custormer-main-head .custormer-cont{width:100%; display:flex; align-items: center; justify-content: space-between;} .csutomer-section .custormer-form .custormer-main-head .custormer-cont .custormer-call{} .csutomer-section .custormer-form .custormer-main-head .custormer-cont .custormer-call .title{font-size:18px; font-weight:700;} .csutomer-section .custormer-form .custormer-main-head .custormer-cont .custormer-call .number{font-size:36px; font-weight:900; margin-top: 13px;} .csutomer-section .custormer-form .custormer-main-head .custormer-cont .custormer-call .time{font-size:15px; font-weight:500; margin-top: 13px; color:#888; display:flex; align-items: center;} .csutomer-section .custormer-form .custormer-main-head .custormer-cont .custormer-call .time::before{content:""; display:block; width:16px; height:16px; background:url(../images/common/ic_footer_time.png) no-repeat center; margin-right:5px; } .csutomer-section .custormer-form .custormer-main-head .custormer-cont .custormer-quick-list{display: flex; align-items: center;} .csutomer-section .custormer-form .custormer-main-head .custormer-cont .custormer-quick-list .custormer-quick-con{display:flex; align-items: center; } .csutomer-section .custormer-form .custormer-main-head .custormer-cont .custormer-quick-list .custormer-quick-con::after{content:""; display:block; width:1px; height:100px; background:#eee; margin:0 50px;} .csutomer-section .custormer-form .custormer-main-head .custormer-cont .custormer-quick-list .custormer-quick-con:last-child::after{display:none;} .csutomer-section .custormer-form .custormer-main-head .custormer-cont .custormer-quick-list .custormer-quick-con .custormer-quick-btn{display:flex; flex-direction: column; align-items: center; justify-content: center;} .csutomer-section .custormer-form .custormer-main-head .custormer-cont .custormer-quick-list .custormer-quick-con .custormer-quick-btn .title{font-size:18px; font-weight:700; margin-top:10px;} .csutomer-section .custormer-form .custormer-main-head .custormer-partner{width:100%; margin-top:35px; display:flex; align-items: center; height:80px; background:#f9f9f9;} .csutomer-section .custormer-form .custormer-main-head .custormer-partner .custormer-partner-con{width:33.33%; padding:0 20px; display:flex; align-items: center; justify-content: space-between; position: relative; } .csutomer-section .custormer-form .custormer-main-head .custormer-partner .custormer-partner-con::after{content:""; display:block; width:1px; height:40px; background:#eee; position: absolute; right:0px; top:50%; transform: translate( 0, -50% ); } .csutomer-section .custormer-form .custormer-main-head .custormer-partner .custormer-partner-con:last-child::after{display:none;} .csutomer-section .custormer-form .custormer-main-head .custormer-partner .custormer-partner-con a{display:flex; align-items: center; position: relative; width:100%; } .csutomer-section .custormer-form .custormer-main-head .custormer-partner .custormer-partner-con a span{font-size:14px; font-weight:700; } .csutomer-section .custormer-form .custormer-main-head .custormer-partner .custormer-partner-con a::before{content:""; display:block; width:44px; height:44px; border-radius: 44px; margin-right:10px; } .csutomer-section .custormer-form .custormer-main-head .custormer-partner .custormer-partner-con a::after{content:">"; font-size:14px; font-weight:700; color:#333; position: absolute; right:0; top:50%; transform: translate( -0, -50% ); } .csutomer-section .custormer-form .custormer-main-head .custormer-partner .custormer-partner-con a.custormer-partner01::before{background:#fff url(../images/contents/custormer_ico05.png) no-repeat center;} .csutomer-section .custormer-form .custormer-main-head .custormer-partner .custormer-partner-con a.custormer-partner02::before{background:#fff url(../images/contents/custormer_ico06.png) no-repeat center;} .csutomer-section .custormer-form .custormer-main-head .custormer-partner .custormer-partner-con a.custormer-partner03::before{background:#fff url(../images/contents/custormer_ico07.png) no-repeat center;} .csutomer-section .custormer-form .custormer-main-box{width:100%; margin-top:80px;} .csutomer-section .custormer-form .custormer-main-box .custormer-main-title{width:100%; display:flex; align-items: center; justify-content: space-between; margin-bottom:18px;} .csutomer-section .custormer-form .custormer-main-box .custormer-main-title .title{font-size:18px; font-weight:700;} .csutomer-section .custormer-form .custormer-main-box .custormer-main-title .arrow-btn{font-size:14px; font-weight:500; color:#888;} /* faq 공통 */ .faq-form{width:100%; border-top:1px solid #131313;} .faq-form .faq-box{width:100%;} .faq-form .faq-box .faq-con{width:100%;} .faq-form .faq-box .faq-con .faq-haed{width:100%; height:64px; border-bottom:1px solid #eee; display:flex; align-items: center; justify-content: space-between; padding:0 15px 0 16px; cursor: pointer; } .faq-form .faq-box .faq-con .faq-haed .faq-title-box{display:flex; align-items: center; width: calc( 100% - 38px );} .faq-form .faq-box .faq-con .faq-haed .faq-title-box .faq-status{width:108px; font-size:16px; color:#333;} .faq-form .faq-box .faq-con .faq-haed .faq-title-box .faq-title{width:100%; display:flex; align-items: center; } .faq-form .faq-box .faq-con .faq-haed .faq-title-box .faq-title span{display:flex; max-width:100%; display:flex; align-items: center; font-size: 16px; color:#333; } .faq-form .faq-box .faq-con .faq-haed .faq-title-box .faq-title::before{content:"Q"; font-size:16px; font-weight:800; display: block; margin-right:12px; } .faq-form .faq-box .faq-con .faq-haed .faq-title-box .faq-status + .faq-title{width:calc( 100% - 108px );} .faq-form .faq-box .faq-con .faq-haed .faq-arrow{transform: rotate(0deg); transition: all 0.2s;} .faq-form .faq-box .faq-con .faq-haed:hover .faq-title-box .faq-title span{text-decoration: underline; color:#131313;} .faq-form .faq-box .faq-con .faq-haed.active .faq-title-box .faq-title span{font-weight:700; color:#131313;} .faq-form .faq-box .faq-con .faq-haed.active .faq-arrow{transform: rotate(180deg); transition: all 0.2s;} .faq-form .faq-box .faq-con .faq-summary-box{width:100%; padding:30px 40px; background:#f9f9f9; font-size:15px; font-weight:500; color:#666; line-height:1.4; border-bottom:1px solid #eee; display:none; } .faq-form .faq-box .faq-con .faq-summary-box p{font-size:15px;font-weight:500; color:#666; line-height:1.4;} .faq-form .faq-box .faq-con .faq-summary-box strong{font-size:15px;font-weight:500; color:#666; line-height:1.4;} .faq-form .faq-box .faq-con .faq-summary-box b{font-size:15px;font-weight:500; color:#666; line-height:1.4;} .faq-form .faq-box .faq-con .faq-summary-box span{font-size:15px;font-weight:500; color:#666; line-height:1.4;} .faq-form .faq-box .faq-con .faq-summary-box a{font-size:15px;font-weight:700; color:#131313; line-height:1.4;} .faq-section .faq-form .faq-box .faq-con .faq-summary-box{padding-left:150px;} /* 공지사항 공통 */ .notice-form{width:100%; border-top:1px solid #131313;} .notice-form .notice-head{width:100%; display:flex; align-items: center; border-bottom:1px solid #acacac; height:64px; padding:0 20px; } .notice-form .notice-head li{font-size:16px; font-weight:700; color:#333;} .notice-form .notice-head .notice-number{width:45px; text-align: center; margin-right:35px; } .notice-form .notice-head .notice-title{ width:calc( 100% - 232px ); text-align: center; } .notice-form .notice-head .notice-date{width:92px; text-align: center; margin-left:60px;} .notice-form .notice-box{width:100%;} .notice-form .notice-box .notice-con{width:100%; display:flex; align-items: center; justify-content: space-between; height:64px; border-bottom:1px solid #eee; padding:0 15px 0 16px; } .notice-form .notice-box .notice-con .notice-number{width:45px; text-align: center; margin-right:35px; } .notice-form .notice-box .notice-con .notice-number span{display:flex; align-items: center; justify-content: center; width:100%; height:28px; font-size:14px; } .notice-form .notice-box .notice-con .notice-number span.important{width:45px; height:28px; border-radius: 28px; border:1px solid #0061FD; color:#0061FD; font-weight:700; } .notice-form .notice-box .notice-con .notice-number span.notice{width:45px; height:28px; border-radius: 28px; border:1px solid #131313; color:#131313; font-weight:700; } .notice-form .notice-box .notice-con .notice-title{ width:calc( 100% - 172px ); display:flex; align-items: center; } .notice-form .notice-box .notice-con .notice-title a{font-size:16px; color:#333; display:block; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .notice-form .notice-box .notice-con .notice-title a:hover{text-decoration: underline; color:#131313;} .notice-form .notice-box .notice-con .notice-date{width:92px; text-align: center; margin-left:60px; font-size:16px; color:#888; letter-spacing:-0.5px;} .notice-form .notice-box .notice-con .notice-title.new::after{content:"N"; display:flex; align-items: center; justify-content: center; width:16px; height:16px; border-radius: 16px; background:#131313; color:#fff; font-size:10px; margin-left:6px; } .notice-form .notice-box .notice-con .notice-number + .notice-title{width:calc( 100% - 232px ); } /* 카톡 친추 */ .custormer-kakao-step{width:100%; border-top:1px solid #131313; padding-top:58px;} .custormer-kakao-step .kakao-step-list{width:100%; padding:50px; border-radius: 10px; border:1px solid #eee; display:flex; justify-content: space-between; } .custormer-kakao-step .kakao-step-list .kakao-step{position: relative; display:flex; flex-direction: column; align-items: center; } .custormer-kakao-step .kakao-step-list .kakao-step::after{content:""; display:block; width:6px; height:12px; background:url(../images/contents/kakao_step_arrow.png) no-repeat center; position: absolute; right:-33px; top:50%; transform: translate( -0, -50% ); } .custormer-kakao-step .kakao-step-list .kakao-step:last-child::after{display:none;} .custormer-kakao-step .kakao-step-list .kakao-step .step-bage{ width:70px; height:36px; border-radius: 36px; background:#0061FD; color:#fff; display:flex; align-items: center; justify-content: center; font-size:14px; font-weight:700; } .custormer-kakao-step .kakao-step-list .kakao-step .step-img{margin-top:26px;} .custormer-kakao-step .kakao-step-list .kakao-step .step-title{text-align: center; margin-top:26px; font-size:14px; font-weight:700; line-height:1.5; } .custormer-kakao-step .kakao-step-list .kakao-step .step-title span{font-size:14px; font-weight:700; color:#0061FD;} .faq-section{width:1200px; margin:90px auto 130px auto; } .faq-section .page-title{padding-top:0px;} .faq-section .page-title .page-title-txt .main-txt{font-size:24px; font-weight:700;} .faq-section .page-title .page-title-txt .sub-txt{font-size:14px; font-weight:500;} .faq-section .custormer-form{margin-top:24px;} .faq-section .custormer-form .faq-search-form{width:100%; padding:30px 0px; border-radius: 5px; background:#f9f9f9; } .faq-section .custormer-form .faq-search-form .faq-search-box{width:560px; height:44px; position: relative; margin:0 auto; } .faq-section .custormer-form .faq-search-form .faq-search-box .faq-inpt{width:100%; height:100%; border:1px solid #ddd; outline: none; padding:0 60px 0 12px; font-size:14px;} .faq-section .custormer-form .faq-search-form .faq-search-box .faq-inpt:focus{border:1px solid #131313;} .faq-section .custormer-form .faq-search-form .faq-search-box .faq-search-delete{width:16px; height:16px; border-radius: 16px; display:flex; align-items: center; justify-content: center; background:#ddd; cursor: pointer; position: absolute; right:40px; top:50%; transform: translate(0px, -50%); display: none; } .faq-section .custormer-form .faq-search-form .faq-search-box .faq-search-delete.active{display:flex;} .faq-section .custormer-form .faq-search-form .faq-search-box .faq-search-btn{position: absolute; right:12px; top:50%; transform: translate(0px, -50%);} .faq-section .faq-filter-form{width:100%; margin-top:30px;} .faq-section .faq-filter-form .faq-filter-box{width:100%; display:flex; align-items: center; gap:0px 10px;} .faq-section .faq-filter-form .faq-filter-box .faq-filter-con{} .faq-section .faq-filter-form .faq-filter-box .faq-filter-con input[type='checkbox']{display:none;} .faq-section .faq-filter-form .faq-filter-box .faq-filter-con input[type='checkbox'] + label{display:flex; align-items: center; height:44px; padding:0 10px; background:#fff; border:1px solid #ddd; border-radius: 2px; cursor: pointer; position: relative; } .faq-section .faq-filter-form .faq-filter-box .faq-filter-con input[type='checkbox'] + label span{font-size:16px; color:#515151; } .faq-section .faq-filter-form .faq-filter-box .faq-filter-con input[type='checkbox']:checked + label{border:1px solid #131313; } .faq-section .faq-filter-form .faq-filter-box .faq-filter-con input[type='checkbox']:checked + label span{color:#131313;} .faq-section .faq-filter-form .faq-filter-box .faq-filter-con input[type='checkbox']:checked + label::before{content:""; display:block; width:18px; height:18px; border-radius: 18px; background:#333 url(../images/common/ico_chk_on.png) no-repeat center; position: absolute; right:-8px; top:-8px; } .faq-section .faq-filter-form .faq-filter-box .faq-filter-con input[type='radio']{display:none;} .faq-section .faq-filter-form .faq-filter-box .faq-filter-con input[type='radio'] + label{display:flex; align-items: center; height:44px; padding:0 10px; background:#fff; border:1px solid #ddd; border-radius: 2px; cursor: pointer; position: relative; } .faq-section .faq-filter-form .faq-filter-box .faq-filter-con input[type='radio'] + label span{font-size:16px; color:#515151; } .faq-section .faq-filter-form .faq-filter-box .faq-filter-con input[type='radio']:checked + label{border:1px solid #131313; } .faq-section .faq-filter-form .faq-filter-box .faq-filter-con input[type='radio']:checked + label span{color:#131313;} .faq-section .faq-filter-form .faq-filter-box .faq-filter-con input[type='radio']:checked + label::before{content:""; display:block; width:18px; height:18px; border-radius: 18px; background:#333 url(../images/common/ico_chk_on.png) no-repeat center; position: absolute; right:-8px; top:-8px; } .faq-section .faq-form{margin-top:36px;} .faq-section .pagination{margin-top:50px;} .faq-section .notice-search-form{width:100%; display:flex; justify-content: space-between; padding-bottom:12px; border-bottom:1px solid #131313; } .faq-section .notice-search-form .notice-total-box{} .faq-section .notice-search-form .notice-total-box .list-total{font-size:18px; font-weight:700; display:flex; align-items: center; height:34px;} .faq-section .notice-search-form .notice-total-box .list-total span{font-size:16px; margin-left:6px; font-weight:400; } .faq-section .notice-search-form .notice-total-box .list-total span strong{font-size:16px; font-weight:700;} .faq-section .notice-search-form .notice-total-box .search-total{display:flex; align-items: center; height:26px; font-size:18px; font-weight:700;} .faq-section .notice-search-form .notice-total-box .search-total span{color:#0061FD; font-size:18px; font-weight:700;} .faq-section .notice-search-form .notice-search-box{width:280px; height:40px; position: relative; } .faq-section .notice-search-form .notice-search-box .notice-inpt{width:100%; height:100%; border:1px solid #ddd; outline: none; padding:0 60px 0 12px; font-size:14px;} .faq-section .notice-search-form .notice-search-box .notice-inpt:focus{border:1px solid #131313;} .faq-section .notice-search-form .notice-search-box .notice-search-delete{width:16px; height:16px; border-radius: 16px; display:flex; align-items: center; justify-content: center; background:#ddd; cursor: pointer; position: absolute; right:40px; top:50%; transform: translate(0px, -50%); display: none; } .faq-section .notice-search-form .notice-search-box .notice-search-delete.active{display:flex;} .faq-section .notice-search-form .notice-search-box .notice-search-btn{position: absolute; right:12px; top:50%; transform: translate(0px, -50%);} .faq-section .notice-form{border-top:0px;} /* 공통 검색 결과 없음 */ .search-none-form{width:100%;} .search-none-form .search-none-box{ width:100%; max-width:1200px; margin:150px auto 150px auto; display:flex; flex-direction: column; align-items: center; justify-content: center; } .search-none-form .search-none-box .title{font-size:18px; font-weight:700; margin:20px auto 0 auto;} .search-none-form .search-none-box .txt{font-size:14px; color:#888; margin:10px auto 0 auto;} .search-none-form .search-none-box .btn{width:225px; height:53px; margin-top:20px;} /* 공지사항 상세페이지 */ .notice-view-section{width:1200px; margin:40px auto 130px auto; } .notice-view-section .notice-view-form{width:100%;} .notice-view-section .notice-view-form .notice-view-head{width:100%; padding-bottom:24px; border-bottom:1px solid #131313;} .notice-view-section .notice-view-form .notice-view-head .notice-bage-box{margin-bottom:20px; display:flex; align-items: center; gap: 0 8px;} .notice-view-section .notice-view-form .notice-view-head .notice-bage-box span{display:flex; align-items: center; justify-content: center; width:45px; height:28px; border-radius: 28px; font-size:14px; font-weight:700; } .notice-view-section .notice-view-form .notice-view-head .notice-bage-box span.important{border:1px solid #0061FD; color:#0061FD;} .notice-view-section .notice-view-form .notice-view-head .notice-bage-box span.notice{border:1px solid #131313; color:#131313;} .notice-view-section .notice-view-form .notice-view-head .notice-info{width:100%; display:flex; align-items: flex-end; gap:0px 40px; } .notice-view-section .notice-view-form .notice-view-head .notice-info .notice-title-box{width:1100px;} .notice-view-section .notice-view-form .notice-view-head .notice-info .notice-title-box .notice-title{font-size:30px; font-weight:500; line-height:1.3;} .notice-view-section .notice-view-form .notice-view-head .notice-info .notice-title-box .notice-date{margin-top:12px; font-size:14px; color:#666; font-weight:700; display:flex; align-items: center; } .notice-view-section .notice-view-form .notice-view-head .notice-info .notice-title-box .notice-date span{font-size:14px; font-weight:400; color:#666; margin-left:6px;} .notice-view-section .notice-view-form .notice-view-body{width:100%; padding:50px 0px;} .notice-view-section .notice-view-form .notice-view-body .notice-summary{width:100%;} .notice-view-section .notice-view-form .notice-view-body .notice-summary, .notice-view-section .notice-view-form .notice-view-body .notice-summary p, .notice-view-section .notice-view-form .notice-view-body .notice-summary span, .notice-view-section .notice-view-form .notice-view-body .notice-summary b, .notice-view-section .notice-view-form .notice-view-body .notice-summary strong{font-size:16px; color:#333; line-height:1.4;} .notice-view-section .notice-view-form .notice-view-body .notice-file{width:100%; display:flex; align-items: center; justify-content: flex-end; } .notice-view-section .notice-view-form .notice-view-body .notice-file .file-down{font-size:16px; color:#888; display:flex; align-items: center; margin-top:50px;} .notice-view-section .notice-view-form .notice-view-body .notice-file .file-down::before{content:""; display:block; width:24px; height:24px; margin-right:4px; background:url(../images/contents/file_down_ico.png) no-repeat center; } .notice-view-section .notice-view-form .notice-view-ft{width:100%; } .notice-view-section .notice-view-form .notice-view-ft .notice-view-list{width:100%; border-top:1px solid #ddd; } .notice-view-section .notice-view-form .notice-view-ft .notice-view-list .notice-view-list-con{width:100%; display:flex; border-bottom:1px solid #ddd; align-items: center; height:64px; padding:0 20px;} .notice-view-section .notice-view-form .notice-view-ft .notice-view-list .notice-view-list-con .title{width:97px; height:32px; display:flex; align-items: center; justify-content: center; font-size:16px; color:#515151; margin-right:48px; } .notice-view-section .notice-view-form .notice-view-ft .notice-view-list .notice-view-list-con .title::after{content:""; display:block; width:16px; height:16px; background:url(../images/contents/faq_arrow.png) no-repeat center; margin-left:10px; } .notice-view-section .notice-view-form .notice-view-ft .notice-view-list .notice-view-list-con.prev .title::after{transform: rotate(180deg);} .notice-view-section .notice-view-form .notice-view-ft .notice-view-list .notice-view-list-con .txt{width:calc( 100% - 145px ); font-size:16px; color:#333; } .notice-view-section .notice-view-form .notice-view-ft .notice-view-list .notice-view-list-con .txt a{display:block; max-width:100%; white-space: nowrap; overflow:hidden; text-overflow: ellipsis; font-size:16px; color:#333; } .notice-view-section .notice-view-form .notice-view-ft .btn-box{margin-top:50px;} .notice-view-section .notice-view-form .notice-view-ft .btn-box .btn{width:250px;} /* 금융상품 담당자 */ .finance-manager{width:1200px; margin:50px auto 130px auto;} .finance-manager .page-title .page-title-txt .main-txt{font-size:24px; font-weight:700;} .finance-manager .finance-manager-form{width:100%; margin-top:40px;} .finance-manager .finance-manager-form .finance-manager-bn{width:100%; height:100px; display:flex; align-items: center; padding:0 36px; background:url(../images/contents/finance_mamger_bn.png) no-repeat center;} .finance-manager .finance-manager-form .finance-manager-bn .txt{font-size:18px; } .finance-manager .finance-manager-form .finance-manager-box{width:100%; margin-top:50px; border-top:1px solid #131313;} .finance-manager .finance-manager-form .finance-manager-box .finance-manager-con{height:84px; display:flex; align-items: center; border-bottom:1px solid #eee; } .finance-manager .finance-manager-form .finance-manager-box .finance-manager-con .title{width:290px; font-size:15px; font-weight:500;} .finance-manager .finance-manager-form .finance-manager-box .finance-manager-con .cont{width: calc( 100% - 290px ); display:flex; align-items: center;} .finance-manager .finance-manager-form .finance-manager-box .finance-manager-con .cont .radio-box{margin-right:30px;} .finance-manager .finance-manager-form .finance-manager-box .finance-manager-con .cont .radio-box:last-child{margin-right:0px;} .finance-manager .finance-manager-form .finance-manager-box .finance-manager-con .cont .radio-box label span{font-size:15px;} .finance-manager .finance-manager-form .finance-manager-box .finance-manager-con .cont .finance-manager-inpt{width:310px; height:44px; padding:0 12px; border:1px solid #ddd; outline: none; font-size:14px; } .finance-manager .finance-manager-form .finance-manager-box .finance-manager-con .cont .finance-manager-inpt:focus{border:1px solid #131313;} .finance-manager .finance-manager-form .btn-box{margin-top:30px;} .finance-manager .finance-manager-form .finance-manager-summary{width:100%; margin-top:30px;} .finance-manager .finance-manager-form .finance-manager-summary .title{display:flex; align-items: center; font-size:18px; font-weight:700; } .finance-manager .finance-manager-form .finance-manager-summary .title::before{content:""; display:block; width:20px; height:20px; background:url(../images/contents/review_care_ico.png) no-repeat center; margin-right:8px; } .finance-manager .finance-manager-form .finance-manager-summary .summary-list{width:100%; margin-top:16px;} .finance-manager .finance-manager-form .finance-manager-summary .summary-list li{font-size:14px; color:#666; padding-left:15px; position: relative; margin-top:10px; display:flex; align-items: center;} .finance-manager .finance-manager-form .finance-manager-summary .summary-list li:first-child{margin-top:0px;} .finance-manager .finance-manager-form .finance-manager-summary .summary-list li::before{content:""; display:block; width:3px; height:3px; background:#999; border-radius: 3px; position: absolute; left:4px; top:7px; } .finance-manager .finance-manager-form .finance-manager-summary .summary-list li a{display:flex; width:68px; height:20px; display:flex; align-items: center; justify-content: center; font-size:12px; font-weight:700; border-radius: 4px; background:#f6f6f6; margin-left:8px; } .finance-manager .finance-manager-form .finance-manager-summary .summary-list li a::before{content:""; display:block; width:20px; height:20px; background:url(../images/contents/link_ico_s.png) no-repeat center; } /* 금융상품 담당자 팝업 */ #financeManagerPop{display:none;} #financeManagerPop .layer-pop-body{padding:0px;} #financeManagerPop .layer-pop-body .finance-manager-form{width:100%; height:297px; display:flex; flex-direction: column; align-items: center; justify-content: center; } #financeManagerPop .layer-pop-body .finance-manager-form .finance-manager-title{font-size:16px; font-weight:700; } #financeManagerPop .layer-pop-body .finance-manager-form .finance-manager-txt{font-size:16px; color:#888; margin-top:10px; } #financeManagerPop .layer-pop-body .finance-manager-form .finance-manager-info{width:100%; display:flex; align-items: center; justify-content: space-between; margin-top:30px; border-top:1px solid #eee; border-bottom:1px solid #eee; padding:20px 31px; background:#f9f9f9; } #financeManagerPop .layer-pop-body .finance-manager-form .finance-manager-info .info-list{} #financeManagerPop .layer-pop-body .finance-manager-form .finance-manager-info .info-list .info-con{display:flex; align-items: center;margin-top:10px;} #financeManagerPop .layer-pop-body .finance-manager-form .finance-manager-info .info-list .info-con:first-child{margin-top:0px;} #financeManagerPop .layer-pop-body .finance-manager-form .finance-manager-info .info-list .info-con .title{width:91px; margin-right:20px; font-size:15px; font-weight:700;} #financeManagerPop .layer-pop-body .finance-manager-form .finance-manager-info .info-list .info-con .txt{ font-size:15px;} #financeManagerPop .layer-pop-body .finance-manager-form .finance-manager-info .info-photo{max-width:83px;} #financeManagerPop .layer-pop-body .finance-manager-none{width:100%; height:297px; display:flex; flex-direction: column; align-items: center; justify-content: center; } #financeManagerPop .layer-pop-body .finance-manager-none .txt{font-size:16px; color:#666; line-height:1.4; text-align: center; margin-top:13px;} /* 마이페이지 */ .mypage{width:100%; margin:90px 0px 130px 0px;} .mypage .mypage-form{width:1200px; margin:0 auto; display:flex; gap:0px 50px;} .mypage .mypage-form .mypage-lnb{width:250px;} .mypage .mypage-form .mypage-lnb .lnb-title{font-size:24px; font-weight:700;} .mypage .mypage-form .mypage-lnb .lnb-list{margin-top:36px;} .mypage .mypage-form .mypage-lnb .lnb-list .lnb-list-con{margin-top:16px;} .mypage .mypage-form .mypage-lnb .lnb-list .lnb-list-con:first-child{margin-top:0px;} .mypage .mypage-form .mypage-lnb .lnb-list .lnb-list-con a{display:flex; align-items: center; width:100%; height:32px; font-size:16px; color:#666; position: relative; } .mypage .mypage-form .mypage-lnb .lnb-list .lnb-list-con.active a{padding-left:14px; font-size:16px; font-weight:700; color:#131313;} .mypage .mypage-form .mypage-lnb .lnb-list .lnb-list-con.active a::before{content:""; display:block; width:4px; height:16px; background:#131313; position: absolute; left:0; top:50%; transform: translate( -0, -50% ); } .mypage .mypage-form .mypage-box{width:900px;} /* 마이페이지 - 나의 현황 */ .mypage .mypage-form .mypage-box .mypage-head{width:100%; display:flex; align-items: center; justify-content: space-between; height:160px; background:#f9f9f9; padding:0 40px; border-radius: 8px;} .mypage .mypage-form .mypage-box .mypage-head .mypage-haed-user{} .mypage .mypage-form .mypage-box .mypage-head .mypage-haed-user .user-info-modify a{font-size:16px; color:#666;} .mypage .mypage-form .mypage-box .mypage-head .mypage-haed-user .user-name{font-size:24px; font-weight:700; margin-top:8px;} .mypage .mypage-form .mypage-box .mypage-head .mypage-haed-list{} .mypage .mypage-form .mypage-box .mypage-head .mypage-haed-list .count-list{display:flex; align-items: center;} .mypage .mypage-form .mypage-box .mypage-head .mypage-haed-list .count-list .count-list-con{display:flex; align-items: center;} .mypage .mypage-form .mypage-box .mypage-head .mypage-haed-list .count-list .count-list-con::after{content:""; display:block; width:1px; height:32px; background:#ddd; margin:0 20px; } .mypage .mypage-form .mypage-box .mypage-head .mypage-haed-list .count-list .count-list-con:last-child::after{display:none;} .mypage .mypage-form .mypage-box .mypage-head .mypage-haed-list .count-list .count-list-con a{display:flex; flex-direction: column; width:72px; align-items: center; justify-content: center; } .mypage .mypage-form .mypage-box .mypage-head .mypage-haed-list .count-list .count-list-con a .count-ico{position: relative;} .mypage .mypage-form .mypage-box .mypage-head .mypage-haed-list .count-list .count-list-con a .count-txt{font-size:14px; color:#888; height:22px; display:flex; align-items: center;} .mypage .mypage-form .mypage-box .mypage-head .mypage-haed-list .count-list .count-list-con a .count-num{font-size:30px; font-weight:700; color:#0061FD;height:38px; display:flex; align-items: center;} .mypage .mypage-form .mypage-box .mypage-head .mypage-haed-list .count-list .count-list-con.new a .count-ico::before{content:""; display:block; width:4px; height:4px; border-radius: 4px; background:#0061FD; position: absolute; top:8px; right:8px; } .mypage .mypage-form .mypage-box .mypage-main-form .search-none-form .search-none-box{margin:40px 0px;} .mypage .mypage-form .mypage-box .mypage-main-form .search-none-form .search-none-box .txt{text-align: center; line-height:1.3;} .mypage .search-none-form .search-none-box .btn{width:auto; padding:0 60px;} .mypage .mypage-form .mypage-box .mypage-main-form{width:100%; display:flex; gap:0px 80px; margin-top:50px;} .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box{width:100%;} .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box.wd50{width:calc( 50% - 40px );} .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-title{width:100%; padding-bottom:18px; border-bottom:1px solid #131313; display:flex; justify-content: space-between; align-items: center;} .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-title .title-box{display:flex; align-items: flex-end; } .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-title .title-box .title{font-size:18px; font-weight:700;} .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-title .title-box .sub-title{margin-left:10px; font-size:14px; font-weight:500; color:#666;} .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-title .more{font-size:14px; color:#888; font-weight:500;} .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con{width:100%;} .mypage .mypage-tbl{width:100%;} .mypage .mypage-tbl .mypage-tbl-head{width:100%; display:flex; align-items: center; height:64px; border-bottom:1px solid #acacac; } .mypage .mypage-tbl .mypage-tbl-head li{font-size:16px; font-weight:700; text-align: center;} .mypage .mypage-tbl .mypage-tbl-head li:nth-child(1){width:100px;} .mypage .mypage-tbl .mypage-tbl-head li:nth-child(2){width:510px;} .mypage .mypage-tbl .mypage-tbl-head li:nth-child(3){width:290px;} .mypage .mypage-tbl .mypage-tbl-body{width:100%;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con{width:100%; display:flex; align-items: center; border-bottom:1px solid #eee; padding:20px 0px;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .date-con{width:100px; padding:0 10px; text-align: center; font-size:14px; letter-spacing: -0.5px;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con{width:510px; padding:0 10px; display:flex; align-items: center; cursor:pointer;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con .buy-thumnail{width:136px; height:102px; position: relative; overflow: hidden;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con.rent .info-con .buy-thumnail::before{content:"렌트"; width:32px; height:20px; display:flex; align-items: center; justify-content: center; background:#fff; border:1px solid #0061FD; font-size:12px; font-weight:500; color:#0061FD; position: absolute; left:0; top:0; z-index: 1; } .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con.lease .info-con .buy-thumnail::before{content:"구독"; width:32px; height:20px; display:flex; align-items: center; justify-content: center; background:#0061FD; border:1px solid #0061FD; font-size:12px; font-weight:500; color:#fff; position: absolute; left:0; top:0; z-index: 1; } .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con .buy-info{ margin-left:20px; width:calc( 100% - 156px ); } .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con .buy-info .buy-info-name{width:100%;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con .buy-info .buy-info-name .car-name{font-size:16px; line-height:1.3;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con .buy-info .buy-info-name .car-trim{font-size:16px !important; line-height:1.3; margin-top:2px; } .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con .buy-info .buy-info-list{width:100%; padding:4px 0px; display:flex; align-items: center; flex-wrap: wrap; gap:5px 10px; } .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con .buy-info .buy-info-list li{font-size:12px; color:#888; height:16px; align-items: center;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con .buy-info .buy-pay{font-size:18px; margin-top:4px; display:flex; align-items: center;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con .buy-info .buy-pay span{font-size:18px; font-weight:700;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con .buy-info .buy-pay span + span{display:flex; align-items: center;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con .buy-info .buy-pay span + span::before{content:""; display:block; width:1px; height:14px; background:#ddd; margin:0 8px; } .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .status-con{width:290px; padding:0 10px; } .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .status-con .status-title{font-size:18px; font-weight:700; text-align: center; word-break: keep-all; line-height: 1.4;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .status-con .status-txt{font-size:14px; color:#666; margin-top:6px; text-align: center; line-height:1.4; word-break:keep-all;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .status-con .status-btn-box{margin-top:15px; display:flex; align-items: center; gap:0px 5px; } .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .status-con .status-btn-box .btn{width:100%; max-width:100%; height:40px;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .status-con .status-btn-box .btn span{font-size:14px; font-weight:500;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .status-con .status-btn-box .btn.btn-navy{background:#2e3546;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .status-con .status-btn-box .btn.btn-navy span{color:#fff; font-size:13px; line-height:1.2; font-weight:700;text-align: center;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con .sell-info-list{width:100%; display:flex; flex-direction:column; gap:6px 0px; } .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con .sell-info-list .sell-info-con{display:flex; gap:0px 20px;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con .sell-info-list .sell-info-con .tit{font-size:14px; color:#666; width:50px;} .mypage .mypage-tbl .mypage-tbl-body .mypage-tbl-con .info-con .sell-info-list .sell-info-con .txt{width:calc( 100% - 70px ); font-size:14px; font-weight:500; line-height:1.4; display: -webkit-box; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con .notice-list-box{width:100%;padding:20px 0px;} .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con .notice-list-box .notice-list{display:flex; flex-direction: column; gap:32px 0px; } .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con .notice-list-box .notice-list .notice-con{width:100%; display:flex; align-items: center; height:24px; } .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con .notice-list-box .notice-list .notice-con .notice-bage{width:58px; height:20px; border-radius: 20px; background:#e3e3e3; font-size:12px; font-weight:700; color:#666; display:flex; align-items: center; justify-content: center; } .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con .notice-list-box .notice-list .notice-con .notice-bage.check{background:#0061FD; color:#fff;} .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con .notice-list-box .notice-list .notice-con .notice-title{width:calc( 100% - 68px ); margin-left:10px; } .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con .notice-list-box .notice-list .notice-con .notice-title a{font-size:16px; display:block; width:100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con .bell-list-box{width:100%;padding:20px 0px;} .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con .bell-list-box .bell-list{display:flex; flex-direction: column; gap:32px 0px; position: relative; } .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con .bell-list-box .bell-list::before{content:""; display:block; width:2px; height:calc( 100% - 16px ); background:#eee; position: absolute; left:20px; top:50%; transform: translate( 0%, -50% );} .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con .bell-list-box .bell-list .bell-con{width:100%; display:flex; align-items: center; height:24px; padding-left:44px; position: relative; } .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con .bell-list-box .bell-list .bell-con::before{content:""; display:flex; align-items: center; justify-content: center; width:8px; height:8px; border-radius: 8px; background:#acacac; position:absolute; left:17px; top:50%; transform: translate(-0, -50%); } .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con .bell-list-box .bell-list .bell-con.new::before{content:"N"; width:20px; height: 20px; border-radius: 20px; background:#0061FD; color:#fff; font-size:10px; font-weight:900; left:11px; } .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con .bell-list-box .bell-list .bell-con .bell-title{width:100%; } .mypage .mypage-form .mypage-box .mypage-main-form .mypage-main-box .mypage-main-con .bell-list-box .bell-list .bell-con .bell-title a{font-size:16px; display:block; width:100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .mypage .page-section{max-width:100%; width:100%;} /* 공통 영역 */ .mypage .mypage-form .mypage-box .mypage-page-title{width:100%; display:flex; align-items: center; justify-content: space-between; margin-bottom:40px;} .mypage .mypage-form .mypage-box .mypage-page-title .title-box{display:flex; align-items: flex-end;} .mypage .mypage-form .mypage-box .mypage-page-title .title-box .title{font-size:26px; font-weight:500; height:32px; display:flex; align-items: center;} .mypage .mypage-form .mypage-box .mypage-page-title .title-box .txt{margin-left:10px; height:22px; display:flex; align-items: center; font-size:14px; color:#666; } .mypage .mypage-form .mypage-box .mypage-con{width:100%;} .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head{width:100%; display:flex; align-items: flex-start; justify-content: space-between; height:52px; border-bottom:1px solid #131313; } .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head .mypage-list-count{height:34px; display:flex; align-items: center; } .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head .mypage-list-count .txt{font-size:18px; font-weight:700;} .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head .mypage-list-count .count{margin-left:8px; font-size:16px; } .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head .mypage-list-count .count span{font-size:16px; font-weight:700; color:#0061FD;} .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head .mypage-list-btn-box{position: relative; display:flex; align-items: center; gap:0px 4px;} .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head .mypage-list-btn-box .myapge-link-btn{height:40px; border-radius: 4px; padding:0 20px; display:flex; align-items: center; justify-content: center; background:#fff; border:1px solid #ccc; font-size:14px; font-weight:500; } .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head .mypage-list-btn-box .myapge-link-btn:hover{background:rgba(0,0,0,0.06);} .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head .mypage-list-btn-box .myapge-link-btn:active{background:rgba(0,0,0,0); border:1px solid #131313;} .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head .mypage-list-btn-box .btn-floating{position: absolute; left:50%; top:-51px; transform: translate( -50%, -0 ); } .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head .mypage-list-btn-box .btn-floating .btn-floating-box{position: relative; width: max-content; height:40px; border-radius: 40px; padding:0 16px; display:flex; align-items: center; justify-content: center; background:#fff; border:1px solid #000; } .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head .mypage-list-btn-box .btn-floating .btn-floating-box .btn-floating-con{font-size:12px; font-weight:700;} .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head .mypage-list-btn-box .btn-floating .btn-floating-box::before{content: ""; display:block; width:10px; height:9px; background:url(../images/contents/my_float_arrow.png) no-repeat center; background-size:contain; position: absolute; left:50%; bottom:-8px; transform: translate( -49.99% , -0 ); } .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head .mypage-list-btn-box .myapge-link-btn:hover + .btn-floating{animation:myToolMove 0.4s ease-in-out infinite alternate-reverse;} .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head .mypage-list-btn-box input[type="text"]{width:280px; height:40px; border:1px solid #ddd; padding:0 12px; outline: none; font-size:14px; } .mypage .mypage-form .mypage-box .mypage-con .mypage-list-head .mypage-list-btn-box input[type="text"]:focus{border:1px solid #131313;} /* 마이페이지 - 라이브 */ .mypage .mypage-form .mypage-box .mypage-con.mypage-live-form .mypage-list-head{border-bottom:0px;} .mypage .mypage-form .mypage-box .mypage-con.mypage-live-form .search-none-form .search-none-box{padding:150px 0px; margin:0px; border-bottom:1px solid #ddd;} .mypage-live-list{width:100%;} .mypage-live-list .mypage-live-box{width:100%; margin-top:60px; border-bottom:1px solid #ddd; } .mypage-live-list .mypage-live-box:first-child{margin-top:0px;} .mypage-live-list .mypage-live-box .mypage-live-title{width:100%; display:flex; align-items: center; justify-content: space-between; padding:24px 0px 12px 0px; border-bottom:1px solid #131313; } .mypage-live-list .mypage-live-box .mypage-live-title .title{display:flex; align-items: center; font-size:16px; font-weight:500; height:24px; } .mypage-live-list .mypage-live-box .mypage-live-title .title::before{content:""; display:block; width:20px; height:20px; margin-right:4px;} .mypage-live-list .mypage-live-box.reserve .mypage-live-title .title::before{background:url(../images/contents/my_live_ico01.png) no-repeat center;} .mypage-live-list .mypage-live-box.onair .mypage-live-title .title::before{background:url(../images/contents/my_live_ico02.png) no-repeat center;} .mypage-live-list .mypage-live-box.end .mypage-live-title .title::before{background:url(../images/contents/my_live_ico03.png) no-repeat center;} .mypage-live-list .mypage-live-box.cancel .mypage-live-title .title::before{background:url(../images/contents/my_live_ico04.png) no-repeat center;} .mypage-live-list .mypage-live-box .mypage-live-title .date{font-size:14px; color:#666;} .mypage-live-list .mypage-live-box .mypage-live-con{width:100%; display:flex; padding:0 20px;} .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl{width:100%; max-width:100%;} .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-head{width:100%; display:flex; gap:0px 20px; padding:20px 0px; border-bottom:1px solid #ddd;} .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-head .mypage-live-head-con{width:100%; max-width:33.33%;} .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-head .mypage-live-head-con .title{display:flex; align-items: center; height:24px; font-size:14px; font-weight:500; color:#666;} .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-head .mypage-live-head-con .txt{display:flex; align-items: center; height:22px; font-size:14px; margin-top:4px; } .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body{padding:20px 0px; width:100%;} .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body .title{display:flex; align-items: center; height:24px; font-size:14px; font-weight:500; color:#666;} .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body .live-car-list{width:100%; display:flex; gap:0px 40px; margin-top:10px; } .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body .live-car-list .live-car-con{width:calc(50% - 20px); display:flex; gap:0px 15px; } .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body .live-car-list .live-car-con .car-thumnail{width:80px; height:60px;} .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body .live-car-list .live-car-con .car-info{width:calc( 100% - 95px );} .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body .live-car-list .live-car-con .car-info .car-name{font-size:14px; line-height:1.3;} .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body .live-car-list .live-car-con .car-info .car-trim{font-size:14px !important; line-height:1.3;} .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body .live-car-list .live-car-con .car-info .car-infos{width:100%; display:flex; flex-wrap: wrap; gap:5px 8px; } .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body .live-car-list .live-car-con .car-info .car-infos li{margin-top:5px; font-size:12px; color:#888; } .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body .live-car-list .live-car-con .car-info .car-pay{margin-top:7px; gap:0px 6px; display:flex; align-items: center; height:22px;} .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body .live-car-list .live-car-con .car-info .car-pay .pay{font-size:14px;} .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body .live-car-list .live-car-con .car-info .car-pay .pay span{font-size:14px; font-weight:700;} .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body .live-car-list .live-car-con .car-info .car-pay .discount{font-size:14px; color:#999; text-decoration: line-through;} .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body .live-car-list .live-car-con.contract .car-thumnail::before{content: "계약중"; display:flex; align-items: center; justify-content: center; width:43px; height:24px; background:#0061FD; font-size:12px; font-weight:500; color:#fff; position: absolute; left:0; top:0; z-index: 1; } .mypage-live-list .mypage-live-box .mypage-live-con .mypage-live-tbl .mypage-live-body .live-car-list .live-car-con.sale .car-thumnail::before{content: "판매완료"; display:flex; align-items: center; justify-content: center; width:54px; height:24px; background:#333; font-size:12px; font-weight:500; color:#fff; position: absolute; left:0; top:0; z-index: 1; } .mypage-live-list .mypage-live-box.reserve .mypage-live-con{gap:0px 20px;} .mypage-live-list .mypage-live-box.reserve .mypage-live-con .mypage-live-tbl{width:calc( 100% - 140px );} .mypage-live-list .mypage-live-box.reserve .mypage-live-con .mypage-live-btn{width:120px; display:flex; flex-direction: column; align-items: center; justify-content: center; gap:4px 0px;} .mypage-live-list .mypage-live-box.reserve .mypage-live-con .mypage-live-btn .btn{width:64px; height:32px;} .mypage-live-list .mypage-live-box.reserve .mypage-live-con .mypage-live-btn .btn span{font-size:12px; font-weight:500;} .mypage-live-list .mypage-live-box.onair .mypage-live-con{gap:0px 20px;} .mypage-live-list .mypage-live-box.onair .mypage-live-con .mypage-live-tbl{width:calc( 100% - 140px );} .mypage-live-list .mypage-live-box.onair .mypage-live-con .mypage-live-btn{width:120px; display:flex; flex-direction: column; align-items: center; justify-content: center; } .mypage-live-list .mypage-live-box.onair .mypage-live-con .mypage-live-btn .btn{width:120px; height:36px;} .mypage-live-list .mypage-live-box.onair .mypage-live-con .mypage-live-btn .btn span{font-size:14px; font-weight:700;} .mypage-live-list .mypage-live-box.end .mypage-live-con .mypage-live-tbl .mypage-live-head .mypage-live-head-con .title{color:#acacac;} .mypage-live-list .mypage-live-box.end .mypage-live-con .mypage-live-tbl .mypage-live-head .mypage-live-head-con .txt{color:#acacac;} .mypage-live-list .mypage-live-box.cancel .mypage-live-con .mypage-live-tbl .mypage-live-head .mypage-live-head-con .title{color:#acacac;} .mypage-live-list .mypage-live-box.cancel .mypage-live-con .mypage-live-tbl .mypage-live-head .mypage-live-head-con .txt{color:#acacac;} .mypage-live-summary{width:100%; margin-top:100px;} .mypage-live-summary li{padding-left:15px; font-size:14px; color:#666; position: relative; margin-top:8px;} .mypage-live-summary li:first-child{margin-top:0px;} .mypage-live-summary li::before{content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:5px; } .mypage-live-banner{width:100%; height:80px;display:flex; align-items: center; background:#f0f0f0 url(../images/contents/mypage_live_obj.png) no-repeat 51px -3px ; margin-top:80px; } .mypage-live-banner .title{margin-left:238px; font-size:18px; font-weight:500; } .mypage-live-banner .bn-btn{margin-left:108px; width:174px; height:48px; border-radius: 48px; background:#fff; display:flex; align-items: center; justify-content: center; } .mypage-live-banner .bn-btn span{font-size:14px; font-weight:500; } /* 마이페이지 - 찜한차량 */ .mypage .list-filter{display:flex; justify-content: flex-end; margin:0px; padding:16px 0px; border-bottom:1px solid #ddd;} .mypage .mypage-lp-form{width:100%;} .mypage .mypage-lp-form .mypage-lp-head{width:100%; margin:16px 0px 20px 0px; } .mypage .mypage-lp-form .mypage-lp-head .mypage-lp-count{font-size:14px;} .mypage .mypage-lp-form .mypage-lp-head .mypage-lp-count span{font-size:14px; font-weight:700; color:#0061FD;} .mypage .mypage-lp-form .lp-form .lp-box{gap:40px 30px;} .mypage .mypage-lp-form .order-view-form{width:280px;} .mypage .mypage-lp-form .mypage-lp-head .mypage-lp-head-box{display:flex; align-items: center; justify-content: space-between;} .mypage .mypage-lp-form .mypage-lp-head .mypage-lp-head-box .lp-compare-btn-form{display:flex; align-items: center;} .mypage .mypage-lp-form .mypage-lp-head .mypage-lp-head-box .lp-compare-btn-form .lp-compare-txt{font-size:14px;margin:0px 6px 0px 8px;} .lp-compare-tooltip .tooltip-form .tooltip-box{width:245px;} .mypage .mypage-lp-form .mypage-lp-head .lp-compare-from{margin-top:20px;} .mypage-lp-head.fixed{position:fixed; left:0; top:79px; z-index: 999; background:#fff; border-bottom:1px solid #ccc; box-sizing:border-box; margin:0px !important; } .mypage-lp-head.fixed .lp-compare-from{ background:#fff; margin-bottom:0px; } .mypage-lp-head.fixed .lp-compare-from .lp-compare .lp-compare-text{color:#666;} .mypage-lp-head.fixed .mypage-lp-head-box{width:1200px; margin:16px auto 0 auto;} .mypage-lp-head.fixed .lp-status-check .check-box-round{display:none;} .mypage .mypage-lp-form .mypage-lp-head.fixed .mypage-lp-count{display:none;} /* 마이페이지 쿠폰함 */ .coupon-list-form{padding:20px; display:flex; flex-direction: column; gap:20px 0px;} .coupon-list-form .coupon-list-box{width:100%; border-radius: 10px; overflow: hidden; border:1px solid #eee; } .coupon-list-form .coupon-list-box .coupon-con{display:flex; align-items: center; gap:0px 40px;} .coupon-list-form .coupon-list-box .coupon-con .coupon-thumnail{width:276px;} .coupon-list-form .coupon-list-box .coupon-con .coupon-info{display:flex; flex-direction: column; width:calc( 100% - 316px ); gap:4px 0px; } .coupon-list-form .coupon-list-box .coupon-con .coupon-info li{height:22px; display:flex; align-items: center; gap:0px 20px;} .coupon-list-form .coupon-list-box .coupon-con .coupon-info li .title{width:80px; font-size:14px; color:#666; } .coupon-list-form .coupon-list-box .coupon-con .coupon-info li .txt{font-size:14px; font-weight:500; width:calc( 100% - 100px );} .coupon-list-form .coupon-list-box .coupon-summary{padding:20px; width:100%; display:none; } .coupon-list-form .coupon-list-box .coupon-summary pre{line-height:1.4; font-size:12px; color:#515151;} .coupon-list-form .coupon-list-box .coupon-btn{width:100%; height:32px; display:flex; align-items: center; justify-content: center; background:#f6f6f6; font-size:12px; color:#666;} .coupon-list-form .coupon-list-box .coupon-btn::after{content:""; display:block; width:16px; height:16px; background:url(../images/contents/my_box_arrow.png) no-repeat center; transform: rotate(180deg); transition: all 0.2s; } .coupon-list-form .coupon-list-box.active .coupon-btn::after{transform: rotate(0deg); transition: all 0.2s; } /* 마이페이지 - 문의 내역 */ .mypage-notice-form{width:100%;} .mypage-notice-form .mypage-notice-box{width:100%;} .mypage-notice-form .mypage-notice-box .mypage-notice-con{width:100%;} .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-head{width:100%; padding:20px; border-bottom:1px solid #eee; display:flex; gap:0px 20px; align-items: center; cursor:pointer;} .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-head .status{width:58px;} .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-head .status span{ display:flex; align-items: center; justify-content: center; width:58px; height:20px; border-radius: 20px; background:#e3e3e3; font-size:12px; font-weight:700; color:#666; position: relative; } .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-head .status.check span{ background:#0061FD; color:#fff; } .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-head .status.check span::after{content:""; display:block; width:4px; height:4px; border-radius: 4px; background:#0061FD; position: absolute; top:0px; right:-4px; } .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-head .notice-info{width:calc( 100% - 114px )} .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-head .notice-info .notice-kind{font-size:14px; color:#666; height:22px; display:flex; align-items: center;} .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-head .notice-info .notice-title{width:100%; display:flex; gap:0px 12px; margin-top:4px; } .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-head .notice-info .notice-title::before{content:"Q"; font-size:16px; font-weight:800;} .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-head .notice-info .notice-title .title{width:calc( 100% - 27px ); font-size:14px; line-height:1.4; display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; transition: all 0.2s; } .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-head .notice-info .notice-date{padding-left:27px; height:16px; display:flex; align-items: center; margin-top:4px; font-size:12px; color:#888; } .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-head .notice-arrow{width:16px;} .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-head .notice-arrow i{display:flex; width:16px; height:16px; align-items: center; justify-content: center; transform: rotate(0deg); transition: all 0.2s;} .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-summary{border-bottom:1px solid #eee; display:none;} .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-summary .txt{display:flex; padding:32px 40px 32px 98px; background:#f9f9f9; font-size:14px; color:#666; line-height:1.4; } .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-summary .txt::before{content:"A"; font-size:16px; font-weight:800; margin-right:12px; color:#131313; margin-top:-2px; } .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-summary .notice-btn{display:flex; justify-content: flex-end; padding:10px 0px; } .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-summary .notice-btn .btn{width:85px; height:32px; } .mypage-notice-form .mypage-notice-box .mypage-notice-con .notice-summary .notice-btn .btn span{font-size:12px;} .mypage-notice-form .mypage-notice-box .mypage-notice-con.active .notice-head .notice-info .notice-title .title{-webkit-line-clamp: unset; transition: all 0.2s; } .mypage-notice-form .mypage-notice-box .mypage-notice-con.active .notice-head .notice-arrow i{transform: rotate(180deg); transition: all 0.2s;} /* 마이페이지 - 알림 내역 */ .mypage-bell-form{ width:100%; margin-top:20px; } .mypage-bell-form .mypage-bell-list{width:100%; display:flex; flex-direction: column; gap:40px 0px; position: relative;} .mypage-bell-form .mypage-bell-list::before{content:''; display:block; width:2px; height:calc( 100% - 4px ); background:#eee; position: absolute; left:138px; top:4px; } .mypage-bell-form .mypage-bell-list .mypage-bell-box{width:100%; display:flex; gap:0px 10px; position: relative; z-index: 2;} .mypage-bell-form .mypage-bell-list .mypage-bell-box .bell-date{width:120px; height:24px; display:flex; align-items: center; font-size:16px; font-weight:700;} .mypage-bell-form .mypage-bell-list .mypage-bell-box .bell-dot{width:24px; height:24px; display:flex; align-items: center; justify-content: center; position: relative; z-index: 1;} .mypage-bell-form .mypage-bell-list .mypage-bell-box .bell-dot::before{content:""; display:flex; width:8px; height:8px; border-radius: 4px; background:#acacac; position: relative; z-index: 2;} .mypage-bell-form .mypage-bell-list .mypage-bell-box.new .bell-dot::before{content:"N"; display:flex; width:20px; height:20px; border-radius: 20px; background:#0061FD; color:#fff; font-size:10px; font-weight:900; align-items: center; justify-content: center; } .mypage-bell-form .mypage-bell-list .mypage-bell-box:last-child::after{ content:""; width:100%; height:calc( 100% - 15px ); background:#fff; display:block; position: absolute; left:0; bottom:0; z-index: -1;} .mypage-bell-form .mypage-bell-list .mypage-bell-box .bell-con-list{width:calc( 100% - 144px ); display:flex; flex-direction: column; gap:20px 0px;} .mypage-bell-form .mypage-bell-list .mypage-bell-box .bell-con-list .bell-con{width:100%; border-radius: 10px; overflow: hidden; border:1px solid #eee; } .mypage-bell-form .mypage-bell-list .mypage-bell-box .bell-con-list .bell-con .bell-summary{padding:12px 20px; } .mypage-bell-form .mypage-bell-list .mypage-bell-box .bell-con-list .bell-con .bell-summary .txt{font-size:14px; line-height:1.4; } .mypage-bell-form .mypage-bell-list .mypage-bell-box .bell-con-list .bell-con .bell-summary .txt.line-hide{display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 4; transition: all 0.2s;} .mypage-bell-form .mypage-bell-list .mypage-bell-box .bell-con-list .bell-con.active .bell-summary .txt{ -webkit-line-clamp: unset; } .mypage-bell-form .mypage-bell-list .mypage-bell-box .bell-con-list .bell-con .bell-arrow{width:100%; height:32px; display:flex; align-items: center; justify-content: center; background:#f6f6f6; font-size:12px; color:#666; cursor:pointer;} .mypage-bell-form .mypage-bell-list .mypage-bell-box .bell-con-list .bell-con .bell-arrow::after{content:""; display:block; width:16px; height:16px; background:url(../images/contents/my_box_arrow.png) no-repeat center; transform: rotate(180deg); transition: all 0.2s; } .mypage-bell-form .mypage-bell-list .mypage-bell-box .bell-con-list .bell-con.active .bell-arrow::after{transform: rotate(0deg); transition: all 0.2s; } /* 마이페이지 - 입고 알림 */ .mypage-wait-form{width:100%;} .mypage-wait-form .mypage-car-wait{width:100%;} .mypage-wait-form .mypage-car-wait .car-wait-list{width:100%;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con{padding:28px 0px; border-bottom:1px solid #eee;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box{width:100%; display:flex; } .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box::before{content:""; display:block; width:24px; height:24px; margin-right:8px; } .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box .car-wait-info{background:#fff; width:calc( 100% - 126px ); padding:0px;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box .car-wait-info .car-wait-date{display:flex; align-items: center; height:24px;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box .car-wait-info .car-wait-date .date{font-size:14px;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box .car-wait-info .car-wait-date .date span{font-size:14px; font-weight:700; } .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box .car-wait-info .car-wait-date .status{padding:0 6px; height:24px; display:flex; align-items: center; justify-content: center; background:#eee; font-size:12px; margin-left:8px; } .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box .car-wait-info .car-wait-name{width:100%; height:26px; line-height:26px; font-size:18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top:4px; } .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box .car-wait-info .car-wait-infos{display:flex; align-items: center; gap:0px 8px; height:22px; margin-top:4px;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box .car-wait-info .car-wait-infos li{font-size:14px; color:#888;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box .car-wait-info .car-wait-infos li:first-child{width:140px; } .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box .car-wait-btn{display:flex; align-items: center; gap:0px 10px; margin-left:20px;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box .car-wait-btn button .ico{display:flex; width:32px; height: 32px; border-radius: 32px; background:#f6f6f6; position: relative; overflow: hidden; align-items: center; justify-content: center; } .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box .car-wait-btn button .ico img{position: relative; z-index: 1;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box .car-wait-btn button:hover .ico::before{content:""; display:block; width:100%; height:100%; background:rgba(0,0,0,0.06); position: absolute; left:0; top:0;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box .car-wait-btn button:active .ico::before{content:""; display:block; width:100%; height:100%; background:rgba(0,0,0,0.1); position: absolute; left:0; top:0;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con .car-wait-info-box .car-wait-btn button .txt{font-size:12px; color:#666; line-height:1.2; margin-top:6px;} /* 입고알림 상태값 */ .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con.wait .car-wait-info-box::before{background:url(../images/contents/car_wait_i.png) no-repeat center;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con.send .car-wait-info-box::before{background:url(../images/contents/car_wait_send_i.png) no-repeat center;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con.send .car-wait-info-box .car-wait-info .car-wait-date .date{color:#acacac;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con.send .car-wait-info-box .car-wait-info .car-wait-date .date span{color:#acacac;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con.send .car-wait-info-box .car-wait-info .car-wait-date .status{background:#e3e3e3; color:#acacac;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con.send .car-wait-info-box .car-wait-info .car-wait-name{color:#acacac;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con.send .car-wait-info-box .car-wait-info .car-wait-infos li{color:#acacac;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con.over .car-wait-info-box::before{background:url(../images/contents/car_wiat_over_i.png) no-repeat center;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con.over .car-wait-info-box .car-wait-info .car-wait-date .date{color:#acacac;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con.over .car-wait-info-box .car-wait-info .car-wait-date .date span{color:#acacac;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con.over .car-wait-info-box .car-wait-info .car-wait-date .status{background:#e3e3e3; color:#acacac;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con.over .car-wait-info-box .car-wait-info .car-wait-name{color:#acacac;} .mypage-wait-form .mypage-car-wait .car-wait-list .car-wait-con.over .car-wait-info-box .car-wait-info .car-wait-infos li{color:#acacac;} .car-wait .search-none-form .search-none-box{margin:0px; padding:150px 0px; border-bottom:1px solid #eee;} #carWaitDatePop{display:none;} #carWaitDatePop .wait-date-form{width:100%; margin-top:30px;} #carWaitDatePop .wait-date-form .title{font-size:18px; font-weight:700;} #carWaitDatePop .wait-date-form .date-select{width:100%; margin-top:24px;} #carWaitDatePop .wait-date-form .date-select .check-btn-box{display:flex; align-items: center; flex-wrap: nowrap; gap:0 10px;} #carWaitDatePop .wait-date-form .date-select .check-btn-box .check-btn.check-btn-s{width:100%; max-width:100%;} #carWaitDatePop .wait-date-form .date-select .check-btn-box .check-btn.check-btn-s label{width:100%; max-width:100%;} #carWaitDatePop .wait-date-form .date-summary{ margin-top:40px;} #carWaitDatePop .wait-date-form .date-summary li{font-size:14px; color:#666; position: relative ; padding-left:15px; margin-top:10px;} #carWaitDatePop .wait-date-form .date-summary li::before{content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:6px; } #carWaitDatePop .wait-date-form .date-summary li:first-child{margin-top:0px;} /* 회원 정보 */ /* 회원 정보 - 로그인 체크 */ .mypage .login-check-form{width:100%;} .mypage .login-check-form .sns-login-form{display:flex; flex-direction: column; justify-self: flex-start; align-items: flex-start; gap:10px 0px;} .mypage .login-check-form .sns-login-form .sns-login-box .sns-login-btn .sns-ico{position: absolute; width:20px; height:20px; display:flex; align-items: center; justify-content: center; left:14px; top:50%; transform: translate( -0, -50% );} .mypage .login-check-form .login-check-box{width:335px;} .mypage .login-check-form .login-check-box .login-check-con{width:100%; margin-bottom:20px;} .mypage .login-check-form .login-check-box .login-check-con .title{height:32px; display:flex; align-items: center; font-size:14px; font-weight:500; } .mypage .login-check-form .login-check-box .login-check-con input{width:100%; height:44px; padding:0 12px; font-size:14px; color:#131313; outline: none; border:1px solid #ddd;} .mypage .login-check-form .login-check-box .login-check-con input:focus{border:1px solid #131313;} .mypage .login-check-form .login-check-box .login-check-con input:read-only{border:0px; background:#f9f9f9; } .mypage .login-check-form .login-check-box .login-check-btn .btn{height:50px;} .mypage .login-check-form .login-check-box .login-check-btn .btn span{font-size:16px; font-weight:500;} /* 회원 정보 - 수정 */ .mypage-info-form{width:100%; display:flex; flex-direction: column; gap:60px 0px;} .mypage-info-form .mypage-info-box{width:100%;} .mypage-info-form .mypage-info-box .box-title{font-size:18px; font-weight:700; padding-bottom:24px; border-bottom:1px solid #131313;} .mypage-info-form .mypage-info-box .mypage-info-list{width:100%;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con{border-bottom:1px solid #eee; padding:10px 0px; display:flex;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .title{width:145px; height:24px; display: flex; align-items: center; margin-top:10px; font-size: 15px; font-weight:500; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont{width:475px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .id-box{width:100%; height:44px; display:flex; align-items: center; background:#f9f9f9; font-size:14px; padding:0px 16px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .id-box::before{content:""; display:block; width:24px; height:24px; border-radius: 24px; margin-right:8px; } .mypage-info-form .mypage-info-box.reborn .mypage-info-list .mypage-info-con .cont .id-box::before{background:url(../images/contents/find_reborn_ico.png) no-repeat center;} .mypage-info-form .mypage-info-box.kakao .mypage-info-list .mypage-info-con .cont .id-box::before{background:url(../images/contents/find_kakao_ico.png) no-repeat center;} .mypage-info-form .mypage-info-box.naver .mypage-info-list .mypage-info-con .cont .id-box::before{background:url(../images/contents/find_naver_ico.png) no-repeat center} .mypage-info-form .mypage-info-box.apple .mypage-info-list .mypage-info-con .cont .id-box::before{background:url(../images/contents/find_apple_ico.png) no-repeat center} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont input[type="password"]{width:100%; height:44px; padding:0 16px; font-size:14px; border:1px solid #ddd; outline: none; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont input[type="password"]:focus{border:1px solid #131313;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .name-box{width:100%; height:44px; display:flex; align-items: center; background:#f9f9f9; font-size:14px; padding:0px 16px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-inpt-box{display:flex; align-items: center; width:100%;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-inpt-box .phone-number{ width:calc( 100% - 130px ); height:44px; border:1px solid #ddd; outline: none; padding:0 16px; font-size:14px; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-inpt-box .phone-number:read-only{background:#f9f9f9; color:#131313; border:0px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-inpt-box .phone-inpt-btn{width:120px; margin-left:10px; position: relative;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-inpt-box .phone-inpt-btn .btn{width:100%; height:44px; font-size:15px; font-weight:500;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-inpt-box .phone-inpt-btn .btn span{font-size:15px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-inpt-box .phone-inpt-btn .btn-floating{position: absolute; left:50%; top:-36px; transform: translate( -50%, -0 ); z-index: 2; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-inpt-box .phone-inpt-btn .btn-floating .btn-floating-box{position: relative; width: max-content; height:40px; border-radius: 40px; padding:0 16px; display:flex; align-items: center; justify-content: center; background:#fff; border:1px solid #000; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-inpt-box .phone-inpt-btn .btn-floating .btn-floating-box .btn-floating-con{font-size:12px; font-weight:700;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-inpt-box .phone-inpt-btn .btn-floating .btn-floating-box::before{content: ""; display:block; width:10px; height:9px; background:url(../images/contents/my_float_arrow.png) no-repeat center; background-size:contain; position: absolute; left:50%; bottom:-8px; transform: translate( -49.99% , -0 ); } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-inpt-box .phone-inpt-btn .btn:hover + .btn-floating{animation:myToolMove02 0.4s ease-in-out infinite alternate-reverse;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-check-summary{width:100%; margin-top:12px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-check-summary li{font-size:14px; color:#666; position: relative ; padding-left:15px; margin-top:10px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-check-summary li::before{content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:6px; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-check-summary li:first-child{margin-top:0px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .phon-check-summary li a{font-size:14px; font-weight:500;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .add-info{width:100%; display:flex; flex-wrap: wrap; gap:10px 10px; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .add-info input{width:100%; height:44px; border:1px solid #ddd; outline: none; padding:0 16px; font-size:14px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .add-info input:focus{border:1px solid #131313;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .add-info input:read-only{background:#e3e3e3; color:#999;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .add-info .add-number{width:calc( 100% - 130px ); height:44px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .add-info .btn{width:120px; position: relative; height:44px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .cont .add-info .btn span{font-size:15px;} .mypage-info-form .mypage-info-box.mypage-info-policy{padding:30px 0px; border-bottom:1px solid #eee;} .mypage-info-form .mypage-info-box.mypage-info-policy .mypage-info-list .mypage-info-con .cont{width:100%;} .mypage-info-form .mypage-info-box.mypage-info-policy .mypage-info-list .mypage-info-con{border-bottom:0px; padding:0px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-con{width:100%;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-con .policy-title{display:flex; align-items: center; justify-content: space-between; height:46px; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-con .policy-title .policy-arrow{cursor:pointer; transform: rotate(180deg); transition: all 0.2s; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-con.active .policy-title .policy-arrow{transform: rotate(0deg);} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-con .policy-summery{width:100%; padding:20px; background:#f9f9f9; max-height:200px; overflow-y: auto; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-con .policy-summery p{font-size:14px; color:#888 !important; line-height:1.4;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-con .policy-summery p.title{font-weight:700; margin-bottom:4px; margin-top:8px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-con .policy-summery p:first-child{margin-top:0px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-con .policy-summery p span{font-size:14px; color:#888 !important; line-height:1.4 !important;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-con .policy-summery .policy-list{width:100%;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-con .policy-summery .policy-list li{display:flex; width:100%; margin-top:12px; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-con .policy-summery .policy-list li:first-child{margin-top:0px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-con .policy-summery .policy-list li .policy-sum-tit{ width:160px; font-size: 14px; font-weight:700; color:#888; padding-left:16px; box-sizing:border-box; position: relative; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-con .policy-summery .policy-list li .policy-sum-tit::before{content:"";display:block; width:4px; height:4px; border-radius: 4px; background:#888; position: absolute; left:4px; top:4px; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-con .policy-summery .policy-list li .policy-sum-txt{ width:calc( 100% - 180px ); font-weight:400; font-size: 14px; color:#888; margin-left:20px; line-height:1.3; word-break: keep-all; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .policy-summery-txt{font-size:14px; font-weight:700; color:#888; margin-top:10px;} .mypage-info-form .mypage-info-btn-box{margin-top:-10px;} .mypage-info-form .mypage-info-btn-box .btn-box .btn{height:50px;} .mypage-info-form .mypage-info-btn-box .btn-box .btn span{font-size:16px; font-weight:500;} .mypage-info-form .mypage-info-btn-box .membership-withdrawal{text-align: center; margin-top:20px;font-size:14px; color:#666;} .mypage-info-form .mypage-info-btn-box .membership-withdrawal a{font-size:14px; color:#131313;} .confirm-pop#mypageConfirmPop .confirm-pop-body .confirm-pop-txt{letter-spacing: -0.6px; } /* 마이페이지 - 회원탈퇴 */ .withdrawal-inpt{width:100%; margin-top:8px; display:none;} .withdrawal-inpt textarea{width:100%; height:160px; border:1px solid #ddd; outline: none; padding:8px 12px; font-size:14px; resize:none; } .withdrawal-inpt textarea:focus{border:1px solid #131313;} .withdrawal-summary{width:100%; padding:30px; background:#f9f9f9; gap:0px 40px; display:flex; align-items: flex-start; margin-top:60px;} .withdrawal-summary .title{display:flex;align-items: center; font-size:18px; font-weight:700; } .withdrawal-summary .title::before{content:""; display:block; width:20px; height:20px; border-radius: 20px; background:url(../images/contents/review_care_ico.png) no-repeat center; margin:0px 8px 0px 2px; } .withdrawal-summary .withdrawal-list{} .withdrawal-summary .withdrawal-list li{font-size:14px; color:#666; position: relative ; padding-left:15px; margin-top:10px; line-height:1.3;} .withdrawal-summary .withdrawal-list li span{font-size:14px; color:#666; font-weight:700;} .withdrawal-summary .withdrawal-list li::before{content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:7px; } .withdrawal-summary .withdrawal-list li:first-child{margin-top:0px;} .withdrawal-check{padding:16px 0px; width:max-content;} .mypage-withdrawal-btn-box{} .mypage-withdrawal-btn-box .btn-white{width:120px; height:50px;} .mypage-withdrawal-btn-box .btn-white span{font-size:16px; font-weight:500;} .mypage-withdrawal-btn-box .btn-red{width:240px; height:50px;} .mypage-withdrawal-btn-box .btn-red span{font-size:16px; font-weight:500;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .select-box .select-choice{height:44px; font-size:14px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .select-box .select-list{top:44px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-choice span{font-size:14px; color:#888;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select{ width:100%; position:relative; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-choice{ width:100%; height:44px; display:flex; align-items: center; background:#f6f6f6; padding: 0 35px 0 16px; box-sizing:border-box; border:1px solid #f6f6f6; font-size:14px; font-weight:400; color:#888; letter-spacing: -0.2px; position:relative; cursor: pointer; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-choice::after{content:""; display:block; width:16px; height:16px; background:url(../images/common/select_arrow.png) no-repeat center ; position: absolute; right:16px; top:16px; transform: rotate(0deg); transition: all 0.2s; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-choice:hover::before{content:""; display:block; width:100%; height:100%; position: absolute; left:0; top:0; background:rgba(0,0,0,0.06); } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-choice.active{background:#fff; border:1px solid #131313; font-weight:400; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-choice.active::after{transform: rotate(180deg); } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-choice.active:hover::before{display:none;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-choice.disabled{ background:#e3e3e3; font-weight:400; color:#acacac; cursor:default; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-choice::after{content:""; display:block; width:16px; height:16px; background:url(../images/common/select_arrow_disabled.png) no-repeat center ; position: absolute; right:16px; top:16px; transform: rotate(0deg); transition: all 0.2s; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-choice.disabled:hover::before{display:none;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-choice.choice{color:#131313; font-weight:700;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-list{ display:none; width:100%; padding:20px; box-sizing:border-box; max-height:370px; overflow-y: auto; border:1px solid #acacac; background:#fff; position:absolute; left:0; top:44px; z-index: 9999; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-list li{ height:24px; display:flex; align-items: center; font-size: 16px; color:#666; letter-spacing: -0.2px; margin-bottom:10px; cursor: default; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-list li:last-child{ margin-bottom:0px; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-list li:hover{color:#131313; font-weight:700; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-list li.active{color:#131313; font-weight:700; } /* select scroll 커스텀 */ .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-list::-webkit-scrollbar{width:20px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-list::-webkit-scrollbar-track{ background: #fff;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-list::-webkit-scrollbar-thumb { background:#ccc; border-radius: 10px; border:8px solid #fff; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-list::-webkit-scrollbar-button{ display: none; } .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-list::-webkit-scrollbar-button:vertical:start:decrement, .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-list::-webkit-scrollbar-button:vertical:start:increment{display:block; height:6px;} .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-list::-webkit-scrollbar-button:vertical:end:decrement, .mypage-info-form .mypage-info-box .mypage-info-list .mypage-info-con .coupon-select .coupon-select-list::-webkit-scrollbar-button:vertical:end:increment{display:block; height:6px;} /* 탈퇴 완료 */ .withdrawal-form{width:100%; display:flex; flex-direction: column; align-items: center; justify-content: center;} .withdrawal-form .withdrawal-ico{width:80px; height:80px; border-radius: 80px; background:#f4f9ff; display: flex; align-items: center; justify-content: center; } .withdrawal-form .withdrawal-title{font-size:26px; font-weight:500; margin-top:24px; } .withdrawal-form .withdrawal-txt{font-size:16px; line-height:1.4; color:#666; margin-top:16px; text-align: center; } .withdrawal-form .withdrawal-btn{margin-top:60px;} .withdrawal-form .withdrawal-btn .btn{height:50px;} .withdrawal-form .withdrawal-btn .btn span{font-size:16px; font-weight:500;} /* 나의 구매/판매 내역 찾기 */ .buy-search-form{width:100%; margin:50px 0px 130px 0px;} .buy-search-form .page-title{width:1200px; margin:0 auto;} .buy-search-form .page-title .page-title-txt .main-txt{font-size:24px; font-weight:700;} .buy-search-form .buy-search-summary{width:100%; display:flex; align-items: center; justify-content: center; padding:40px 0px; background:#f9f9f9; margin-top:24px; } .buy-search-form .buy-search-summary .summary-box{display:flex; flex-direction: column; align-items: center; justify-content: center; } .buy-search-form .buy-search-summary .summary-box .summary-ico{} .buy-search-form .buy-search-summary .summary-box .summary-title{margin-top:20px; text-align: center; font-size:20px; font-weight:700; line-height:1.3; } .buy-search-form .buy-search-summary .summary-box .summary-txt{margin-top:10px; text-align: center; font-size:14px; line-height:1.4; color:#666; } .buy-search-form .buy-search-box{width:335px; margin:40px auto 0 auto; display:flex; flex-direction: column; gap:20px 0px; } .buy-search-form .buy-search-box .buy-search-con{width:100%; display: flex; flex-wrap: wrap; gap:0 40px;} .buy-search-form .buy-search-box .buy-search-con .title{display:flex; align-items: center; height:32px; font-size:14px; font-weight:500; width:100%; } .buy-search-form .buy-search-box .buy-search-con .cont{width:100%; display:flex; flex-direction: column; gap:10px 0px; } .buy-search-form .buy-search-box .buy-search-con .cont input[type="text"]{width:100%; height:44px; border:1px solid #ddd; padding:0 12px; font-size:14px; outline: none; } .buy-search-form .buy-search-box .buy-search-con .cont input[type="text"]:focus{border:1px solid #131313;} .buy-search-form .buy-search-box .buy-search-con .radio-box label span{font-size:15px;} .buy-search-form .buy-search-box .buy-search-con .cont .phone-number-box{width:100%; display:flex; flex-wrap: wrap; gap:10px 10px; } .buy-search-form .buy-search-box .buy-search-con .cont .phone-number-box .phone-number-con{width:calc( 100% - 130px ); position: relative; } .buy-search-form .buy-search-box .buy-search-con .cont .phone-number-box .phone-number-btn{width:120px; } .buy-search-form .buy-search-box .buy-search-con .cont .phone-number-box .phone-number-btn .btn{width:100%; height:44px; } .buy-search-form .buy-search-box .buy-search-con .cont .phone-number-box .phone-number-btn .btn span{font-size:15px; font-weight:500;} .buy-search-form .buy-search-box .buy-search-con .cont .phone-number-box .time-count{font-size:14px; font-weight:500; color:#ff3f3f; position: absolute; right:12px; top:50%; transform: translate( -0, -50% ); } .buy-search-form .buy-search-box .buy-search-con .cont .phone-number-box.phone-num-check{display:none;} .buy-search-view{width:100%;margin:50px 0px 120px 0px;} .buy-search-view .buy-search-view-head{display:flex; flex-direction: column; align-items: center; justify-content: center; } .buy-search-view .buy-search-view-head .ico{width:48px;} .buy-search-view .buy-search-view-head .title{font-size:24px; font-weight:700; text-align: center; margin-top:20px;} .buy-search-view .buy-search-view-head .txt{font-size:14px; font-weight:500; text-align: center; margin-top:10px; color:#666; } .buy-search-view .buy-search-view-box{ width:560px; margin:40px auto 0 auto; } .buy-search-view .buy-search-view-box .buy-search-list{width:100%;} .buy-search-view .buy-search-view-box .buy-search-list .buy-search-view-con{ width:100%; padding:40px; background:#f9f9f9; display:flex; flex-direction: column; gap:16px 0px; } .buy-search-view .buy-search-view-box .buy-search-list .buy-search-view-con .cont{width:100%; display:flex; gap:0px 20px; } .buy-search-view .buy-search-view-box .buy-search-list .buy-search-view-con .cont .title{width:50px; font-size:14px; color:#666;line-height:1.4;} .buy-search-view .buy-search-view-box .buy-search-list .buy-search-view-con .cont .txt{width:calc( 100% - 70px ); font-size:14px; font-weight:500; line-height:1.4; overflow:hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2 ; } .buy-search-view .buy-search-btn{margin:100px auto 0 auto;} .buy-search-view .buy-search-btn .btn{margin:0 auto; height: 50px;} .buy-search-view .buy-search-btn .btn span{font-size:16px; font-weight:500;} /* 결제 라인 공통 */ .payment-section{width:1200px; margin:100px auto 130px auto;} .payment-section .payment-head{margin-bottom:80px;} .payment-section .payment-form{width:100%;} .payment-section .payment-title{width:100%; text-align: center;} .payment-section .payment-title .title{font-size:26px; font-weight:700;} .payment-section .payment-title .title span{font-size:26px; font-weight:700;} .payment-section .payment-title .txt{font-size:16px; color:#666; margin-top:10px;} .order-step-form{display:flex; align-items: center; justify-content: center; margin-top:30px;} .order-step-form .order-step-list{display:flex; align-items: center; justify-content: center;} .order-step-form .order-step-list li{display:flex; align-items: center; justify-content: center; } .order-step-form .order-step-list li::after{content:""; display:block; width:16px; height:16px; background:url(../images/smartbuy/payment_step_arrow.png) no-repeat center; margin:0 16px; } .order-step-form .order-step-list li:last-child::after{display:none;} .order-step-form .order-step-list li .ico{width:36px; height:36px; border-radius: 36px; margin-right:7px; display:flex; align-items: center; justify-content: center; background:#e3e3e3; } .order-step-form .order-step-list li .txt{font-size:14px; font-weight:500; color:#acacac;} .order-step-form .order-step-list li .ico::before{content:""; display:block; width:36px; height:36px; } .order-step-form .order-step-list li:nth-child(1) .ico::before{background:url(../images/smartbuy/payment_step01.png) no-repeat center;} .order-step-form .order-step-list li:nth-child(2) .ico::before{background:url(../images/smartbuy/payment_step02.png) no-repeat center;} .order-step-form .order-step-list li:nth-child(3) .ico::before{background:url(../images/smartbuy/payment_step03.png) no-repeat center;} .order-step-form .order-step-list li.active .ico{background:#0061FD;} .order-step-form .order-step-list li.active .txt{color:#131313;} .order-step-form .order-step-list li:nth-child(2).active .ico::before{background:url(../images/smartbuy/payment_step02_on.png) no-repeat center;} .payment-section .payment-form .payment-btn-box{margin:0px auto 0 auto; border-top:0px; position:relative; } .payment-section .payment-form .payment-btn-box .btn{width:250px; height:60px;} .payment-section .payment-form .payment-btn-box .btn span{font-size:20px; font-weight:500;} .payment-section .payment-form .tool-type{ position:relative; } .payment-section .payment-form .tool-type .payment-tool{ position:absolute; top: 4px; left:50%; transform:translate(-50%, 0); animation: paymentToolMove 1s infinite; } .payment-section .payment-form .tool-type-box .tool-type .payment-tool{ top:-46px; left:50%; transform:translate(-50%, -0); } .payment-section .payment-form .tool-type .payment-tool span{ display:flex; align-items:center; justify-content:center; padding:0 10px; height:30px; background:#2e3546; border-radius:4px; position:relative; color:#fff; font-size:14px; font-weight:700; gap:4px; will-change: transform; backface-visibility: hidden; white-space:nowrap; width:max-content; } .payment-section .payment-form .tool-type .payment-tool span img{ margin-top:-2px; } .payment-section .payment-form .tool-type .payment-tool span::after{ content:""; display:block; width:12px; height:6px; background:url(../images/contents/payment_tool_arrow.png) no-repeat center; position:absolute; bottom:-6px; } @keyframes paymentToolMove { 0% { transform: translate(-50%, 0); } 50% { transform: translate(-50%, 4px); } 100% { transform: translate(-50%, 0); } } .payment-section .faq-section{ margin-top:130px; } /* 결제라인 - 차량 확인 */ .opder-info-form{display:flex; align-items: flex-start; gap:0px 80px; width:100%; padding-bottom:100px; border-bottom: 1px solid #eee; flex-wrap:wrap; } .opder-info-form .order-info-box{width:calc( 50% - 40px );} .opder-info-form .order-info-box .car-thumnail-box{width:100%; height:420px; position: relative; } .opder-info-form .order-info-box .car-thumnail-box .visual-logo{ position: absolute; left:10px; top:10px; background:#fff; border-radius: 60px; z-index: 2; display:flex; align-items: center; } .opder-info-form .order-info-box .car-thumnail-box .visual-logo .rb-logo{width:60px; height:60px; border-radius: 60px; background:url(../images/smartbuy/vip_visual_rb.png) no-repeat center; } .opder-info-form.finance .order-info-box .car-thumnail-box .visual-logo .rb-logo{order:1;} .opder-info-form.finance .order-info-box .car-thumnail-box .visual-logo::before{order:2; content:""; display:block; width:14px; height:14px; margin:0 5px; background:url(../images/smartbuy/vip_visual_finance.png) no-repeat center; } .opder-info-form.finance .order-info-box .car-thumnail-box .visual-logo::after{order:3; content:""; display:block; width:60px; height:60px; } .opder-info-form.finance.bnk .order-info-box .car-thumnail-box .visual-logo::after{background:url(../images/smartbuy/vip_visual_bnk.png) no-repeat center;} .opder-info-form.finance.mc .order-info-box .car-thumnail-box .visual-logo::after{background:url(../images/smartbuy/vip_visual_mc.png) no-repeat center;} .opder-info-form.finance.woori .order-info-box .car-thumnail-box .visual-logo::after{background:url(../images/smartbuy/vip_visual_woori.png) no-repeat center;} .opder-info-form.finance.sk .order-info-box .car-thumnail-box .visual-logo::after{background:url(../images/smartbuy/vip_visual_sk.png) no-repeat center;} .opder-info-form.finance.hana .order-info-box .car-thumnail-box .visual-logo::after{background:url(../images/smartbuy/vip_visual_hana.png) no-repeat center;} .opder-info-form.finance.hyundai .order-info-box .car-thumnail-box .visual-logo::after{background:url(../images/smartbuy/vip_visual_hyundai.png) no-repeat center;} .opder-info-form.finance.shinhan .order-info-box .car-thumnail-box .visual-logo::after{background:url(../images/smartbuy/vip_visual_shinhan.png) no-repeat center;} .opder-info-form .order-info-box .order-buyback-form{ width:100%; padding:40px 20px; background:#f6f6f6; } .opder-info-form .order-info-box .order-buyback-form .order-buyback-title{ display:flex; align-items: center; justify-content: center;} .opder-info-form .order-info-box .order-buyback-form .order-buyback-title .ico{width:31px; height:31px; border-radius: 31px; background:#ddd; position: relative; margin-right:23px; } .opder-info-form .order-info-box .order-buyback-form .order-buyback-title .ico::before{content:""; display:block; width:29px; height:25px; background:url(../images/smartbuy/buyback_title_ico.png) no-repeat center; position: absolute; left:7px; bottom:8px; } .opder-info-form .order-info-box .order-buyback-form .order-buyback-title .title{font-size:20px; font-weight:700;} .opder-info-form .order-info-box .order-buyback-form .order-buyback-summary{width:100%; margin-top:20px; text-align: center;} .opder-info-form .order-info-box .order-buyback-form .order-buyback-summary .title{font-size:18px; font-weight:700;} .opder-info-form .order-info-box .order-buyback-form .order-buyback-summary .txt{margin-top:10px;font-size:16px; line-height:1.4;} .opder-info-form .order-info-box .order-buyback-form .order-buyback-summary .txt span{font-size:16px; font-weight:700;} .opder-info-form .order-info-box .order-buyback-form .order-buyback-step{width:100%; margin-top:20px; padding:20px 40px; background:#fff;} .opder-info-form .order-info-box .order-buyback-form .order-buyback-step .title{font-size:18px; font-weight:700;} .opder-info-form .order-info-box .order-buyback-form .order-buyback-step .buyback-step-list{display:flex; justify-content: space-between; position: relative; margin-top:23px; background:url(../images/smartbuy/vip_buyback_line.png) no-repeat; background-position:0px 17px; } .opder-info-form .order-info-box .order-buyback-form .order-buyback-step .buyback-step-list .buyback-step-con{} .opder-info-form .order-info-box .order-buyback-form .order-buyback-step .buyback-step-list .buyback-step-con .buyback-date{width:80px; height:34px; border-radius: 34px; border:1px solid #131313; background:#fff; display:flex; align-items: center; justify-content: center; font-size:13px; font-weight:600; background:#fff; position: relative; z-index: 2; } .opder-info-form .order-info-box .order-buyback-form .order-buyback-step .buyback-step-list .buyback-step-con .buyback-pay{ font-size:14px; margin-top:10px; height:24px; display: flex; align-items: center; justify-content: center; } .opder-info-form .order-info-box .order-buyback-form .order-buyback-step .buyback-step-list .buyback-step-con .buyback-pay span{font-size:18px; font-weight:700; color:#0061FD;} .opder-info-form .order-info-box .order-buyback-form .order-buyback-notice{width:100%; margin-top:20px;} .opder-info-form .order-info-box .order-buyback-form .order-buyback-notice li{font-size:14px; color:#666; position: relative; padding-left:14px; line-height:1.4; word-break: keep-all; margin-top:10px; } .opder-info-form .order-info-box .order-buyback-form .order-buyback-notice li:first-child{margin-top:0px;} .opder-info-form .order-info-box .order-buyback-form .order-buyback-notice li::before{content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:3px; top:7px; } .opder-info-form .order-info-box .car-timedeal{width:100%;border:1px solid #cd0000; border-radius: 5px; background:#fff; height:40px; display:flex; align-items: center; overflow: hidden; margin-bottom:20px; } .opder-info-form .order-info-box .car-timedeal .title{width:136px; height:100%; display:flex; align-items: center; background:#fef3f3; font-size:13px; font-weight:700; color:#cd0000; justify-content: center; } .opder-info-form .order-info-box .car-timedeal .title::before{content:""; display: block; width:20px; height:20px; margin-right:2px; background:url(../images/smartbuy/vip_detail_time.png) no-repeat center; } .opder-info-form .order-info-box .car-timedeal .txt{width:calc( 100% - 136px ); height:100%;display: flex; align-items: center; padding:0 15px; font-size:14px; font-weight:500; } .opder-info-form .order-info-box .car-timedeal .txt span{font-size:14px; font-weight:500; color:#cd0000; margin-left:5px;} .opder-info-form .order-info-box .car-info-form{width:100%;} .opder-info-form .order-info-box .car-info-form .car-info-box{width:100%; display:flex; align-items: flex-end;} .opder-info-form .order-info-box .car-info-form .car-info-box .car-info{width:calc( 100% - 230px );} .opder-info-form .order-info-box .car-info-form .car-info-box .car-info .car-name{font-size:24px; font-weight:700; line-height:1.3; letter-spacing:-0.5px; word-break:keep-all;} .opder-info-form .order-info-box .car-info-form .car-info-box .car-info .car-trim{font-size:24px !important; line-height:1.3; letter-spacing:-0.5px; word-break:keep-all;} .opder-info-form .order-info-box .car-info-form .car-info-box .car-info .car-infos{display: flex; align-items: center; margin-top:10px; } .opder-info-form .order-info-box .car-info-form .car-info-box .car-info .car-infos li{font-size:14px; font-weight:500; color:#888; display: flex; align-items: center;} .opder-info-form .order-info-box .car-info-form .car-info-box .car-info .car-infos li::after{content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#ddd; margin:0 6px; } .opder-info-form .order-info-box .car-info-form .car-info-box .car-info .car-infos li:last-child::after{display:none;} .opder-info-form .order-info-box .car-info-form .car-info-box .car-pay{width:210px; margin-left:20px;} .opder-info-form .order-info-box .car-info-form .car-info-box .car-pay .pay-discount{text-align: right; font-size:16px; font-weight:700; color:#999; text-decoration: line-through; } .opder-info-form .order-info-box .car-info-form .car-info-box .car-pay .pay{font-size:20px; font-weight:700;text-align: right; margin-top:5px;} .opder-info-form .order-info-box .car-info-form .car-info-box .car-pay .pay span{font-size:36px; font-weight:700;} .opder-info-form .order-info-box .car-info-form .car-info-box .car-pay .pay-type-list{display: flex; align-items: center; justify-content: flex-end; margin-top:10px;} .opder-info-form .order-info-box .car-info-form .car-info-box .car-pay .pay-type-list li{display:flex; gap:0px 6px; align-items: center;} .opder-info-form .order-info-box .car-info-form .car-info-box .car-pay .pay-type-list li::after{content:""; display:block; width:1px; height:10px; background:#ddd; margin:0px 8px; } .opder-info-form .order-info-box .car-info-form .car-info-box .car-pay .pay-type-list li:last-child::after{display:none;} .opder-info-form .order-info-box .car-info-form .car-info-box .car-pay .pay-type-list li .title{font-size:14px;} .opder-info-form .order-info-box .car-info-form .car-info-box .car-pay .pay-type-list li .type-pay{font-size:14px;} .opder-info-form .order-info-box .car-info-form .car-info-box .car-pay .pay-type-list li .type-pay span{font-size:14px; font-weight:700; color:#0061FD;} .opder-info-form .order-info-box .car-info-form .car-service{width:100%; margin-top:20px; border-radius: 5px; border:1px solid #eee; background: #f9f9f9; padding:10px 20px; } .opder-info-form .order-info-box .car-info-form .car-service .car-service-box{width:100%;} .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con{display:flex; height:40px; align-items: center; justify-content: space-between; } .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-name{display:flex; align-items: center; gap:0px 4px; font-size:16px; } .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-pay{} .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-pay .service-pay-box{display: flex; align-items: center; gap:0px 10px; } .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-pay .service-pay-box .service-title{display:flex; align-items: center; gap:0px 5px;} .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-pay .service-pay-box .service-title .name{font-size:16px; font-weight:700;} .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-pay .service-pay-box .service-title .pay{font-size:16px;} .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-pay .service-pay-box .service-title .pay span{font-size:18px; font-weight:700;} .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-pay .service-pay-box .service-delete{width:20px; height:20px; border-radius: 20px; background:#fff; border:1px solid #ddd; display:flex; align-items: center; justify-content: center; cursor: pointer; position: relative; overflow: hidden; } .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-pay .service-pay-box .service-delete img{position: relative; z-index: 1;} .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-pay .service-pay-box .service-delete:hover::before{ content:""; width:100%; height:100%; display:block; background:rgba(0,0,0,0.06); position: absolute; left:0; top:0; } .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-pay .service-pay-box .service-delete:active::before{content:""; width:100%; height:100%; display:block; background:rgba(0,0,0,0.1); position: absolute; left:0; top:0;} .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-pay .service-none{display:flex; align-items: center; justify-content: flex-end;} .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-pay .service-none .txt{font-size:16px; color:#666; margin-right:10px;} .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-pay .service-none button{width:80px; height:32px; border-radius: 4px; background:#fff; border:1px solid #ddd; display:flex; align-items: center; justify-content: center; font-size:14px; position: relative; overflow: hidden; } .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-pay .service-none button:hover::before{ content:""; width:100%; height:100%; display:block; background:rgba(0,0,0,0.06); position: absolute; left:0; top:0; } .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con .service-pay .service-none button:active::before{content:""; width:100%; height:100%; display:block; background:rgba(0,0,0,0.1); position: absolute; left:0; top:0;} /* 선택형 개선 경우 추가 */ .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con[data-name="repair-choice"]{align-items: flex-start; min-height:40px; height:auto; } .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con[data-name="repair-choice"] .service-name{display: flex; height:40px; display:flex; align-items: center;} .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con[data-name="repair-choice"] .service-pay{display:flex; flex-direction: column; gap:8px 0; padding:7px 0px; } .opder-info-form .order-info-box .car-info-form .car-service .car-service-box .car-service-con[data-name="repair-choice"] .service-pay .service-pay-box{height:26px;} .opder-info-form .order-info-box .car-info-form .car-total-pay{width:100%; display:flex; align-items: flex-end; justify-content: space-between; padding-top:20px; margin-top:20px; border-top:1px solid #131313;} .opder-info-form .order-info-box .car-info-form .car-total-pay .title{font-size:16px; font-weight:500;} .opder-info-form .order-info-box .car-info-form .car-total-pay .total-pay{font-size:20px; font-weight:700;} .opder-info-form .order-info-box .car-info-form .car-total-pay .total-pay span{font-size:36px; font-weight:700; color:#0061FD;} .opder-info-form .order-info-box .car-info-form .car-notice{width:100%; margin-top:40px;} .opder-info-form .order-info-box .car-info-form .car-notice li{font-size:14px; color:#666; position: relative; padding-left:14px; line-height:1.2; word-break: keep-all; margin-top:10px; } .opder-info-form .order-info-box .car-info-form .car-notice li:first-child{margin-top:0px;} .opder-info-form .order-info-box .car-info-form .car-notice li::before{content:""; display:block; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:3px; top:6px; } .opder-info-form .order-info-box .order-policy-form{width:100%; margin-top:64px;} .opder-info-form .order-info-box .order-policy-form .title{font-size:20px; font-weight:700;} .opder-info-form .order-info-box .order-policy-form .policy-list{width:100%; margin-top:20px; display: flex; flex-direction: column; gap:10px 0px; } .opder-info-form .order-info-box .order-policy-form .policy-list .policy-con{width:100%;} .opder-info-form .order-info-box .order-policy-form .policy-list .policy-con button{width:100%; height:80px; display:flex; align-items: center; justify-content: space-between; padding:0px 20px; border-radius:10px ; border:1px solid #ddd; background:#fff;} .opder-info-form .order-info-box .order-policy-form .policy-list .policy-con button::after{content:""; display:block; width:16px; height:16px; background:url(../images/smartbuy/payment_policy_arrow.png) no-repeat center;} .opder-info-form .order-info-box .order-policy-form .policy-list .policy-con button .txt{display:flex; align-items: center; font-size:16px; color:#515151; } .opder-info-form .order-info-box .order-policy-form .policy-list .policy-con button .txt::before{content:""; display: block; width:20px; height:20px; border-radius: 20px; background:#fff; border:1px solid #ddd; background:#fff url(../images/common/ico_chk_default.png) no-repeat center; margin:0px 8px 0px 2px; } .opder-info-form .order-info-box .order-policy-form .policy-list .policy-con button:hover{background:rgba(0,0,0,0.06);} .opder-info-form .order-info-box .order-policy-form .policy-list .policy-con button:active{background:rgba(0,0,0,0.1);} .opder-info-form .order-info-box .order-policy-form .policy-list .policy-con button:hover .txt::before{border:1px solid #131313; background:#fff url(../images/common/ico_chk_hover.png) no-repeat center; } .opder-info-form .order-info-box .order-policy-form .policy-list .policy-con button.active{background:#fff; border:1px solid #131313;} .opder-info-form .order-info-box .order-policy-form .policy-list .policy-con button.active .txt{font-weight:700; color:#131313;} .opder-info-form .order-info-box .order-policy-form .policy-list .policy-con button.active .txt::before{border:1px solid #0061FD; background:#0061FD url(../images/common/ico_chk_on.png) no-repeat center; } .opder-info-form .order-info-box.order-policy{ width:100%;} .opder-info-form .order-info-box.order-policy .policy-list{display:flex; flex-wrap:wrap; gap:10px; flex-direction:row;} .opder-info-form .order-info-box.order-policy .policy-list .policy-con{width:calc( 50% - 5px );} #carAllOptionPop.payment-option .btn{width:auto; padding:0 45px;} /* 결제라인 - 서비스 선택 팝업 */ #serviceSelectPop{display:none;} #serviceSelectPop .vip-service-form{width:100%; display:flex; justify-content: space-between; margin-top:20px; } #serviceSelectPop .vip-service-form .vip-service-box{width:calc( 50% - 10px );} #serviceSelectPop .vip-service-form .vip-service-box .title{display:flex; align-items: center;} #serviceSelectPop .vip-service-form .vip-service-box .title .service-name{font-size:18px; font-weight:700; } #serviceSelectPop .vip-service-form .vip-service-box .title .tooltip{margin-left:5px;} #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con{width:100%; margin-top:12px; } #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont{width:100%; margin-top:8px; display: flex; align-items: center;} #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont:first-child{margin-top:0px;} #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont input[type=radio]{display:none;} #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont .service-chk{display:flex; cursor: pointer; flex-direction: column; justify-content: center; width:100%; height:84px; border-radius: 10px; border:1px solid #ddd; background:#fff; padding:20px; position: relative; } #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont .service-chk .service-con{ width:100%; display:flex; align-items: center; justify-content: space-between; } #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont .service-chk .service-con .service-con-title{display:flex; align-items: center;} #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont .service-chk .service-con .service-con-title .service-con-dot{width:20px; height:20px; border-radius: 20px; border:1px solid #ddd; background:#fff; position: relative; margin-right:8px; } #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont .service-chk .service-con .service-con-title .title{font-size:16px; font-weight:400;} #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont .service-chk .service-con .service-pay{font-size:14px;} #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont .service-chk .service-con .service-pay span{font-size:16px; font-weight:700;} #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont .service-chk .service-summery{width:100%; display:flex; align-items: center; padding-left:30px; margin-top:4px;} #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont .service-chk .service-summery .txt{font-size:12px; color:#888; display:flex; align-items: center;} #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont .service-chk .service-summery .txt::after{content:""; display:block; width:1px; height:10px; background:#ddd; margin:0px 5px; } #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont .service-chk .service-summery .txt:last-child::after{display:none;} #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont input[type=radio]:checked + .service-chk .service-con .service-con-title .service-con-dot{border:1px solid #0061FD;} #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont input[type=radio]:checked + .service-chk .service-con .service-con-title .service-con-dot::after{content:""; display:block; width:12px; height:12px; border-radius: 12px; background:#0061FD; position: absolute; left:50%; top:50%; transform: translate( -50%, -50% ); } #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont input[type=radio]:checked + .service-chk .service-con .service-con-title .title{font-weight:700;} #serviceSelectPop .vip-service-form .vip-service-box .vip-service-con .service-cont .service-chk .service-recommend{width:41px; height:21px; background:url(../images/smartbuy/service_recommend_bg.png) no-repeat center; position: absolute; left:-1px; top:-1px; font-size:12px; font-weight:700; color:#fff; display:flex; align-items: center; padding-left:7px; } /* 결제라인 환불 약관 팝업 */ #refundPop{display:none;} #refundPop .layer-pop-bt .btn{width:auto; padding:0 25px;} /* 결제라인 - 계약자 정보 확인 */ .payment-form .order-tab-form{width:100%;} .payment-form .order-tab-form .title{font-size:20px; font-weight:700;} .payment-form .order-tab-form .order-tab-list{width:100%; display:flex; align-items: center; gap:0px 15px; margin-top:20px;} .payment-form .order-tab-form .order-tab-list .order-tab-con{width:20%; max-width:20%; height:60px; border-radius: 2px; display:flex; align-items: center; justify-content: center; position: relative; background:#fff; font-size:14px; color:#515151; border:1px solid #ddd; cursor: pointer; } .payment-form .order-tab-form .order-tab-list .order-tab-con:hover{background:rgba(0,0,0,0.06);} .payment-form .order-tab-form .order-tab-list .order-tab-con:active{background:rgba(0,0,0,0.1);} .payment-form .order-tab-form .order-tab-list .order-tab-con.active{border:1px solid #131313; color:#131313;} .payment-form .order-tab-form .order-tab-list .order-tab-con.active::after{content:""; display:block; width:18px; height:18px; border-radius: 18px; background:#333 url(../images/live/live_check_ico.png) no-repeat center; position: absolute; right:-7px; top:-7px; } .payment-form .order-form{width:100%;} .payment-form .order-form .order-box{width:100%; margin-top:60px;} .payment-form .order-form .order-box .order-title-box{display:flex; justify-content: space-between; align-items: center;} .payment-form .order-form .order-box .order-title-box .order-title-con{display:flex; align-items: flex-end; gap:0px 10px; } .payment-form .order-form .order-box .order-title-box .order-title-con .title{font-size:18px; font-weight:700;} .payment-form .order-form .order-box .order-title-box .order-title-con .txt{font-size:14px; font-weight:500; color:#666;} .payment-form .order-form .order-box .order-title-box .sub-txt span{font-size:14px; color:#515151;} /* 아이콘 타입 */ .payment-form .order-tab-form .order-tab-list.ico-type .order-tab-con{width:33.33%; max-width:33.33%;} .payment-form .order-tab-form .order-tab-list.ico-type .order-tab-con::before{content:""; display:block; width:24px; height:24px; margin-right:4px;} .payment-form .order-tab-form .order-tab-list.ico-type .order-tab-con[data-name='cash']::before{background: url(../images/smartbuy/ic_card.png) no-repeat center;} .payment-form .order-tab-form .order-tab-list.ico-type .order-tab-con[data-name='plan']::before{background: url(../images/smartbuy/ic_installment.png) no-repeat center;} .payment-form .order-tab-form .order-tab-list.ico-type .order-tab-con[data-name='lease']::before{background: url(../images/smartbuy/ic_lease.png) no-repeat center;} .payment-form .order-tab-form .order-tab-list.ico-type .order-tab-con.active[data-name='cash']::before{background: url(../images/smartbuy/ic_card_on.png) no-repeat center;} .payment-form .order-tab-form .order-tab-list.ico-type .order-tab-con.active[data-name='plan']::before{background: url(../images/smartbuy/ic_installment_on.png) no-repeat center;} .payment-form .order-tab-form .order-tab-list.ico-type .order-tab-con.active[data-name='lease']::before{background: url(../images/smartbuy/ic_lease_on.png) no-repeat center;} /* 테이블 형식 */ .payment-form .order-form .order-box .order-tbl{width:100%; border-top:1px solid #131313; margin-top:24px;} .payment-form .order-form .order-box .order-tbl .order-tr{width:100%;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con{width:100%; display:flex; border-bottom:1px solid #eee; padding:10px 0px; min-height:64px; } .payment-form .order-form .order-box .order-tbl .order-tr .order-con .joint-txt{display:flex; align-items: flex-end; font-size:16px; color:#515151; } .payment-form .order-form .order-box .order-tbl .order-tr .order-con .title{width:145px; margin-top:15px;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .title span{font-size:15px; font-weight:500; display:flex;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont{width:calc( 100% - 145px ); display: flex; align-items: center; flex-wrap: wrap; gap:10px 10px; } .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont input[type="text"]{padding:0px 12px; height:44px; border:1px solid #ddd; outline: none; font-size:14px; } .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont input[type="text"]:focus{border:1px solid #131313;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont input[type="text"]:read-only{background:#e3e3e3;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont input[type="text"].wd270{width:100%; max-width: 270px;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont input[type="text"].wd400{width:100%; max-width: 400px;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont input[type="text"].wd230{width:100%; max-width: 230px;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont input[type="text"].wd100p{width:100%;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont input[type="text"].wd114{width:114px;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont input[type="text"].wd185{width:185px;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .txt{font-size:14px; color:#888; width:100%;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .check-box{width:100%;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .check-box label span{font-size:15px;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .btn{width:120px; height:44px;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .btn span{font-size:15px; font-weight:500; color:#131313;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .line{font-size:16px; display:flex; align-items: center; } .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont textarea{width:100%; height:160px; border:1px solid #ddd; background:#fff; padding:8px 12px; font-size:14px; line-height:1.4; resize: none; outline: none; } .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont textarea:focus{border:1px solid #131313;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .select-box{width:160px; } .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .select-box .select-choice{height:44px; font-size:14px;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .select-box .select-list{top:44px;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .select-box .select-list li{font-size:14px;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .manager-inpt-box{width:270px; position:relative;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .manager-inpt-box input.active{background:#fff !important; color:#666;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .manager-inpt-box .manaser-delete-btn{ display:none; width:16px; height:16px; border-radius:16px; align-items:center; justify-content:center; background:#ddd; cursor:pointer; position:absolute; right:20px; top:50%; transform: translate(0px, -50%);} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .manager-inpt-box .manaser-delete-btn.active{display:flex;} .payment-form .order-form .order-box .order-policy-form{width:100%; border-top:1px solid #131313; margin-top:24px; padding-bottom:100px; border-bottom:1px solid #ddd; } .payment-form .order-form .order-box .order-policy-form .order-policy-all{display:flex; align-items: center; height: 46px; border-bottom:1px solid #eee;} .payment-form .order-form .order-box .order-policy-form .order-policy-all .check-box label span{font-size:15px; font-weight:500;} .payment-form .order-form .order-box .order-policy-form .order-policy-box{width:100%;} .payment-form .order-form .order-box .order-policy-form .order-policy-box .order-policy-con{width:100%;padding:18px 0px;display:flex; align-items: center; justify-content: space-between;} .payment-form .order-form .order-box .order-policy-form .order-policy-box .order-policy-con .order-policy-title{} .payment-form .order-form .order-box .order-policy-form .order-policy-box .order-policy-con .policy-arrow{cursor:pointer; transform: rotate(180deg); transition: all 0.2s;} .payment-form .order-form .order-box .order-policy-form .order-policy-box.active .order-policy-con .policy-arrow{cursor:pointer; transform: rotate(0deg); transition: all 0.2s;} .payment-form .order-form .order-box .order-policy-form .order-policy-box .check-box label span{font-weight:500;} .payment-form .order-form .order-box .order-policy-form .order-policy-box .order-policy-txt{padding-left:30px; font-size:12px; color:#666; margin-top:5px;} .payment-form .order-form .order-box .order-policy-form .order-policy-box .order-policy-summary{padding:20px 20px 48px 20px; background:#f9f9f9; display:none; } .payment-form .order-form .order-box .order-policy-form .order-policy-box .order-policy-summary p{font-size:14px; color:#888; line-height:1.4;} .payment-form .order-form .order-box .order-policy-form .order-policy-box .order-policy-summary p span{font-size:14px; color:#888;} .payment-form .order-form .order-box .order-policy-form .order-policy-box .order-policy-summary table{font-size:14px; border:1px solid #ddd;} .payment-form .order-form .order-box .order-policy-form .order-policy-box .order-policy-summary table tr th{font-size:14px; border:1px solid #ddd;} .payment-form .order-form .order-box .order-policy-form .order-policy-box .order-policy-summary table tr td{font-size:14px; border:1px solid #ddd;} /* 할부 개월수 선택 */ .payment-form .order-form .order-box.plan-type{display:none;} .payment-form .order-form .order-box .order-plan-select{width:100%; display:flex; align-items: center; justify-content: flex-end; margin-top:24px;} .payment-form .order-form .order-box .order-plan-select .select-box{width:270px;} .payment-form .order-form .order-box .order-plan-select .select-box .select-choice{height:44px; font-size:14px;} .payment-form .order-form .order-box .order-plan-select .select-box .select-list{top:44px;} .payment-form .order-form .order-box .order-plan-select .select-box .select-list li{font-size:14px;} /* 할부 개월수 팝업 */ #payPlanPop{display:none;} #payPlanPop .layer-pop-body{overflow: unset; padding:40px 0;} /* 담당 매니저 찾기 팝업 */ #managerSearchPop{justify-content: flex-start; height:400px; width:500px; display:none;} #managerSearchPop .layer-pop-head{height:58px;} #managerSearchPop .layer-pop-body{height:calc( 100% - 58px ); } #managerSearchPop .manager-search-form{width:100%; display:flex; gap:0px 10px; margin:20px 0px;} #managerSearchPop .manager-search-form .manager-search-inpt{position: relative;} #managerSearchPop .manager-search-form .manager-search-inpt input[type='text']{width:290px; height:44px; border:1px solid #ddd; outline: none; font-size:14px; padding:0 12px; } #managerSearchPop .manager-search-form .manager-search-inpt .list-search-delete{width:16px; height:16px; display:none; align-items: center; justify-content: center; border-radius: 16px; background:#ddd; position: absolute; right:12px; top:50%; transform: translate( -0px, -50% ); cursor: pointer; } #managerSearchPop .manager-search-form .manager-search-inpt .list-search-delete.active{display:flex;} #managerSearchPop .manager-search-form .btn{width:120px; height:44px;} #managerSearchPop .manager-list{width:100%;} #managerSearchPop .manager-list .title-box{width:100%; display:flex; align-items: center; gap:0px 8px; padding-bottom: 18px; border-bottom:1px solid #131313;} #managerSearchPop .manager-list .title-box .title{font-size:18px; font-weight:700;} #managerSearchPop .manager-list .title-box .txt{font-size:16px;} #managerSearchPop .manager-list .title-box .txt span{font-size:16px; font-weight:700; color:#0061FD;} #managerSearchPop .manager-list .manager-list-box{width:100%; height:164px; overflow: auto;} #managerSearchPop .manager-list .manager-list-box .manager-list-head{width:100%; padding:0 20px; display:flex; gap:0px 20px; border-bottom:1px solid #ddd;} #managerSearchPop .manager-list .manager-list-box .manager-list-head li{display:flex; align-items: center; justify-content: center; height:44px; font-size:15px; font-weight:500; color:#666; } #managerSearchPop .manager-list .manager-list-box .manager-list-head li:nth-child(1){width:130px;} #managerSearchPop .manager-list .manager-list-box .manager-list-head li:nth-child(2){width:130px;} #managerSearchPop .manager-list .manager-list-box .manager-list-head li:nth-child(3){width:80px;} #managerSearchPop .manager-list .manager-list-box .manager-list-con{width:100%; padding:0 20px; display:flex; gap:0px 20px; border-bottom:1px solid #ddd;} #managerSearchPop .manager-list .manager-list-box .manager-list-con li{display:flex; align-items: center; justify-content: center; height:60px; font-size:16px; font-weight:500; padding:10px 0px; } #managerSearchPop .manager-list .manager-list-box .manager-list-con li:nth-child(1){width:130px;} #managerSearchPop .manager-list .manager-list-box .manager-list-con li:nth-child(2){width:130px;} #managerSearchPop .manager-list .manager-list-box .manager-list-con li:nth-child(3){width:80px;} #managerSearchPop .manager-list .manager-list-box .manager-list-con li .btn span{font-size:16px; font-weight:500;} #managerSearchPop .search-none-form .search-none-box{margin:0px; height:216px;} /* 주문서 작성 - 결제 */ /* 쿠폰 */ .order-coupon-tbl{width:100%; margin-top:24px; border-top:1px solid #131313;} .order-coupon-tbl .order-tr{width:100%;} .order-coupon-tbl .order-tr .order-con{display:flex; padding:10px 0px; min-height:64px; align-items: center; justify-content: space-between; border-bottom:1px solid #eee;} .order-coupon-tbl .order-tr .order-con .title{} .order-coupon-tbl .order-tr .order-con .title span{font-size:15px; font-weight:500;} .order-coupon-tbl .order-tr .order-con .cont{display:flex; align-items: center; justify-content: flex-end; gap:10px 10px;} .order-coupon-tbl .order-tr .order-con .cont .select-box{width:270px;} .order-coupon-tbl .order-tr .order-con .cont .select-box .select-choice{height:44px; font-size:14px; } .order-coupon-tbl .order-tr .order-con .cont .select-box .select-list{top:44px;} .order-coupon-tbl .order-tr .order-con .cont .select-box .select-list li{font-size:14px;} .order-coupon-tbl .order-tr .order-con .cont .coupon-btn{width:120px; height:44px; background:#f4f9ff; display:flex; align-items: center; justify-content: center;} .order-coupon-tbl .order-tr .order-con .cont .coupon-btn span{font-size:15px; font-weight:500; color:#0061FD;} .order-coupon-tbl .order-tr .order-con .cont .coupon-btn.active{background:#e3e3e3;} .order-coupon-tbl .order-tr .order-con .cont .coupon-btn.active span{color:#acacac;} .order-coupon-tbl .order-tr .order-con .cont .coupon-discount{font-size:16px;} .order-coupon-tbl .order-tr .order-con .cont .coupon-discount span{font-size:16px; font-weight:700;} /* 결제 금액 정보 */ .order-pay-form{width:100%; margin-top:24px; border:1px solid #131313;} .order-pay-form .order-pay-box{width:100%; display:flex; align-items: center;} .order-pay-form .order-pay-box .order-pay-con{width:33.33%; padding:40px 0px; display:flex; flex-direction: column; align-items: center; justify-content: center; border-right:1px solid #eee; position: relative; } .order-pay-form .order-pay-box .order-pay-con:last-child{border-right:0px;} .order-pay-form .order-pay-box .order-pay-con .title{width:100%; height:24px; text-align: center; font-size: 16px; color:#666; } .order-pay-form .order-pay-box .order-pay-con .pay{ margin-top: 10px; font-size:20px; font-weight:700; } .order-pay-form .order-pay-box .order-pay-con .pay span{font-size:36px; font-weight:700;} .order-pay-form .order-pay-box .order-pay-con::after{content:""; display:block; width:36px; height:36px; position: absolute; right:-18px; top:50%; transform: translate( -0, -50% );} .order-pay-form .order-pay-box .order-pay-con:nth-child(1)::after{background:url(../images/smartbuy/ic_minus.png) no-repeat center;} .order-pay-form .order-pay-box .order-pay-con:nth-child(2)::after{background:url(../images/smartbuy/ic_equal.png) no-repeat center;} .order-pay-form .order-pay-box .order-pay-con:nth-child(3)::after{display:none;} /* 결제 가이드 */ .order-payment-guide{width:100%; margin-top:24px;} .order-payment-guide .order-guide-tbl{width:100%; border:1px solid #ddd;} .order-payment-guide .order-guide-tbl tr td{padding:10px; text-align: center; vertical-align: middle; border:1px solid #ddd; height:56px; font-size:14px; color:#515151; line-height:1.4;} .order-payment-guide .order-guide-tbl tr th{border:1px solid #ddd; height:56px; font-size:14px; font-weight:400; text-align: center; vertical-align: middle; color:#131313; background:#f9f9f9; } .order-payment-guide .order-guide-tbl tr td:nth-child(1){width:160px;} .order-payment-guide .order-guide-tbl tr td:nth-child(2){width:346px;} .order-payment-guide .order-guide-tbl tr td:nth-child(3){width:346px;} .order-payment-guide .order-guide-tbl tr td:nth-child(4){width:351px;} .order-payment-guide .order-guide-tbl tr td .guide-cont{width:100%; height:100%;} .order-payment-guide .order-guide-tbl tr td .guide-cont .title-box{width:100%; display:flex; align-items: center; justify-content: space-between; height:44px; padding:0 10px; } .order-payment-guide .order-guide-tbl tr td .guide-cont .title-box .title{display:flex; align-items: center; font-size:16px; } .order-payment-guide .order-guide-tbl tr td .guide-cont .title-box .total-pay{display:flex; font-size:16px; } .order-payment-guide .order-guide-tbl tr td .guide-cont .title-box .total-pay span{font-size:16px; font-weight:700; margin-right:2px;} .order-payment-guide .order-guide-tbl tr td .guide-cont .summary-box{width:100%; height:calc( 100% - 44px ); padding:10px 20px; background:#f9f9f9; display:flex; flex-direction: column; gap:10px 0px; } .order-payment-guide .order-guide-tbl tr td .guide-cont .summary-box .summary-con{width:100%; display:flex; align-items: center; justify-content: space-between; height:24px;} .order-payment-guide .order-guide-tbl tr td .guide-cont .summary-box .summary-con .title{display:flex; align-items: center; gap:0px 5px; } .order-payment-guide .order-guide-tbl tr td .guide-cont .summary-box .summary-con .title .name{font-size:14px; color:#666;} .order-payment-guide .order-guide-tbl tr td .guide-cont .summary-box .summary-con .title .choice{font-size:14px; font-weight:700; color:#666;} .order-payment-guide .order-guide-tbl tr td .guide-cont .summary-box .summary-con .pay{font-size:14px;} .order-payment-guide .order-guide-tbl tr td .guide-cont .summary-box .summary-con .pay span{font-size:14px; font-weight:700;} .order-payment-guide .order-guide-tbl tr td .guide-cont .title-box.arrow{cursor:pointer;} .order-payment-guide .order-guide-tbl tr td .guide-cont .title-box.arrow .title::after{content:""; display:block; width:24px; height:24px; background:url(../images/smartbuy/payment_arrow.png) no-repeat center; transform: rotate(180deg); transition: all 0.2s; } .order-payment-guide .order-guide-tbl tr td .guide-cont .title-box.arrow.active .title::after{transform: rotate(0deg); transition: all 0.2s;} .order-payment-guide .payment-guide-summary{width:100%; margin-top:20px; display:flex; flex-direction: column; gap:10px 0px;} .order-payment-guide .payment-guide-summary li{padding-left:14px; font-size:14px; color:#666; position: relative; } .order-payment-guide .payment-guide-summary li::before{content:""; display:block; width:3px; height:3px; background:#999; border-radius: 3px; position: absolute; left:3px; top:5px;} .order-payment-guide .payment-guide-summary li.focus{color:#131313; font-weight:700;} .order-payment-guide .payment-guide-summary li.focus::before{content:""; display:block; width:3px; height:3px; background:#131313; border-radius: 3px; position: absolute; left:3px; top:5px;} .payment-form .order-form .order-box .order-pay-choice{width:100%; display:flex; align-items: center; gap:0px 15px; margin-top:20px;} .payment-form .order-form .order-box .order-pay-choice .pay-choice-btn{width:100%; max-width:100%; height:60px; border-radius: 2px; display:flex; align-items: center; justify-content: center; position: relative; background:#fff; border:1px solid #ddd; cursor: pointer; position: relative; } .payment-form .order-form .order-box .order-pay-choice .pay-choice-btn .title{display:flex; align-items: center; justify-content: center; font-size:14px; color:#515151; } .payment-form .order-form .order-box .order-pay-choice .pay-choice-btn .title span{font-size:14px; color:#515151; font-weight:700;} .payment-form .order-form .order-box .order-pay-choice .pay-choice-btn:hover{background:rgba(0,0,0,0.06);} .payment-form .order-form .order-box .order-pay-choice .pay-choice-btn:active{background:rgba(0,0,0,0.1);} .payment-form .order-form .order-box .order-pay-choice .pay-choice-btn.active{border:1px solid #131313; color:#131313;} .payment-form .order-form .order-box .order-pay-choice .pay-choice-btn.active .title{color:#131313;} .payment-form .order-form .order-box .order-pay-choice .pay-choice-btn.active .title span{color:#131313;} .payment-form .order-form .order-box .order-pay-choice .pay-choice-btn.active::after{content:""; display:block; width:18px; height:18px; border-radius: 18px; background:#333 url(../images/live/live_check_ico.png) no-repeat center; position: absolute; right:-7px; top:-7px; } .payment-form .order-form .order-box .order-pay-choice .pay-choice-btn[data-name="pay-deposit"]::before{content:""; display:block; width:24px; height:24px; background:url(../images/smartbuy/ic_deposit.png) no-repeat center; margin-right:4px;} .payment-form .order-form .order-box .order-pay-choice .pay-choice-btn[data-name="pay-card"]::before{content:""; display:block; width:24px; height:24px; background:url(../images/smartbuy/btn_ic_card.png) no-repeat center; margin-right:4px;} .payment-form .order-form .order-box .order-pay-choice .pay-choice-btn.active[data-name="pay-deposit"]::before{content:""; display:block; width:24px; height:24px; background:url(../images/smartbuy/ic_deposit_on.png) no-repeat center; margin-right:4px;} .payment-form .order-form .order-box .order-pay-choice .pay-choice-btn.active[data-name="pay-card"]::before{content:""; display:block; width:24px; height:24px; background:url(../images/smartbuy/btn_ic_card_on.png) no-repeat center; margin-right:4px;} .payment-form .order-form .order-box .order-pay-choice .pay-choice-btn:hover .bubble{animation:myToolMove02 0.4s ease-in-out infinite alternate-reverse;} .payment-form .order-form .order-box .total-pay-form{display:flex; align-items: flex-end; justify-content: space-between; padding-top:20px; width:100%; border-top:1px solid #131313; } .payment-form .order-form .order-box .total-pay-form .title{font-size:16px; font-weight:700;} .payment-form .order-form .order-box .total-pay-form .pay{display:flex; align-items: flex-end; font-size:20px; font-weight:700;} .payment-form .order-form .order-box .total-pay-form .pay span{font-size:36px; font-weight:700;} .payment-form .order-form .order-box .total-pay-summary{margin-top:20px; display:flex; align-items: center; justify-content: flex-end} .payment-form .order-form .order-box .total-pay-summary li{padding-left:14px; font-size:14px; color:#666; position: relative; } .payment-form .order-form .order-box .total-pay-summary li::before{content:""; display:block; width:3px; height:3px; background:#999; border-radius: 3px; position: absolute; left:3px; top:5px;} /* 할부 */ .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .plan-box{width:400px; position: relative; } .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .plan-box span{position: absolute; font-size:14px; coloR:#999; right:12px; top:50%; transform: translate( -0, -50% ); } .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .plan-box input{text-align: right; padding-right:27px; font-weight:700; } .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .plan-box input:read-only{font-weight:400;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .choice-box{display:flex;align-items: center; width:400px; } .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .choice-box .choice-box{} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .choice-box .choice-box input[type='radio']{display:none;width:100%; max-width:100%; } .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .choice-box .choice-box label{height:48px; background:#f9f9f9; display:flex; align-items: center; justify-content: center; border:1px solid #ddd; border-right:0px; width:100%; cursor: pointer; } .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .choice-box .choice-box:last-child label{border-right:1px solid #ddd; border-radius: 0px 5px 5px 0px;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .choice-box .choice-box:first-child label{border-radius: 5px 0px 0px 5px;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .choice-box .choice-box label span{font-size:16px; color:#666;} .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .choice-box .choice-box input[type='radio']:checked + label{background: #0061FD; border:1px solid #0061FD; } .payment-form .order-form .order-box .order-tbl .order-tr .order-con .cont .choice-box .choice-box input[type='radio']:checked + label span{color:#fff;} /* 구매 내역 상세 */ .order-view-form{width:100%; max-width:1200px; margin:0 auto;} .order-view-form .order-view-car{width:100%; border-top:1px solid #131313;} .order-view-form .order-view-car.payment-step{margin-bottom:58px;} .order-view-form .order-view-car .order-car-head{width:100%; border-bottom:1px solid #acacac; height:64px; display:flex; align-items: center; } .order-view-form .order-view-car .order-car-head li{width:100% ; max-width:100% ;font-size:16px; font-weight:700; color:#333; text-align: center; } .order-view-form .order-view-car .order-car-head li:first-child{ padding:0 20px; text-align: left; } .order-view-form .order-view-car .order-car-head li:nth-child(n+2){max-width:150px;} .order-view-form .order-view-car .order-car-body{width:100%; display:flex; align-items: center; border-bottom:1px solid #ddd;} .order-view-form .order-view-car .order-car-body .car-info-box{padding:20px 20px 40px 20px; display:flex; gap:0px 20px; cursor:pointer;} .order-view-form .order-view-car .order-car-body li{width:100% ; max-width:100%; text-align: center; } .order-view-form .order-view-car .order-car-body li:first-child{text-align: left; } .order-view-form .order-view-car .order-car-body li:nth-child(n+2){max-width:150px;} .order-view-form .order-view-car .order-car-body li span{font-size:18px; font-weight:500;} .order-view-form .order-view-car .order-car-body li span.contract-check{color:#666;} .order-view-form .order-view-car .order-car-body li span.contract-wait{color:#0061FD;} .order-view-form .order-view-car .order-car-body li span.payment-check{color:#0061FD;} .order-view-form .order-view-car .order-car-body li span.order-status{font-size:32px; color:#131313; font-weight:700;} .order-view-form .order-view-car .order-car-body li .order-status-txt{ font-size:12px; color:#888; margin-top:10px; } .order-view-form .order-view-car .order-car-body .car-info-box .car-thumnail{width:136px; height:102px;} .order-view-form .order-view-car .order-car-body .car-info-box .car-info{width:calc( 100% - 156px );} .order-view-form .order-view-car .order-car-body .car-info-box .car-info .logo-box{display: flex; align-items: center;} .order-view-form.finance .order-view-car .order-car-body .car-info-box .car-info .logo-box::before{content:""; display:block; width:14px; height:14px; background:url(../images/contents/lp_finance_ico.png) no-repeat center; order:2; } .order-view-form.finance .order-view-car .order-car-body .car-info-box .car-info .logo-box::after{content:""; display:block; width:24px; height:24px; order:3; } .order-view-form.finance.bnk .order-view-car .order-car-body .car-info-box .car-info .logo-box::after{background:url(../images/contents/lp_bnk_logo.png) no-repeat center;} .order-view-form.finance.mc .order-view-car .order-car-body .car-info-box .car-info .logo-box::after{background:url(../images/contents/lp_mc_logo.png) no-repeat center;} .order-view-form.finance.woori .order-view-car .order-car-body .car-info-box .car-info .logo-box::after{background:url(../images/contents/lp_woori_logo.png) no-repeat center;} .order-view-form.finance.sk .order-view-car .order-car-body .car-info-box .car-info .logo-box::after{background:url(../images/contents/lp_sk_logo.png) no-repeat center;} .order-view-form.finance.hana .order-view-car .order-car-body .car-info-box .car-info .logo-box::after{background:url(../images/contents/lp_hana_logo.png) no-repeat center;} .order-view-form.finance.dgb .order-view-car .order-car-body .car-info-box .car-info .logo-box::after{display:none;} .order-view-form.finance.dgb .order-view-car .order-car-body .car-info-box .car-info .logo-box::before{display:none;} .order-view-form.finance.hyundai .order-view-car .order-car-body .car-info-box .car-info .logo-box::after{background:url(../images/contents/lp_hyundai_logo.png) no-repeat center;} .order-view-form .order-view-car .order-car-body .car-info-box .car-info .car-name{font-size:16px; font-weight:700; height:24px; width:100%; line-height:24px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .order-view-form .order-view-car .order-car-body .car-info-box .car-info .car-trim{font-size:16px !important; font-weight:400; height:24px; width:100%; line-height:24px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .order-view-form .order-view-car .order-car-body .car-info-box .car-info .car-infos{display:flex; align-items: center; height:24px; gap:5px 8px; flex-wrap: wrap; } .order-view-form .order-view-car .order-car-body .car-info-box .car-info .car-infos li{font-size:12px; color:#888; width:auto; font-weight:400;} .order-view-form .order-view-title{padding:50px 0px; width:100%; display: flex; align-items:center; justify-content: center;} /* .order-view-form .order-view-title span{font-size:24px; font-weight:500; display:flex; align-items: center;} .order-view-form .order-view-title span::before{content:""; width:32px; height: 32px; border-radius: 32px; background:#f4f9ff url(../images/smartbuy/payment_check_ico.png) no-repeat center; margin-right:10px; } */ .order-view-form .order-view-title .order-title{font-size:24px; font-weight:500; display:flex; align-items: center;} .order-view-form .order-view-title .order-title::before{content:""; width:32px; height: 32px; border-radius: 32px; background:#f4f9ff url(../images/smartbuy/payment_check_ico.png) no-repeat center; margin-right:10px; } .order-view-form .order-view-box{width:100%; display:flex; flex-direction: column; gap:60px 0px; } .order-view-form .order-view-box .order-pay-info{width:100%; display:flex; border:1px solid #ddd;} .order-view-form .order-view-box .order-pay-info .pay-info-box{width:50%;padding:20px; border-left:1px solid #ddd;} .order-view-form .order-view-box .order-pay-info .pay-info-box:first-child{border-left:0px; position: relative;} .order-view-form .order-view-box .order-pay-info .pay-info-box:first-child::before{content:""; display:block; width:36px; height:36px; background:url(../images/smartbuy/ic_equal.png) no-repeat center; position: absolute; right:-18px; top:30px; } .order-view-form .order-view-box .order-pay-info .pay-info-box .pay-info-total{width:100%; height:56px; display:flex; align-items: center; justify-content: space-between; padding:0 20px; } .order-view-form .order-view-box .order-pay-info .pay-info-box .pay-info-total .title{font-size:16px; font-weight:700;} .order-view-form .order-view-box .order-pay-info .pay-info-box .pay-info-total .pay{font-size:16px;} .order-view-form .order-view-box .order-pay-info .pay-info-box .pay-info-total .pay span{font-size:28px; font-weight:700; } .order-view-form .order-view-box .order-pay-info .pay-info-box .pay-list{margin-top:20px; width:100%; background:#f9f9f9; padding:10px 20px; height:calc( 100% - 76px ); } .order-view-form .order-view-box .order-pay-info .pay-info-box .pay-list .pay-list-con{display:flex; align-items: center; height:40px; width:100%; justify-content: space-between; } .order-view-form .order-view-box .order-pay-info .pay-info-box .pay-list .pay-list-con .title{font-size:16px;} .order-view-form .order-view-box .order-pay-info .pay-info-box .pay-list .pay-list-con .pay{font-size:16px;} .order-view-form .order-view-box .order-pay-info .pay-info-box .pay-list .pay-list-con .pay span{font-size:16px; font-weight:700;} .order-view-form .order-view-box .order-view-con{width:100%; } .order-view-form .order-view-box .order-view-con .title{font-size:18px; font-weight:700; margin-bottom:24px; display: flex; align-items: flex-end;} .order-view-form .order-view-box .order-view-con .title span{font-size:14px; color:#666; font-weight:500; margin-left:10px;} .order-view-form .order-view-box .order-view-con .cont{width:100%; display:flex; flex-direction: column; gap:20px 0px; } .order-view-form .order-view-box .order-view-con .cont .order-view-tbl{width:100%; border:1px solid #ddd;} .order-view-form .order-view-box .order-view-con .cont .order-view-tbl .order-view-tbl-box .order-view-tbl-con{display:flex;} .order-view-form .order-view-box .order-view-con .cont .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-th{width:160px; min-height:56px; display:flex; align-items: center; font-size:14px; background:#f8f8f8; color:#000; border-bottom:1px solid #ddd; border-right:1px solid #ddd; padding:15px 14px; } .order-view-form .order-view-box .order-view-con .cont .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td{padding:15px 14px; min-height:56px; display:flex; font-size:14px; color:#515151; align-items: center; width:calc( 50% - 160px ); max-width:437px; border-bottom:1px solid #ddd; border-right:1px solid #ddd; word-break: keep-all; line-height:1.4; } .order-view-form .order-view-box .order-view-con .cont .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td:last-child{border-right:0px;} .order-view-form .order-view-box .order-view-con .cont .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td.type02{width:calc( 100% - 160px )} .order-view-form .order-view-box .order-view-con .cont .order-view-tbl .order-view-tbl-box .order-view-tbl-con:last-child .tbl-th{border-bottom:0px;} .order-view-form .order-view-box .order-view-con .cont .order-view-tbl .order-view-tbl-box .order-view-tbl-con:last-child .tbl-td{border-bottom:0px;} .order-view-form .order-view-box .order-view-con .cont .order-view-tbl .tbl-title{width:100%; height:56px; display:flex; align-items: center; justify-content: center; border-bottom:1px solid #ddd; background:#f4f4f4; font-size:14px; } .order-view-form .order-view-box .order-view-con .cont .txt{font-size:14px; color:#666;} .order-view-form .order-view-box .order-view-con .cont .step-list{display:flex;} .order-view-form .order-view-box .order-view-con .cont .step-list .step-con{width:100%; max-width:100%; display:flex; flex-direction: column; align-items: center; position: relative; } .order-view-form .order-view-box .order-view-con .cont .step-list .step-con::after{content:""; display:block; width:16px; height:16px; background:url(../images/smartbuy/payment_step_arrow.png) no-repeat center; position: absolute; right:-8px; top:50%; transform: translate( -0, -50% ); } .order-view-form .order-view-box .order-view-con .cont .step-list .step-con:last-child::after{display:none;} .order-view-form .order-view-box .order-view-con .cont .step-list .step-con .number{display:flex; align-items: center; justify-content: center; width:60px; height:26px; border-radius: 26px; background:#f0f0f0; font-size:12px; font-weight:500; color:#666; margin-top:20px; } .order-view-form .order-view-box .order-view-con .cont .step-list .step-con .text{font-size:16px; margin-top:10px;} .order-view-form .order-view-box .order-view-summary{width:100%; background:#f9f9f9; display:flex; align-items: flex-start; padding:30px; gap:0px 40px;} .order-view-form .order-view-box .order-view-summary .title{display:flex; width:130px; align-items: center; font-size:18px; font-weight:700; } .order-view-form .order-view-box .order-view-summary .title::before{content:""; display:block; width:20px; height:20px; background:url(../images/contents/review_care_ico.png) no-repeat center; margin-right:8px; } .order-view-form .order-view-box .order-view-summary ul{display:flex; flex-direction: column; gap:10px 0px; width:calc( 100% - 170px );} .order-view-form .order-view-box .order-view-summary ul li{padding-left:15px; font-size:14px; color:#666; position: relative; word-break: keep-all; line-height:1.4;} .order-view-form .order-view-box .order-view-summary ul li::before{content:""; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:7px; line-height:1.4; } .order-view-form .order-view-btn{margin-top:100px; border-top:1px solid #eee; padding-top:50px; } .order-view-form .order-view-btn .btn{width:250px; height:60px;} .order-view-form .order-view-btn .btn span{font-size:20px; font-weight:500;} .order-view-form .oder-cancel-list{width:100%; margin-top:-40px; display: flex; flex-direction: column; gap:10px 0px; } .order-view-form .oder-cancel-list li{padding-left:15px; font-size:14px; color:#666; position: relative; word-break: keep-all; } .order-view-form .oder-cancel-list li::before{content:""; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:5px; line-height:1.4; } /* 온라인 결제 - 잔금 결제 */ .order-view-form .order-view-box .order-view-con .cont .payment-info-form{width:100%;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl{width:100%; } .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr th{height:64px; background:#f9f9f9; border-top:1px solid #131313; border-bottom:1px solid #acacac; vertical-align: middle; text-align: center; font-size:15px; font-weight:500; color:#666; } .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr th:nth-child(1){width:480px; border-right:1px solid #acacac;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr th:nth-child(2){width:240px; border-right:1px solid #acacac;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr th:nth-child(3){width:240px; border-right:1px solid #acacac;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr th:nth-child(4){width:240px;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td{padding:20px; border-right:1px solid #ccc; vertical-align: middle;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr:nth-child(2) td:first-child{border-bottom:1px solid #eee;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr:nth-child(2) td:last-child{border-right:0px;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr.total-row td{border-top:1px solid #131313; border-bottom:1px solid #131313; border-right:0px;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-info-box{width:100%; display:flex; align-items: center; justify-content: space-between; height:26px;margin-top:10px;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-info-box:first-child{margin-top:0px;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-info-box .info-title{font-size:16px; display:flex; align-items: center;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-info-box .info-title .tooltip{margin-left:4px;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-info-box .info-title .tooltip .tooltip-box{width:230px;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-info-box .info-title .tooltip .tooltip-box .tool-title{font-size:12px; font-weight:700;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-info-box .info-title .tooltip-form{right:-40px;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-info-box .info-title .tooltip-form .tooltip-box::before{right:41px;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-info-box .info-pay{font-size:16px; display:flex; align-items: flex-end;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-info-box .info-pay span{font-size:18px; font-weight:700;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-info-box .info-total-pay{width:100%; text-align: center;font-size:16px; display:flex; align-items: flex-end; justify-content: center;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-info-box .info-total-pay span{font-size:18px; font-weight:700;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-pay-list{padding:20px; background:#f9f9f9; display:flex; flex-direction: column; gap:10px 0px; margin-top:20px; } .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-pay-list .payment-pay-list-con{display:flex; align-items: center; justify-content: space-between; height:24px; } .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-pay-list .payment-pay-list-con .list-title{font-size:16px; color:#666;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-pay-list .payment-pay-list-con .list-pay{font-size:16px; color:#666;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr td .payment-pay-list .payment-pay-list-con .list-pay span{font-size:16px; color:#666; font-weight:700;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr.total-row td{padding:10px 20px; height:64px; text-align: center; } .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr.total-row td .payment-info-box .info-title{font-size:16px; font-weight:700;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr.total-row td{font-size:16px; color:#131313;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr.total-row td span{font-size:18px; color:#131313; font-weight:700;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr.total-row td:last-child{color:#0061FD;} .order-view-form .order-view-box .order-view-con .cont .payment-info-form .payment-info-tbl tr.total-row td:last-child strong{font-size:18px; color:#131313; font-weight:400;} .order-view-form .order-view-box .order-view-con .cont .payment-type-form{width:100%; border:1px solid #131313; background:#fff;} .order-view-form .order-view-box .order-view-con .cont .payment-type-form .payment-type-box{width:100%; display:flex; } .order-view-form .order-view-box .order-view-con .cont .payment-type-form .payment-type-box .payment-type-con{width:25%; padding:40px 20px; display:flex; flex-direction: column; align-items: center; justify-content: center; position: relative; border-right:1px solid #eee;} .order-view-form .order-view-box .order-view-con .cont .payment-type-form .payment-type-box .payment-type-con::after{content:""; display:block; width:36px; height:36px; background:url(../images/smartbuy/ic_plus.png) no-repeat center; position: absolute; right:-18px; top:50%; transform: translate( -0, -50% ); } .order-view-form .order-view-box .order-view-con .cont .payment-type-form .payment-type-box .payment-type-con:nth-child(3)::after{background:url(../images/smartbuy/ic_equal.png) no-repeat center;} .order-view-form .order-view-box .order-view-con .cont .payment-type-form .payment-type-box .payment-type-con:last-child{border-right:0px;} .order-view-form .order-view-box .order-view-con .cont .payment-type-form .payment-type-box .payment-type-con:last-child::after{display:none;} .order-view-form .order-view-box .order-view-con .cont .payment-type-form .payment-type-box .payment-type-con .type-title{width:100%; height:24px; display:flex; align-items: center ; justify-content: center; font-size:16px; color:#666; } .order-view-form .order-view-box .order-view-con .cont .payment-type-form .payment-type-box .payment-type-con .type-cont{display:flex; align-items: center; justify-content: center; height:44px; margin-top:10px;} .order-view-form .order-view-box .order-view-con .cont .payment-type-form .payment-type-box .payment-type-con .type-cont input[type='text']{ width:calc( 100% - 16px ); max-width:200px; height:44px; border:1px solid #ccc; outline: none; text-align: right; padding:0 2px; font-size:24px; font-weight:700; } .order-view-form .order-view-box .order-view-con .cont .payment-type-form .payment-type-box .payment-type-con .type-cont input[type='text']:focus{border:1px solid #131313;} .order-view-form .order-view-box .order-view-con .cont .payment-type-form .payment-type-box .payment-type-con .type-cont span{font-size:18px; margin-top:5px; margin-left:2px;} .order-view-form .order-view-box .order-view-con .cont .payment-type-form .payment-type-box .payment-type-con .type-cont .basic-pay{font-size:18px; margin-top:5px; margin-left:2px;} .order-view-form .order-view-box .order-view-con .cont .payment-type-form .payment-type-box .payment-type-con .type-cont .basic-pay span{font-size:24px; font-weight:700;} .order-view-form .order-view-box .order-view-con .cont .payment-type-form .payment-type-box .payment-type-con .type-cont .total-pay{font-size:18px; margin-top:5px; margin-left:2px;} .order-view-form .order-view-box .order-view-con .cont .payment-type-form .payment-type-box .payment-type-con .type-cont .total-pay span{font-size:30px; font-weight:700; color:#0061FD;} .order-view-form .order-view-box .order-view-con .cont .payment-type-summary{display:flex; flex-direction: column; gap:10px 0px; width:calc( 100% - 170px );} .order-view-form .order-view-box .order-view-con .cont .payment-type-summary li{padding-left:15px; font-size:14px; color:#666; position: relative; word-break: keep-all; line-height:1.4;} .order-view-form .order-view-box .order-view-con .cont .payment-type-summary li::before{content:""; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:7px; line-height:1.4; } .payment-section .order-view-form .payment-btn-box{margin:100px auto 0 auto; padding-top:50px; border-top:1px solid #eee;} .payment-section .order-view-form .payment-btn-box .btn{width:250px; height:60px;} .payment-section .order-view-form .payment-btn-box .btn span{font-size:20px; font-weight:500;} .payment-cont-form{width:100%;} .payment-cont-form .payment-cont-title{width:100%; height:56px; display:flex; align-items: center; justify-content: center; background:#2e3546; color:#fff; font-size:16px; } .payment-cont-form .payment-cont-box{width:100%;border:1px solid #ddd; display:flex;} .payment-cont-form .payment-cont-box .payment-cont{width:50%; border-right:1px solid #ddd;} .payment-cont-form .payment-cont-box .payment-cont:last-child{border-right:0px;} .payment-cont-form .payment-cont-box .payment-cont .title{width:100%; height:56px; display:flex; align-items: center; justify-content: center; border-bottom:1px solid #ddd; background:#f9f9f9; font-size:16px; font-weight:700; margin-bottom:0px; } .payment-cont-form .payment-cont-box .payment-cont .payment-cont-pay{width:100%; height:130px; display:flex; flex-direction: column; align-items: center; justify-content: center; border-bottom:1px solid #ddd;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-pay .pay{font-size:14px;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-pay .pay span{font-size:18px; font-weight:700;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-pay .pay-btn{margin-top:15px;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-pay .pay-btn .btn{width:180px; height:44px;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-pay .pay-btn .btn span{font-size:15px; font-weight:500;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-summary{padding:20px 14px;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-summary .payment-status{height:32px; display:flex; align-items: center; justify-content: center; } .payment-cont-form .payment-cont-box .payment-cont .payment-cont-summary .payment-status .status{font-size:14px; color:#888;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-summary .payment-status .status.success{color:#0061FD;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-summary .payment-status .pay-reflash{width:89px; height:32px; margin-left:10px;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-summary .payment-status .pay-reflash span{font-size:14px; color:#131313; font-weight:400; display:flex; align-items: center;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-summary .payment-status .pay-reflash span::before{content:""; display:block; width:16px; height:16px; background:url(../images/smartbuy/lp_filter_reflash_ico.png) no-repeat center ; margin-right:4px; } .payment-cont-form .payment-cont-box .payment-cont .payment-cont-summary .payment-status .pay-reflash.disabled{border:1px solid #ccc;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-summary .payment-status .pay-reflash.disabled span{color:#acacac;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-summary .payment-status .pay-reflash.disabled span::before{opacity: 0.4;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-summary .summary{display:flex; flex-direction: column; gap:8px 0px; width:100%; margin-top:20px;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-summary .summary li{padding-left:15px; font-size:14px; color:#666; position: relative; word-break: keep-all; line-height:1.4;} .payment-cont-form .payment-cont-box .payment-cont .payment-cont-summary .summary li::before{content:""; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:7px; line-height:1.4; } .payment-cont-form .payment-cont-box .payment-cont .payment-cont-summary .summary li span{font-size:14px; color:#131313; font-weight:700;} .payment-section .order-view-form .payment-btn-summary{font-size:16px; margin-top:10px; text-align: center; } .payment-cash-form{width:100%; display:none;} .payment-cash-form .payment-cash-title{border:1px solid #ddd; background:#f4f4f4; width:100%; height:56px; display:flex; align-items: center; justify-content: center; font-size:14px;} .payment-cash-form .payment-cash-list{width:100%; display:flex; align-items: center; flex-wrap: wrap; } .payment-cash-form .payment-cash-list .list-title{width:200px; height:56px; display:flex; align-items: center; justify-content: center; font-size:14px; border-bottom:1px solid #ddd; border-right:1px solid #ddd; } .payment-cash-form .payment-cash-list .list-title:nth-child(1){border-left:1px solid #ddd;} .payment-cash-form .payment-cash-list .list-title:nth-child(5){border-left:1px solid #ddd;} .payment-cash-form .payment-cash-list .list-con{width:calc( 50% - 200px ); height:56px; display:flex; align-items: center; padding:0 14px; border-bottom:1px solid #ddd; border-right:1px solid #ddd; font-size:14px; color:#515151; } .payment-cash-form .payment-cash-list .list-con .account-number{font-size:14px; color:#515151; } .payment-cash-form .payment-cash-list .list-con .account-copy{width:53px; height:28px; border-radius: 4px; border:1px solid #ccc; margin-left:10px; display:Flex; align-items: center; justify-content: center; } .payment-cash-form .payment-cash-list .list-con .account-copy::before{content:""; display:block; width:16px; height:16px; margin-right:4px; background:url(../images/smartbuy/account-copy.png) no-repeat center; } .payment-cash-form .payment-cash-list .list-con .account-copy:hover{background:rgba(0,0,0,0.06);} .payment-cash-form .payment-cash-list .list-con .account-copy:active{background:#fff; border:1px solid #131313;} .payment-cash-form .payment-cash-summary{display:flex; flex-direction: column; gap:8px 0px; width:100%; margin-top:20px;} .payment-cash-form .payment-cash-summary li{padding-left:15px; font-size:14px; color:#666; position: relative; word-break: keep-all; line-height:1.4;} .payment-cash-form .payment-cash-summary li::before{content:""; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:7px; line-height:1.4; } /* 찾아가는 서비스 구매 */ .visit-order-step-form{display:flex; align-items: center; justify-content: center; margin-top:30px;} .visit-order-step-form .order-step-list{display:flex; align-items: center; justify-content: center;} .visit-order-step-form .order-step-list li{display:flex; align-items: center; justify-content: center; } .visit-order-step-form .order-step-list li::after{content:""; display:block; width:16px; height:16px; background:url(../images/smartbuy/payment_step_arrow.png) no-repeat center; margin:0 16px; } .visit-order-step-form .order-step-list li:last-child::after{display:none;} .visit-order-step-form .order-step-list li .ico{width:36px; height:36px; border-radius: 36px; margin-right:7px; display:flex; align-items: center; justify-content: center; background:#e3e3e3; } .visit-order-step-form .order-step-list li .txt{font-size:14px; font-weight:500; color:#acacac;} .visit-order-step-form .order-step-list li .ico::before{content:""; display:block; width:36px; height:36px; } .visit-order-step-form .order-step-list li:nth-child(1) .ico::before{background:url(../images/smartbuy/payment_step02.png) no-repeat center;} .visit-order-step-form .order-step-list li:nth-child(2) .ico::before{background:url(../images/smartbuy/payment_step03.png) no-repeat center;} .visit-order-step-form .order-step-list li.active .ico{background:#0061FD;} .visit-order-step-form .order-step-list li.active .txt{color:#131313;} .visit-order-step-form .order-step-list li:nth-child(1).active .ico::before{background:url(../images/smartbuy/payment_step02_on.png) no-repeat center;} .visit-payment-form{width:100%; max-width:1200px; margin:0 auto; display:flex; flex-direction: column; gap:60px 0px; } .visit-payment-form .visit-payment-box{width:100%;} .visit-payment-form .visit-payment-box .visit-payment-title{width:100%; margin-bottom:24px;} .visit-payment-form .visit-payment-box .visit-payment-title .title{font-size:18px; font-weight:700;} .visit-payment-form .visit-payment-box .visit-payment-title .txt{margin-top:10px; font-size:14px; color:#666; line-height:1.4;} .visit-payment-form .visit-payment-box .visit-payment-title.title-type02{display:flex; align-items: flex-end;} .visit-payment-form .visit-payment-box .visit-payment-title.title-type02 .title{line-height:1;} .visit-payment-form .visit-payment-box .visit-payment-title.title-type02 .txt{margin-top:0px; margin-left:10px; line-height:1; font-weight:500;} .visit-payment-form .visit-payment-box .visit-payment-con{width:100%;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list{width:100%; border-top:1px solid #131313;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-haed{display:flex; align-items: center; height:64px; border-bottom:1px solid #acacac; } .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-haed .list-head-tit{ padding:0 20px; font-size:16px; font-weight:700; color:#333; } .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-haed .list-head-tit:first-child{width:calc( 100% - 280px );} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-haed .list-head-tit:last-child{width:280px; text-align: center;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body{width:100%;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con{width:100%; display:flex; align-items: center; border-bottom:1px solid #ddd; } .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice{padding:20px; width:calc( 100% - 280px );} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check{width:100%;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check input[type='radio']{display:none;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check label{width:100%; display:flex; align-items: center;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check label .radio-dot{width:20px; height:20px; display: flex; align-items: center; justify-content: center; border-radius: 20px; border:1px solid #ddd; margin:2px 2px;; } .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check label .radio-dot::before{content:""; display:block; width:12px; height:12px; border-radius: 12px; background:#fff;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check label .list-car{width:calc( 100% - 24px ); display:flex; align-items: center; padding-left:20px; gap:0 20px;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check label .list-car .car-thumnail{width:136px; height:102px; overflow: hidden;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check label .list-car .car-info{width:calc( 100% - 156px );} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check label .list-car .car-info .car-name{font-size:16px; height:24px; line-height:24px; font-weight:700; width:100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check label .list-car .car-info .car-trim{font-size:16px !important; height:24px; line-height:24px; width:100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check label .list-car .car-info .car-infos{display:flex; align-items: center; margin-top:5px; gap:0px 8px; } .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check label .list-car .car-info .car-infos li{font-size:12px; color:#888;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check input[type='radio'] + label:hover .radio-dot{border:1px solid #131313;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check input[type='radio']:checked + label{} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check input[type='radio']:checked + label .radio-dot{border:1px solid #0061FD;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check input[type='radio']:checked + label .radio-dot::before{background:#0061FD;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check input[type='radio']:checked + label:hover .radio-dot{border:1px solid #131313;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check input[type='radio']:disabled + label .radio-dot{border:1px solid #ddd;background:#e3e3e3;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check input[type='radio']:disabled + label .radio-dot::before{background:#e3e3e3;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check input[type='radio']:disabled + label:hover .radio-dot{border:1px solid #ddd;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check input[type='radio']:disabled + label .list-car .car-thumnail::before{content:""; width:100%; height:100%; display:block; background:rgbA(0,0,0,0.5); position: absolute; left:0; top:0; z-index: 1; } .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check input[type='radio']:disabled + label .list-car .car-info .car-name{color:#acacac;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check input[type='radio']:disabled + label .list-car .car-info .car-trim{color:#acacac;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .list-choice .list-check input[type='radio']:disabled + label .list-car .car-info .car-infos li{color:#acacac;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .visit-choice{width:280px; padding:20px;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .visit-choice .visit-choice-btn{width:100%; display:flex; flex-direction: column; gap:12px 0px;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .visit-choice .visit-choice-btn button{width:100%; height:44px; display:flex; align-items: center; justify-content: center; border:1px solid #ddd; border-radius: 2px; background:#fff; position: relative; } .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .visit-choice .visit-choice-btn button span{font-size:14px; color:#515151;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .visit-choice .visit-choice-btn button span b{font-size:14px; font-weight:700; color:#515151;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .visit-choice .visit-choice-btn button:hover{background:rgba(0,0,0,0.06);} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .visit-choice .visit-choice-btn button.active{border:1px solid #131313;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .visit-choice .visit-choice-btn button.active::after{content:""; display:block; width:18px; height:18px; border-radius: 18px; background:#333 url(../images/live/live_check_ico.png) no-repeat center; position: absolute; right:-7px; top:-7px; } .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .visit-choice .visit-choice-btn button.active span{color:#131313;} .visit-payment-form .visit-payment-box .visit-payment-con .visit-car-list .car-list-body .list-con .visit-choice .visit-choice-btn button.active span b{color:#131313;} .visit-payment-form .visit-payment-box .visit-add-form{width:100%; padding:10px 0px; border-top:1px solid #131313;} .visit-payment-form .visit-payment-box .visit-add-form .visit-add-box{width:100%; display: flex; flex-wrap: wrap; gap:10px 10px; } .visit-payment-form .visit-payment-box .visit-add-form .visit-add-box input[type="text"]{ width:100%; height:44px; padding:0 12px; font-size:14px; border:1px solid #ddd; background:#fff; outline: none; } .visit-payment-form .visit-payment-box .visit-add-form .visit-add-box input[type="text"]:focus{border:1px solid #131313;} .visit-payment-form .visit-payment-box .visit-add-form .visit-add-box input[type="text"]:read-only{background:#e3e3e3;} .visit-payment-form .visit-payment-box .visit-add-form .visit-add-box input[type="text"]:read-only:focus{border:1px solid #ddd;} .visit-payment-form .visit-payment-box .visit-add-form .visit-add-box input[type="text"].add-number{width:270px;} .visit-payment-form .visit-payment-box .visit-add-form .visit-add-box .btn{height:44px;} .visit-payment-form .visit-payment-box .visit-add-form .visit-add-box .btn span{font-size:15px; color:#131313;} .visit-payment-form .visit-payment-box .visit-add-form .visit-add-box .btn.add-search-btn{width:120px;} .visit-payment-form .visit-payment-box .visit-add-form .visit-add-box .btn.add-find-btn{width:150px;} .visit-payment-form .visit-payment-box .visit-add-form .visit-add-txt{margin-top:10px; font-size:14px; color:#888; } .visit-payment-form .visit-payment-box .visit-line-bn{width:100%; height:48px; border-radius: 5px; background:#2ac1bc; display:flex; align-items: center; } .visit-payment-form .visit-payment-box .visit-line-bn span{font-size:18px; font-weight:700; color:#fff; margin-left:389px; display:flex; height:100%; align-items: center; position: relative;} .visit-payment-form .visit-payment-box .visit-line-bn span::after{content:""; display:block; width:134px; height:62px; background:url(../images/contents/visit_bn_img.png) no-repeat center; position: absolute; bottom:0; right:-141px; } .visit-payment-form .visit-payment-box .visit-total-pay{width:100%; display:flex; align-items: flex-end; justify-content: space-between; height:44px; margin-top:20px; } .visit-payment-form .visit-payment-box .visit-total-pay .title{font-size:16px; font-weight:700;} .visit-payment-form .visit-payment-box .visit-total-pay .pay{font-size:20px; font-weight:700;} .visit-payment-form .visit-payment-box .visit-total-pay .pay span{font-size:36px; font-weight:700;} .payment-btn-box{margin:100px auto 0 auto; padding-top:50px; border-top:1px solid #eee;} .payment-btn-box .btn{width:250px; height:60px;} .payment-btn-box .btn span{font-size:20px; font-weight:500;} .visit-order-summary{width:100%; margin-top:100px;} .visit-order-summary .title{display:flex; align-items: center; font-size:18px; font-weight:700;} .visit-order-summary .title::before{content:""; display:block; width:24px; height:24px; background:url(../images/smartbuy/ic_notice.png) no-repeat center; margin-right:6px; } .visit-order-summary .visit-order-summary-list{width:100%; margin-top:16px;} .visit-order-summary .visit-order-summary-list li{padding-left:15px; font-size:14px; color:#666; position: relative; word-break: keep-all; line-height:1.4; margin-top:8px;} .visit-order-summary .visit-order-summary-list li::before{content:""; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:7px; line-height:1.4; } .visit-order-summary .visit-order-summary-list li ul li{padding-left:0px;} .visit-order-summary .visit-order-summary-list li ul li::before{display:none;} /* 찾아가는 서비스 제공 불가 팝업 */ #visitAddNonePop{word-break: keep-all; display:none;} #visitAddNonePop .visit-none-title{display:flex; align-items: center; margin-top:16px; font-size:16px; } #visitAddNonePop .visit-none-title::before{content:""; display:block; width:24px; height:24px; margin-right:5px; background:url(../images/contents/review_care_ico.png) no-repeat center; } #visitAddNonePop .visit-none-info{width:100%; margin-top:22px; text-align: center; padding:15px 0; border-radius:10px ; background:#f9f9f9; line-height:1.4; font-size:16px; color:#333; } #visitAddNonePop .visit-none-info span{font-size:16px; font-weight:700; color:#333;} #visitAddNonePop .visit-none-txt{margin-top:20px; line-height:1.4; font-size:16px; } #visitAddNonePop .visit-none-notice{font-size:14px; display: flex; line-height:1.4; color:#666; word-break: keep-all; margin-top:10px;} #visitAddNonePop .visit-none-notice::before{content:"예시)"; font-size:14px; line-height:1.4; color:#666; width:55px; } #visitAddNonePop .btn-blue{width:260px;} /* 차량 구매 이력 없을시 */ .buy-list-none-form{width:100%; margin:130px auto;} .buy-list-none-form .buy-list-none{width:100%;} .buy-list-none-form .buy-list-none .buy-list-none-con{width:100%; display:flex; flex-direction: column; align-items: center; justify-content: center; } .buy-list-none-form .buy-list-none .buy-list-none-con .title{font-size:26px; font-weight:500; margin-top:24px;} .buy-list-none-form .buy-list-none .buy-list-none-con .txt{font-size:16px; color:#666; margin-top:16px;} .buy-list-none-form .buy-list-none .buy-search-cont{width:100%; margin:30px 0px; padding:30px 0px; background:#f9f9f9;} .buy-list-none-form .buy-list-none .buy-search-cont .buy-search-title{font-size:18px; font-weight:700; text-align: center;} .buy-list-none-form .buy-list-none .buy-search-cont .buy-search-txt{font-size:14px; color:#888; margin-top:8px; text-align: center;} .buy-list-none-form .buy-list-none .buy-search-cont .btn{margin:20px auto 0 auto; width:255px;} .buy-list-none-form .buy-list-none-btn{display:flex; flex-direction: column; align-items: center; justify-content: center; gap:18px 0px; } .buy-list-none-form .buy-list-none-btn .btn{height:50px; width:355px;} .buy-list-none-form .buy-list-none-btn .btn span{font-size:16px; font-weight:500;} /* 찾아가는 서비스 결재 정보 확인 */ .visit-payment-box .visit-coupon-form{width:100%;border-top:1px solid #131313;} .visit-payment-box .visit-coupon-form .visit-coupon-box{width:100%; display:flex; align-items: center; justify-content: space-between; border-bottom:1px solid #eee; padding:10px 0px; height:64px;} .visit-payment-box .visit-coupon-form .visit-coupon-box .title{font-size:15px; font-weight:500;} .visit-payment-box .visit-coupon-form .visit-coupon-box .cont{display:flex; align-items: center; flex-wrap: wrap; gap:10px 10px;} .visit-payment-box .visit-coupon-form .visit-coupon-box .cont .select-box{ width:270px; } .visit-payment-box .visit-coupon-form .visit-coupon-box .cont .select-box .select-choice{height:44px; font-size:14px;} .visit-payment-box .visit-coupon-form .visit-coupon-box .cont .select-box .select-list{top:44px;} .visit-payment-box .visit-coupon-form .visit-coupon-box .cont .select-box .select-list li{font-size:14px;} .visit-payment-box .visit-coupon-form .visit-coupon-box .cont .btn{height:44px; width:120px;} .visit-payment-box .visit-coupon-form .visit-coupon-box .cont .btn span{font-size:15px; font-weight:500;} .visit-payment-box .visit-coupon-form .visit-coupon-box .cont .coupon-pay{font-size:16px;} .visit-payment-box .visit-coupon-form .visit-coupon-box .cont .coupon-pay span{font-size:16px; font-weight:700;} .visit-payment-box .visit-info-form{width:100%; border-top:1px solid #131313;} .visit-payment-box .visit-info-form .visit-info-haed{width:100%; display:flex; align-items: center; height:64px; border-bottom:1px solid #acacac; } .visit-payment-box .visit-info-form .visit-info-haed li{padding:0 20px; font-size:16px; font-weight:700; color:#333; width:calc( 100% - 220px ) } .visit-payment-box .visit-info-form .visit-info-haed li:last-child{width:220px; text-align: center;} .visit-payment-box .visit-info-form .visit-info-body{display:flex; align-items: center; border-bottom:1px solid #ddd;} .visit-payment-box .visit-info-form .visit-info-body .visit-info-box{width: calc( 100% - 220px );padding:20px 20px 40px 20px; display:flex; align-items: center; gap:0px 20px; } .visit-payment-box .visit-info-form .visit-info-body .visit-info-box .visit-thumnail{width:136px; height:102px;} .visit-payment-box .visit-info-form .visit-info-body .visit-info-box .visit-info-con{ width:calc( 100% - 156px ); } .visit-payment-box .visit-info-form .visit-info-body .visit-info-box .visit-info-con .visit-name{ display:flex; align-items: center; height:32px; font-size:16px; font-weight:700; } .visit-payment-box .visit-info-form .visit-info-body .visit-info-box .visit-info-con .visit-date{display:flex; align-items: center; height:24px; color:#888; font-size:12px; } .visit-payment-box .visit-info-form .visit-info-body .visit-info-box .visit-info-con .visit-pay{display:flex; align-items: flex-end; gap:0px 4px; margin-top:4px;} .visit-payment-box .visit-info-form .visit-info-body .visit-info-box .visit-info-con .visit-pay .discount{font-size:14px; color:#999; text-decoration: line-through;} .visit-payment-box .visit-info-form .visit-info-body .visit-info-box .visit-info-con .visit-pay .pay{font-size:18px;} .visit-payment-box .visit-info-form .visit-info-body .visit-info-box .visit-info-con .visit-pay .pay span{font-size:18px; font-weight:700;} .visit-payment-box .visit-info-form .visit-info-body .visit-status{width:220px; padding:0 20px; text-align: center; font-size:32px; font-weight:700; } .visit-payment-box .order-view-tbl{width:100%; border:1px solid #ddd;} .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con{display:flex;} .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-th{width:187px; min-height:56px; display:flex; align-items: center; font-size:14px; background:#f8f8f8; color:#000; border-bottom:1px solid #ddd; border-right:1px solid #ddd; padding:15px 14px; } .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td{padding:0px 14px; height:56px; display:flex; font-size:14px; color:#000; align-items: center; width:calc( 50% - 187px ); max-width:437px; border-bottom:1px solid #ddd; border-right:1px solid #ddd; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height:1.4; } .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td:last-child{border-right:0px;} .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td.type02{width:calc( 100% - 187px ); max-width:unset;} .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con:last-child .tbl-th{border-bottom:0px;} .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con:last-child .tbl-td{border-bottom:0px;} .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .txt{width:100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size:14px; color:#000; } .visit-payment-box .order-view-tbl .tbl-title{width:100%; height:56px; display:flex; align-items: center; justify-content: center; border-bottom:1px solid #ddd; background:#f4f4f4; font-size:14px; } .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .account-number{font-size:14px; color:#515151; } .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .account-copy{width:53px; height:28px; border-radius: 4px; border:1px solid #ccc; margin-left:10px; display:Flex; align-items: center; justify-content: center; } .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .account-copy::before{content:""; display:block; width:16px; height:16px; margin-right:4px; background:url(../images/smartbuy/account-copy.png) no-repeat center; } .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .account-copy:hover{background:rgba(0,0,0,0.06);} .payment-cash-form .payment-cash-list .list-con .account-copy:active{background:#fff; border:1px solid #131313;} .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .visit-pay{font-size:14px;} .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .visit-pay span{font-size:18px; font-weight:700;} .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .payment-status{height:32px; margin-left:10px; display:flex; align-items: center; justify-content: center; } .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .payment-status .status{font-size:14px; color:#888;} .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .payment-status .status.success{color:#0061FD;} .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .payment-status .pay-reflash{width:89px; height:32px; margin-left:10px;} .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .payment-status .pay-reflash span{font-size:14px; color:#131313; font-weight:400; display:flex; align-items: center;} .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .payment-status .pay-reflash span::before{content:""; display:block; width:16px; height:16px; background:url(../images/smartbuy/lp_filter_reflash_ico.png) no-repeat center ; margin-right:4px; } .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .payment-status .pay-reflash.disabled{border:1px solid #ccc;} .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .payment-status .pay-reflash.disabled span{color:#acacac;} .visit-payment-box .order-view-tbl .order-view-tbl-box .order-view-tbl-con .tbl-td .payment-status .pay-reflash.disabled span::before{opacity: 0.4;} .visit-payment-box .visit-payment-summary{display:flex; flex-direction: column; gap:8px 0px; width:100%; margin-top:20px;} .visit-payment-box .visit-payment-summary li{padding-left:15px; font-size:14px; color:#666; position: relative; word-break: keep-all; line-height:1.4;} .visit-payment-box .visit-payment-summary li::before{content:""; width:3px; height:3px; border-radius: 3px; background:#999; position: absolute; left:4px; top:7px; line-height:1.4; } .visit-payment-box .visit-payment-summary li span{font-size:14px; color:#131313; font-weight:700;} .visit-payment-box .order-policy-form{width:100%; border-top:1px solid #131313; margin-top:24px; } .visit-payment-box .order-policy-form .order-policy-all{display:flex; align-items: center; height: 46px; border-bottom:1px solid #eee;} .visit-payment-box .order-policy-form .order-policy-all .check-box label span{font-size:15px; font-weight:500;} .visit-payment-box .order-policy-form .order-policy-box{width:100%;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-con{width:100%;padding:18px 0px;display:flex; align-items: center; justify-content: space-between;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-con .order-policy-title{} .visit-payment-box .order-policy-form .order-policy-box .order-policy-con .policy-arrow{cursor:pointer; transform: rotate(180deg); transition: all 0.2s;} .visit-payment-box .order-policy-form .order-policy-box.active .order-policy-con .policy-arrow{cursor:pointer; transform: rotate(0deg); transition: all 0.2s;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-con .policy-pop-arrow{cursor:pointer; transform: rotate(90deg); } .visit-payment-box .order-policy-form .order-policy-box .check-box label span{font-weight:500;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-txt{padding-left:30px; font-size:12px; color:#666; margin-top:5px;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary{padding:20px; background:#f9f9f9; display:flex; flex-direction: column; gap:10px 0px; max-height: 200px; overflow-y: auto; } .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary p{font-size:14px; color:#888; line-height:1.4;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary p span{font-size:14px; color:#888;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary table{font-size:14px; border:1px solid #ddd;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary table tr th{font-size:14px; border:1px solid #ddd;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary table tr td{font-size:14px; border:1px solid #ddd;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary .sum-box{width:100%;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary .sum-box:last-child{margin-bottom:20px;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary .sum-box .title{font-size:14px; font-weight:700; color:#888;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary .sum-box .txt{margin-top:6px; font-size:14px; color:#888; line-height:1.4; word-break: keep-all;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary .sum-box .sum-tbl{margin-top:8px; margin-bottom:40px; width:100%;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary .sum-box .sum-tbl table{width:100%; border:1px solid #ddd;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary .sum-box .sum-tbl table tr th{height:56px; text-align: center; vertical-align: middle; font-size:14px; font-weight:700; color:#888; background:#f9f9f9;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary .sum-box .sum-tbl table tr td{height:56px; padding:0 14px; vertical-align: middle; font-size:14px; color:#888; background:#fff;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary .sum-box .sum-tbl table tr td:first-child{text-align: center;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary .policy-list{width:100%;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary .policy-list li{display:flex; width:100%; margin-top:12px; } .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary .policy-list li:first-child{margin-top:0px;} .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary .policy-list li .policy-sum-tit{ width:160px; font-size: 14px; font-weight:700; color:#888; padding-left:16px; box-sizing:border-box; position: relative; } .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary .policy-list li .policy-sum-tit::before{content:"";display:block; width:4px; height:4px; border-radius: 4px; background:#888; position: absolute; left:4px; top:4px; } .visit-payment-box .order-policy-form .order-policy-box .order-policy-summary .policy-list li .policy-sum-txt{ width:calc( 100% - 180px ); font-weight:400; font-size: 14px; color:#888; margin-left:20px; line-height:1.3; word-break: keep-all; } .visit-payment-box .order-policy-form .policy-info{font-size:14px; font-weight:700; color:#888; margin-top:12px; } /* 찾아가는 서비스 약관 팝업 */ #visitPolicyPop{display:none;} #visitPolicyPop .visit-policy-pop-con table{font-size:14px; border:1px solid #ddd;} #visitPolicyPop .visit-policy-pop-con table tr th{font-size:14px; border:1px solid #ddd;} #visitPolicyPop .visit-policy-pop-con table tr td{font-size:14px; border:1px solid #ddd;} #visitPolicyPop .visit-policy-pop-con .sum-box{width:100%; margin-top:20px;} #visitPolicyPop .visit-policy-pop-con .sum-box .title{font-size:14px; font-weight:700; color:#515151;} #visitPolicyPop .visit-policy-pop-con .sum-box .txt{margin-top:6px; font-size:14px; color:#515151; line-height:1.5; word-break: keep-all;} #visitPolicyPop .visit-policy-pop-con .sum-box .sum-tbl{margin-top:8px; margin-bottom:40px; width:100%;} #visitPolicyPop .visit-policy-pop-con .sum-box .sum-tbl table{width:100%; border:1px solid #ddd;} #visitPolicyPop .visit-policy-pop-con .sum-box .sum-tbl table tr th{height:56px; text-align: center; vertical-align: middle; font-size:14px; font-weight:700; color:#131313; background:#f9f9f9;} #visitPolicyPop .visit-policy-pop-con .sum-box .sum-tbl table tr td{height:56px; padding:0 14px; vertical-align: middle; font-size:14px; color:#515151; background:#fff;} #visitPolicyPop .visit-policy-pop-con .sum-box .sum-tbl table tr td:first-child{text-align: center;} .visit-payment-box .order-pay-choice{width:100%; display:flex; align-items: center; gap:0px 15px; margin-top:20px;} .visit-payment-box .order-pay-choice .pay-choice-btn{width:100%; max-width:100%; height:60px; border-radius: 2px; display:flex; align-items: center; justify-content: center; position: relative; background:#fff; border:1px solid #ddd; cursor: pointer; position: relative; } .visit-payment-box .order-pay-choice .pay-choice-btn .title{display:flex; align-items: center; justify-content: center; font-size:14px; color:#515151; } .visit-payment-box .order-pay-choice .pay-choice-btn .title span{font-size:14px; color:#515151; font-weight:700;} .visit-payment-box .order-pay-choice .pay-choice-btn:hover{background:rgba(0,0,0,0.06);} .visit-payment-box .order-pay-choice .pay-choice-btn:active{background:rgba(0,0,0,0.1);} .visit-payment-box .order-pay-choice .pay-choice-btn.active{border:1px solid #131313; color:#131313;} .visit-payment-box .order-pay-choice .pay-choice-btn.active .title{color:#131313;} .visit-payment-box .order-pay-choice .pay-choice-btn.active .title span{color:#131313;} .visit-payment-box .order-pay-choice .pay-choice-btn.active::after{content:""; display:block; width:18px; height:18px; border-radius: 18px; background:#333 url(../images/live/live_check_ico.png) no-repeat center; position: absolute; right:-7px; top:-7px; } .visit-payment-box .order-pay-choice .pay-choice-btn[data-name="pay-deposit"]::before{content:""; display:block; width:24px; height:24px; background:url(../images/smartbuy/ic_deposit.png) no-repeat center; margin-right:4px;} .visit-payment-box .order-pay-choice .pay-choice-btn[data-name="pay-card"]::before{content:""; display:block; width:24px; height:24px; background:url(../images/smartbuy/btn_ic_card.png) no-repeat center; margin-right:4px;} .visit-payment-box .order-pay-choice .pay-choice-btn.active[data-name="pay-deposit"]::before{content:""; display:block; width:24px; height:24px; background:url(../images/smartbuy/ic_deposit_on.png) no-repeat center; margin-right:4px;} .visit-payment-box .order-pay-choice .pay-choice-btn.active[data-name="pay-card"]::before{content:""; display:block; width:24px; height:24px; background:url(../images/smartbuy/btn_ic_card_on.png) no-repeat center; margin-right:4px;} .visit-payment-box .order-pay-choice .pay-choice-btn:hover .bubble{animation:myToolMove02 0.4s ease-in-out infinite alternate-reverse;} .visit-payment-box .order-pay-choice .pay-choice-btn:disabled{background:#e3e3e3; border:1px solid #ccc;} .visit-payment-box .order-pay-choice .pay-choice-btn:disabled .title{opacity: 0.5;} .visit-payment-box .order-pay-choice .pay-choice-btn:disabled::before{opacity: 0.5;} .visit-payment-form .order-view-title{width:100%; display: flex; align-items:center; justify-content: center;} .visit-payment-form .order-view-title span{font-size:24px; font-weight:500; display:flex; align-items: center;} .visit-payment-form .order-view-title span::before{content:""; width:32px; height: 32px; border-radius: 32px; background:#f4f9ff url(../images/smartbuy/payment_check_ico.png) no-repeat center; margin-right:10px; } .visit-consult-bn{width:100%; display:flex; align-items: center; justify-content: space-between; padding:0px 40px 0px 37px; background:#f6f6f6; height:80px; margin-top:100px;} .visit-consult-bn .visit-consult-bn-box{display:flex; align-items: center;} .visit-consult-bn .visit-consult-bn-box::before{content:""; display: block; width:120px; height:80px; background:url(../images/contents/visit_consult_img.png) no-repeat center;} .visit-consult-bn .visit-consult-bn-box .visit-consult-con{margin-left:70px;} .visit-consult-bn .visit-consult-bn-box .visit-consult-con .title{font-size:18px; font-weight:500;} .visit-consult-bn .visit-consult-bn-box .visit-consult-con .txt{font-size:14px; font-weight:500; color:#666; margin-top:6px;} .visit-consult-bn a{display:flex; align-items: center; justify-content: center; width:174px; height:48px; border-radius: 48px; background: #fff; position: relative; overflow: hidden; } .visit-consult-bn a:hover::before{content:"";display:block; width:100%; height:100%; background:rgba(0,0,0,0.06); position: absolute; left:0; top:0;} .visit-consult-bn a span{font-size:14px; font-weight:500;} /* 404 에러 */ .error-page{margin:130px 0px;} .error-page .error-page-box{text-align: center;} .error-page .error-page-box i{display:flex; align-items: center; justify-content: center; width:80px; height:80px; border-radius: 80px; background:#f6f6f6; margin:0 auto; } .error-page .error-page-box .title{font-size:26px; font-weight:500; margin-top:24px;} .error-page .error-page-box .txt{font-size:16px; color:#666; line-height: 1.4; margin-top:16px;} .error-page .error-page-box .btn-box{flex-direction: column; margin-top:60px; gap:16px 0px;} .error-page .error-page-box .btn-box .btn{height:50px;} .error-page .error-page-box .btn-box .btn span{font-size:16px;} /* 약관 */ .policy-section{width:1200px; margin:90px auto 130px auto;} .policy-section .policy-form{width:100%; margin-top:90px; display:none;} .policy-section .policy-form .policy-title{width:100%; display:flex; height:44px; align-items: center; justify-content: space-between;} .policy-section .policy-form .policy-title .title{padding-left:10px; font-size:36px; font-weight:500;} .policy-section .policy-form .policy-title .date-choice{display:flex; align-items: center; gap:0px 24px;} .policy-section .policy-form .policy-title .date-choice .date-title{font-size:18px; font-weight:500; color:#515151; white-space: nowrap;} .policy-section .policy-form .policy-title .date-choice .date-select{width:260px; } .policy-section .policy-form .policy-title .date-choice .date-select .select-choice{height:44px; font-size:14px;} .policy-section .policy-form .policy-title .date-choice .date-select .select-list{top:44px;} .policy-section .policy-form .policy-title .date-choice .date-select .select-list li{font-size:14px;} .policy-section .policy-form .policy-box{width:100%; margin-top:30px; border-top:1px solid #999; padding:30px 20px;} /* 약관 공통 폰트 셋팅 */ .policy-cont{font-size:16px !important; position: relative; padding:20px 0px; width:100%; color:#515151; line-height:1.3;} .policy-cont p{font-size:16px !important; line-height:1.3; color:#515151;} .policy-cont b{font-size:16px !important; color:#515151;} .policy-cont span{font-size:16px !important; color:#515151;} .policy-cont strong{font-size:16px !important; color:#515151;} /* 본인인증 팝업 */ #userAuthPop .layer-pop-body{ gap:0 4px; display: flex; padding-top:30px; padding-bottom:0px; } #userAuthPop .layer-pop-body button{ width:calc( 50% - 2px ); border:1px solid #ddd; display:flex; flex-direction: column; align-items: center; justify-content: center; height:220px; border-radius: 10px; box-sizing:border-box; } #userAuthPop .layer-pop-body button .user-phone-chk-txt{ font-size:20px; font-weight:500; color:#131313; } #userAuthPop .layer-pop-body button .user-phone-chk-ico{ display:flex; align-items: center; justify-content: center; height:92px; } #userAuthPop .layer-pop-body button::after{ content:"인증하기"; display:flex; width:95px; height:48px; border-radius: 4px; background:#0061FD; color:#fff; font-size:16px; font-weight:400; align-items: center; justify-content: center; } #userAuthPop .layer-pop-body button:hover::after{ background:#0087E6; } #userAuthPop .user-phone-sum{ padding:30px 0 40px 0; background:#fff; } @keyframes myToolMove { from {top:-57px;} to {top:-51px;} } @keyframes myToolMove02 { from {top:-43px;} to {top:-36px;} } /* 25.03.25 신규 추가 */ .buyback-pop .family-pop-box{ width:100%; padding:40px 20px 16px 20px; border-bottom:1px solid #ddd; } .buyback-pop .family-pop-box .family-pop-title{ font-size:26px; color:#131313; text-align:center; line-height:1.3; letter-spacing:-0.2px; } .buyback-pop .family-pop-box .family-pop-title span{ font-size:26px; color:#131313; font-weight:700; } .buyback-pop .family-pop-box .family-process{ width:100%; margin-top:25px; } .buyback-pop .family-pop-box .family-process .process-con{ width:100%; display:flex; align-items:flex-start; padding:15px; background:#f9f9f9; border:1px solid #eee; border-radius:5px; gap:10px; } .buyback-pop .family-pop-box .family-process .process-con .ico{ width:60px; } .buyback-pop .family-pop-box .family-process .process-con .cont{ width:calc( 100% - 70px ); } .buyback-pop .family-pop-box .family-process .process-con .cont .title{ font-size:16px; font-weight:700; color:#131313; letter-spacing:-0.2px; } .buyback-pop .family-pop-box .family-process .process-con .cont .txt{ font-size:14px; color:#666; line-height:1.3; margin-top:10px; } .buyback-pop .family-pop-box .family-process .process-con .cont .txt span{ font-size:14px; color:#666; font-weight:700; } .buyback-pop .family-pop-box .family-process .process-con + .process-con{ margin-top:5px; } /* 가상계좌 팝업 */ #cooconPop .coocon-pop-form{ padding-top:20px; position:relative; } #cooconPop .coocon-pop-form .txt-box{ width:100%; } #cooconPop .coocon-pop-form .txt-box .txt{ font-size:14px; line-height:1.3; margin-bottom:20px; color:#515151; } #cooconPop .coocon-pop-form .txt-box .txt span{ font-weight:700; color:#FF3F3F; font-size:14px; } #cooconPop .coocon-pop-form .txt-box .txt + .coocon-title{ font-size:14px; font-weight:500; margin-bottom:10px; } #cooconPop .coocon-pop-form .coocon-list{ width:100%; display:flex; flex-direction:column; gap:5px; } #cooconPop .coocon-pop-form .coocon-list li{ display:flex; align-items:center; padding-left:8px; position:relative; gap:5px; height:20px; } #cooconPop .coocon-pop-form .coocon-list li::before{ content:""; display:block; width:3px; height:3px; border-radius:3px; background:#666; position:absolute; left:0; top:8px; } #cooconPop .coocon-pop-form .coocon-list li .txt{ font-size:14px; color:#131313; font-weight:500; } #cooconPop .coocon-pop-form .coocon-list li .txt.focus{ color:#0061FD; } #cooconPop .coocon-pop-form .coocon-list li .txt span{ font-weight:700; } #cooconPop .coocon-pop-form .coocon-copy{ background:url(../images/smartbuy/vip_car_copy_off.png) no-repeat center; width:20px; height:20px; } #cooconPop .coocon-pop-form .coocon-copy:hover{ background:url(../images/smartbuy/vip_car_copy_on.png) no-repeat center; } #cooconPop .coocon-pop-form .coocon-summary{ margin-top:30px; font-size:14px; color:#666; line-height:1.3; word-break:keep-all; position:relative; padding-left:16px; } #cooconPop .coocon-pop-form .coocon-summary::before{ content:"※"; font-size:14px; color:#666; line-height:1.3; position:absolute; left:0; top:0; } #cooconPop .coocon-pop-form .copy-pop{ position:absolute; z-index:9; padding:10px 20px; border-radius:100px; background:rgba(0, 0, 0, 0.9); color:#fff; font-size:14px; top:50%; left:50%; transform:translate( -50%, -50% ); width:max-content; display:none; } /* 25.08 결재 추가 */ #carPurchasePop{ display:none; } .purchase-pop-form{ width:100%; } .purchase-pop-form .purchase-title{ width:100%; display:flex; align-items:center; gap:6px; padding:30px 0; } .purchase-pop-form .purchase-title i{ width:24px; height:24px; } .purchase-pop-form .purchase-title .title{ font-size:18px; } .purchase-pop-form .purchase-title .title span{ font-size:18px; font-weight:700; } .purchase-pop-form .purchase-box .txt{ font-size:14px; color:#666; } .purchase-pop-form .purchase-box .purchase-summary{ display:flex; flex-direction: column; gap:8px; margin-top:8px; } .purchase-pop-form .purchase-box .purchase-summary li{ position:relative; word-break:keep-all; font-size:14px; color:#666; padding-left:15px; line-height:1.3; letter-spacing:-0.5px; } .purchase-pop-form .purchase-box .purchase-summary li::before{ content:""; display:block; width:3px; height:3px; border-radius:3px; background:#999; position:absolute; left:3px; top:6px; } #carRefundPop{ display:none; } .refund-pop-form{ width:100%; } .refund-pop-form .refund-title{ width:100%; padding:20px 0 30px 0; } .refund-pop-form .refund-title .title{ font-size:18px; line-height:1.3; } .refund-pop-form .refund-title .title span{ font-size:18px; font-weight:700; } .refund-pop-form .refund-title .txt{ margin-top:10px; font-size:14px; color:#666; } .refund-pop-form .refund-box{ width:100%; } .refund-pop-form .refund-box .title{ display:flex; align-items:center; font-size:16px; font-weight:700; } .refund-pop-form .refund-box .title.require::after{ margin-top:0px; margin-left:4px; } .refund-pop-form .refund-box .refund-area{ width:100%; margin-top:10px; } .refund-pop-form .refund-box .refund-area textarea{ width:100%; resize:none; height:160px; padding:8px 12px; font-size:14px; border:1px solid #ddd; border-radius:0px; } .refund-pop-form .refund-box .refund-area textarea::placeholder{ font-size:14px; color:#999; } .layer-pop#carRefundPop .layer-pop-body{ padding-bottom:10px; } /* txt color set */ .red-txt{ color:#cd0000 !important; } .order-view-form .order-view-title{ display:block; } .order-view-form .order-view-title .order-title-box{ display:flex; align-items:center; justify-content:center; gap:67px; } .order-view-form .order-view-title .order-title-box .order-title-con{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; } .order-view-form .order-view-title .order-title-box .order-title-con .btn-box{ width:240px; margin:0 auto; } .order-view-form .order-view-title .order-title-box .order-title-con .btn-box .btn.btn-navy{background:#2e3546; } .order-view-form .order-view-title .order-title-box .order-title-con .btn-box .btn.btn-navy span{color:#fff; font-size:13px; line-height:1.2; font-weight:700;text-align: center; word-break:keep-all; padding:0 15px; box-sizing:border-box;} .order-view-form .order-view-title .order-title-box .order-title-con .btn-box .btn span{ font-size:15px; } .order-view-form .order-view-title .order-title-box .order-title-con .txt{ font-size:14px; color:#515151; } .order-view-form .order-view-title .order-title-box.title-type02{ flex-direction:column; gap:8px; } /* 브릿지 페이지 추가 */ .bridge-page{ width:100%; padding:100px 0; width:620px; margin:0 auto; } .bridge-page .bridge-head{ width:100%; } .bridge-page .bridge-head .bridge-logo{ width:100%; display:flex; align-items:center; } .bridge-page .bridge-head .bridge-logo .finance-logo{ display:flex; align-items:center; } .bridge-page .bridge-head .bridge-logo .finance-logo::before{ content:""; display:block; width:10px; height:10px; margin:0 10px; background:url(../images/finance/bridge_logo_ico.png) no-repeat center; } .bridge-page .bridge-head .bridge-comment{ width:100%; padding:12px 20px; background:#f4f9ff; border-radius:8px; font-size:16px; color:#579aff; margin-top:29px; } .bridge-page .bridge-head .bridge-comment span{ font-size:16px; color:#579aff; font-weight:700; } .bridge-page .bridge-car-info{ width:100%; padding:40px 20px 30px 20px; border-bottom:1px solid #eee; } .bridge-page .bridge-car-info .car-number{ font-size:16px; font-weight:600; color:#131313; } .bridge-page .bridge-car-info .car-name{ margin-top:10px; line-height:1.3; font-size:24px; font-weight:700; color:#131313; word-break: keep-all; } .bridge-page .bridge-car-info .car-info-list{ width:100%; display:flex; align-items:center; margin-top:10px; } .bridge-page .bridge-car-info .car-info-list .info-con{ font-size:14px; color:#888; font-weight:500; position:relative; display:flex; align-items:center; } .bridge-page .bridge-car-info .car-info-list .info-con + .info-con::before{ content:""; display:block; width:3px; height:3px; border-radius:3px; background:#ddd; margin:0 6px; } .bridge-page .bridge-btn-box{ width:100%; margin-top:24px; display:flex; align-items:center; justify-content:center; gap:8px; } .bridge-page .bridge-btn-box .btn{ height:50px; } .bridge-page .bridge-btn-box .btn span{ font-size:16px; } .bridge-page .bridge-btn-box .bridge-none-btn{ width:150px; } .bridge-page .bridge-btn-box .bridge-ok-btn{ width:280px; } .bridge-page .bridge-info-box{ width:100%; margin-top:50px; } .bridge-page .bridge-info-box .bridge-info-list{ width:100%; display:flex; flex-direction: column; gap:4px; } .bridge-page .bridge-info-box .bridge-info-list .bridge-info-con{ display:flex; align-items:center; padding:10px; gap:6px; background:#f9f9f9; border-radius:8px; } .bridge-page .bridge-info-box .bridge-info-list .bridge-info-con .txt{ font-size:14px; color:#666; } .bridge-page .bridge-info-box .bridge-info-list .bridge-info-con .txt span{ font-sizE:14px; color:#666; font-weight:700; } /*** 2026-03-26 김보라 보험 캐롬추가 ***/ .vip-info-head .info-number-set {display: flex;} .info-number-set .insurance-btn {color: #666;font-size: 15px;display:inline-block;margin-left: 4px;position: relative;padding: 1px 2px;} .info-number-set .insurance-btn::before {position: absolute;bottom: 0;height: 1px;left: 0;right: 0;background-color: #666;content: '';display: block;} .vip-info-head .vip-tool-con .link-btn-set {display: flex;gap: 8px;flex-direction: column;align-items: center;} .vip-info-head .vip-tool-con .link-btn-set a {display: flex;width:100%;border: 1px solid #ccc;border-radius: 4px;height: 48px;align-items: center;text-align: center;justify-content: center;}