/**************************************************************************************************/ /* 서브비주얼 /************************************************************************************************ */ .h1 {font-size:1.75rem; color:#222; font-weight:600;} .h2 {font-size:1.375rem; line-height:1.3em; font-weight:700; color:#333; margin-bottom:0.5rem; padding: 0 0.25rem 0.5rem} .h3 {font-size:1rem; font-weight:600;} .title-wrap { display:block; padding-bottom:30px; } .title-wrap h1.title { display:block; font-size:25px; font-weight:600; line-height:1.5em; color:#111; letter-spacing:-.06em;} .title-wrap .h1 {padding-top:2rem;} .title-wrap.center { text-align:center;} .s_visual {display:block; height:210px; max-width:2000px; margin:0 auto; display:none !important;} .s_visual:after {content:''; display:block; width:100%; clear:both; } .s_visual .txt-box {display:block; position:relative; width:1200px; height:100%;padding-top:55px; margin:0 auto; text-align:center; } .s_visual .txt-box h1 { display:inline-block; font-size:1.85rem; font-weight:600; color:#fff; line-height:1.5em; text-shadow:1px 1px 2px rgba(0, 0, 0, 0.2)} .s_visual .txt-box p {display:block;padding-top:10px; font-size:1rem; padding-left:3px; line-height:1.5em; color:#fff; text-shadow:1px 1px 1px rgba(0, 0, 0, 0.2) } .s_visual .txt-box .car-img {position:absolute; right:20px; bottom:-23px; z-index:10;} /*.s_visual .txt-box h1:after {content:''; display:block; height:5px; margin:0 auto; background:rgba(255,255,255,0.2)}*/ .s_visual.s_bg01 { background:url('/images/sub/s_visual_01.jpg') no-repeat center 0; background-size:cover; } .s_visual.s_bg02 { background:url('/images/sub/s_visual_02.jpg') no-repeat center ; background-size:cover; } .s_visual.s_bg03 { background:url('/images/sub/s_visual_03.jpg') no-repeat center ; background-size:cover; } .s_visual.s_bg04 { background:url('/images/sub/s_visual_04.jpg') no-repeat center ; background-size:cover; height:250px;} .s_visual.s_bg05 { background:url('/images/sub/s_visual_05.jpg') no-repeat center ; background-size:cover; height:250px;} .s_visual.s_bg06 { background:url('/images/sub/s_visual_06.jpg') no-repeat center 0; background-size:cover; height:250px;} .s_visual.s_bg07 { background:url('/images/sub/s_visual_01.jpg') no-repeat center ; background-size:cover; } .s_visual.s_bg08 { background:url('/images/sub/s_visual_08.jpg') no-repeat center ; background-size:cover; } .s_visual.s_bg04 .txt-box { padding-top:120px; } .s_visual.s_bg05 .txt-box { padding-top:120px; } .s_visual.s_bg06 .txt-box { padding-top:120px; } .navigation {display:block; text-align:right; margin-top:15px; } .navigation li {display:inline-block; vertical-align:middle; position:relative; font-size:14px;color:#777; } .navigation li:before {content:"\e940"; font-family:'xeicon'; display:inline-block; vertical-align:top; margin-top:1px; margin-right:5px;font-size:17px; } .navigation li:nth-child(1):before {content:"\e902"; display:inline-block; font-size:19px; vertical-align:top;margin-right:0 } .navigation li:nth-last-child(1) {color:#333} /*** container ****/ .container { display:block; margin:0px auto; padding-top:1rem; } .container:after {content:''; clear:both; width:100%; display:block; } @media screen and (max-width:1200px){ .s_visual .txt-box {width:100%; } } /**************************************************************************************************/ /* 서브메뉴 /************************************************************************************************ */ #page01 .s_gnb ul li a.m01, #page02 .s_gnb ul li a.m02, #page03 .s_gnb ul li a.m03, #page04 .s_gnb ul li a.m04, #page05 .s_gnb ul li a.m05 { background-color:var(--color-main); border-color:var(--color-main); color:#fff;} /* .s_gnb {position:absolute; left:0; width:100%; top:135px; height:60px; background-color:rgba(2,169,246,0.85); z-index:10; } .s_gnb:after {content:''; display:block; clear:both; } .s_gnb ul {width:1200px; margin:0 auto; text-align:center;font-size:0; } .s_gnb ul.m04 { padding-left:0px;} .s_gnb ul.m05 {padding-left:250px; } .s_gnb ul.m06 {text-align:right; } */ .s_gnb {position:relative; width:100%; height:50px; /* background-color:rgba(2,169,246,0.85); */ z-index:10; } .s_gnb:after {content:''; display:block; clear:both; } .s_gnb ul { display:flex; width:1200px; margin:0 auto; text-align:center; font-size:0; } .s_gnb ul li {display:inline-block; width:100% ; padding:0;list-style:none; height:50px;margin-left:-1px;} .s_gnb ul li:first-child {margin:0;} .s_gnb ul li a {display:block;position:relative; width:100%; line-height: 50px; font-size:16px; color:#333; border:1px solid #dedede; } .s_gnb ul li a.on { background-color:var(--color-main); border-color:var(--color-main); color:#fff;} /**************************************************************************************************/ /* 차량리스트 /************************************************************************************************ */ /* 검색조건 */ .total-count {display:block;font-size:1rem; color:#333; font-weight:500; } .total-count span {color:var(--color-main); font-size:1.125rem;font-weight:600; letter-spacing:0; } .total-count-wrap {display:flex; align-items:center; justify-content:space-between;} /* count */ .result-count {display:flex; align-items:center; justify-content:space-between;padding:1rem 0; } .result-count .h4 {font-size:1.25rem; font-weight:bold; color:#333; } .result-count .h4 strong {font-size:1.3125rem;color:var(--color-main)} .filter-tab {display:flex; align-items:center; gap:2rem;} .filter-tab a {font-size:1rem; font-weight:400; color:#A2A6AC; cursor:pointer; transition: none; } .filter-tab a:hover {color:#111;} .filter-tab a.active { color:#111; font-weight:bold; padding-left:1.5rem; background-repeat:no-repeat; background-position:left ; background-size:auto 1.3125rem; background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6 10L4 12L10 18L20 8L18 6L10 14L6 10Z' fill='%23333333'/%3E%3C/svg%3E%0A");} /* 250513 = 차량리스트화면 변경 */ .listLine {display:flex;justify-content: space-between;align-items: flex-end; } .listLine .list_right {display:flex; gap:0.375rem;} .listLine .list_right select { border:0; border-bottom:1px solid #dedede; border-radius:0; min-width:100px; height:40px; } .align-wrap {display:inline-block; vertical-align:middle; width:auto;margin-left:0px; font-size:0; } .align-wrap a { display:inline-block; vertical-align:top; width:40px; height:40px; border:1px solid #e5e5e5; background-color:#fff; text-align:center; margin-left:2px;} .align-wrap a i {line-height:35px; font-size:20px; font-family:"Material Design Icons", "xeicon";display:none; } .align-wrap a.on {border:1px solid #111; } .align-wrap a.on i {color:#fff; display:none;} .align-wrap a:before { content:"\FDAC"; font-size:1.25rem; color:#999; display:inline-block; line-height:38px;font-family:"Material Design Icons", "xeicon"; } .align-wrap a.gallery:before {content:"\F03B"; } .align-wrap a.on:before {color:#111; } .result_sort_wrap.mypage .result_sort { width:100%;} .result_sort_wrap.mypage .align-wrap {display:none;} .result_sort_wrap {display:block; width:100%;margin:0px 0 30px; font-size:0; border-radius:0px; background-color:#F5F5F6; padding:1rem; } .result_sort_wrap .result_sort { font-size:0; display:block; vertical-align:middle; border:0px solid #f00; font-size:0; } .result_sort_wrap .result_sort.all {width:100%;} .result_sort_wrap .result_sort.flex > form{display:flex} .result_sort_wrap .result_sort form {display:flex; width:100%; gap:0.25rem;} .result_sort_wrap .result_sort select, .result_sort_wrap .result_sort input[type="text"], .result_sort_wrap .result_sort button { border-radius:0.25rem; height:40px; line-height:40px; border-radius:0.3125rem; font-size:15px;} .result_sort_wrap .result_sort select, .result_sort_wrap .result_sort input[type="text"] { border:1px solid #fff; background-color:#fff; } .result_sort_wrap .result_sort select:focus, .result_sort_wrap .result_sort input[type="text"]:focus { border:1px solid var(--color-main);} .result_sort_wrap .result_sort select {padding-right:28px; letter-spacing:-.10em; } .result_sort_wrap .result_sort button { background-color:#333;border:1px solid transparent; color:#fff; border-radius:0.25rem; } .result_sort_wrap .result_sort button:hover {background-color:var(--color-main); border:1px solid var(--color-main);} .result_sort_wrap .result_sort .w8 {width:calc(8% - 5px)} .result_sort_wrap .result_sort .w10 {width:calc(12% - 5px)} .result_sort_wrap .result_sort .w12 {width:calc(12% - 5px)} .result_sort_wrap .result_sort .w15 {width:calc(15% - 5px)} .result_sort_wrap .result_sort .w20 {width:calc(20% - 5px);} .result_sort_wrap .item_group {display:flex; gap:0.25rem; width:calc(100% - 8rem); font-size:0;} .result_sort_wrap .btn_group {display:flex; gap:0.25rem; font-size:0;padding-left:0.25rem} .item_group select { min-width:6.5rem;} .item_group input { flex: 2 0 0;} .item_group .unit.area {min-width:8rem;} .item_group .sort {flex:2.5 0 0; display:flex; gap:0.25rem;} .btn_group {flex:auto; width:8rem; gap:0.25rem;} .btn_group .btn-search { flex:2; max-width:100%;l} .btn_group .reset { flex:1;background-color:transparent !important; border:1px solid #DDDFE8 !important; background-repeat:no-repeat; background-position:center ; background-size:auto 52%; background-image: url("data:image/svg+xml,%3Csvg width='19' height='19' viewBox='0 0 19 19' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.58331 9.50001C1.58331 13.8724 5.12761 17.4167 9.49998 17.4167C13.8724 17.4167 17.4166 13.8724 17.4166 9.50001C17.4166 5.12764 13.8724 1.58334 9.49998 1.58334V3.16668C11.0164 3.16685 12.4824 3.71111 13.6316 4.70052C14.7807 5.68993 15.5367 7.05882 15.7622 8.55838C15.9877 10.0579 15.6676 11.5886 14.8602 12.8722C14.0528 14.1558 12.8116 15.1071 11.3623 15.5531C9.91295 15.9992 8.35169 15.9104 6.96226 15.303C5.57283 14.6956 4.44746 13.6098 3.79072 12.2429C3.13397 10.8761 2.98943 9.31903 3.38337 7.85469C3.77732 6.39034 4.6836 5.11594 5.93748 4.26314V6.33334H7.52081V1.58334H2.77081V3.16668H4.74998C3.76631 3.90366 2.96795 4.85978 2.41826 5.95915C1.86858 7.05852 1.5827 8.27088 1.58331 9.50001Z' fill='%23666666'/%3E%3C/svg%3E%0A");} .btn_group > .reset:hover {background-color:transparent; } .result_sort_wrap input[type=checkbox] + label:before, .result_sort_wrap input[type=checkbox] + label:after {display:none;} .result_sort_wrap input[type=checkbox] + label {display:flex; align-items: center; padding:0; justify-content: center; background-color:#fff;flex:auto; border-radius:0.25rem; border:1px solid transparent } .result_sort_wrap input[type=checkbox]:checked + label {border:1px solid var(--color-main); color:var(--color-main)} /* 260716 지역선택 추가 */ .all-area-wrap {display:flex; align-items:center; justify-content:space-between; padding:0.5rem !important; border-bottom:1px dashed #eee !important} .all-area-wrap button {display:inline-flex; align-items:center; padding:0 0.75rem;font-size:0.75rem; height:1.5rem; border-radius:3rem; background-color:#f5f5f5; color:#666} .result_sort_wrap .result_sort .btn_area {width:100%; background-color:#fff !important; color:#333;border:1px solid #e5e5e5;padding-right:1rem; background-position:90% ; background-repeat:no-repeat; background-size:auto 1rem; background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M14.7774 5.19452C15.064 5.46372 15.0755 5.90987 14.8022 6.19225L8.43237 12.781C8.36545 12.8502 8.28495 12.9053 8.19578 12.9429C8.1066 12.9806 8.01059 13 7.91357 13C7.81655 13 7.72054 12.9806 7.63136 12.9429C7.54218 12.9053 7.46169 12.8502 7.39477 12.781L4.21031 9.48663C4.14263 9.42007 4.08916 9.34084 4.05305 9.2536C4.01694 9.16636 3.99892 9.07288 4.00005 8.97868C4.00118 8.88447 4.02144 8.79144 4.05964 8.70507C4.09784 8.6187 4.1532 8.54073 4.22246 8.47577C4.29172 8.4108 4.37348 8.36015 4.46292 8.3268C4.55235 8.29345 4.64767 8.27808 4.74323 8.28158C4.8388 8.28509 4.93268 8.3074 5.01936 8.34721C5.10604 8.38702 5.18375 8.44352 5.24791 8.51338L7.91357 11.2712L13.7646 5.21899C13.8957 5.08349 14.076 5.0048 14.2659 5.00021C14.4558 4.99562 14.6398 5.06551 14.7774 5.19452Z' fill='%23777777'/%3E%3C/svg%3E%0A"); } .result_sort_wrap .area_wrap {position:relative; width:calc(11% - 5px); margin-right:5px;} .result_sort_wrap .area_wrap .cont {position:absolute; left:5px; top:45px; width:320px; background-color:#fff;padding:0.25rem 0.875rem 0.875rem; border:1px solid #eee; z-index:10; box-shadow:5px 5px 12px rgba(0,0,0,0.05) } .result_sort_wrap .area_wrap .cont .title {position:relative;height:2rem; display:flex; align-items:center; justify-content:space-between;} .result_sort_wrap .area_wrap .cont .title h3 {font-size:0.875rem; color:#333; font-weight:500; } .result_sort_wrap .area_wrap .cont .title .close {background-color:#fff; border:0; margin-right:-0.5rem !important; width:1.75rem; height:1.75rem; font-size:0; background-position:center ; background-repeat:no-repeat; background-size:auto 1rem; background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 12L19 19M12 12L5 5M12 12L5 19M12 12L19 5' stroke='%23111111' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A"); } .result_sort_wrap .area_wrap .check-item {max-height:250px; overflow-y:auto; } .result_sort_wrap ::-webkit-scrollbar { width: 5px;height:12px;} .result_sort_wrap ::-webkit-scrollbar-track { background-color: #f9f9f9; } .result_sort_wrap ::-webkit-scrollbar-thumb { background:#aaa !important; opacity:1 !important; border-radius:0px; } .seciton_wrap {display:flex;justify-content: space-between;align-items: flex-start; } .seciton_wrap .title-wrap {padding:0 0 .5rem;} .seciton_wrap .schset {width:260px; padding-top:.25rem;} .seciton_wrap .schset .reset { height:1.5rem; display:inline-flex; align-items: center; gap:.2rem; padding:0 .65rem; background-color:#f5f5f5; border-radius:3rem; font-size:.8rem; font-weight:500;} .seciton_wrap .schset .reset:before {content: "\e973";font-family:'xeicon';display:inline-flex; align-items: center; font-size:.85rem; color:#333;} .seciton_wrap .schset .title {position:relative; display:flex; align-items: center; justify-content: space-between; padding:0 .5rem 0; font-size:0.9375rem;color:#222; font-weight:600;} .seciton_wrap .schset .title.mg0{margin:0;} .seciton_wrap .schset ul {display:flex;flex-direction: column;/* border-top:1px solid #eaeaea; */} .seciton_wrap .schset ul li {position:relative; border-top:1px solid #eeeef0; padding:1.25rem 0;} .seciton_wrap .schset ul li:first-of-type, .seciton_wrap .schset ul li:last-child {border:0;} .seciton_wrap .schset ul li ul {padding:0 0.5rem 0;margin-top:0.875rem; border-top:0;/* background-color:#f6f8fa;*/ } .seciton_wrap .schset ul li ul li {border:0 !important; padding:0;} .seciton_wrap input[type=radio] + label {font-size:.9rem; font-weight:600; color:#555; padding-right:0;} .seciton_wrap input[type=radio]:checked + label {color:var(--color-main)} .seciton_wrap .schset ul li>ul.brand {display:flex;flex-direction: column; gap:.95rem; max-height:9.5rem; overflow-y:auto} .seciton_wrap .schset ul li>ul.brand>li {border:0;display:flex; justify-content: space-between;align-items: center; font-size:.9rem; font-weight:500;cursor:pointer; } .seciton_wrap .schset ul li>ul.brand>li.active {color:var(--color-main)} /*.seciton_wrap .schset ul li>ul.sort li {display:flex; justify-content: center; gap:.85rem;}*/ .seciton_wrap .schset ul li>ul.year li {display:flex;flex-direction: column;gap:.2rem;} .seciton_wrap .schset ul li>ul.year li p {font-size:.85rem; color:#999; display:flex; align-items: center;gap:.15rem;} .seciton_wrap .schset ul li>ul.year .select1 {width:48%;} .seciton_wrap .schset ul li>ul.year .select2 {width:38%;} .seciton_wrap .schset ul li>ul.sch li p {display:flex; gap:.2rem;} .seciton_wrap .schset ul li>ul.sch select {width:95px;} .seciton_wrap .schset ul li>ul.sch input {width:calc(100% - 95px); color:#111; font-weight:600;} .seciton_wrap .schset ul li>ul.area {max-height:9.25rem; overflow-y:scroll} .seciton_wrap .schset ul li>ul.gu p {display:flex; gap:0.25rem;} .seciton_wrap .schset ul li>ul.gu p select {width:50%;} .seciton_wrap .schset ul li.total_search {padding:0 0.5rem 0;} .seciton_wrap .schset ul li.total_search button {background-color:#132E69; color:#fff; font-size:0.9375rem; font-weight:bold; width:100%; height:2.875rem; text-align:center; border-radius:0.25rem;} /* 260716 지역선택 추가 */ .check-item {display:flex;flex-wrap:wrap; align-items: center; gap:0.25rem;} .check-item input[type=radio], .check-item input[type=checkbox] {display:none;position:absolute;opacity:0;-webkit-opacity:0;-moz-opacity:0;z-index:0;} .check-item input[type=radio] + label, .check-item input[type=checkbox] + label {display:flex; align-items: center; justify-content: center; gap:0.25rem; width:calc(33.3% - 0.1625rem);height:2.25rem;padding:0; border:1px solid #d7dadf; background-color:#fff !important; color:#707480; border-radius:0.25rem; font-weight:600; font-size:0.875rem !important; } .check-item input[type=radio] + label:before, .check-item input[type=radio] + label:after, .check-item input[type=checkbox] + label:before, .check-item input[type=checkbox] + label:after{display:none;} .check-item input[type=radio]:checked + label, .check-item input[type=checkbox]:checked + label {z-index:2 ;border-color:var(--color-main); color:var(--color-main); font-weight:700; opacity:1;} /* 260827 지역선택 스타일 변경 */ .filter_branch {display:flex; flex-direction:column; gap:0.25rem;padding:0.9375rem 0.5rem 0; max-height:20rem; overflow-y:auto; } .filter_branch input[type=checkbox] + label {font-size:0.9375rem; padding-left:1.625rem;} .filter_branch .row-item {display:flex; flex-direction:column; gap:0.5rem;} .filter_branch .row-head {position:relative; display:flex; align-items:center; justify-content:space-between; } .filter_branch .row-head .right {display:flex; align-items:center; justify-content:flex-end; gap:0.25rem; } .filter_branch .row-head .right span {font-size:0.8125rem; color:#C6CED7; } .filter_branch .row-head .right .btn-toggle { display:flex; align-items:center; justify-content:center; width:1.5rem; height:1.5rem; } .filter_branch .row-head .right .btn-toggle:after {content:''; display:inline-block; width:100%; height:100%; background-repeat:no-repeat; background-position:center ; background-size:auto 0.625rem; background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='utf-8'%3F%3E%3C!-- Generator: Adobe Illustrator 27.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 21 17' style='enable-background:new 0 0 21 17;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23AAB6C4;%7D%0A%3C/style%3E%3Cg%3E%3Crect x='1' y='7.5' transform='matrix(-0.7071 -0.7071 0.7071 -0.7071 5.8611 19.4217)' class='st0' width='12' height='2'/%3E%3Crect x='8' y='7.5' transform='matrix(-0.7071 0.7071 -0.7071 -0.7071 29.9924 4.5828)' class='st0' width='12' height='2'/%3E%3C/g%3E%3C/svg%3E%0A"); } .filter_branch .row-head .right .btn-toggle.on:after {transform: rotate(-180deg);} .filter_branch .row-cont {display:block; padding:0.75rem; border-radius:0.25rem; background-color:#F5F7FD; } .filter_branch .branch-list {display:flex; flex-wrap:wrap; gap:0.25rem;} .branch-list input[type=checkbox] {display:none;position:absolute;opacity:0;-webkit-opacity:0;-moz-opacity:0;z-index:0;} .branch-list input[type=checkbox] + label {display:flex; align-items: center; justify-content: center; gap:0.25rem; width:calc(33.3% - 0.1625rem);height:2.25rem;padding:0; border:1px solid #d7dadf; background-color:#fff !important; color:#707480; border-radius:0.25rem; font-weight:600; font-size:0.875rem !important; } .branch-list input[type=checkbox] + label:before, .branch-list input[type=checkbox] + label:after{display:none;} .branch-list input[type=checkbox]:checked + label {z-index:2 ;border-color:var(--color-main); color:var(--color-main); font-weight:700; opacity:1;} .seciton_wrap .schset ul li ul input[type=checkbox], .seciton_wrap .schset ul li ul input[type=radio]{display:none;position:absolute;opacity:0;-webkit-opacity:0;-moz-opacity:0;z-index:0;} .seciton_wrap .schset ul li ul input[type=checkbox] + label, .seciton_wrap .schset ul li ul input[type=radio] + label{display:flex; align-items: center; justify-content: center; gap:0.25rem; height:2.25rem;padding:0; border:1px solid #d7dadf; background-color:#fff !important; color:#707480; border-radius:0.25rem; font-weight:600; font-size:0.875rem !important; } .seciton_wrap .schset ul li ul input[type=checkbox] + label:before, .seciton_wrap .schset ul li ul input[type=radio] + label:before, .seciton_wrap .schset ul li ul input[type=checkbox] + label:after, .seciton_wrap .schset ul li ul input[type=radio] + label:after{display:none;} .seciton_wrap .schset ul li ul input[type=checkbox]:checked + label, .seciton_wrap .schset ul li ul input[type=radio]:checked + label{z-index:2 ;border-color:var(--color-main); color:var(--color-main); font-weight:700; opacity:1;} .seciton_wrap .schset ul li ul.sort li {display:flex; flex-wrap:wrap; gap:0.25rem;} .seciton_wrap .schset ul li ul.sort li input[type=radio] + label { width:calc(50% - 0.25rem);} /* 20260806 검색조건 추가 */ .seciton_wrap .schset ul li ul.condition {display:flex; justify-content: center; flex-direction: row; gap:0.3125rem; } .seciton_wrap .schset ul li ul.condition button {flex:1; height:2.25rem; align-items:center; justify-content: center; display:inline-flex; align-items: center;padding:0 .5rem; background-color:#fff; border:1px solid #eaeaea; border-radius:0.25rem; font-size:0.875rem; font-weight:500; letter-spacing:-0.04em;} .seciton_wrap .schset ul li ul.condition button:hover {border-color:var(--color-main)} .seciton_wrap .schset ul li ul.condition button:before {content:''; width:1rem; height:1rem; background-repeat:no-repeat; background-position:center ; background-size:auto 100%; margin-right:0.25rem;} .seciton_wrap .schset ul li ul.condition button.list:before {background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M13.5 11.3496C13.859 11.3496 14.1504 11.641 14.1504 12C14.1504 12.359 13.859 12.6504 13.5 12.6504H6C5.64101 12.6504 5.34961 12.359 5.34961 12C5.34961 11.641 5.64101 11.3496 6 11.3496H13.5ZM10.5 7.34961C10.859 7.34961 11.1504 7.64101 11.1504 8C11.1504 8.35898 10.859 8.65039 10.5 8.65039H6C5.64101 8.65039 5.34961 8.35898 5.34961 8C5.34961 7.64101 5.64101 7.34961 6 7.34961H10.5ZM13.5 3.34961C13.859 3.34961 14.1504 3.64101 14.1504 4C14.1504 4.35899 13.859 4.65039 13.5 4.65039H6C5.64101 4.65039 5.34961 4.35899 5.34961 4C5.34961 3.64101 5.64101 3.34961 6 3.34961H13.5Z' fill='%23111111'/%3E%3Cpath d='M2 12C2 11.7348 2.10543 11.4805 2.29297 11.293C2.48051 11.1054 2.73478 11 3 11C3.26522 11 3.51949 11.1054 3.70703 11.293C3.89457 11.4805 4 11.7348 4 12C4 12.2652 3.89457 12.5195 3.70703 12.707C3.51949 12.8946 3.26522 13 3 13C2.73478 13 2.48051 12.8946 2.29297 12.707C2.10543 12.5195 2 12.2652 2 12ZM2 8C2 7.73478 2.10543 7.4805 2.29297 7.29297C2.4805 7.10543 2.73478 7 3 7C3.26522 7 3.5195 7.10543 3.70703 7.29297C3.89457 7.4805 4 7.73478 4 8C4 8.26522 3.89457 8.5195 3.70703 8.70703C3.51949 8.89457 3.26522 9 3 9C2.73478 9 2.48051 8.89457 2.29297 8.70703C2.10543 8.5195 2 8.26522 2 8ZM2 4C2 3.73478 2.10543 3.4805 2.29297 3.29297C2.4805 3.10543 2.73478 3 3 3C3.26522 3 3.5195 3.10543 3.70703 3.29297C3.89457 3.4805 4 3.73478 4 4C4 4.26522 3.89457 4.5195 3.70703 4.70703C3.5195 4.89457 3.26522 5 3 5C2.73478 5 2.4805 4.89457 2.29297 4.70703C2.10543 4.5195 2 4.26522 2 4Z' fill='%23111111'/%3E%3C/svg%3E%0A");} .seciton_wrap .schset ul li ul.condition button.saved:before {background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.3 5.30005L8.49999 12.1L5.69999 9.30005L4.29999 10.7L8.49999 14.9L16.7 6.70005L15.3 5.30005Z' fill='%23111111'/%3E%3C/svg%3E%0A");} .seciton_wrap .schset input[type="text"], .seciton_wrap .schset select {height:2.25rem; border-radius:.2rem; font-size:.9rem; width:auto; border-color:#d7dadf;} .seciton_wrap .schset ::-webkit-scrollbar { width: 4px;height:12px;} .seciton_wrap .schset ::-webkit-scrollbar-track { background-color: #fff; } .seciton_wrap .schset ::-webkit-scrollbar-thumb { background:#ddd !important; opacity:1 !important; border-radius:0.5rem; } .seciton_wrap .carlist_wrap {width:calc(100% - 260px); padding-left:2.85rem; padding-top:.5rem;} @media screen and (max-width:1200px){ .seciton_wrap .schset {/*width:210px; */} .seciton_wrap .carlist_wrap {/*width:calc(100% - 210px);*/ padding-left:1.5rem; } } /* 차량리스트 갤러리형 */ .result-carlist { position:relative; display:block; width:100%; margin:15px 0 0; font-size:0;} .result-carlist.fuc_temp li {height:250px !important; overflow:hidden;} .result-carlist.fuc_temp li:after {display:none;} .result-carlist li { display:inline-block; position:relative; vertical-align:top; width:calc(25% - 15px); position:relative;height:420px;border-radius:0px; overflow:hidden; margin-left:20px; margin-bottom:40px; z-index:1} .result-carlist li:before {content:''; position:absolute; left:0;top:0; background-color:#fff; border:1px solid #eaeaea; width:100%; height:100%;z-index:-2 } .result-carlist li a.cont { } .result-carlist li:hover {border-color:var(--color-main) ;box-shadow: 3px 3px 8px rgba(8, 8, 8, 0.05);transition: all 0.2s ease-in;} .result-carlist li:after {content:'';position:absolute; left:1px; bottom:1px; width:calc(100% - 2px); height:110px; background-color:#f9f9f9; z-index:-1} .result-carlist li:nth-child(1) { margin-left:0; } .result-carlist li:nth-child(4n+1) {clear:both; margin-left:0; } .result-carlist .thumb {display:block; position:relative; height:185px; background-size:cover; background-repeat:no-repeat; background-position:center center; background-image:url('/images/no_img.png'); background-color:#f5f5f5; } .result-carlist .img-wrap {display:block; position:relative; height:185px; background-size:cover; background-repeat:no-repeat; background-position:center center; } .result-carlist .img-wrap a {display:block; width:100%; height:100%;} .result-carlist button.carwish {position:absolute; right:10px; bottom:10px; background:rgba(0,0,0,0.3); border-radius:50%; width:35px; height:35px; border:0; text-align:center; z-index:30; } .result-carlist button.carwish:before {content:"\F2D5"; display:inline-block; line-height:37px; color:#fff; font-size:20px; font-family:"xeicon","Material Design Icons";} /*.result-carlist button.carwish:focus:before {content:"\F8CF"; color:#f64629} .result-carlist button.carwish:active:before {content:"\F8CF"; color:#f64629}*/ .result-carlist button.carwish.on:before {content:"\F8CF"; color:#f64629} .result-carlist.new {display:flex; flex-wrap: wrap; gap:1.2rem;font-size:0; margin-bottom:2rem;} .result-carlist.new li {width:calc(33.3% - .8rem); margin:0 !important;} .auc-ht .result-carlist li {height:420px;} /* 일반-보험경공매 높이값 */ .auc-ht .s_visual {display:none;} .badge-group { display:flex;flex-wrap:wrap; gap:0.25rem !important; padding-top:0.25rem; span, .badge {display:inline-flex;align-items: center; height:1.375rem; padding:0 0.5rem; border-radius:0.25rem; line-height:1; background-color:#f1f1f1; font-size:0.75rem; font-weight:500; border:0 !important; font-family:'나눔고딕', 'pretendard';} .badge.dashed {} .badge.gna { /*background-color:#E3F5FE; color:#108BE3;*/ background-color:#1396f3; color:#fff !important;}/* 일반 */ .badge.ins {/* background-color:#F8F2E6; color:#E67401; */ background-color:#ee7802; color:#fff !important;}/* 보험 */ .badge.happy {/*background-color:#EEF9EF; color:#03B131; */ background-color:#02bb34; color:#fff !important;}/* 해피폐차 */ .badge.recycle {/*background-color:#ECF5F9; color:#108DBA;*/ background-color:#03b6ec; color:#fff !important;}/* 재활용 */ .badge.loss {/*background-color:#EBE9FE; color:#4727F8; */ background-color:#654bfa; color:#fff !important; }/* 전손 */ .badge.scrap {/*background-color:#FBF0F1; color:#ED2929; */ background-color:#f1454e; color:#fff !important; }/* 폐차 */ .badge.restor {/*background-color:#E4EBFE; color:#186CEA; */ background-color:#3280f7; color:#fff !important; }/* 구제 */ } .label-area {position:absolute; left:5px; top:-180px; z-index:10;display:flex; align-items: center; gap:0.125rem !important; } .label-area label { position:relative; margin-right:0px;display:inline-flex;align-items: center; height:1.625rem; line-height:1.39rem; padding:0 0.5rem; border-radius:0.25rem; background-color:#595d92; font-size:0.875rem; font-weight:700; font-family:'나눔고딕','pretendard'; } .label-area label.status1 {/* background-color:#E4EBFE; color:#186CEA; */ background-color:#2779f5; color:#fff;}/* 구제 */ .label-area label.status2 {/* background-color:#FBF0F1; color:#ED2929; */ background-color:#f1454e; color:#fff;}/* 폐차 */ .label-area label.status3 { /* background-color:#ECF5F9; color:#108DBA; */ background-color:#04b1e6; color:#fff;}/* 부품 or 재활용 */ .label-area label.status4 {/* background-color:#E3F5FE; color:#108BE3; */ background-color:#1594ee; color:#fff;}/* 기타 */ .label-area label.status5 {/* background-color:#eafaf3; color:#03a56f; */ background-color:#0ebb81; color:#fff;}/* 매매 */ .label-area label.status6 {/* background-color:#f5e3fe; color:#8a11ec; */background-color:#9d31f5; color:#fff; }/* 수출 */ /* 재활용 부품매매 리스트 */ .result-carlist.recycle li {height:400px;} .result-carlist.recycle li:after { height:50px; } .result-carlist.recycle.general .auc-info {top:60px;} .usedcar-icon {position:absolute; right:5px; top:-180px; z-index:10;display:flex; align-items: center; gap:0.125rem !important; } .usedcar-icon span {display:inline-block; position:relative; margin-right:0px;display:inline-flex;align-items: center; height:1.625rem; line-height:1.39rem; padding:0 0.5rem;border-radius:0.25rem; background-color:#1dca9f; color:#fff; font-size:0.875rem; font-weight:700;font-family:'나눔고딕','pretendard'; } .usedcar-icon span.allcrush { /* background-color:#EBE9FE; color:#4727F8; */ background-color:#5e43f5; color:#fff; }/* 전손 */ .result-carlist .car-info {display:block; position:relative; padding:18px 20px 0; } .result-carlist .car-info .title {font-size:18px; display:block;color:#222; font-weight:500; line-height:1.3em; overflow:hidden; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis;} .result-carlist .car-info .subtitle {display:block; font-size:15px; color:#777; padding-top:5px; height:25px;} .result-carlist .auc-info {display:block;position:relative; clear:both; padding:7px 0 0; } .result-carlist .auc-info p {display:block; margin-bottom:8px; font-size:14px; } .result-carlist .auc-info p span {display:inline-block; position:relative; vertical-align:top;} .result-carlist .auc-info p span:first-child {width:85px; margin-right:10px; color:#999} .result-carlist .auc-info p span:first-child:after {content:'';position:absolute; width:1px; height:14px; border-right:1px solid #ddd; right:0; top:3px; } .result-carlist .auc-info p span:first-child + span {width:calc(100% - 95px); } .result-carlist .badge-group {position:absolute; left:5px; top:-180px; z-index:10; padding:0;} .result-carlist .badge-group .badge {padding:0 0.5rem; } .car-desc {position:relative; display:block; gap:0.25rem; margin-top:.2rem; font-size:13px; line-height:21px; color:#888;height:60px; } .car-desc span {position:relative; display:inline-block;font-size:13px; height:auto; line-height:1.5em; color:#888; padding-right:0.625rem; margin-right:0.4375rem;} .car-desc span:after {content:''; position:absolute;top:50%; margin-top:-1.5px; right:-1.5px; width:3px; height:3px; border-radius:50%; background-color:#ddd} .car-desc span:last-child {padding-left:0; margin-left:0;} .car-desc span:last-child:after {display:none;} /* 차량리스트 일반형 */ .result-carlist.general { margin-bottom:30px;border-top:1px solid #dedede; } .result-carlist.general li { display:block; position:relative; height:auto; width:100%; margin-left:0; padding-bottom:1.125rem; padding-top:1.125rem; border:0; border-radius:0; margin:0;border-bottom:1px solid #eee; } .result-carlist.general li:hover {background-color:#f6f9fb; box-shadow:none;} /*.result-carlist.general li a {display:block; height:auto; border-radius:0px; border:0; }*/ .result-carlist.general li:before {display:none;} .result-carlist.general li:hover {box-shadow: none;} .result-carlist.general li:after {display:none; } .result-carlist.general .thumb {display:inline-block;vertical-align:top; width:170px; height:120px; background-size:cover; background-repeat:no-repeat; background-position:center center; background-image:#f4f4f4 url('/images/no_img.png')} .result-carlist.general .img-wrap {display:inline-block;vertical-align:top; width:100%; height:100%; } .result-carlist.general .car-info {display:inline-block; vertical-align:top; width:calc(100% - 170px); padding:0; padding-left:1.2rem; } .result-carlist.general .car-info .title {font-size:20px; margin-top:0px; overflow:hidden; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis;} .result-carlist.general .car-info .car-desc {font-size:.85rem; height:auto; margin-top:.85rem; } .result-carlist.general .car-info .car-desc em {margin:3px 12px 0; } .result-carlist.general .label-area {position:relative; left:auto; top:0; margin-bottom:10px; } .result-carlist.general .badge-group {position:relative; left:auto; top:0; margin-bottom:10px; } .result-carlist.general li .mark {position:absolute; z-index:55; width:99px; height:99px; top:30px; right:280px; background:url('/images/inc/mark_end.png');} .result-carlist.general .btn-print { display:inline-block; clear:both; height:25px; line-height:25px; color:#fff; padding:0 10px; font-size:14px; border-radius:3px; background-color:#f65f0d} .result-carlist.general .btn-print:before {content:"\e9bb"; display:inline-block; vertical-align:middle; color:#fff; font-size:18px; margin-right:3px; } .result-carlist.general .usedcar-icon {position:absolute; left:120px; right:auto; top:0px;} .result-carlist.general .auc-info {position:absolute; width:300px; right:0; top:0px; padding:0 20px 0 0} .result-carlist.general .auc-info p { font-size:15px; width:100%; } .result-carlist.general .auc-info p span:first-child {width:100px;margin-right:20px; display:inline-block;} .result-carlist.general .auc-info p span:first-child:after {height:15px; top:5px; } .result-carlist.general .auc-info p span:first-child + span {width:calc(100% - 120px);display:inline-block; } @media screen and (max-width:1200px){ .result-carlist li a {height:410px; } .result-carlist li a:after { height:100px;} .result-carlist .car-info {padding:18px 15px 0; } .result-carlist .car-info .title {font-size:16px; } .result-carlist .auc-info {padding:0.5rem 0 0; } .result-carlist .auc-info p { font-size:13px; } .result-carlist .auc-info p span:first-child {width:75px; } .result-carlist.general .thumb {width:120px; height:90px; } .result-carlist.general .car-info {width:calc(100% - 120px)} .result-carlist.general .auc-info{padding:0; width:260px;} } /* 중고부품리스트 */ .table-list {display:block; margin:20px 0 0} .table-list li { display:inline-block; position:relative; vertical-align:top; width:calc(33.3% - 20px); margin-left:30px; border-radius:0px; overflow:hidden; margin-bottom:30px; z-index:1} .table-list li:nth-child(1) { margin-left:0; } .table-list li:nth-child(3n+1) {clear:both; margin-left:0; } .table-list li a {display:block; border:1px solid #ddd; padding:30px; height:230px; transition: all 0.2s ease-in; } .table-list li a:hover {border-color:var(--color-main); } .table-list .name {color:var(--color-main); font-size:16px; font-weight:500; } .table-list .title {display:block; color:#333; font-size:20px; color:#111; line-height:1.6em; margin:20px 0 30px; height:62px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .table-list .date { position:absolute; left:30px; bottom:40px; color:#888; font-size:15px; } .table-list .file {position:absolute; right:30px; bottom:40px; width:25px; height:25px; text-align:center; } .table-list .file:after {content:"\F339"; display:inline-block; font-size:25px; color:#333} .table-list .record {position:absolute; top: 30px; right:30px; text-align:right; } .table-list .record span {display:inline-block; vertical-align:top; margin-left:20px;font-size:15px; line-height:1.3em; color:#444; } .table-list .record span i {display:inline-block; vertical-align:top; margin-top:0px; color:#aaa; margin-right:5px; font-size:18px; } .table-img-list {display:block; margin:20px 0 0} .table-img-list li { display:inline-block; position:relative; vertical-align:top; width:calc(25% - 15px); position:relative;border-radius:0px;border:0px solid #ddd; margin-left:20px; margin-bottom:40px; z-index:1} .table-img-list li:nth-child(1) { margin-left:0; } .table-img-list li:nth-child(4n+1) {clear:both; margin-left:0; } .table-img-list li .thumb {display:block; position:relative; height:185px; background-size:cover; background-repeat:no-repeat; background-position:center center; background-image:url('/images/no_img.png'); background-color:#f5f5f5; } .table-img-list li .img-wrap {display:block; position:relative; height:185px; background-size:cover; background-repeat:no-repeat; background-position:center center; } .table-img-list li a {display:block; width:100%; height:100%;} .table-img-list li .cont {display:block; position:relative; padding:15px 5px 0; height:130px; } .table-img-list li .cont .name {display:block; font-size:14px;line-height:1.3em; color:var(--color-main)} .table-img-list li .cont .title {display:block; font-size:15px;line-height:1.5em; color:#333; padding:5px 0; height:3.2em; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;} .table-img-list li .cont .data-line {position:absolute; left:5px; bottom:20px; font-size:14px; line-height:1.3em; color:#333} .table-img-list li .cont .data-line .date {color:#999; } .table-img-list li .cont .data-line em {display:inline-block; vertical-align:top;margin:0 10px; } .table-img-list li .cont .data-line i {display:inline-block; vertical-align:top; font-size:18px; color:#aaa; margin-right:5px; } /* 중고부품뷰페이지 */ .table-view-title {display:block; margin-top:30px; } .table-view-title .title { display:block; padding-left:2px; font-size:21px; color:#333; padding-bottom:15px; border-bottom:1px solid #666; } .table-view-title .txt-info {display:block; padding:15px 5px; line-height:30px; height:62px; border-bottom:1px solid #eee; } .table-view-title .txt-info span {display:inline-block; vertical-align:middle;font-size:15px; color:#888;} .table-view-title .txt-info em { display:inline-block; vertical-align:middle; width:1px; height:14px; background-color:#ddd; margin:0px 12px 0;} .table-view-title .txt-info strong {display:inline-block; color:#000; margin-left:8px; font-weight:500;} .table-view-title .txt-info .file { position:relative; color:var(--color-main); padding-left:10px; } .table-view-title .txt-info .file a{ color:var(--color-main);} .table-view-title .txt-info .file:before {content:"\F339"; display:inline-block; margin-right:5px; font-size:21px; } .table-view-title .txt-info .date {float:right; padding-right:10px; } .label-wait { display:inline-block; vertical-align:middle; height:32px; line-height:30px; font-size:14px; color:var(--color-main); border:1px solid #ddd; text-align:center; width:80px;} .label-answer {display:inline-block; vertical-align:middle; height:32px; line-height:30px; font-size:14px; background-color:var(--color-main); border:1px solid var(--color-main); color:#fff;text-align:center; width:80px; } .table-view-cont {display:block; padding:20px; font-size:15px; line-height:1.6em; color:#555; } .table-view-cont .Inq-answer {background-color:#f1f6f8; padding:30px 30px 30px 50px; margin-top:30px; color:#777} .table-view-cont .table-line .tb-tit { display:inline-block; vertical-align:top; width:160px; color:#111; padding-left:25px; font-size:16px; line-height:40px; } .table-view-cont .table-line .tb-cont { display:inline-block; vertical-align:top; width:calc(100% - 160px); padding-right:0px; font-size:16px; } .table-btn-area.line {border-top:1px solid #ddd;padding-top:30px; } .table-btn-area {display:block; clear:both; margin:0px 0 30px;font-size:0; padding-top:20px; } .table-btn-area .write {display:inline-block; text-align:center; height:50px; line-height:50px; padding:0 30px; background-color:var(--color-main); color:#fff; font-size:17px; } .table-btn-area .write:before {content:"\ea39"; display:inline-block; vertical-align:middle; margin-right:5px; font-size:20px; } .table-btn-area .write:hover {background-color:#333; } .table-btn-area .btn-list {display:inline-block; vertical-align:top; width:30%; text-align:center; } .table-btn-area .btn-list button {display:inline-block; vertical-align:middle; margin:0 3px; height:55px; background-color:#fff; color:#333; font-size:16px; line-height:55px; padding:0 20px; border:1px solid #ddd; } .table-btn-area .btn-list .w-list{background-color:#333; border-color:#333; color:#fff; } .table-btn-area .btn {display:inline-block; vertical-align:middle; height:60px; line-height:60px; padding:0 50px; margin:0 5px; font-size:17px; } .table-btn-area .upload {background-color:var(--color-main);border:1px solid var(--color-main); color:#fff;} .table-btn-area .cancel {background-color:#fff; border:1px solid var(--color-main); color:var(--color-main); } .paginate-area {display:inline-block; position:relative; vertical-align:top; width:35%; padding-top:1px; } .paginate-area a { display:block; } .paginate-area a.left:before {content:"\e908" ;position:absolute; left:10px; bottom:-5px; font-size:25px; transition: all 0.2s ease-in; } .paginate-area a.right:before{content:"\e90b" ;position:absolute; right:10px; bottom:-5px; font-size:25px; transition: all 0.2s ease-in; } .paginate-area a.left:hover:before {left:0} .paginate-area a.right:hover:before {right:0} .paginate-area a.left:hover:before, .paginate-area a.right:hover:before {color:var(--color-main)} .paginate-area .title {display:inline-block; font-size:15px; color:#777;margin-bottom:10px; } .paginate-area .cont {display:block; font-size:16px; color:#333; overflow:hidden; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis;} .paginate-area.right .cont {padding-right:70px;} .paginate-area .left .cont {padding-left:70px;} .paginate-area a:hover .cont {color:var(--color-main)} /* 댓글 */ .icon-new {display:inline-block; vertical-align:top; margin:0 5px; font-size:21px; color:#f84d54; } .cmt-wrap {display:block; clear:both; padding-top:30px; border-top:0px solid #ddd; font-size:15px; } .cmt-wrap .cmt-nb { display:inline-block; height:35px; line-height:33px; padding:0 20px 0 18px; border:1px solid #ccc; border-radius:30px; font-size:16px; color:var(--color-main); } .cmt-wrap .cmt-nb:before {content:"\F189" ; display:inline-block; vertical-align:top;margin-top:1px; font-size:20px; color:#666; margin-right:5px; } .cmt-wrap .cmt-area {display:block; padding:20px; background-color:#f8f8f8; margin-top:20px; } .cmt-wrap .cmt-box {display:block; padding:10px; border:1px solid #f0f0f0; margin-bottom:10px; background-color:#fff; } .cmt-wrap .cmt-box textarea {display:block; width:100%; background:transparent; border:0;height:60px; } .cmt-wrap .cmt-box p {text-align:right; } .cmt-wrap .cmt-box p button { display:inline-block ; height:35px; line-height:35px;background-color:var(--color-main); color:#fff; padding:0 20px; } .cmt-wrap ul{} .cmt-wrap ul li { display:block;width:100%; border-top:1px solid #eee; padding:15px 0; font-family:Sans-serif; font-size:0} .cmt-wrap ul li:first-child { border-top:0; } .cmt-wrap ul li .title {display:block; font-size:14px;line-height:1.3em;font-weight:bold;margin-bottom:10px; color:#333; } .cmt-wrap ul li .title .date {display:inline-block; vertical-align:top; font-size:14px; margin-left:10px; color:#999; } .cmt-wrap ul li .cont {display:inline-block; clear:both; font-size:15px; color:#000; vertical-align:top; border:0 !important; background-color:#f8f8f8;width:calc(100% - 100px) !important; } .cmt-wrap ul li .txt-btn {display:inline-block;vertical-align:top; width:100px; padding-left:10px;line-height:30px; } .cmt-wrap ul li .txt-btn span {display:inline-block;vertical-align:top;width:1px; height:14px;margin:9px 12px 0; background-color:#ccc;} .cmt-wrap ul li .txt-btn a {color:#333 ; font-size:13px; } .cmt-wrap ul li textarea {width:calc(100% - 80px); height:36px;line-height:36px; border:1px solid #dedede; padding-left:10px; background-color:#fff; } .cmt-wrap ul li input[type="text"] {width:calc(100% - 80px); height:36px;line-height:36px; border:1px solid #dedede; padding-left:10px; background-color:#fff; } .cmt-wrap ul li .modify {display:inline-block;vertical-align:top;width:60px;font-size:14px; text-align:center; height:36px; line-height:36px;background-color:#999; border:1px solid #999; color:#fff; padding:0 12px;} /* 공매종료차량리스트 */ .closed-list {display:block; margin:20px 0 0} .closed-list li { display:inline-block; position:relative; vertical-align:top; width:calc(33.3% - 20px); margin-left:30px; border-radius:0px; overflow:hidden; margin-bottom:30px; z-index:1} .closed-list li:nth-child(1) { margin-left:0; } .closed-list li:nth-child(3n+1) {clear:both; margin-left:0; } .closed-list li a {display:block; border:1px solid #ddd; padding:25px 30px; height:240px; transition: all 0.2s ease-in; } .closed-list li a:hover {border-color:var(--color-main); } .closed-list .title {color:var(--color-main); font-size:18px; font-weight:500; } .closed-list .car-aucinfo {display:block; margin:10px 0 0} .closed-list .car-aucinfo dd {display:block; margin-bottom:7px; font-size:14px; } .closed-list .car-aucinfo dd span {display:inline-block;position:relative; vertical-align:top; color:#777; } .closed-list .car-aucinfo dd span:first-child {width:90px; margin-right:15px; } .closed-list .car-aucinfo dd span:first-child:after {content:''; position:absolute; right:0; top:3px; height:14px; border-right:1px solid #ddd; } /* 등록 글쓰기 */ .table-write { display:block; border-top:1px solid #ddd; border-bottom:1px solid #ddd; margin-bottom:30px; padding:20px 0; font-size:0;} .table-write .table-line { display:inline-block; width:100%; padding:10px 0; font-size:0; } .table-write .table-line .tb-tit { display:inline-block; vertical-align:top; width:160px; color:#111; padding-left:25px; font-size:16px; line-height:40px; } .table-write .table-line .tb-cont { display:inline-block; vertical-align:top; width:calc(100% - 160px); padding-right:0px; font-size:16px; } .table-write .table-line .tb-cont #content {width:99.8% !important;} .table-write input[type="text"], .table-write select {padding-left:15px; height:45px; line-height:45px; } .table-write textarea {padding:15px; height:250px;} .table-write input[type="text"], .table-write select, .table-write textarea {background-color:#f9f9f9;border:1px solid #ddd; border-radius:4px; width:100%; color:#333 } .table-write input[type="text"]:focus, .table-write select:focus, .table-write textarea:focus {border:1px solid var(--color-main); background-color:#fff; } /* readonly */ .table-write input[readonly][type=text] { background-color:#f4f4f4} .table-write input[readonly][type=text]:focus { border:1px solid #ddd; background-color:#f4f4f4 } .inp-file { display: inline-block; vertical-align: middle; } .inp-file label {display: block; position:relative; text-align: center; box-sizing: border-box;height: 40px; width:130px; padding: 0 5px;border: 1px solid #ccc;border-radius: 4px; background-color: #fff; cursor: pointer;} .inp-file label:hover {border:1px solid var(--color-main);} .inp-file label:before {content:"\eb7b"; display:inline-block; vertical-align:middle; margin-right:5px; font-size:18px;line-height:38px; } .inp-file label span {display: inline-block;vertical-align: top;line-height: 38px; font-size: 14px;color: #666;} .inp-file input[type="file"] { @include blind(); display:none;} .inp-file .disabled label { cursor: default; background-color: #f1f1f1 !important; } .inp-file .disabled label span { color: #999; } .file-txt {display:inline-block; vertical-align:middle; margin-left:10px; font-size:14px;} /* 첨부파일 리스트 */ .img-file { display:block; width:100%; padding-top:20px; } .img-file .img-list {display:inline-block ; vertical-align:top; position:relative ; margin-right:18px; margin-bottom:20px; } .img-file .img-list .img-wrap {display:block;position:relative ; border-radius:4px; width:150px; height:110px; background-size:cover; background-repeat:no-repeat; background-position:center center; } .img-file a.close {position:absolute; top:-7px; right:-7px; background-color:#eaeaea; width:22px; height:22px; text-align:center; border-radius:30px; } .img-file a.close:before{ content:"\e921" ; display:inline-block; color:#000; font-size:11px; font-weight:bold; line-height:22px; font-family:'xeicon'; } .table-note {display:block; padding:20px 0 40px 160px; } .table-note input[type=checkbox] + label { padding-left:1.45rem; font-size:16px; color:#555; } /**************************************************************************************************/ /* 차량상세페이지 /************************************************************************************************ */ .slideWrap .bxslider-wrap .usedcar-icon {position:absolute;right:5px; top:5px; z-index:333} .slideWrap .bxslider-wrap .usedcar-icon > span { padding:0px .875rem 0; height:1.75rem; } .slideWrap .bxslider-wrap .usedcar-icon > span.partcrush {/*background:#f35984;*/} #detail-cont {display:block; position:relative;} .carDetail-wrap {display:inline-block;position:relative; vertical-align:top; width:calc(100% - 470px); } .slideWrap { display:block; width:100%;position:relative; margin:0px 0 0 ; } .bxslider-wrap {position:relative;min-height:500px; background-repeat:no-repeat; background-position:center center; background-size:cover; background-image:url("/images/no_img.png"); background-color:#f4f4f4; } .bxslider-wrap ul.bxslider { position:relative; display:block; clear:both;} .bxslider-wrap ul.bxslider li {width:100%; height:500px; background-repeat:no-repeat; background-position:center center; background-size:contain } .water_mark {position:absolute;left:0;top:0; width:100%; height:500px; background:rgba(0,0,0,0.01);padding-top:220px;text-align:center;z-index:5;} .water_mark div {transform:rotate(-30deg);color:#BDBDBD;font-size:80px;opacity:0.2} .water_mark.big div {font-size:100px;font-family:새굴림;font-weight:10;letter-spacing: 15px;} .popup .water_mark.big {height:650px !important; padding-top:320px;} .popup .water_mark.big div {font-size:200px;font-family:새굴림;font-weight:10;letter-spacing: 15px;} .slideWrap .count {position:absolute;right:20px; bottom:20px; width:65px; height:32px; line-height:32px; border-radius:30px; background-color:rgba(0,0,0,0.4) ; color:#fff; font-size:16px; text-align:center; z-index:333} .slideWrap .big-view {position:absolute; left:20px; bottom:20px;width:40px; height:40px; text-align:center; z-index:333;border-radius:3px; background-color:rgba(0,0,0,0.4) } .slideWrap .big-view:after {content:"\e90d";font-family:'xeicon'; display:inline-block;font-size:30px; line-height:40px; color:#fff; } .slideWrap .bxslider-wrap .label-area{position:absolute; left:5px; top:5px; z-index:33; font-size:0;} .slideWrap .bxslider-wrap .label-area label { padding:0px 0.625rem 0; height:1.75rem; line-height:1.75rem; font-size:0.875rem; } .bx-wrapper .bx-controls-direction a { position: absolute; top: 50%; margin-top: -30px; outline: 0; width: 35px; text-align:center; padding:0; height: 60px; background-color:rgba(0,0,0,0.2); z-index: 333; color:rgba(255,255,255,0) } .bx-wrapper .bx-controls-direction a.disabled { display: none;} .bx-wrapper .bx-prev {left: 0px;} .bx-wrapper .bx-prev:before {content:"\e93d"; display:inline-block; font-family:'xeicon'; font-size:28px; line-height:60px; color:#fff; text-align:center; text-indent:none; } .bx-wrapper .bx-next {right: 0px;} .bx-wrapper .bx-next:before {content:"\e940"; display:inline-block; font-family:'xeicon'; font-size:28px; line-height:60px; color:#fff; text-align:center; } #bx-pager { position: relative; display:block; margin: 10px 0 0; list-style: none; font-size:0; width: 100%;} #bx-pager li { display:inline-block; vertical-align:middle; margin:0; padding:0; width: 10%; } #bx-pager li a { position:relative; display:block; width:100%; height:50px;padding: 0; margin: 0; background-repeat:no-repeat; background-position:center center; background-size:cover; z-index:0; opacity:0.6; transition: all 0.2s ease-in;} #bx-pager li a:after {content:''; position:absolute; left:0; top:0; width:100%; height:100%; border:3px solid transparent; z-index:55; transition: all 0.2s ease-in;} #bx-pager li a.active:after {border:3px solid var(--color-main)} #bx-pager li a.active, #bx-pager li a:hover { opacity:1} #bx-pager li a.active:after {content:' (Active)';} /* .bx-pager-direction {position:absolute; bottom:-40px; left:0; width:100%; display:none; } .bx-pager-direction a{ position: absolute;outline: 0;width: 27px;height:27px; border-radius:50%; background-color:rgba(255,255,255,0.9);border:1px solid #000; z-index: 33;} .bx-pager-direction a.pager-prev{left:3px; } .bx-pager-direction a.pager-prev:before {content:"\e93c"; display:inline-block; font-family:'xeicon'; font-size:24px; line-height:25px; color:#000; text-align:center; } .bx-pager-direction a.pager-next {right:3px; } .bx-pager-direction a.pager-next:before {content:"\e93f"; display:inline-block; font-family:'xeicon'; font-size:24px; line-height:25px; color:#000; text-align:center; } */ /* 차량상세정보 */ .car-detail-inner {display:block; margin:0;} .car-detail-inner h2.title {display:block; font-size:21px; color:#222; margin-bottom:15px; margin-top:40px; letter-spacing:-.06em; } .car-detail-inner h2.title span {display:inline-block; margin-left:5px; font-size:80%; color:#888} .car-detail-inner .detail-info01 {display:block; background-color:#fff; padding:20px 20px 20px 30px;border-top:1px solid #ccc; border-bottom:1px solid #eee; } .car-detail-inner .detail-info01 ul{font-size:0;} .car-detail-inner .detail-info01 ul li {display:inline-block; vertical-align:top; width:25%; line-height:1.3em; font-size:15px; margin:18px 0;color:#888;font-weight:500;} .car-detail-inner .detail-info01 ul li p {display:block; margin-top:8px; font-size:102%; line-height:1.3em; color:#222; letter-spacing:-.02em} .car-detail-inner .detail-info02 {display:block; background-color:#f6f6f6; border-radius:8px; padding:30px 10px;text-align:center; } .car-detail-inner .detail-info02 ul {font-size:0;} .car-detail-inner .detail-info02 ul li {display:inline-block; vertical-align:top; width:25%; line-height:1.3em; font-size:15px; margin:18px 0;color:#888; font-weight:500; } .car-detail-inner .detail-info02 ul li .count {display:inline-block; text-align:center; font-size:30px; color:var(--color-main); font-family:'YouandiBold'; } .car-detail-inner .detail-info02 ul li .title {display:block; margin-top:15px;line-height:1.3em; font-size:15px; color:#888; letter-spacing:-.06em; } .car-detail-inner .detail-info02 ul li .title span {display:block; margin-top:7px; color:#333; font-size:18px; letter-spacing:-.02em } .car-detail-inner a.btn-detail {display:inline-block; margin:20px auto 0; border-radius:50px; height:40px; line-height:40px; background-color:#fff; border:1px solid #dedede; padding:0 30px; color:#111; font-size:15px; transition: all 0.2s ease-in;} .car-detail-inner a.btn-detail:hover { background-color:var(--color-main); border-color:var(--color-main); color:#fff;} .car-detail-inner .detail-info03 {display:block; padding:15px 10px 0; background-color:#fff; border-top:1px solid #ccc } .car-detail-inner .detail-info03 p {display:block; line-height:1.5em; font-size:15px; color:#555; margin:10px 0; } .car-detail-inner .detail-info03 ol {display:block; } .car-detail-inner .detail-info03 ol li {list-style:none; padding-left:12px; position:relative; display:block; margin:5px 0; font-size:15px; line-height:24px; color:#555; } .car-detail-inner .detail-info03 ol li:before {content:''; position:absolute; left:3px; top:12px; width:3px; height:3px; background:#666} .car-detail-inner .line {display:block; height:1px; border-bottom:1px solid #bbb; } @media screen and (max-width:1200px){ .car-detail-inner .car-list ul li { width:33.333%; } } /* 차량기본정보 - 입찰금입력 - 고정 */ .carInfo-wrap { position:absolute; right:0; top:0;width:420px; z-index:33; letter-spacing:-.07em;} .carInfo-wrap.fixed {position:fixed;top:20px;left:50%; margin-left:180px;} .carInfo-wrap .inner {position:relative; width:100%; padding-bottom:70px; z-index:0 } .carInfo-wrap .inner:after {content:''; position:absolute; left:0; top:0; width:100%; height:100%; border:1px solid #ddd; background-color:#fff;z-index:-1; } .carInfo-wrap .head {display:block; background-color:#f1f7fc; padding:15px 20px; border:1px solid #ddd; border-bottom:0;} .carInfo-wrap .head h2 {font-size:24px; color:#000; line-height:1.4em; } .carInfo-wrap .head .car-desc {display:block; font-size:15px; color:#777; margin-top:5px; font-weight:500;} .carInfo-wrap .cont-wrap {display:block; padding:15px 20px; } .carInfo-wrap .cont-wrap .txt-info {display:block; margin-bottom:10px; } .carInfo-wrap .cont-wrap .txt-info button.carwish {display:inline-block; vertical-align:top; background-color:#fff; border:0;font-size:15px;color:#999;} .carInfo-wrap .cont-wrap .txt-info button.carwish:before {content:"\F2D5"; display:inline-block; vertical-align:top; margin-top:1px; margin-right:5px; color:#999;font-size:20px; font-family:"xeicon","Material Design Icons";} /*.carInfo-wrap .cont-wrap .txt-info button.carwish:focus:before {content:"\F8CF"; color:#f64629} .carInfo-wrap .cont-wrap .txt-info button.carwish:active:before {content:"\F8CF"; color:#f64629}*/ .carInfo-wrap .cont-wrap .txt-info button.carwish.on:before {content:"\F8CF"; color:#f64629} .carInfo-wrap .cont-wrap .txt-info button.carwish:focus {color:#333} .carInfo-wrap .cont-wrap .txt-info button.carwish.on {color:#333;} .carInfo-wrap .cont-wrap .txt-info .car-nb {display:inline-block; vertical-align:top; color:#999; float:right; font-size:15px;color:#999; } .carInfo-wrap .cont-wrap .carInfo {display:block; margin:15px 0 0px; padding:8px 20px; background-color:#f8f8f8; } .carInfo-wrap .cont-wrap .carInfo li {display:block; margin:15px 0; font-size:0;} .carInfo-wrap .cont-wrap .carInfo li span {font-size:14px; color:#333;display:inline-block; vertical-align:top; word-break:break-all !important; } .carInfo-wrap .cont-wrap .carInfo li span:first-child {color:#999;width:100px; } .carInfo-wrap .cont-wrap .carInfo li span:first-child + span {width:calc(100% - 100px)} /* 1등금액 */ .carInfo-wrap .cont-wrap .firstplace {display:flex; margin:5px 0 0px;justify-content: center; align-items: center;gap:1rem; padding:15px 15px; background-color:#fff; border:2px solid var(--color-main)} .carInfo-wrap .cont-wrap .firstplace span {font-size:1.2rem; color:#333; font-weight:500;} .carInfo-wrap .cont-wrap .firstplace span.price {color:var(--color-red); font-size:1.5rem; font-weight:bold; } .firstprice_note {display:block; border:1px solid ##02a9f6; padding:.5rem .2rem; letter-spacing:-.04em; font-size:1rem; line-height:1.3em; color:#02a9f6; margin:.25rem 0; text-align:center;} .carInfo-wrap .cont-wrap .auc-time {display:block; margin:5px 0 0px; padding:15px 15px; background-color:#fdf3f3} .carInfo-wrap .cont-wrap .auc-time span {display:inline-block; vertical-align:top; font-size:15px; line-height:1.3em; } .carInfo-wrap .cont-wrap .auc-time span.time {float:right; font-size:18px;margin:0;color:#333;} .carInfo-wrap .cont-wrap .auc-time span.time span {font-size:18px !important; color:#ea1919 !important; } .carInfo-wrap .cont-wrap .auc-class {display:block;margin-top:5px;padding:0 15px; } .carInfo-wrap .cont-wrap .auc-class span {display:inline-block; vertical-align:top; font-size:15px; } .carInfo-wrap .cont-wrap .auc-class span:first-child {width:100px; } .carInfo-wrap .cont-wrap .auc-class label {display:inline-block; position:relative; margin-right:0px;vertical-align:top; border-radius:0px; width:auto; padding:0px 12px; height:25px; line-height:25px; text-align:center; color:#fff; font-size:14px; } .carInfo-wrap .cont-wrap .auc-class label.status1 {background-color:var(--color-main) !important; } .carInfo-wrap .cont-wrap .auc-class label.status2 {background-color:#5bbc04} .carInfo-wrap .cont-wrap .auc-class label.status3 {background-color:#fd4940} .carInfo-wrap .cont-wrap .auc-class label.status4 {background-color:#6503ea} .carInfo-wrap .cont-wrap .calc-cont {display:block;margin-top:5px; } .carInfo-wrap .cont-wrap .calc-cont input[type="text"] {background-color:transparent !important; } .carInfo-wrap .cont-wrap .calc-cont ul li {display:block; margin:0 0 5px 0; background-color:#f7f7f7; font-size:0px; padding-right:20px; } .carInfo-wrap .cont-wrap .calc-cont ul li span {display:inline-block; vertical-align:middle; font-size:15px;line-height:21px; padding:2px 0; } .carInfo-wrap .cont-wrap .calc-cont ul li span select {font-size:15px; margin:0; display:inline-block; vertical-align:top;} .carInfo-wrap .cont-wrap .calc-cont ul li span:first-child {width:120px;padding:10px 5px 10px 15px; background-color:#efefef; letter-spacing:-.07em; } .carInfo-wrap .cont-wrap .calc-cont ul li span:first-child + span {width:calc(100% - 120px); text-align:right;padding-left:10px; color:#888} .carInfo-wrap .cont-wrap .calc-cont ul li span:first-child + span em { font-size:18px; margin-right:3px; color:#111; font-family:'YouandiBold'; letter-spacing:0; } .carInfo-wrap .cont-wrap .calc-cont ul li span:first-child + span input[type="text"] {display:inline-block; width:80%; border:0; text-align:center; text-align:right; padding-right:5px;font-size:16px; color:#333; font-family:'YouandiBold'; letter-spacing:0; background-color:transparent; } .carInfo-wrap .cont-wrap .calc-cont .total { display:block; margin:15px 0 0; border-bottom:1px solid #ddd; padding-bottom:10px; } .carInfo-wrap .cont-wrap .calc-cont .total span { display:inline-block; vertical-align:top;font-size:16px; line-height:24px; color:#666; } .carInfo-wrap .cont-wrap .calc-cont .total span:first-child { width:110px; padding-left:15px; } .carInfo-wrap .cont-wrap .calc-cont .total span:first-child + span { width:calc(100% - 110px); text-align:right; padding-right:20px; } .carInfo-wrap .cont-wrap .calc-cont .total span:first-child + span em { font-family:'YouandiBold'; font-size:21px; margin-right:3px; letter-spacing:0; } .carInfo-wrap .cont-wrap .calc-cont .total span:first-child + span input[type="text"] {display:inline-block; width:80%; border:0; text-align:center; text-align:right; padding-right:5px; color:#333; font-family:'YouandiBold'; font-size:23px;letter-spacing:0; } .carInfo-wrap .cont-wrap .calc-cont .total.reset {border-bottom:0; animation: blink-bg 0.5s infinite; padding:.5rem 0;margin-top:0; } .carInfo-wrap .cont-wrap .calc-cont .total.reset span {color:#fff; vertical-align:middle;} .carInfo-wrap .cont-wrap .calc-cont .total.reset span:first-child + span input[type="text"] { height:2.5rem; border-radius:.3rem; color:#f00; padding:0 .5rem; background-color:#fff !important; margin-right:.2rem;} @keyframes blink-bg { 0% { background-color: #02a9f6; } 50% { background-color: #f66d11; } 100% { background-color: #02a9f6; } } .carInfo-wrap .cont-wrap .calc-cont .agree {display:block; margin:10px 0 0px;} .carInfo-wrap .cont-wrap .calc-cont .agree label {color:#777; font-size:13.5px; line-height:20px; display:inline-block; vertical-align:top; } .carInfo-wrap .cont-wrap .calc-cont .agree label a {color:#000; text-decoration:underline;background-color:#f5f5f5; font-weight:500;} .carInfo-wrap .cont-wrap .calc-cont .agree label a:hover {color:#f00; background-color:#fbeded} .carInfo-wrap .cont-wrap .calc-cont .agree label:before {top:10px;width:16px;height:16px;} .carInfo-wrap .cont-wrap .calc-cont .agree label:after {top:10px;left:5px;width:6px;height:10px;margin:-6.5px 0 0 0;} .carInfo-wrap .cont-wrap .calc-cont .comply {display:inline-block;position:relative; clear:both; margin:0px 0 5px; background-color:#fff; border-radius:4px; border:1px solid #666; color:#222; height:27px; line-height:27px; font-size:13px; padding:0 12px; } .carInfo-wrap .cont-wrap .calc-cont .comply:before {content: ; display:inline-block; margin-right:5px; color:#fff; font-family:'xeicon'; } .carInfo-wrap .btn-wrap {position:absolute; left:0; bottom:0; width:100%; height:60px; text-align:center; font-size:0; } .carInfo-wrap .btn-wrap a {display:inline-block; vertical-align:top; height:60px; line-height:60px; border:1px solid var(--color-main); color:var(--color-main); font-size:17px; width:50%;font-family:'GmarketSans'; } .carInfo-wrap .btn-wrap a.bid {background-color:var(--color-main); color:#fff; } .carInfo-wrap .btn-wrap a.w100 {width:100% !important;} .carInfo-wrap .btn-wrap a.junkcar {background-color:#2b4980; border:1px solid #2b4980; color:#fff; } .carInfo-wrap .btn-wrap a.bid-done {background-color:#333 !important;border:1px solid #333 !important} /*.carInfo-wrap input[placeholder] { color:#ddd; font-size:14px; } .carInfo-wrap input::-webkit-input-placeholder { color:#ddd;font-size:14px; } .carInfo-wrap input::-moz-input-placeholder { color:#ddd; opacity:1; font-size:14px; } .carInfo-wrap input::-o-input-placeholder { color:#ddd; opacity:1; font-size:14px; } .carInfo-wrap input::-ms-input-placeholder { color:#ddd; opacity:1; font-size:14px; } */ @media screen and (max-width:1200px){ .carDetail-wrap {width:calc(100% - 440px); } .bxslider-wrap ul.bxslider li {height:400px; } #bx-pager li a { height:40px;} #bx-pager li a.active:after { border-width:2px; } .carInfo-wrap.fixed {left:auto; margin-left:0; right:10px;} } /**************************************************************************************************/ /* 차량등록 /************************************************************************************************ */ .car-Regist-title {display:block; clear:both; padding-top:20px;} .car-Regist-title h2 {display:block; font-size:20px; color:var(--color-main); } .car-Regist-title h2 span {display:inline-block; float:right; vertical-align:middle; font-size:14px; color:#777; } .car-Regist-title .exp {display:block; font-size:15px; color:#333; margin-top:7px; line-height:21px; } .car-Regist-title .exp i {font-size:21px; vertical-align:top; margin-top:1px; margin-right:3px; } .car-Regist-title .comp {display:inline-block; vertical-align:top; margin-left:3px; margin-right:3px; color:#f74950; font-size:18px; } .car-Regist {position:relative; width:100%; clear:both ;font-size:0; display:block; list-style:none;} .car-Regist:after {content:''; display:block; clear:both ; width:100%; } .car-Regist .space {display:inline-block; vertical-align:middle; padding:0 20px; } .car-Regist .comp {display:inline-block; vertical-align:top; margin-left:3px; margin-right:3px; color:#f74950; font-size:18px; } .car-Regist ul{ margin-top:20px;} .car-Regist ul.half { width:calc(50% - 25px); display:inline-block; vertical-align:top; } .car-Regist ul.half.right {width:calc(50% - 25px); margin-left:50px; } .car-Regist ul.half li {display:inline-block; width:100%; margin:0 ; margin-bottom:25px; } .car-Regist ul li {display:inline-block; vertical-align:top; width:calc(50% - 25px); margin-left:50px; font-size:15px; margin-bottom:25px; } .car-Regist ul li:first-child {margin-left:0; } .car-Regist ul li:nth-child(2n+1){margin-left:0 !important; } .car-Regist ul li p {display:block; padding-bottom:0px; font-size:15px; height:35px;line-height:35px; color:#555;} .car-Regist ul li p span {display:inline-block; vertical-align:bottom; float:right; font-size:13px; height:35px; line-height:35px; color:#999;} .car-Regist ul.col3{} .car-Regist ul.col3 li { width:calc(33.3% - 40px); margin-left:60px; margin-bottom:30px; } .car-Regist ul.col3 li:nth-child(2n+1) {margin-left:60px !important; } .car-Regist ul.col3 li:nth-child(3n+1){margin-left:0 !important; } .car-Regist .year { width:130px; margin-right:5px;} .car-Regist .month { width:90px;margin-left:20px; margin-right:5px;} .car-Regist input[type="text"], .car-Regist textarea {width:100%; letter-spacing:0; font-size:16px; } .car-Regist input[type="text"] { letter-spacing:0 !important; } .car-Regist input[type="text"], .car-Regist input[type="password"], .car-Regist textarea, .car-Regist select {height:45px; line-height:45px; border-radius:4px; font-size:16px; color:#444; font-size:15px; background-color:#f9f9f9; letter-spacing:-.07em; font-weight:500} .car-Regist select.wd50pc {width:calc(50% - 5px) !important; margin-right:5px; } .car-Regist select:last-child {margin-right:0; } .car-Regist .wd30pc { width:calc(30% - 7px) !important; margin-left:7px;} .car-Regist .wd40pc { width:40%;margin:0} .car-Regist input[type="text"]:focus, .car-Regist input[type="password"]:focus, .car-Regist select:focus, .car-Regist textarea:focus { background-color:#fff; } .car-Regist ul label {font-size:16px !important; color:#444; } .car-Regist .wd100pc {margin-left:0 !important;} .car-Regist button.postn {border:0; height:45px; line-height:45px;margin-left:-5px; color:#fff; background-color:#555; font-size:15px; padding:0 25px; border-radius:0 4px 4px 0; } .car-Regist .ph01 {width:30% !important;} .car-Regist .ph02 {width:calc(35% - 7px) !important; margin-left:7px;} .car-Regist .ph03 {width:calc(35% - 7px) !important; margin-left:7px;} .car-Regist .btn-sector {display:inline-block; vertical-align:top; margin-top:0px;margin-left:5px; height:28px; line-height:28px; padding: 0 15px; border-radius:40px; color:#fff; background-color:#f44d34; font-size:15px; font-weight:500; } .car-Regist .sector-wrap {position:relative; display:block; width:100%; margin-top:-1px !important; border-top:1px solid #fff; padding:0 !important; } .car-Regist .sector-wrap input[type="text"] {margin-left:0 !important; margin-right:3px !important;background-color:transparent !important; border:0 !important;border-bottom:1px solid #ccc !important;border-radius:0!important; } .car-Regist .sector-wrap input[type="text"]:focus {background-color:#transparent !important; } .car-Regist .sector-wrap .postn {border-radius:4px !important; margin:0 !important; margin-left:-1px !important; height:35px !important; vertical-align:bottom !important; line-height:35px !important; border:1px solid #666 !important; color:#333 !important; background-color:#fff !important; } .car-Regist .sector-wrap .mg-t4 {display:block; clear:both; margin-bottom:2px !important;} .car-Regist .sector-wrap .sector-or1 {width:calc(35% - 10px); background-color:transparent !important; position:relative !important; } .car-Regist .sector-wrap .sector-or1:after {content:"\e940";position:absolute; top:0; right:0; width:30px; height:30px; font-size:21px; color:#333; z-index:333; font-family:'xeicon'; } .car-Regist .sector-wrap .sector-or2 { width:calc(50% - 10px);} /* 추가 20210616 회원가입시*/ #sectorsLayer {font-size:0;} #sectorsLayer input[type="text"] {display:inline-block; vertical-align:middle !important; margin-left:0 !important; font-size:13.5px !important; letter-spacing:-.08em !important; padding:0 !important; border:0 !important; border-bottom:1px solid #aaa !important; border-radius:0 !important; background-color:#fff !important; } #sectorsLayer .sect-sort1 {width:calc(30% - 5px) !important; margin-right:5px !important;} #sectorsLayer .sect-sort2 {width:calc(70% - 35px) !important;} #sectorsLayer span {display:block;} #sectorsLayer button {width:31px !important; height:31px !important;border-radius:50% !important; border:1px dotted #777 !important;background-color:#fff !important; text-align:center; } #sectorsLayer button:before {content:'\e921'; display:inline-block; line-height:29px !important; font-size:15px; color:#333;font-family:'xeicon'; } /* 차량색상 선택 */ .color-list {display:block; padding-top:70px; padding-bottom:20px;} .color-list .color-item{display:inline-block; position:relative; text-align:center; margin-left:25px; } .color-list .color-item:first-child {margin-left:0; } .color-list .color-item:focus {border:0;} .color-list .color-item span {display:inline-block; clear:both;width:80px; text-align:center; padding-top:0px; font-size:14px; color:#555;border:0; background-color:#fff } .color-list .color-item:before {content:''; position:absolute; top:-60px;left:15px; width:50px; height:50px; border-radius:50%; transition: all 0.2s ease-in;} .color-list .color-item:after {content:'';display:none;position:absolute;top:-45px;left:50%;margin-left:-5px; width:10px;height:16px;border-width:0 2px 2px 0 !important; transform:rotate(45deg); border-color:#fff;border-style:solid;} .color-list .color-item:focus:after {display:block;} .color-list .color-item.on:after {display:block;} .color-list .color-item.ck1:before { background-color:#000;} .color-list .color-item.ck2:before { background-color:#fff; border:1px solid #dedede; } .color-list .color-item.ck2:after { border-color:#333 } .color-list .color-item.ck3:before { background-color:#f0f0f0;} .color-list .color-item.ck3:after { border-color:#333 } .color-list .color-item.ck4:before { background-color:#ddd;} .color-list .color-item.ck4:after { border-color:#333 } .color-list .color-item.ck5:before { background-color:#f62d32;} .color-list .color-item.ck6:before { background-color:#2b4ee7;} .color-list .color-item.ck7:before { background-color:#ea5707;} .color-list .color-item.ck8:before { background-color:#954b1e;} .color-list .color-item.ck9:before { background-color:#198931;} .color-list .color-item.ck10:before { background-color:#f9d301;} .color-list .color-item.ck10:after { border-color:#333;} .color-list .color-item.ck11:before { background-color:#711bae;} .color-list .etc {display:block; clear:both;padding-top:20px; } .color-list .etc p {padding-top:8px;} @media screen and (max-width:1200px){ .color-list .color-item{margin-left:5px; } .color-list .color-item span {width:70px;} } .kr{display:block;} .eng{display:none;} /* 차량진단 상세정보 */ .all-grade {display:block; padding:15px 10px 0px; } .all-grade button {display:inline-block; vertical-align:middle; margin:0 10px; width:70px; height:70px; line-height:70px; border-radius:50%; font-size:18px; text-align:center; border:0; background-color:#f0f0f0; color:#777; } .all-grade button:focus, .all-grade button:active, .all-grade button.on {background-color:#f8424f; color:#fff; box-shadow:0 10px 15px -5px rgba(221,36,44,0.7); } .all-grade input[type=radio] + label {position:relative;display:inline-block;margin:30px 40px; padding:0 !important ; font-size:17px; text-align:center; color:#666; z-index:1} .all-grade input[type=radio] + label:before {display: block;content: "";position: absolute;left: 0;top:50%;margin-left:-28px; transform:translateY(-50%); width:70px;height:70px;background-color:#f0f0f0;border:1px solid #dedede; border-radius:50%; transition: border 0.2s ease-in; z-index:-1} .all-grade input[type=radio] + label:after {display:none;content: ""; position:absolute;top:8px;left:13px;width:12px;height:18px;border-width:0 2px 2px 0 !important; border-color:#fff; background-color:transparent; transform:rotate(45deg); border-radius:0;} .all-grade input[type=radio]:checked + label { color:#fff; } .all-grade input[type=radio]:checked + label:before {background-color:#f8424f; border:1px solid #f8424f; box-shadow:0 7px 12px -3px rgba(221,36,44,0.5); } .all-grade input[type=radio]:checked + label:after {display:none;position:absolute;top:-9px;left:-3.5px;width:9px;height:15px;border-width:0 2px 2px 0 !important; background-color:transparent; border-color:#fff; transform:rotate(45deg);} .all-grade.eng {display:none !important;} /* table */ .tbl_list {width:100%; padding:0; border-top:1px solid #e2e2e2; margin-top:20px;} .tbl_list thead th { padding: 18px 10px 17px; color:#333; font-size: 16px; text-align:center; font-weight:500;background-color:#fafafa; border:1px solid #e2e2e2;} .tbl_list tbody th, .tbl_list td, .tbl_list tfoot th { padding: 18px 10px 17px; text-align:center; border:1px solid #e2e2e2; vertical-align: middle;} .tbl_list tbody th {color:#333; background-color:#fafafa; font-weight:500; font-size: 16px;} .tbl_list tbody td {color:#888; font-size:14px;} .tbl_list td { height:40px; box-sizing:border-box;} .tbl_list tbody td[rowspan] { border-right:1px solid #e2e2e2;} .tbl_list tbody td[rowspan]:last-child { border-right:0;} .tbl_list .bl_no {border-left: 0 !important;} .tbl_list .br_no {border-right: 0 !important;} .tbl_list input[type=radio] + label {position:relative;display:inline-block;margin:0 auto; padding:0 !important ;background:none; } .tbl_list input[type=radio] + label:before {display: block;content: "";position: absolute;left: 0;top:50%;margin-left:-12px; transform:translateY(-50%); width:24px;height:24px;background-color:#f0f0f0;border:1px solid #dedede; border-radius:50%; transition: border 0.2s ease-in; } .tbl_list input[type=radio] + label:after {display:none;content: ""; position:absolute;top:8px;left:13px;width:8px;height:14px;border-width:0 2px 2px 0 !important; border-color:#fff; background-color:transparent; transform:rotate(45deg); border-radius:0;} .tbl_list input[type=radio]:checked + label {background:none;} .tbl_list input[type=radio]:checked + label:before {background-color:#f8424f; border:1px solid #f8424f; box-shadow:0 7px 12px -3px rgba(221,36,44,0.5); } .tbl_list input[type=radio]:checked + label:after { display:block; position:absolute;top:-7px;left:-2.5px;width:7px;height:11px;border-width:0 2px 2px 0 !important; background-color:transparent; border-color:#fff; transform:rotate(45deg);} /* 차량점검 */ .carCheck-wrap { display:block; margin:20px 0 50px; border:1px solid #dedede; text-align:center; background-color:#f9f9f9;} .carCheck-wrap .code-wrap { display:inline-block; vertical-align:top; padding:80px 0px 0px 50px;font-size:16px; width:calc(100% - 900px); text-align:left; padding-left:30px; border:0px solid #000; } .carCheck-wrap .code-wrap h2 {display:block; font-size:18px; color:#000; } .carCheck-wrap .code-wrap ul {display:block; width:100%; clear:both; padding-top:20px; } .carCheck-wrap .code-wrap ul li {display:block; margin-bottom:15px; font-size:15px; color:#555;} .carCheck-wrap .mark {display:inline-block; vertical-align:middle; margin-right:10px; border-radius:50%; text-align:center; font-size:11px; font-weight:bold; width:30px; height:30px;line-height:32px;font-family:'GmarketSans'; } .carCheck-wrap .mark.normal {background-color:#3e85f0; color:#fff;} .carCheck-wrap .mark.change {background-color:#fa5e40; color:#fff;} .carCheck-wrap .mark2 {display:inline-block; vertical-align:middle; margin-right:5px; border-radius:50%; text-align:center; font-size:10px; font-weight:bold; width:22px; height:22px;line-height:24px;font-family:'GmarketSans'; } .carCheck-wrap .mark2.normal {background-color:#3e85f0; color:#fff;} .carCheck-wrap .mark2.change {background-color:#fa5e40; color:#fff;} .carCheck-wrap .check-car-wrap {display:inline-block; vertical-align:top; width:750px; padding:50px 0px 0px; text-align:left; border:0px solid #000; } .carCheck-wrap .code-result {display:block; clear:both; width:100%; text-align:left; margin-top:20px; padding:0px 0px 0px; font-size:0; background-color:#fff; } /* width:33.33 수정 ASK */ .carCheck-wrap .code-result li {display:inline-block; width:25%;vertical-align:top; padding:0px 15px;height:45px; line-height:45px; font-size:15px; border-top:1px solid #dedede; border-left:1px solid #eee;} .carCheck-wrap .code-result li:nth-child(1), .carCheck-wrap .code-result li:nth-child(4n+1) {border-left:0;} .carCheck-wrap .code-result li span {display:inline-block; vertical-align:middle; font-size:15px;} .carCheck-wrap .code-result li span:first-child {width:120px;margin-right:10px; font-weight:500;color:#000;} .carCheck-wrap .code-result li span:first-child + span {width:calc(100% - 140px) } .carCheck-wrap .code-result li br {display:none !important;} .carCheck-wrap input[type=radio] + label {position:relative;display:inline-block;margin:0 0 0 12px; font-size:17px; color:#666; font-weight:600; padding:0 0px 0 20px !important ;background:none; } .carCheck-wrap input[type=radio] + label:before {display: block;content: "";position: absolute;left: 0;top:50%;margin-left:-12px; transform:translateY(-50%); width:24px;height:24px;background-color:#ccd1dd;border:1px solid #ccd1dd; border-radius:50%; transition: border 0.2s ease-in; } .carCheck-wrap input[type=radio] + label:after {display:none;} .carCheck-wrap input[type=radio]:checked + label {background:none;} .carCheck-wrap input[type=radio]:checked + label:before {background-color:#3e85f0; border:1px solid #3e85f0; box-shadow:none !important; } .carCheck-wrap input[type=radio]:checked + label:after { box-shadow:none !important;} .carCheck-wrap input[type=radio] + label.normal:before {background-color:#3e85f0; border:1px solid #3e85f0; box-shadow:none; } .carCheck-wrap input[type=radio] + label.normal:after {content:"O"; display:block;position:absolute;top:-1px;left:-5px; font-size:13px; color:#fff; width:24px;height:24px;border-width:0 !important; border-color:#0; background-color:transparent; transform:rotate(0deg); border-radius:0 } .carCheck-wrap input[type=radio] + label.change:before {background-color:#fa5e40; border:1px solid #fa5e40; box-shadow:none} .carCheck-wrap input[type=radio] + label.change:after {content:"X"; display:block;position:absolute;top:-1px;left:-4px; font-size:13px; color:#fff; width:24px;height:24px;border-width:0 !important; border-color:#0; background-color:transparent; transform:rotate(0deg); border-radius:0 } .car-option {display:block; width:100%; clear:both; font-size:0; padding:20px 0 50px;} .car-option h2 {display:block; background-color:#f0f0f0; height:45px; line-height:45px; margin-bottom:10px; border-radius:4px; text-align:center; color:#333; font-size:17px; } .car-option ul {display:inline-block; vertical-align:top; width:20%; padding:0 5px;} .car-option ul li {display:block; clear:both; width:100%; margin:0px 0; font-size:14px;padding:0 5px; border:0px solid #f00 } .car-option ul li input[type=checkbox] + label {padding-left:23px; font-size:15px !important; } .car-option ul li input[type=checkbox] + label:before {margin-top:1px} /* 차량사진 */ .blind { position: absolute; overflow: hidden; clip: rect(0 0 0 0); margin: -1px; width: 1px; height: 1px;} .cmm-car-photo {display:block; padding: 20px 0 40px;} .cmm-car-photo .photo-btn-area {display:inline-block; float:right; margin-top:-50px; } .cmm-car-photo .photo-btn-area button {display:inline-block; vertical-align:middle; margin-left:5px; height:38px; line-height:38px; border-radius:4px; border:0; background-color:#2557b1; color:#fff; font-size:15px; padding:0 20px; } .cmm-car-photo ul {overflow: hidden;font-size:0;} .cmm-car-photo ul li {position: relative; display:inline-block; vertical-align:top; width:180px; height:125px; margin:10px; border-radius:5px; border:1px solid #ddd; } .cmm-car-photo ul li button {position: relative; display: block; width: 100%; height: 100%; background-color:transparent; text-align:center; font-size: 14px; color: #222; border:0; z-index: 2; background-repeat:no-repeat; background-size:cover; background-position:center center; border-radius:5px; } .cmm-car-photo ul li button > i {display:block; text-align:center; } .cmm-car-photo ul li button > i:before {content:"\e913"; display:inline-block;font-size:45px; line-height:45px; color:#ccc; } .cmm-car-photo ul li button > span { position: relative; margin:0 auto; top: 5px; font-size:15px;} .cmm-car-photo ul li button > span .ess-txt { color: #fd665c;} .cmm-car-photo ul li .del-btn {display:none; } .cmm-car-photo .on {position: relative; } .cmm-car-photo .on button { } .cmm-car-photo .on button > i {display:none;} .cmm-car-photo .on button > span { position: absolute; right: 0; bottom: 0; top: auto; height: 30px; line-height: 28px; padding: 0 11px; z-index: 2; color: #fff; border-radius: 0 0 5px 0; overflow: hidden;} .cmm-car-photo .on button > span:after {content: "";position: absolute;left: 0; top: 0;width: 100%; height: 30px; background: #000;opacity: 0.7; z-index: -1;} .cmm-car-photo .on button > span .ess-txt {display:none} .cmm-car-photo .on .del-btn {display:block; position: absolute; right: -10px; top: -10px; width: 24px; height: 24px; border-radius:50%; background-color:#f9f9f9;border:1px solid #dedede; z-index:10 } .cmm-car-photo .on .del-btn:before {content:"\e921"; display:inline-block; text-align:center; color:#000; font-size:12px; font-weight:bold;} /**************************************************************************************************/ /* 게시판검색영역 /************************************************************************************************ */ .board-search {display:block; clear:both; margin:0px 0 30px; padding:25px 30px; background-color:#f5f5f5; text-align:center;} .board-search select, .board-search input[type="text"], .board-search button {display:inline-block; vertical-align:top; margin:0; margin-left: 5px;padding-right:5px; height:50px; font-size:17px; border-radius:0;transition: all 0.2s ease-in; } .board-search button:before {content: "\e97a"; font-family:'xeicon';display:inline-block; vertical-align:middle; margin-right:5px; font-size:22px; } .board-search select {margin:0; padding-left:12px; } .board-search input[type="text"] {padding-left:12px; color:#555; border:1px solid #ddd; } .board-search button {background-color:#444; color:#fff; } .board-search select:focus, .board-search input[type="text"]:focus {background-color:#fff; border:1px solid var(--color-main)} .board-search button:hover {background-color:var(--color-main); } .board-search.faq {margin-bottom:10px;} /* pagination */ .pagination { display:inline-block; width:100%; margin:5px 0 0; padding:0; } .pagination:after {content:''; clear:both; } .pagination ul {font-size:0;text-align:center; } .pagination li { display:inline-block; margin:0 3px; } .pagination li a { display:inline-block; font-size:14px; border:1px solid #dcdde0; width:40px; height:40px; line-height:40px;color:#333;background:#fff; vertical-align:middle; transition:300ms ease-out 0ms;} .pagination li i {font-family:"Material Design Icons","xeicon"; font-size:24px;} .pagination li.prev {margin-right:10px; } .pagination li.next {margin-left:10px; } .pagination li a:hover {background:var(--color-main); border:1px solid var(--color-main); color:#fff; } .pagination li a.on { background:var(--color-main); border:1px solid var(--color-main); color:#fff; } .pagination li a.off { color:#bfc2ca; } .pagination li a.on, .pagination li a.off:hover {color:#fff;} .pagination li:first-child a{ margin-left:0;border-left:1px solid #dcdde0; } .pagination li:last-child a { } .pagination li a.first:before {content:"\F13D"; font-size:1.5rem; } .pagination li a.prev:before {content:"\F141"; font-size:1.5rem; } .pagination li a.next:before {content:"\F142"; font-size:1.5rem; } .pagination li a.last:before {content:"\F13E"; font-size:1.5rem; } .pagination li a:before {content:'';font-family:"Material Design Icons","xeicon"; font-size:0; } /**************************************************************************************************/ /* 레이어팝업 /************************************************************************************************ */ .pop-layer { display: none; position: absolute; top: 50%; left: 50%; width:680px; height:auto; border-top:5px solid var(--color-main); background-color: #fff; z-index: 3333; } .pop-layer .pop-container { position:relative; padding: 40px 50px;} .pop-layer .pop-container.center {text-align:center;} .pop-layer .btn-r {} .dim-layer { display: none; position: fixed; _position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index:3330 } .dim-layer .dimBg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #000; opacity: .5; filter: alpha(opacity=50); } .dim-layer .pop-layer { display: block; } .pop-conts {display:block; } .pop-conts.center {text-align:center;} .pop-conts .featherlight .featherlight-close-icon.featherlight .featherlight-close-icon {color:#fff !important;} .pop-layer .ctit { font-weight:normal; font-size:25px; color:#333; line-height:1.6em; font-family:'GmarketSans'; } .dim-layer .ctxt { margin-top:25px; font-weight:normal; font-size:15px; line-height:1.6em; color:#777;} .dim-layer .ctxt p {display:block; padding-top:12px; color:#000} .pop-layer .btn-r { margin-top:25px; text-align: center;} .pop-layer a.btn-layerClose {transition:300ms ease-out 0ms; display: inline-block;margin:0 auto; height: 40px; line-height:40px !important; width:120px; background-color: #444; font-weight:normal; font-size:16px; color:#fff;} .pop-layer a.btn-layerClose:hover { background-color: var(--color-main);} .popup {background-color:#111} .popup .slideWrap {position:relative; margin:0 !important;} .popup .slideWrap .head {position:relative; display:block; height:60px; padding:15px 20px; background-color:#00a4f0;box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.05); } .popup .slideWrap .head h2 {display:inline-block; vertical-align:middle; color:#fff; font-size:20px; } .popup .slideWrap .head h2 span {display:inline-block; vertical-align:middle; margin-left:20px; color:#fff; font-size:15px; } .popup .slideWrap .head h2 span em {display:inline-block; vertical-align:middle; width:1px; height:15px; background:rgba(255,255,255,0.4); margin:0 12px; } .popup ul.bxslider { position:relative; display:block; clear:both;} .popup ul.bxslider li {width:100%; height:650px; background-repeat:no-repeat; background-position:center center; background-size:cover; } .popup #bx-pager { margin:0; padding:7px; } .popup #bx-pager li { width: 5%; } .popup #bx-pager li a { height:35px;} .popup #bx-pager li a:after { border:2px solid transparent;} .popup #bx-pager li a.active:after {border:2px solid var(--color-main)} .popup .bx-controls-direction2 a { position: absolute; top: 50%; margin-top: -30px; outline: 0; width: 35px; text-align:center; padding:0; height: 60px; background-color:rgba(0,0,0,0.2); z-index: 333; color:rgba(255,255,255,0) } .popup .bx-controls-direction2 a.disabled { display: none;} .popup .bx-controls-direction2 .bx-prev {left: 0px;} .popup .bx-controls-direction2 .bx-prev:before {content:"\e93d"; display:inline-block; font-family:'xeicon'; font-size:28px; line-height:60px; color:#fff; text-align:center; text-indent:none; } .popup .bx-controls-direction2 .bx-next {right: 0px;} .popup .bx-controls-direction2 .bx-next:before {content:"\e940"; display:inline-block; font-family:'xeicon'; font-size:28px; line-height:60px; color:#fff; text-align:center; } /* 필수준수사항 */ .popup-guide {padding-top:50px;} .popup-guide.pd0 {padding:0} .popup-guide .head {position:fixed; left:0; top:0; width:100%; display:block; height:50px; padding:0px 20px; background-color:var(--color-main); border-bottom:1px solid #ccc;} .popup-guide .head h2 {display:inline-block; vertical-align:middle; color:#fff; font-size:18px; line-height:50px; } .popup-guide .head h2 i {font-size:22px; margin-right:3px;} .popup-guide .pop-wrap {padding:20px; } .popup-guide .pop-wrap h3 {display:block; font-size:16px; color:#000; } .popup-guide .pop-cont {display:block; padding:0px; border-radius:5px; } .popup-guide .pop-cont .comply {display:block; margin:0 } .popup-guide .pop-cont .comply li {list-style-type: none; font-size:14px; padding-left:15px;border-bottom:1px dashed #888; padding-bottom:8px; position:relative; color:#333; line-height:1.5em; margin-bottom:10px; } .popup-guide .pop-cont .comply li:before {content:''; position:absolute; left:5px; top:9px; width:3px; height:3px; background-color:#555} .popup-guide ol.note1 { display:block; margin-top:20px; padding-left:20px; list-style-type:decimal; list-style-position: outside;font-size:15px; line-height:1.5em} .popup-guide ol.note1 li { list-style-type:decimal; position:relative; color:#333; margin-bottom:12px; font-size:15px; line-height:1.5em} /*.popup-guide ol.note1 li:before {content:''; position:absolute; left:-23px; top:-1px; width:24px; height:24px; border:1px dotted #999; background-color:#f9f9f9; border-radius:50%; z-index:-1;background}*/ .popup-guide ol.note2 { display:block; margin-top:30px; padding-left:15px; list-style-type:decimal; list-style-position: outside; } .popup-guide ol.note2 li {color:#333; margin-bottom:12px; font-size:15px; line-height:1.5em} .popup-guide ol.note2 p {display:block; color:#333 !important; } .popup-guide .pop-wrap .alert_box {text-align:center; padding:1.5rem 0 1.5rem;} .popup-guide .pop-wrap figure {display:inline-block;width:9rem; height:9rem;margin: 0 auto 1rem; border-radius:50%; background:#faf7f0 url('/app/images/bell.png') no-repeat center ; background-size:auto 50%; } .popup-guide .pop-wrap h2 {font-size:1.25rem;line-height:1.3em; font-weight:bold; color:#e42006} .popup-guide .pop-wrap p {font-size:1rem; line-height:1.4em; color:#666; margin-top:.5rem;} .popup-guide ol.note3 {display:block; margin:30px 0; } .popup-guide ol.note3 li {list-style-type: none; font-size:14px; padding-left:15px; position:relative; color:#333; line-height:1.5em; margin-bottom:5px; } .popup-guide ol.note3 li:before {content:''; position:absolute; left:5px; top:9px; width:3px; height:3px; background-color:#555} .popup-guide .btn-wrap{display:block; text-align:center; padding-top:10px;} .popup-guide .btn-wrap a.ess-agree {display:inline-block; margin:0 auto; height:40px; line-height:40px; border-radius:4px; color:#fff; font-size:15px; font-weight:500; padding:0 20px; background-color:#366bd9;} .popup-guide .btn-wrap a.ess-agree:before {content:"\e929" ; display:inline-block; vertical-align:middle; margin-right:3px; font-size:18px; color:#fff; } html.with-featherlight{overflow:hidden;} .featherlight{display:none;position:fixed;top:0;right:0;bottom:0;left:0;z-index:99999;text-align:center;white-space:nowrap;cursor:pointer;background:rgba(0,0,0,0)} .featherlight:last-of-type{background:rgba(0,0,0,.4)} .featherlight:before{content:'';display:inline-block;height:100%;vertical-align:middle; } .featherlight .featherlight-content{position:relative;text-align:left;vertical-align:middle;display:inline-block;overflow:auto;padding:0;border:1px solid rgba(0,0,0,0.5);margin-left:5%;margin-right:5%;min-width:auto; min-height:auto; border-radius:0px; background:#fff;cursor:auto;white-space:normal; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);} .featherlight .featherlight-inner{display:block} .featherlight link.featherlight-inner,.featherlight script.featherlight-inner,.featherlight style.featherlight-inner{display:none} .featherlight .featherlight-close-icon{position:absolute;z-index:9999;top:10px;right:10px;line-height:30px;width:30px;cursor:pointer;text-align:center;font-family:Arial,sans-serif; font-size:25px;color:#fff; background:transparent; border:0;padding:0} .featherlight .featherlight-close-icon::-moz-focus-inner{border:0;padding:0}.featherlight .featherlight-image{width:100%}.featherlight-iframe .featherlight-content{border-bottom:0;padding:0;-webkit-overflow-scrolling:touch} .featherlight iframe{border:0}.featherlight *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box} /**************************************************************************************************/ /* Login /************************************************************************************************ */ .bg_login { background-color:#f5f5f5; } .cmn-copyright {display:block; text-align:center; padding-top:19px; color:#888; font-size:14px; font-weight:normal; } .mem-title {display:block; text-align:center; margin-bottom:30px;} .mem-title a.logo {display:inline-block; width:210px; height:47px; background:url(/images/inc/logo.png) no-repeat center ; background-size:cover;} .mem-title p {display:block;clear:both; font-size:14px; line-height:1.3em; color:#666; margin-top:10px; } .mem-title h2 { display:block; position:relative; padding-top:30px; font-size:28px; line-height:1.5em; color:#222; letter-spacing:-.06em; } .mem-title h2:after {content:""; display:block; width:45px; margin:8px auto 0; height:1px; background-color:#444;} .mem-title h2 span { color:var(--color-main); } .mem-title2 {display:block; text-align:center; margin-top:120px;} .mem-title2 a.logo2 {display:inline-block; width:210px; height:47px; background:url(/images/inc/logo.png) no-repeat center ; background-size:cover; } .mem-title3 {display:block; text-align:center; margin-top:50px;} .mem-title3 a.logo2 {display:inline-block; width:210px; height:47px; background:url(/images/inc/logo.png) no-repeat center ; background-size:cover; } /* 기존 회원사관리 로그인 페이지 css */ #login-wrap {width:580px; margin:54px auto; /* position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); */ } #login-wrap .inner {display:block; width:100%; height:100%; background-color:#fff; border-radius:10px; padding:50px 60px 50px; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.05); } /* 24.10.24 변경후 로그인 페이지 css */ #login-wrap2 {width:780px; height:700px; margin:54px auto; background:url(/images/inc/back.png) no-repeat center ; background-size:cover; /* position:absolute; top:50%; left:50%; transform: translate(-50%,-50%); */ } #login-wrap2 .inner {display:block; width:100%; height:100%; border-radius:10px; padding:150px 60px 60px; } #login-wrap h2 {display:block; font-size:30px; line-height:1.5em; color:#333; margin-bottom:30px; letter-spacing:-.06em; } #login-wrap2 h2 {display:block; font-size:50px; color:#333;text-align:center; } #login-wrap h2 span {color:var(--color-main)} #login-wrap input[type="text"], #login-wrap input[type="password"] {display:block; border:1px solid #f4f4f4; background-color:#f4f4f4; color:#333; font-size:16px; padding-left:15px; width:100%; height:50px; line-height:50px;border-radius:3px; margin-bottom:10px; } #login-wrap input[type="text"]:focus, #login-wrap input[type="password"]:focus { background-color:#fff; border-color:var(--color-main);} #login-wrap .check {display:block; margin:10px 0 20px;} #login-wrap .check label {font-size:15px; color:#666; } #login-wrap button { display:block; width:100%; border-radius:3px; background-color:#111; font-size:16px; color:#fff; text-align:center; height:50px; line-height:50px; } #login-wrap2 button { display:block; width:100%; border-radius:3px; background-color:#111; font-size:16px; color:#fff; text-align:center; height:50px; line-height:50px; } #login-wrap button:hover {background-color:var(--color-main); } #login-wrap .link {display:block; margin:30px 0 0; font-size:0; } #login-wrap .link li {display:inline-block; vertical-align:middle; position:relative; width:33.3%; text-align:center; } #login-wrap .link li:nth-child(1):before {display:none; } #login-wrap .link li:before {content:''; position:absolute; left:0; top:3px; width:1px; height:18px; background-color:#ddd;} #login-wrap .link li a {display:block; font-size:16px;line-height:24px; color:#333; } #login-wrap .link li i {display:inline-block; vertical-align:top; margin-top:1px; margin-right:5px; font-size:23px; color:#333; font-family:'xeicon';} /* tab */ #tab_contents {position:relative; display:block; width: 100%; margin-top:0px; } #tab_contents ul.tabs {margin:0 0 10px; padding: 0;list-style: none; font-size:0; width:100%; } #tab_contents ul.tabs li {position: relative; display:inline-block;width:33.3%; height:50px;text-align:center; overflow: visible;} #tab_contents ul.tabs li:first-child {margin-left:0; } #tab_contents ul.tabs li:first-child a { border-left:1px solid #ddd;} #tab_contents ul.tabs li a { text-decoration: none; position:relative; height:50px;line-height:50px; display: block;font-weight:500;border:1px solid #ddd; color:#777; border-left:1px solid #fff; border-bottom:1px solid #000; font-size:17px; letter-spacing:-.04em;; transition: all 0.3s ease-out; } #tab_contents ul.tabs li.active a {height:50px; line-height:50px;color:var(--color-main); border:1px solid #000; border-bottom:1px solid #fff; position:relative; font-weight:500; } #tab_contents .tab_wrap { clear: both;display:block; width:100%; padding:20px 0 0 ; } #tab_contents .tab_content {display:block; transition: all 0.3s ease-out; } /**************************************************************************************************/ /* Join:회원가입 /************************************************************************************************ */ #join-wrap {display:block; width:700px; margin:54px auto; } #join-wrap.mid { position:absolute; top:50%; left:50%; padding-bottom:110px; transform: translate(-50%,-50%); margin:0; } #join-wrap.slt-mmb {width: 730px; } #join-wrap .step{ position:relative; width:100%; margin:0 auto; padding:0 0px; text-align:center; font-size:0; display:flex; justify-content: center;flex-wrap: nowrap;align-items: flex-start; } #join-wrap .step li {position:relative; display:inline-block; width:20%; vertical-align:top; } #join-wrap .step li:nth-child(1):before{display:none; } #join-wrap .step li:nth-last-child(1):after{display:none; } #join-wrap .step li:before {content:""; position:absolute; left:0; width:50%; top:21px; height:1px; border-top:1px solid #ddd; z-index:-1} #join-wrap .step li:after {content:""; position:absolute; left:50%; width:50%; top:21px; height:1px; border-top:1px solid #ddd; z-index:-1} #join-wrap .step li span { display:inline-block; width:40px; height:40px; border-radius:50%; border:1px solid #ddd; background-color:#fff; text-align:center; } #join-wrap .step li span:after { content:"\e929"; display:inline-block; font-size:28px; color:#aaa; line-height:40px; } #join-wrap .step li p {display:block; padding-top:12px; font-size:14px; color:#777; } #join-wrap .step li.on span {border:1px solid var(--color-main); background-color:var(--color-main); } #join-wrap .step li.on span:after { color:#fff; } #join-wrap .step li.on p{ color:#000; } #join-wrap .inner { display:block; width:100%; background-color:#fff; border-radius:10px; margin-top:30px; padding:40px 40px; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.05); } #join-wrap .title-wrap {display:block; clear:both;position:relative; } #join-wrap .title-wrap h2 {display:block; font-size:1.40em; color:#111; line-height:1.45em; } #join-wrap .title-wrap h3 {display:block; font-size:16px; color:#111; line-height:1.3em; } #join-wrap .title-wrap p {display:block; padding-top:7px; font-size:0.90em; color:#888; line-height:1.35rem; letter-spacing:-.08em; } #join-wrap .title-wrap em {font-size:13px; color:#888; margin-left:5px;} #join-wrap .title-wrap .btn {position:absolute; right:0; top:2px;display:flex; gap:5px; justify-content: flex-end;} #join-wrap .title-wrap .btn button{border-radius:60px; height:28px; line-height:28px; padding:0 15px; font-size:13px; font-weight:500; background-color:#555; color:#fff;} #join-wrap .title-wrap .btn button.sch {background-color:var(--color-main)} #join-wrap .title-wrap .btn button.delete {background-color:#444} #join-wrap .agree-check {display:block; margin-top:40px;background:#fafafa;border:1px solid #e1e1e2;} #join-wrap .agree-check dt {padding:0 .5rem;border-bottom:1px solid #e1e1e2;background:#fff;} #join-wrap .agree-check dd {padding:15px 20px;} #join-wrap .agree-check .ag-tit { display:block; width:100%; text-align:left !important; padding:10px; } #join-wrap .agree-check .ag-tit label {font-size:16px; color:#111; font-weight:400 !important; padding-left:25px; } #join-wrap .agree-check dd label {display:inline-block;width:65%;padding:.5rem 0 .5rem 1.5rem;font-size:13px;line-height:1;} #join-wrap .agree-check .basic_txt{color:#f30000; font-size:12px; vertical-align: middle; margin-left:5px;} #join-wrap .agree-check .basic_txt.black {color:#333;} #join-wrap .agree-check .btn_link{float:right;margin-top:.5rem;margin-right:.5rem;color:#333;font-size:.8rem; border-bottom:1px solid #333;font-weight:bold; } #join-wrap .agree-check .item {display:block; padding-left:25px;padding-top:10px; } #join-wrap .agree-check .item h3 {font-size:13px; font-weight:500; padding-bottom:10px; } #join-wrap .agree-check .item p {font-size:13px; font-weight:500; padding-bottom:5px; display:flex; justify-content: space-between;flex-wrap: nowrap; } #join-wrap .agree-check .item p span {font-size:13px; width:100%; color:#444} #join-wrap .agree-check .item p span:first-child {color:#888; width:75px; } /* 파일등록 */ #join-wrap .drag_area{overflow:hidden;overflow-y:auto;position:relative;width:100%;height:212px;margin-top:4px;border:1px solid #eceff2;border-radius:4px; } #join-wrap .drag_area .bg{display:block;position:absolute;top:0;left:0;width:100%;height:210px;background:#f9f9f9 url('/images/sub/bg_drag_image.png') no-repeat center ; } #join-wrap .nobg{background:none !important} #join-wrap .del_button {cursor:pointer;} #join-wrap .lst_type {position:relative; width:100%;} #join-wrap .lst_type li{ position:relative;padding:7px 0 6px 8px;border-bottom:1px solid #f4f4f4;vertical-align:top} #join-wrap .lst_type li{padding:6px 0 5px 8px} #join-wrap .lst_type li span{float:left;color:#222} #join-wrap .lst_type li em{float:right;margin-top:1px;padding-right:22px;color:#a1a1a1;font-size:11px} #join-wrap .lst_type li a{position:absolute;top:6px;right:5px} #join-wrap .blind{visibility:hidden;position:absolute;line-height:0} #join-wrap .mb-select {font-size:0; display:flex; width:100%; padding-top:30px; gap:12px; flex-wrap: nowrap; justify-content: space-between; } #join-wrap .mb-select li {list-style:none;position:relative; text-align:center; font-size:15px; color:#555; width:calc(50% - 7px); height:210px; z-index:0;} #join-wrap .mb-select li:nth-child(1) {margin-left:0; } #join-wrap .mb-select li:after {content:""; position:absolute; left:0; top:0; width:100%; height:100%;background-color:#fff; border:1px solid #dedede; z-index:-1; } #join-wrap .mb-select li a {display:block; padding:1.5rem 1rem;} #join-wrap .mb-select h2 {display:block; font-size:18px; color:#444; font-weight:600; } #join-wrap .mb-select p {padding-top:15px; font-size:14px; color:#888; line-height:1.5em; text-align:left; letter-spacing:-.07em; } #join-wrap .mb-select .btn-go {position:absolute; left:0; bottom:0;width:100%; height:50px; line-height:50px; background-color:var(--color-main) ; color:#fff; font-size:15px;} #join-wrap .box-line {display:block; height:1px; width:100%; background-color:#555; margin:10px 0;} #join-wrap .info-box { position:relative; clear:both; float:left; width:100% ; } #join-wrap .info-box .basic-info { position:relative; float:left; width:100%;padding-bottom:10px; } #join-wrap .info-box .basic-tit { float:left; width:130px; font-size:14px; line-height:40px;letter-spacing:-.09em; } #join-wrap .info-box .basic-input { float:right; width:calc(100% - 130px);position:relative; font-size:15px; line-height:40px; } #join-wrap .info-box .basic-input label {line-height:40px;} #join-wrap .info-box .basic-input .txt-info {display:block;margin:0; font-size:13px !important; color:#888; line-height:1.2em; padding-top:5px;} #join-wrap .info-box .basic-input .txt-info label {line-height:24px !important;} #join-wrap .info-box .basic-input .txt-info.ok {padding-top:10px; padding-bottom:5px;} #join-wrap .info-box .basic-input .type {padding:5px 0; } #join-wrap .info-box .basic-input .type button{display:inline-block; margin:0 2px 3px; height:26px; line-height:18px; background-color:#fff; color:#777; font-size:13px; padding:3px 3px 3px 10px; border-radius:30px; border:1px solid #ccc;} #join-wrap .info-box .basic-input .type button i { vertical-align:top; margin-left:7px; text-align:center; } #join-wrap .info-box .basic-input .type button i:after {content:"\e921";display:inline-block;font-size:11px; width:18px;height:18px; line-height:20px; border-radius:50%; background-color:#eaeaea;color:#111; } #join-wrap .info-box .basic-input ol {} #join-wrap .info-box .basic-input ol li {display:block; font-size:12px; line-height:1.3em; color:#777; padding-left:10px; position:relative; } #join-wrap .info-box .basic-input ol li:before {content:''; position:absolute; left:2px; top:5px; width:3px; height:3px; background-color:#555; } #join-wrap .comp {display:inline-block; vertical-align:top; margin-left:3px; margin-right:3px; color:#f74950; font-size:18px; } #join-wrap input[type="text"], #join-wrap select, #join-wrap input[type="password"] {border:1px solid #e5e5e5; background-color:#f9f9f9; color:#333; font-size:15px; height:40px; line-height:40px;border-radius:3px; } #join-wrap input[type="text"]:focus, #join-wrap select:focus, #join-wrap input[type="password"]:focus { background-color:#fff; border-color:var(--color-main);} #join-wrap input + .remain {position:absolute;right:30%; top:0px; font-weight:bold;color:var(--color-main);z-index:1;} #join-wrap .check {display:block; margin:10px 0 20px;} #join-wrap .check label {font-size:15px; color:#666; } #join-wrap button { border-radius:3px; border:0; background-color:#111; font-size:15px; color:#fff; text-align:center; height:40px; line-height:40px; } #join-wrap .btn-rep { position:absolute; right:0; top:0; width:26%; border-radius:0 3px 3px 0; background-color:#484848; } #join-wrap .btn-rep2 { position:absolute; right:0; top:2px; width:20%; border-radius:3px; background-color:#484848; } #join-wrap .btn-rep.blue { background-color:var(--color-main)} #join-wrap .btn-rep2.blue { background-color:var(--color-main); top:0} #join-wrap .post-n { display:inline-block; vertical-align:top; margin-left:-5px; width:100px; border-radius:0 3px 3px 0; background-color:#484848; } #join-wrap .receive-txt {width:calc(80% - 4px); } #join-wrap .info-box .basic-input .wd80pc { width:calc(80% - 4px) !important; } #join-wrap .time { float:right;width:100%;height:47px; padding-top:7px; } .fuc_wrap {display:none;} #join-wrap .year {width:40% } #join-wrap .month {width:calc(30% - 5px); margin-left:5px !important; } #join-wrap .day {width:calc(30% - 5px); margin-left:5px !important;} #join-wrap .num01 {width:30%; } #join-wrap .num02 {width:calc(35% - 5px); margin-left:5px !important; } #join-wrap .email2 {width:44.7%} #join-wrap .cell1 {width:23%; } #join-wrap .cell2 {width:calc(28% - 8.5px); margin-left:5px !important; } #join-wrap .file-down { display:block; margin:10px 0 5px; padding:0 20px ;height:35px; line-height:33px; border-radius:30px; background-color:#fff; color:#333; border:1px solid #ccc; text-align:center; } #join-wrap .file-down i { font-size:18px; display:inline-block; vertical-align:top; margin-top:6px; margin-left:5px; } #join-wrap .txt-result {position:relative; float:left; width:100%;clear:both; background-color:#f8f9f9; padding:30px; border-radius:5px;} #join-wrap .txt-result .status {font-size:14px; line-height:1.5em; text-align:center; } #join-wrap .txt-result i { display:block; padding-bottom:10px; text-align:center; color:#c2d2e2; font-size:50px; } #join-wrap .txt-result .tit {font-size:16px;line-height:1.4em; color:#111; font-weight:600; } #join-wrap .txt-result .price {display:block; font-size:14px;line-height:1.35em;color:#333; padding-top:10px; } #join-wrap .txt-result .txt {display:block; font-size:13px; line-height:1.6em; color:#777; padding-top:10px; } #join-wrap .txt-result .txt span {display:inline-block; position:relative; vertical-align:top; } #join-wrap .txt-result .txt span:first-child {width:60px; margin-right:12px;} #join-wrap .txt-result .txt span:first-child:after {content:''; position:absolute; right:0; top:4px; width:1px; height:13px; background-color:#ccc;} #join-wrap .txt-result .txt span:first-child + span {color:#333} #join-wrap .done {display:block; text-align:center; padding-top:20px; } #join-wrap .done img {margin-bottom:20px;} #join-wrap .done h2 {font-size:18px; color:#111; line-height:1.5em; } #join-wrap .done p {font-size:14px; color:#777; padding-top:7px; } #join-wrap .btn-area {display:block;clear:both; padding-top:30px; font-size:0; text-align:center; } #join-wrap .btn-area button { display:inline-block; vertical-align:middle; height:55px; line-height:55px; border-radius:3px; font-size:15px; color:#fff; border:0; } #join-wrap .btn-area .confirm {width:100%; background-color:var(--color-main); } #join-wrap .btn-area .btn-ok {width:calc(100% - 137px); margin-left:7px; background-color:var(--color-main); border:1px solid var(--color-main);} #join-wrap .btn-area .btn-cancel {width:130px;background-color:#fff; border:1px solid #ccc; color:#555; } #join-wrap .btn-area .default {width:calc(33.3% - 7px); margin-left:7px; background-color:var(--color-main); border:1px solid var(--color-main); } #join-wrap .btn-area .default.first {margin-left:0; } #join-wrap .btn-area .bg-df01 {background-color:#ee6327; border:0; } #join-wrap .btn-area .bg-df02 {background-color:#22ae65; border:0; } #join-wrap .btn-area .bg-df03 {background-color:#196dda; border:0; } #join-wrap .btn-area .find {width:calc(50% - 7px); margin-left:7px; background-color:var(--color-main); border:1px solid var(--color-main);} #join-wrap .btn-area .find.first {margin-left:0;background-color:#fff; border:1px solid #ccc; color:#555;} #join-wrap .cert-w1 {width:25% !important; } #join-wrap .cert-w2 {width:25% !important;margin-left:5px !important} #join-wrap .cert-w3 {width:25% !important;margin:2px !important} #join-wrap .cert-w4 {width:21% !important;margin-left:0 !important} #join-wrap .cert-wrap {position:relative; width:100%; margin-top:5px;} #join-wrap .cert-wrap input {width:calc(78% - 1px) !important; } #join-wrap .cert-wrap button {width:21% !important;} #join-wrap .cert-wrap input + .remain {position:absolute;right:25%;margin-top:0rem;font-weight:bold;color:var(--color-main);z-index:1;} .find-info-result {display:block; text-align:center; padding:50px 50px; } .find-info-result i { display:inline-block; color:#c2d2e2; font-size:60px; line-height:60px; } .find-info-result dl {padding:30px 0; border:1px solid #ddd; background-color:#f8fafb; margin:20px 0} .find-info-result dl dt {font-size:18px; color:var(--color-main); font-weight:bold; } .find-info-result dl dd {font-size:14px; color:#777; padding-top:7px; } .find-info-result .txt {font-size:13px; color:#777; line-height:1.5em; } /**************************************************************************************************/ /* 마이페이지 /************************************************************************************************ */ .mypage-header {position:relative; display:block; margin-top:20px; padding:20px; background-color:#f5f8f9; height:190px;} .mypage-header:before {content:""; position:absolute; left:70px; top:50%; margin-top:-47px; width:81px; height:95px; background:url(/images/sub/img_mypage.png) no-repeat center ;} .mypage-header .title-wrap {display:inline-block; padding-top:15px; max-width:320px; margin-left:160px; vertical-align:middle; } .mypage-header .title-wrap label {display:inline-block; border-radius:0px 30px 30px 30px ; color:#fff; font-size:15px; height:32px; line-height:32px; padding:0 20px; } .mypage-header .title-wrap label.mst1 {background-color:var(--color-main)} .mypage-header .title-wrap label.mst2 {background-color:#fe9103} .mypage-header .title-wrap label.mst3 {background-color:#5abc03} .mypage-header .title-wrap h2 {display:block; padding-top:7px; font-size:28px; line-height:38px;color:#444; font-weight:300; } .mypage-header .title-wrap h2 strong {color:var(--color-main); font-weight:500;} .mypage-header .my-topList {display:inline-block;float:right; vertical-align:middle; width:calc(100% - 430px); height:100%; font-size:0; padding:20px 0; background-color:rgba(255,255,255,1); border-radius:7px; } .mypage-header .my-topList li {display:inline-block;vertical-align:top; width:25%; height:100%; border-left:1px solid #e6eaec; text-align:center; padding-top:15px; } .mypage-header .my-topList li:nth-child(1) {border-left:0; } .mypage-header .my-topList li .title {display:block; font-size:16px; color:#666;} .mypage-header .my-topList li .number { clear:both;position:relative; display:inline-block; font-weight:600; font-size:28px; line-height:32px; color:var(--color-main); padding-top:12px;} .mypage-header .my-topList li .number:after {content:""; display:block; width:100%; height:1px; background-color:var(--color-main);} /* ui_tab:base layout */ .ui_tab_btn.selected {z-index:2;} /* ui_tab: basic tab */ .ui_tab .ui_tab_btns:after { display:block; clear:both; content:"";} .ui_tab .ui_tab_btns { /*z-index:2;*/ position:relative; /*margin-top:-18px;*/ border-bottom:1px solid #e2e2e2;} .ui_tab .ui_tab_btns .ui_tab_btn { float:left; position:relative; display:block; height:54px; padding:2px 7px 0; line-height:54px; background-color:transparent; font-size:18px; font-weight:400; color:#aaa; overflow:visible; text-align:center;} .ui_tab .ui_tab_btns a.ui_tab_btn { text-decoration:none; } .ui_tab .ui_tab_btns .ui_tab_btn.selected { color:var(--color-main); font-weight:500;} .ui_tab .ui_tab_btns .ui_tab_btn.selected:after { position: absolute; bottom: -1px; left: 0; display: block; width: 100%; height: 2px; background: var(--color-main); content: "";} .ui_tab.size_s .ui_tab_btns .ui_tab_btn { font-size:16px;} /* ui_tab : round line */ .ui_tab.type02 .ui_tab_btns { border:0; display:flex; } .ui_tab.type02 .ui_tab_btns .ui_tab_btn {width:50%; margin-left:-1px; border:1px solid #dedede; font-size:16px; line-height:50px;} .ui_tab.type02 .ui_tab_btns .ui_tab_btn:after { content:none;} .ui_tab.type02 .ui_tab_btns .ui_tab_btn.selected { border-color:var(--color-main); color:#fff; background:var(--color-main);} .ui_tab.tab_mypage { padding:2.5rem 0 1rem;} .ui_tab.tab_mypage .ui_tab_btns .ui_tab_btn { width:calc(14.2% + 1px); margin:-1px 0 0 -1px !important; text-decoration:none;} .ui_tab.tab_cs { padding:40px 0 30px;} .ui_tab.tab_cs .ui_tab_btns {display:flex; } .ui_tab.tab_cs .ui_tab_btns .ui_tab_btn { width:calc(25% + 1px); margin:-1px 0 0 -1px !important; text-decoration:none;} .ui_tab.tab_cs .ui_tab_btns a { display:flex;justify-content: center; align-items: center;height:54px; font-size:1rem; width:calc(25% + 1px); margin:-1px 0 0 -1px !important; border:1px solid #e2e2e2; text-decoration:none;} .ui_tab.tab_cs .ui_tab_btns a.selected { background-color:var(--color-main); color:#fff; border-color:var(--color-main)} .ui_tab.tab_list {padding:0px 0 20px;} .ui_tab.tab_list .ui_tab_btns {display:flex;} .ui_tab.tab_list .ui_tab_btns .ui_tab_btn { width:50%; margin:-1px 0 0 -1px !important; line-height:55px; text-decoration:none;} /* 회원탈퇴 */ .leave-wrap { position:relative; clear:both; display:block; width:100%;} .leave-wrap a.btn-leave {display:inline-block; float:right; height:33px; line-height:32px; color:#333; font-size:15px; padding:0 20px; border-radius:30px; border:1px solid #ccc; } .leave-wrap .title {display:block; font-size:23px; color:#000; } .leave-wrap .exp {display:block; margin:20px 0 40px;background-color:#f4f4f4; padding:25px 50px; font-size:15px; line-height:1.7em; border-radius:4px;} /* ================================================================================================================================ 레이어 팝업 ================================================================================================================================ */ /* 팝업 레이아웃(전체형) */ .modal-popup.modal-reset {display:block !important;position:relative !important;height:auto !important;} .modal-popup {overflow-y:auto;overflow-x:hidden;position:fixed;left:0;top:0;width:100%;height:100%;background:#fff;z-index:99999;-webkit-overflow-scrolling:touch;/*background:url('../usedcar/pop5.png') no-repeat #ededed;background-size:100%;opacity:0.3;*/} /*.modal-popup:after {content:'';position:absolute;left:0;top:0;width:100%;height:1000px;z-index:100000;}*/ .modal-popup .pop-header {position:relative;min-height:45px;background:#fff;text-align:center;} .modal-popup .pop-header span {display:inline-block;padding-top:18px;color:#222;font-size:19px;line-height:19px;font-weight:bold;vertical-align:middle;word-break:keep-all;} .modal-popup .pop-header .product-title {display:block;padding:14px 13px 11px 13px;background:#154fd2;color:#fff;font-size:16px;-weight:bold;text-align:left;line-height:22px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;word-break:keep-all;} .modal-popup .pop-header .title {display:inline-block;padding-top:18px;color:#333;font-size:19px;line-height:19px;font-weight:500;vertical-align:middle;word-break:keep-all;} .modal-popup .pop-header .btn-pop-close {position:absolute;top:50%;left:2px;width:47px;height:47px;margin:-23px 0 0 0;background:url('/images/inc/crossW.png') center center no-repeat;background-size:18px 18px;font-size:0;line-height:0;text-indent:-999px;} .modal-popup .title-wrap {padding:20px 13px 0 13px;} .modal-popup .title-wrap h3 {color:#333 !important;font-weight:500;} .modal-popup .tbl-wrap {padding:0 13px;} .modal-popup iframe {border:0;} .modal-popup.popup-blank {display:block !important;} .modal-popup .agreeChk {margin:0;border-top:0;} .modal-popup button {font-size:16px;} .divpop1 {position:absolute;left:50%;top: 50%;width:450px;transform:translate(-50%, -50%);z-index:20000;font-size:0;} .divpop1 .btns .closing { display:inline-block; width:50%; height:55px;border:1px solid #e3ebf8;line-height:55px; text-align:center; font-size:16px; background:#fff; color:#333;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;} /* 팝업 레이아웃(팝업형) */ .block-ui, .block-ui3 {display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.3);z-index:99991;-webkit-transition:all .4s;-ms-transition:all .4s;transition:all .4s;} .block-ui2 {position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.3);z-index:999911;-webkit-transition:all .4s;-ms-transition:all .4s;transition:all .4s;} .block-ui.white {display:block;background:rgba(0,0,0,.3);z-index:999 !important;} .modal-popup.ty02 {position:fixed;left:50%;top:50%;width:800px;height:auto;background:#fff;z-index:99999;overflow-y:auto;overflow-x:hidden;font-size:0;} .modal-popup.ty02 .pop-header {width:100%;min-height:46px;padding-bottom:12px;background:#f9f9f9; border-bottom:1px solid #ddd; text-align:left;z-index:10;overflow:hidden;box-sizing:border-box;} .modal-popup.ty02 .pop-header span {color:#222;padding:15px 50px 0 16px;font-size:17px;font-weight:600;} .modal-popup.ty02 .pop-header .btn-pop-close2, .modal-popup.ty02 .pop-header .btn-pop-close3 {position:absolute;top:6px;right:6px;left:inherit;width:34px;height:34px; background-color:transparent; } .modal-popup.ty02 .pop-header .btn-pop-close2, .modal-popup.ty02 .pop-header .btn-pop-close3:after {content:'\e921'; display:inline-block; color:#000; font-size:25px; } .modal-popup.ty02 .pop-header .btn-pop-close2 span, .modal-popup.ty02 .pop-header .btn-pop-close3 span {display:none;} .modal-popup.ty02 .pop-content {min-height:50px;max-height:335px !important;background:#fff;overflow-y:auto;} .modal-popup.ty02 .pop-content .rule-box {padding:10px 15px;} .modal-popup.ty02 .pop-content .text-box {padding:16px 25px;font-size:14px;line-height:18px;} .modal-popup.ty02 .pop-btn {/*margin-top:30px;*/} .modal-popup.ty02 .pop-btn button {display:inline-block;width:100%;height:53px;background:#fff;color:#0e3ecd;line-height:42px;text-align:center;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;overflow:hidden;white-space:nowrap;} .modal-popup.ty02 .pop-btn1 button {display:inline-block;width:50%;height:53px;background:#fff;color:#0e3ecd;line-height:42px;text-align:center;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;overflow:hidden;white-space:nowrap;} .modal-popup.ty02 .pop-btn1 button:last-child {/*background:#888;*/color:#555;} .modal-popup.ty02 .pop-btn1 button:nth-child(2) {border-left:1px solid #eee;font-weight:bold;} .modal-popup.ty02 .pop-btn1 button:nth-child(2) span {color:#0078ff;} .modal-popup.ty02 .pop-content02 {padding:25px;background:#f8f8f8;font-size:14px;} .modal-popup.ty02 .pop-content02 h3 {font-size:16px;} .modal-popup.ty02 .pop-content02 ul {font-size:0;} .modal-popup.ty02 .pop-content02 ul li {width:33%;display:inline-block;padding-bottom:15px;text-align:center; font-size:14px;} .modal-popup.ty02 .pop-content02 ul li img {width:50%;margin-bottom:5px;border-radius:10px;} .modal-popup.ty02 .pop-content02 ul:first-child {margin-bottom:15px;} .modal-popup.ty02 .pop-content02 ul li.sns {width:100%;} .modal-popup.ty02 .pop-content02 ul li.sns input {width:58%;margin:0;display: inline-block;} .modal-popup.ty02 .pop-content02 ul li.sns .button {width:27%;height:40px;border:1px solid #aaa;background:#fff;margin:0;font-size:13px;color:#000;} /* 약관 */ .agree-detail { margin-top:20px;} .agree-detail h2 {margin-bottom: 0px; font-size: 23px; color: #333;} .agree-detail h3 {margin-top:30px; font-size: 18px; font-weight:500; color:var(--color-main);} .agree-detail h6 { font-size: 16px; color: #111; padding: 20px 5px 7px 0; font-weight: 500; } .agree-detail h6:first-child {padding-top: 5px;} .agree-detail p {padding: 5px 0 5px 0; color:#888; font-size:14px;line-height:1.4em;} .agree-detail strong {font-weight: bold;} .agree-detail ol { padding: 5px 5px 5px 5px;list-style:none; } .agree-detail ul { padding: 5px 5px 5px 5px; } .agree-detail span {display:inline-block; vertical-align:top;margin-top:-1px; margin-right:3px; font-weight:500;} .agree-detail li { padding: 1px 0 1px 0;font-size:15px;line-height:1.5em;} .agree-detail li.tit {font-size: 14px; color: #111; padding: 20px 5px 10px 0; font-weight: bold;} .agree-detail li.tit:first-of-type {padding-top: 0;} .agree-detail ol li ol {list-style-type:decimal; list-style-position:outside; margin-left:18px; } .agree-detail ol li ol li {font-size:14px;} /* modal pop */ .agree-detail.pop { margin-top:28px;} .agree-detail.pop h2 {margin-bottom: 20px; font-size: 18px; color: #333;} .agree-detail.pop h3 {margin-top:30px; margin-bottom: 10px; font-size: 16px; font-weight:600; color:var(--color-main);} .agree-detail.pop h3:nth-child(1) {margin-top:0;} .agree-detail.pop h6 { font-size: 14px; color: #111; padding: 20px 5px 7px 0; font-weight: bold; } .agree-detail.pop h6:first-child {padding-top: 5px;} .agree-detail.pop p {padding: 5px 0 5px 0; color:#888; font-size:13px;line-height:1.4em;} .agree-detail.pop strong {font-weight: bold;} .agree-detail.pop ol { padding: 5px 5px 5px 10px;list-style:none; } .agree-detail.pop ul { padding: 5px 5px 5px 10px; } .agree-detail.pop li { padding: 1px 0 1px 0;font-size:13px;line-height:1.4em;} .agree-detail.pop li.tit {font-size: 14px; color: #111; padding: 20px 5px 10px 0; font-weight: bold;} .agree-detail.pop li.tit:first-of-type {padding-top: 0;} .agree-detail.pop ol li ol {list-style-type:decimal; list-style-position:outside; margin-left:15px; } /**************************************************************************************************/ /* Customer : 고객센터 /************************************************************************************************ */ .cs-wrap {height:auto; background:none ; display:block;} .cs-wrap.cs-main {height:800px; background:url(/images/sub/bg_cs.jpg) no-repeat center ; background-size:cover; } .cs-wrap:after {content:''; display:block; width:100%;clear:both; } .cs-wrap .title-wrap { text-align:center; padding-top:2rem; } .cs-wrap .title-wrap h2 {font-size:35px; color:#333; } .cs-wrap .title-wrap p {font-size:16px; color:#888; line-height:1.5em; padding-top:10px; } .cs-wrap .title-wrap.cs-m {padding-top:80px;} .cs-wrap .title-wrap.cs-m h2 {color:#fff;} .cs-wrap .title-wrap.cs-m p {color:#fff;} .cs-wrap .cs-link {display:block; padding-top:90px;} .cs-wrap .cs-link li {display:inline-block; vertical-align:top; position:relative; width:calc(25% - 15px); margin-left:20px; height:380px; text-align:center; z-index:3; } .cs-wrap .cs-link li:after {content:''; position:absolute; left:0; top:0; width:100%; height:100%; z-index:-1; border-radius:12px; background-color:#fff; border:1px solid rgba(0,0,0,0.1); transition: all 0.2s ease-in; } .cs-wrap .cs-link li:nth-child(1) {margin-left:0; } .cs-wrap .cs-link li:hover:after {box-shadow:0 5px 15px 5px rgba(78,60,46,0.3);} .cs-wrap .cs-link img {display:inline-block;} .cs-wrap .cs-link li a {display:block; width:100%; height:100%; padding:65px 25px;} .cs-wrap .cs-link li a dl {padding-top:30px; } .cs-wrap .cs-link li a dl dt {font-size:24px; font-weight:600; color:#000} .cs-wrap .cs-link li a dl dd {font-size:15px; color:#777; line-height:1.4em; padding-top:10px; height:65px;} .cs-wrap .cs-link li a button {display:inline-block; clear:both; margin-top:30px; height:34px; line-height:32px; color:#444; font-size:16px; padding:0 25px; border-radius:30px; background-color:#fff; border:1px solid #ddd; transition: all 0.2s ease-in;} .cs-wrap .cs-link li a:hover button { background-color:var(--color-main); border-color:var(--color-main); color:#fff;} /* 공지 */ .bbs-list {width:100%; margin-bottom:30px;} .bbs-list:after {content:''; width:100%; display:block; clear:both;} .bbs-list thead {} .bbs-list tr {position:relative; width:100%;} .bbs-list th {border-top:2px solid var(--color-main); border-bottom:1px solid #ddd; padding:15px 0; font-size:16px; font-weight:500; color:#222; } .bbs-list td { padding:15px 5px; text-align:center; border-bottom:1px solid #eaeaea; color:#555; font-size:15px; } .bbs-list .inq-result { padding:20px; background-color:#f5f5f5; } .bbs-list .inq-result .qs {} /* FAQ */ .faq-toggle { } .faq-toggle h2 { display:block; font-size:18px;padding:10px 100px 10px 15px; font-weight:500; color:#333; line-height:50px; } .faq-toggle .toggle_dl {border-bottom:1px solid #eaeaea; } .faq-toggle .toggle_dl .title {position:relative; cursor:pointer;overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } .faq-toggle .toggle_dl .title:before {content:'Q'; display:inline-block; margin-right:10px; font-family:'GmarketSans'; font-size:18px; width:35px;height:35px; padding-top:2px; line-height:35px; text-align:center; color:#fff; background-color:#1bb4fb; border-radius:50%; font-weight:500; } .faq-toggle .toggle_dl .title:after {content:'\e942'; position:absolute;right:10px; top:12px;font-family :'xeicon'; color:#999;font-size:32px; cursor:pointer; transition: all 0.2s ease-in;} .faq-toggle .toggle_dl .title.on:after { transform:rotate(180deg); } .faq-toggle .toggle_dl .answer {position:relative; width:100%; padding:25px 20px 30px 30px; background-color:#f9f9f9; } .faq-toggle .toggle_dl .answer .icon {display:inline-block; vertical-align:top; width:35px;margin-right:10px; } .faq-toggle .toggle_dl .answer .icon:before {content:'A'; display:inline-block; font-family:'GmarketSans'; font-size:18px; width:35px;height:35px; padding-top:2px; line-height:35px; text-align:center; color:#fff; background-color:#6cc10a; border-radius:50%; font-weight:500;} .faq-toggle .toggle_dl .answer .cont {display:inline-block; vertical-align:top; width:calc(100% - 50px); font-size:16px; line-height:1.6em; color:#666; padding-top:5px;} /**************************************************************************************************/ /* Company : 회사소개 /************************************************************************************************ */ .column {width:1200px; margin:auto; } .company_wrap .title_wrap {color:#111; margin-bottom:2rem;} .company_wrap figure {overflow:hidden; border-radius:1.5rem;} .company_wrap figure img {width:100%;} .company_wrap h2 {font-size:2.188rem; line-height:1.4em; color:inherit; font-weight:700; text-transform:uppercase; } .company_wrap .exp {font-size:1.25rem; line-height:1.5em; color:inherit;font-weight:400; margin-top:1rem;} .company_wrap section {padding:8rem 0;} .company_wrap .btn_wrap {text-align:center;} .company_wrap .intro_top {padding:0;} .company_wrap .intro_top .column {display:flex; justify-content: center;align-items: center; height:550px; background:url('/images/sub/bg_comp.jpg') no-repeat center ; background-size:cover; border-radius:var(--radius-big); overflow:hidden; } .company_wrap .intro_top dl { text-align:center; display:flex;flex-direction: column; gap:1.5rem; } .company_wrap .intro_top dl dt {font-size:2.75rem; color:#fff; line-height:2.8rem; font-weight:600;} .company_wrap .intro_top dl dd {font-size:1.25rem;color:#fff; line-height:1.5em; font-weight:400;} /* 해피카 개요 */ .company_wrap .summary {padding-bottom:0; } .company_wrap .summary ul { display:flex; gap:1.125rem; } .company_wrap .summary ul li {width:25%; background-color:var(--color-light-blue); border-radius:var(--radius-basic); padding:2.35rem 0;gap:.65rem; display:flex;flex-direction: column;align-items: center; justify-content: center; } .company_wrap .summary ul li p {font-size:1.125rem; line-height:1.3em;font-weight:600; color:#111; } .company_wrap .summary ul li h3 {font-size:2rem; line-height:1.5em; font-weight:700; color:var(--color-main)} /* 해피카 비전*/ .company_wrap .vision ul { display:flex; padding:2rem .2rem 0; } .company_wrap .vision ul li {width:50%;} .company_wrap .vision ul li p {font-size:1.2rem; line-height:1.3em; font-weight:700; color:var(--color-main); text-transform:uppercase; letter-spacing:0; } .company_wrap .vision ul li h3 {font-size:1.25rem; line-height:1.6em; font-weight:600; color:#111; margin-top:1rem; } /* 사업환경의 변화 */ .company_wrap .business {background-color:#1a202a; } .company_wrap .business .column {display:flex; } .company_wrap .business .title_wrap {width:50%; color:#fff;} .company_wrap .business ul {width:50%; display:flex; flex-wrap: wrap; gap:5rem 0} .company_wrap .business ul li {width:50%;} .company_wrap .business dl {color:#fff;} .company_wrap .business dl dt {display:inline-flex; align-items: center; background-color:var(--color-main); color:inherit; height:2.5rem; border-radius:.5rem; font-size:1.35rem; font-weight:700;letter-spacing:0; padding:0 1rem; margin-bottom:1rem;} .company_wrap .business dl dd {display:block;position:relative; padding-left:.85rem; font-size:1.2rem; line-height:1.3em;margin-top:.85rem; font-weight:500; color:inherit;} .company_wrap .business dl dd:before {content:''; transform: rotate( 45deg ); width:4px; height:4px; background-color:#fff; position:absolute; left:.1rem; top:.6rem;} /* 사업환경의 변화 */ .company_wrap .innocation .title_wrap{ text-align:center;} .company_wrap .innocation .title_wrap .exp {margin:.5rem; color:#666;} .company_wrap .innocation figure {border-radius:0;} .company_wrap .innocation ul {display:flex; gap:1.85rem; margin-top:2rem;} .company_wrap .innocation ul li { width:33.3%;background-color:#f3f9ff; border-radius:1.25rem;overflow:hidden; } .company_wrap .innocation ul li dl{padding:2.2rem 2.5rem 2.5rem; } .company_wrap .innocation ul li dl dt {font-size:1.563rem; line-height:1.6rem; font-weight:700; color:#222;} .company_wrap .innocation ul li dl dd {font-size:1.12rem; line-height:1.5em; color:#666; font-weight:400; margin-top:1.2rem; letter-spacing:-.02em; } /* 연혁 */ .company_wrap .history {padding-top:0;} .company_wrap .history .title_wrap{ text-align:center;} .company_wrap .history h3 {color:var(--color-main); font-weight:700; font-size:1.65rem; line-height:1.5em;text-align:center; letter-spacing:0; margin-top:2rem; } .company_wrap .history ul {margin-top:2.5rem; position:relative; font-size:0;} .company_wrap .history ul:after {content:''; position:absolute; left:50%; top:0;margin-left:-1px; width:2px; height:100%; background-color:#f0f0f0; z-index:-1; } .company_wrap .history ul li { position:relative; display:flex; justify-content: flex-start; width:100%; margin-top:5rem;} .company_wrap .history ul li:nth-child(1) {margin-top:0rem; } .company_wrap .history ul li:before {content:''; width:36px; height:36px; background-color:var(--color-main); border-radius:50%; border:12px solid #eff5f9; position:absolute; left:50%; top:0rem; margin-left:-18px} .company_wrap .history ul li>div {text-align:right; width:50%; padding-right:5rem; margin-top:-.15rem;} .company_wrap .history ul li.right {justify-content: flex-end;} .company_wrap .history ul li.right>div {padding-left:5rem; text-align:left; } .company_wrap .history ul li .year {font-size:2.5rem; line-height:2.6rem; font-weight:700; color:#111; } .company_wrap .history ul li .txt {margin-top:1.1rem; font-size:1.25rem; font-weight:500; color:#444; } .company_wrap .history ul li:last-child {background-color:#fff;} /* 인증서 */ .company_wrap .cert {padding-top:0;} .company_wrap .cert .title_wrap { text-align:center; } .company_wrap .cert ul { display:flex;flex-wrap: wrap; gap:11rem 2rem;position:relative; margin-top:12rem;} .company_wrap .cert ul li { position:relative; width:calc(50% - 1rem);background-color:#f5f5f5;display:flex; justify-content: flex-end; padding:4.5rem 2rem; } .company_wrap .cert ul li p { width:50%;font-size:1.125rem; line-height:1.5em; font-weight:700; color:#333; letter-spacing:-.05em;} .company_wrap .cert ul li .img_wrap {position:absolute; left:3rem; bottom:2.5rem;background-color:#fff; padding:.35rem; border:1px solid #ddd; text-align:center; box-shadow:7px 7px 0 rgba(0,0,0,0.05)} /* 뉴스 */ .news {padding-top:0rem !important; margin-bottom:2rem} .news .title_wrap{ text-align:center;} .news .title_wrap h2 {letter-spacing:0; font-weight:800;} .news.sub { margin:0 auto; } .news.sub ul {width:1000px; margin:0 auto;} .news ul { margin:0 auto; } .news ul li {position:relative; padding:2rem .2rem; border-bottom:1px solid #e6e6e6; cursor:pointer; transition: all 0.2s ease-in;} .news ul li:after {content:"\e90b";display:inline-flex; align-items: center; height:2rem; font-family:'xeicon'; color:#e6e6e6; font-size:1.85rem; position:absolute; right:.5rem; top:50%; margin-top:-1rem; transition: all 0.2s ease-in;} .news ul li:hover {border-color:var(--color-main)} .news ul li:hover:after, .news ul li:hover .title{color:var(--color-main)} .news ul li .press {font-size:1rem; color:#222; font-weight:600; } .news ul li .date {display:inline-block; margin-left:1.2rem; color:#c2c5ca; font-size:.85rem; font-weight:500; letter-spacing:0; } .news ul li .title {font-size:1.125rem; line-height:1.3em; margin-top:1rem; font-weight:600; color:#111;transition: all 0.2s ease-in;} .news .btn_wrap {margin-top:2rem;} .news .btn_wrap a {display:inline-flex; align-items: center; height:3.5rem; border-radius:.35rem; background-color:#f5f6f7; padding:0 3.5rem; font-size:1.05rem; font-weight:400; color:#222;} .news .btn_wrap a:hover {background-color:var(--color-main); color:#fff;} /* 조직도 */ .company_wrap .orgz {padding-top:0; text-align:center;} .company_wrap .orgz img {max-width:100%; } /* 오시는길 */ .company_wrap .map_wrap { padding-top:0;text-align:center;} .company_wrap .map_box {width:100%; height:500px; border-radius:1.5rem; overflow:hidden; border:1px solid #ddd;} .company_wrap .company_info {display:flex;padding-top:2.5rem; } .company_wrap .company_info h3 {width:350px; } .company_wrap .company_info h3 img {height:2.65rem} .company_wrap .company_info ul {display:block; width:calc(100% - 350px); } .company_wrap .company_info ul li { width:100%; display:inline-flex;align-items: center; font-size:1.125rem; color:#333; line-height:1.3em; font-weight:400; margin-bottom:.65rem;} .company_wrap .company_info ul li:before {content:''; display:inline-flex; align-items: center; width:2rem;height:2rem; font-family:'xeicon'; font-size:1rem; color:#7a7a7a; } .company_wrap .company_info ul li.n01:before {content:"\eb59"; } .company_wrap .company_info ul li.n02:before {content:"\e9d3"; } .company_wrap .company_info ul li.n03:before {content:"\e9bc"; } .company_wrap .company_info ul li.n04:before {content:"\ea07"; } .root_daum_roughmap {width:100% !important; height:100% !important;} .root_daum_roughmap .cont {display:none !important;} .root_daum_roughmap .wrap_controllers {display:none !important;} .root_daum_roughmap .wrap_map {height:100% !important; } .root_daum_roughmap_landing .border1, .root_daum_roughmap_landing .border2, .root_daum_roughmap_landing .border3, .root_daum_roughmap_landing .border4 {display:none !important; border:0 !important;} .root_daum_roughmap .map{border:0 !important;} @media screen and (max-width:1200px){ .column {width:100%; } .company_wrap .cert ul {margin-top:10rem;gap:9rem 1.6rem;} .company_wrap .cert ul li { width:calc(50% - .8rem);padding:3.5rem 2rem; } .company_wrap .cert ul li .img_wrap { left:2rem; bottom:2rem; width:35%;} .company_wrap .cert ul li p {font-size:1.1rem;} .company_wrap .cert ul li p br {display:none;} .company_wrap .company_info h3 {width:250px; } .company_wrap .company_info ul { width:calc(100% - 250px); } } .intro-top {display:block; width:100%; height:650px; background:url(/images/sub/bg_comp.jpg) no-repeat center ; background-size:cover;} .intro-top dl {padding-top:13.50rem; text-align:center;} .intro-top dl dt {font-size:2.75rem; color:#fff; line-height:2rem; margin-bottom:25px;} .intro-top dl dt span {margin:0; padding:0} .intro-top dl dd {font-size:1.35rem;color:#fff; line-height:1.35rem; padding-top:1.20rem; } .cp-title {display:block; text-align:center; font-size:2.25rem; color:#222; margin-bottom:3rem; } .cp-title:after {content:''; display:block; width:50px; height:1px; background-color:#333; margin:20px auto; } .cp-title.cw {color:#fff;} .cp-title.cw:after { background-color:#fff;} /*인사말 */ .greeting {display:block; text-align:center; padding:70px 0;} .greeting h3 {font-size:1.98rem; color:#222; line-height:2.50rem; } .greeting h3 strong{font-weight:500; } .greeting p {font-size:1.15rem; line-height:1.90rem; color:#666; padding-top:1.8rem; } .greeting p strong {font-weight:500; } .greeting .ceo {font-weight:500; color:#333;font-family:'GmarketSans'; } /* 기업현황 */ .outline {display:block; width:100%; height:500px;padding:70px 0; background:url(/images/sub/bg_outline.jpg) no-repeat center ; background-size:cover;} .outline ul{ font-size:0; text-align:center; padding-top:2rem; } .outline ul li { display:inline-block; vertical-align:top; width:16.6%;} .outline ul li h3 {color:#12e6ff; font-size:1.2rem; padding-top:0.95rem; } .outline ul li p {color:#fff; font-size: .95rem; padding-top:0.95rem; line-height:1.6rem; } /* 조직도 */ .organization {display:block; width:100%; padding:70px 0 220px; background-color:#f5f5f5; text-align:center; } .organization .ceo-title {display:inline-block;position:relative;height:150px; } .organization .ceo-title p {width:300px; height:100px; position:relative; line-height:85px;color:#fff; font-size:1.65rem;background: linear-gradient(to bottom right, #fa9049 0%, #f1631b 100%); border:8px solid #f1e6e0; border-radius:20rem; box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.03);z-index:5} .organization .ceo-title:after {content:''; position:absolute; left:50%; top:10px; width:1px; height:100%; background-color:#ccc;z-index:0 } .organization ul {display:block; margin-top:10px; *zoom:1;} .organization li {display:table; float:left; vertical-align:middle; position:relative; width:calc(16.6% - 0px); padding-left:12px; margin-top:55px; height:80px; } .organization li:nth-child(1) {margin-left:0;} .organization li:nth-child(1):before {content:''; position:absolute;left:50%; width:50%; } .organization li:nth-last-child(1):before {content:''; position:absolute;left:0; width:50%; } .organization li:before {content:''; position:absolute;left:0; top:-55px; width:100%; height:1px; border-top:1px solid #ccc; } .organization li:after {content:''; position:absolute;left:50%; top:-55px; width:1px; height:55px; border-left:1px solid #ccc; } .organization li .box {display:table-cell; *margin-top:10px; text-align:center; vertical-align:middle; width:100%;height:100%; color:#fff; padding:0 10px; font-size:1.05rem; background: linear-gradient(to bottom right, #2d4c7a 0%, #213861 100%); box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.09); } /*.organization li.row2 .box { padding-top:15px;}*/ @media screen and (max-width:1200px){ .organization .ceo-title p {font-size:1.5rem; } .organization li .box { font-size:.95rem; } } /* 찾아오시는 길 */ .location {display:block; width:100%; padding:70px 0; } .map { max-width:1600px; margin:0 auto; position:relative; } @media screen and (max-width:1600px){ .map { max-width:100%;} } .location-info { position:relative; width:100%; height:240px; background-color:#212b3f; margin-top:-120px; z-index:5; box-shadow:0 8px 25px 8px rgba(0,0,0,0.2); } .location-info .logo-area {display:inline-block; vertical-align:top; width:300px; height:100%; text-align:center; padding-top:60px; background-color:#1b2033 } .location-info .info-area {display:inline-block; vertical-align:top; width:calc(100% - 300px); height:100%; padding:50px 0 0 70px; } .location-info address {display:block; font-size:18px; color:#fff; line-height:1.8em; } .location-info address p { font-size:15px; line-height:22px; } .location-info .contact {display:block; padding-top:18px; font-size:17px; color:#fff;font-size:18px; color:#fff; line-height:1.6em; letter-spacing:0; } .location-info .contact span {display:inline-block; padding:0 30px; } /* 옵션정보 */ .option_part {text-align:center;} .option_part ul {display:flex; flex-wrap:wrap; gap:1rem 0;font-size:0; } .option_part li {display:inline-block; width:20%;text-align:center;opacity:0.3} .option_part li .img {display:inline-block;width:4rem;height:4rem;background-repeat:no-repeat;background-size:auto 4rem;background-position:center 0;} .option_part li p {font-size:.875rem;font-weight:500; color:#111} .option_part li.active {opacity:0.9;} .option_part li.fuc_view {display:none; } .option_part li.fuc_view.show {display:inline-block;} .option_part a.btn-detail {margin-top:1.75rem;} .option_part a.btn_detail {font-size:0;} .option_part a.fuc_btn:after {content:'15개옵션 모두보기'; display:inline-block; vertical-align:top; line-height:38px; margin-left:5px; font-size:14px; font-weight:500;font-family:'NotoSans';} .option_part a.fuc_btn.on:after {content:'옵션 닫기'; } /* car_list 마이페이지 */ .car_list {padding-top:1.5rem; ul{display:flex; flex-direction:column; border-top:1px solid #EEF0F3; } ul>li {position:relative; display:flex; align-items:center; justify-content:space-between; padding:1.25rem 0.25rem;border-bottom:1px solid #EEF0F3; transition: all 0.2s ease-in;} .card-column { position:relative;width:100%; display:flex; flex-direction: column; gap:1rem;} .card-row {display:flex; align-items:center; width:100%; justify-content:space-between;} .carinfo-wrap {position:relative; display:flex; align-items:center; justify-content: flex-end; gap:1.25rem;} .carinfo-wrap figure {position:relative; width:6.75rem; aspect-ratio: 6 / 4.5; border-radius:0.5rem; overflow:hidden; background-repeat:no-repeat; background-position:center ; background-size:cover; background-color:#f5f5f5; } .carinfo-wrap figure a {display:block; width:100%; height:100%;} .carwish {position:absolute; right:0.5rem; bottom:0.5rem; width:1.3125rem; height:1.3125rem;border:0 !important; background-color:transparent; background-repeat: no-repeat; background-position: center ; background-size:auto 100%; background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.4071 2.19017C15.0683 1.42303 17.4493 2.72522 18.3144 4.48087L18.4159 4.69728C19.4167 6.94289 18.8432 9.36458 17.078 11.7665L17.0771 11.7655C15.6649 13.6989 13.67 15.5858 10.8622 17.743C10.6165 17.932 10.3141 18.0346 10.0028 18.0347C9.69142 18.0347 9.38828 17.9321 9.14248 17.743L8.12491 16.942C5.83815 15.1018 4.16207 13.4385 2.92862 11.7674H2.92764C1.09999 9.28786 0.547167 6.78721 1.68545 4.48087L1.77041 4.31759C2.67034 2.69708 4.86539 1.53401 7.34268 2.1235L7.59073 2.18823L7.59268 2.1892C8.50014 2.44853 9.32404 2.92092 9.99991 3.55821C10.6758 2.92092 11.4997 2.44853 12.4071 2.1892V2.19017ZM16.6962 5.2615C16.2202 4.29514 14.7403 3.37073 12.9091 3.89925L12.9071 3.90022C12.0292 4.15111 11.2632 4.68943 10.7343 5.42671L9.99991 6.44984L9.26553 5.42671C8.73663 4.68943 7.97064 4.15111 7.09268 3.90022V3.89925C5.25154 3.37824 3.77786 4.29869 3.30362 5.2615L3.30264 5.26247C2.55998 6.76754 2.78671 8.5541 4.38077 10.7172H4.38174C5.61572 12.389 7.38993 14.1149 10.0019 16.144C12.6124 14.118 14.3885 12.4078 15.62 10.7211L15.622 10.7192C17.2123 8.5552 17.4401 6.76812 16.6972 5.26247L16.6962 5.2615Z' fill='white' fill-opacity='0.55'/%3E%3C/svg%3E%0A");z-index:1; } .carwish.on {background-image: url("data:image/svg+xml,%3Csvg width='20' height='20' viewBox='0 0 20 20' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M18.4386 4.25787C17.6848 2.73352 15.5132 1.48632 12.9872 2.21247C11.7801 2.55599 10.727 3.29269 9.99988 4.30221C9.27273 3.29269 8.2196 2.55599 7.01256 2.21247C4.48094 1.49741 2.315 2.73352 1.56113 4.25787C0.503479 6.39195 0.942294 8.79211 2.86633 11.3918C4.37405 13.4261 6.52874 15.4882 9.6567 17.8828C9.75555 17.9587 9.87732 18 10.0027 18C10.1281 18 10.2498 17.9587 10.3487 17.8828C13.471 15.4937 15.6313 13.4483 17.1391 11.3918C19.0575 8.79211 19.4963 6.39195 18.4386 4.25787Z' fill='%23EF3333'/%3E%3C/svg%3E%0A");} .carinfo-wrap .info {display:flex; flex-direction:column; gap:0.125rem; } .carinfo-wrap .info .title {display:flex; gap:0.25rem; align-items: center; font-size:1rem; font-weight:600; color:#333;} .carinfo-wrap .info .title a {display:block;} .carinfo-wrap .info .title a:hover {text-decoration: underline;} .carinfo-wrap .regist_n {display:inline-flex; gap:0.5rem;font-size:0.8125rem; color:#555;} .carinfo-wrap .copy { width:1rem;height:1rem;font-size:0; border:0 !important; outline: 0; background-color:transparent; background-repeat:no-repeat; background-position:center ; background-size:auto 100%; background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.6761 1.5C4.43592 1.5 3.24654 1.99228 2.3696 2.86854C1.49266 3.7448 1 4.93327 1 6.17249V11.9477C1 12.1093 1.06426 12.2643 1.17864 12.3786C1.29303 12.4929 1.44816 12.5571 1.60993 12.5571C1.77169 12.5571 1.92683 12.4929 2.04121 12.3786C2.15559 12.2643 2.21985 12.1093 2.21985 11.9477V6.17249C2.21985 5.25654 2.58399 4.37811 3.23216 3.73044C3.88033 3.08277 4.75944 2.71891 5.6761 2.71891H11.3793C11.5411 2.71891 11.6962 2.6547 11.8106 2.54041C11.925 2.42611 11.9892 2.27109 11.9892 2.10946C11.9892 1.94782 11.925 1.7928 11.8106 1.67851C11.6962 1.56421 11.5411 1.5 11.3793 1.5H5.6761Z' fill='%23333333'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M13.3229 4.37907C10.6729 4.08485 7.9984 4.08485 5.34836 4.37907C4.98165 4.41977 4.6395 4.58324 4.37757 4.84291C4.11563 5.10258 3.94932 5.44316 3.90569 5.80925C3.59317 8.48014 3.59317 11.1783 3.90569 13.8492C3.94932 14.2153 4.11563 14.5559 4.37757 14.8155C4.6395 15.0752 4.98165 15.2387 5.34836 15.2794C7.98406 15.5735 10.6872 15.5735 13.3229 15.2794C13.6897 15.2387 14.0318 15.0752 14.2937 14.8155C14.5557 14.5559 14.722 14.2153 14.7656 13.8492C15.0781 11.1783 15.0781 8.48014 14.7656 5.80925C14.722 5.44316 14.5557 5.10258 14.2937 4.84291C14.0318 4.58324 13.6897 4.41977 13.3229 4.37907ZM5.48417 5.59066C8.0296 5.30625 10.6417 5.30625 13.1871 5.59066C13.2798 5.60092 13.3664 5.6421 13.4328 5.70757C13.4992 5.77304 13.5416 5.85896 13.5531 5.95146C13.8552 8.52782 13.8552 11.1306 13.5531 13.707C13.5416 13.7995 13.4992 13.8854 13.4328 13.9509C13.3664 14.0163 13.2798 14.0575 13.1871 14.0678C10.6417 14.3522 8.0296 14.3522 5.48417 14.0678C5.39146 14.0575 5.3049 14.0163 5.2385 13.9509C5.1721 13.8854 5.12972 13.7995 5.11822 13.707C4.81607 11.1306 4.81607 8.52782 5.11822 5.95146C5.12972 5.85896 5.1721 5.77304 5.2385 5.70757C5.3049 5.6421 5.39146 5.60092 5.48417 5.59066Z' fill='%23333333'/%3E%3C/svg%3E%0A");} .car-desc {height:auto; margin:0;} /* 입찰정보 */ .bidinfo-wrap { display:flex; align-items: center; justify-content: flex-end; gap:2.5rem; min-width:32rem; .remain {display:flex; align-items: center; min-width:5rem; gap:0.25rem; line-height:1.5em; font-size:0.8125rem; font-weight:500; color:rgba(236, 23, 23)} .remain:before {content:''; width:1rem;height:1rem; background-repeat: no-repeat; background-position: center ; background-size:auto 100%;background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 2C5.1402 2 2 5.1402 2 9C2 12.8598 5.1402 16 9 16C12.8598 16 16 12.8598 16 9C16 5.1402 12.8598 2 9 2ZM11.3051 12.2949L8.3 9.2898V4.8H9.7V8.7102L12.2949 11.3051L11.3051 12.2949Z' fill='%23A9ADB7'/%3E%3C/svg%3E%0A");} .bid-info {display:flex; align-items: center; justify-content: flex-end;} .bid-info>div {display:flex; align-items:center; gap:0rem;} .bid-info>div.first {padding-right:1.5rem; margin-right:1.5rem; border-right:1px solid #EFEFEF} .bid-info .row {} .bid-info .price {display:flex; flex-direction: column; gap:0.375rem;width:7.5rem;} .bid-info .price span {font-size:0.8125rem; color:#95999E; } .bid-info .price strong {font-size:1rem; line-height:1.3em; color:#222; font-weight:bold;} .bid-info .price.my {gap:0;} .bid-info .price.my span {padding-left:0.5rem} .bid-info .price.my strong {color:var(--color-blue)} .bid-info .price.my input[type="text"] {width:100%; height:2rem; border-radius:0.3125rem;padding-left:0.5rem !important; padding-right:1.25rem !important; border:0; border-radius:0; border-bottom:1px solid var(--color-red); font-size:1rem;line-height:1.3em; color:var(--color-red); font-weight:bold; transition: none;} .bid-info .price.my input[type="text"]:disabled { border-color:transparent; background-color:#fff; border-radius:0; color:var(--color-blue);text-align: left !important; } .bid-info .price.my .unit {width:100%; display:flex; align-items: center;} .bid-info .price.my .manwon input[type="text"] {padding-right:1.875rem !important; text-align: right;font-size:1.125rem;} .bid-info .edit_bid {gap:0.25rem; width:100%; height:2.5rem;padding:0 0.5rem; border-radius:0.25rem; border:1px solid #222; color:#222; font-size:0.875rem; font-weight:600; text-align: center;} .bid-info .edit_bid:before {content:''; display:inline-block;vertical-align: middle;margin-right:0.125rem; width:1rem; height:1rem; background-repeat: no-repeat; background-position: center ; background-size:auto 100%;background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.2546 2.34116C10.4889 2.26504 10.7391 2.25578 10.9773 2.31284L11.0789 2.34116L11.2156 2.39584C11.3442 2.45695 11.4489 2.53584 11.5359 2.60971C11.5907 2.65632 11.6485 2.70964 11.7078 2.76694L11.8904 2.9476L13.0505 4.10776C13.1748 4.23198 13.2965 4.35364 13.3904 4.4642C13.4892 4.58062 13.5962 4.72812 13.6589 4.92124C13.7459 5.18901 13.7459 5.47768 13.6589 5.74545C13.5962 5.93857 13.4892 6.08607 13.3904 6.20249C13.2965 6.31305 13.1748 6.43471 13.0505 6.55893L6.94312 12.6664H13.3337C13.7018 12.6665 13.9998 12.9653 13.9998 13.3333C13.9998 13.7014 13.7018 14.0002 13.3337 14.0003H2.66675C2.29862 14.0002 1.99976 13.7015 1.99976 13.3333V10.6664C1.99984 10.4898 2.07032 10.3206 2.19507 10.1956L9.44214 2.94858C9.566 2.82471 9.68712 2.70252 9.79761 2.60874C9.9139 2.51006 10.0618 2.40381 10.2546 2.34116ZM10.6599 3.62534C10.6006 3.67569 10.5239 3.7516 10.3845 3.89096V3.89194L3.33374 10.9427V12.6664H5.05835L12.1082 5.61557C12.2478 5.47596 12.3243 5.39958 12.3748 5.34018C12.3767 5.33794 12.3779 5.33538 12.3796 5.33334C12.3779 5.33131 12.3767 5.32875 12.3748 5.32651C12.3243 5.26711 12.2478 5.19073 12.1082 5.05112L10.948 3.89096V3.88999C10.8087 3.75105 10.732 3.67579 10.6726 3.62534C10.6702 3.62328 10.6679 3.62129 10.6658 3.61948C10.6638 3.62114 10.6621 3.62348 10.6599 3.62534Z' fill='black'/%3E%3C/svg%3E%0A");} .bid-info .btn-wrap { flex:auto; display:inline-flex; width:5.75rem; align-items: center; justify-content: center; gap:0.25rem; height:2.5rem; margin-left:1rem} .bid-info .btn-wrap .btn { border-radius:0.25rem;padding:0; } .bid-info .btn_close {flex:1 0; height:2.5rem; background-color:#fff; border:1px solid #ddd; background-repeat: no-repeat; background-position: center ; background-size:auto 1.25rem; background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M19 6.41L17.59 5L12 10.59L6.41 5L5 6.41L10.59 12L5 17.59L6.41 19L12 13.41L17.59 19L19 17.59L13.41 12L19 6.41Z' fill='%23333333'/%3E%3C/svg%3E%0A"); } .bid-info .edit_bid.is-editing { background-color:var(--color-blue); border-color:var(--color-blue); color:#fff;} .bid-info .edit_bid.is-editing:before {margin:0; background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.2546 2.34116C10.4889 2.26504 10.7391 2.25578 10.9773 2.31284L11.0789 2.34116L11.2156 2.39584C11.3442 2.45695 11.4489 2.53584 11.5359 2.60971C11.5907 2.65632 11.6485 2.70964 11.7078 2.76694L11.8904 2.9476L13.0505 4.10776C13.1748 4.23198 13.2965 4.35364 13.3904 4.4642C13.4892 4.58062 13.5962 4.72812 13.6589 4.92124C13.7459 5.18901 13.7459 5.47768 13.6589 5.74545C13.5962 5.93857 13.4892 6.08607 13.3904 6.20249C13.2965 6.31305 13.1748 6.43471 13.0505 6.55893L6.94312 12.6664H13.3337C13.7018 12.6665 13.9998 12.9653 13.9998 13.3333C13.9998 13.7014 13.7018 14.0002 13.3337 14.0003H2.66675C2.29862 14.0002 1.99976 13.7015 1.99976 13.3333V10.6664C1.99984 10.4898 2.07032 10.3206 2.19507 10.1956L9.44214 2.94858C9.566 2.82471 9.68712 2.70252 9.79761 2.60874C9.9139 2.51006 10.0618 2.40381 10.2546 2.34116ZM10.6599 3.62534C10.6006 3.67569 10.5239 3.7516 10.3845 3.89096V3.89194L3.33374 10.9427V12.6664H5.05835L12.1082 5.61557C12.2478 5.47596 12.3243 5.39958 12.3748 5.34018C12.3767 5.33794 12.3779 5.33538 12.3796 5.33334C12.3779 5.33131 12.3767 5.32875 12.3748 5.32651C12.3243 5.26711 12.2478 5.19073 12.1082 5.05112L10.948 3.89096V3.88999C10.8087 3.75105 10.732 3.67579 10.6726 3.62534C10.6702 3.62328 10.6679 3.62129 10.6658 3.61948C10.6638 3.62114 10.6621 3.62348 10.6599 3.62534Z' fill='%23FFFFFF'/%3E%3C/svg%3E%0A");} .bid-info .edit_bid.icononly { flex:1 0; height:2.5rem; font-size:0; background-color:var(--color-blue); border-color:var(--color-blue); color:#fff;} .bid-info .edit_bid.icononly:before {margin:0; background-image: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10.2546 2.34116C10.4889 2.26504 10.7391 2.25578 10.9773 2.31284L11.0789 2.34116L11.2156 2.39584C11.3442 2.45695 11.4489 2.53584 11.5359 2.60971C11.5907 2.65632 11.6485 2.70964 11.7078 2.76694L11.8904 2.9476L13.0505 4.10776C13.1748 4.23198 13.2965 4.35364 13.3904 4.4642C13.4892 4.58062 13.5962 4.72812 13.6589 4.92124C13.7459 5.18901 13.7459 5.47768 13.6589 5.74545C13.5962 5.93857 13.4892 6.08607 13.3904 6.20249C13.2965 6.31305 13.1748 6.43471 13.0505 6.55893L6.94312 12.6664H13.3337C13.7018 12.6665 13.9998 12.9653 13.9998 13.3333C13.9998 13.7014 13.7018 14.0002 13.3337 14.0003H2.66675C2.29862 14.0002 1.99976 13.7015 1.99976 13.3333V10.6664C1.99984 10.4898 2.07032 10.3206 2.19507 10.1956L9.44214 2.94858C9.566 2.82471 9.68712 2.70252 9.79761 2.60874C9.9139 2.51006 10.0618 2.40381 10.2546 2.34116ZM10.6599 3.62534C10.6006 3.67569 10.5239 3.7516 10.3845 3.89096V3.89194L3.33374 10.9427V12.6664H5.05835L12.1082 5.61557C12.2478 5.47596 12.3243 5.39958 12.3748 5.34018C12.3767 5.33794 12.3779 5.33538 12.3796 5.33334C12.3779 5.33131 12.3767 5.32875 12.3748 5.32651C12.3243 5.26711 12.2478 5.19073 12.1082 5.05112L10.948 3.89096V3.88999C10.8087 3.75105 10.732 3.67579 10.6726 3.62534C10.6702 3.62328 10.6679 3.62129 10.6658 3.61948C10.6638 3.62114 10.6621 3.62348 10.6599 3.62534Z' fill='%23FFFFFF'/%3E%3C/svg%3E%0A");} .rank {display:flex; align-items: center; justify-content: center; width:2.5rem;height:2.5rem; border-radius:50%;font-size:0.9375rem; font-weight:bold; background-color:#f5f5f5; margin-right:0.75rem } .rank.rank1 {background-color:#F9F2F3; color:#F2141F} .rank.rank2 {background-color:#F8EFE5; color:#E58702} .rank.rank3 {background-color:#EEEFFE; color:#5260F2} }/* end .bidinfo-wrap */ /* 마감차량 */ ul li.closed:after {content:''; position:absolute; left:50%; top:50%; width:6rem; height:6rem; margin-left:-3rem; margin-top:-3rem; background:url(/images/inc/mark_end.png) no-repeat center ; background-size:auto 100%; opacity: 1; z-index: 10;} .bid_calculate {display:flex; justify-content: center; width:100%; font-size:1rem; padding:1.5rem; background-color:#F5F6F8; border-radius:0.5rem; .h4 { font-size:0.9375rem; color:#333; font-weight:500; padding-right:2rem; } .items { display:flex; flex-direction: row; align-items: flex-start; border:0; padding:0 1rem;} .items li { margin:0; padding:0 1.5rem; display:flex; flex-direction: column; justify-content: center; gap:0.3125rem; border:0; background-repeat: no-repeat; background-position: center ; background-size:auto 1.125rem;} .items li.first {gap:0;border-left:1px solid #E0E2E5;} .items li.plus { width:1.5rem; height:1.5rem; padding:0; background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M11.3333 4H12.6667C12.7852 4 12.8444 4.05926 12.8444 4.17778V19.8222C12.8444 19.9407 12.7852 20 12.6667 20H11.3333C11.2148 20 11.1556 19.9407 11.1556 19.8222V4.17778C11.1556 4.05926 11.2148 4 11.3333 4Z' fill='black'/%3E%3Cpath d='M19.8222 11.1556C19.9407 11.1556 20 11.2148 20 11.3333V12.6667C20 12.7852 19.9407 12.8444 19.8222 12.8444H4.17778C4.05926 12.8444 4 12.7852 4 12.6667V11.3333C4 11.2148 4.05926 11.1556 4.17778 11.1556H19.8222Z' fill='black'/%3E%3C/svg%3E%0A");} .items li.equal {width:1.5rem;height:1.5rem; padding:0; background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5 8H19V10H5V8ZM5 14H19V16H5V14Z' fill='%23333333'/%3E%3C/svg%3E%0A");} .items li span {font-size:0.8125rem; color:#666; font-weight:400;} .items li strong {font-weight:1rem; font-weight:bold; color:var(--color-darkblue)} .items li.all {border-right:1px solid #E0E2E5;} .items li.total {padding-right:0.5rem; align-items: flex-start;} .items li.total span {font-weight:bold;} .items li.total strong {font-size:1.25rem;line-height:1.375rem; font-weight:bold; color:var(--color-blue)} .items li .sub {font-size:0.75rem; color:#767F91; font-family: 'Pretendard' !important; line-height:1.3em;} .items li.exp {padding:0; justify-content: flex-end;} } } /* .end car_list */ /* 입찰금액수정 20261002 */ .modal{ .bid_calculate {padding-top:1rem; display:flex; flex-direction: column; width:21rem; .item_list {display:flex;flex-direction: column; padding:0.75rem 1.25rem; border-radius:0.5rem; background-color:#F6F7F9; } .item_list li {display:flex; align-items: center; justify-content: space-between; padding:0.5rem 0.25rem;} .item_list li.first {border-bottom:1px solid #dedede;margin-bottom:0.25rem;padding-bottom:0.75rem;} .item_list li strong {line-height:1.5rem;} span {color:#666; width:6rem;} .unit {width:calc(100% - 6rem)} input[type="text"] {height:1.5rem; border:0 !important; background-color:transparent; color:#111; font-size:1.0625rem; font-weight:bold; width:100%;} .item_list li.total .unit input[type=text] {font-size:1.3125rem; color:#ED1C1C} input[readonly][type=text] {background-color:transparent !important} .remain {display:flex; align-items: center; justify-content: center;padding-top:0.875rem; gap:0.25rem; color:#aaa;font-size:0.875rem;} .remain i {display:inline-block; width:1.125rem; height:1.125rem;background-repeat: no-repeat; background-position: center ; background-size:auto 100%;background-image: url("data:image/svg+xml,%3Csvg width='18' height='18' viewBox='0 0 18 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 2C5.1402 2 2 5.1402 2 9C2 12.8598 5.1402 16 9 16C12.8598 16 16 12.8598 16 9C16 5.1402 12.8598 2 9 2ZM11.3051 12.2949L8.3 9.2898V4.8H9.7V8.7102L12.2949 11.3051L11.3051 12.2949Z' fill='%23333333'/%3E%3C/svg%3E%0A");} .remain em {color:#ED1C1C; font-weight:600; font-size:0.9375rem;} .edit_price {display:flex; align-items: center; justify-content: space-between; padding:1rem 1.25rem 1rem; border-bottom:1px solid var(--color-blue)} .edit_price span {color:#333;} .edit_price input {font-size:1.5rem; font-weight:bold; color:var(--color-blue)} } } .fuc-view {display:none;} .toggle-view {display: none !important;} .toggle-view.is-open { display: block !important;} /* card-row의 flex 레이아웃 유지 */ .card-row.toggle-view.is-open { display: flex !important;}