.main .rightBanner_Wrap {position:absolute;top:858px;} .main .leftBanner_Wrap {position:absolute;top:858px} .main .leftBanner_Wrap.fixed, .main .rightBanner_Wrap.fixed {position:fixed;top:10px !important;} .main .inr {width:970px;} .title_wrap {position:relative;padding-bottom:20px;} .title_wrap h3 {position:relative;font-size:28px;font-weight:600; padding-bottom:0; margin:0; line-height:1.3;color:#fff;letter-spacing:-2px; } .title_wrap h3 img {height:34px;} .title_wrap h3 strong {color:inherit;font-weight:600;color:inherit;} .title_wrap p {display:block; margin-top:10px; font-size:1rem; line-height:1.6em; color:#eee;} .title_wrap .subtitle { display:inline-block; margin-left:10px; color:rgba(255,255,255,0.8); font-weight:500; font-size:15px; padding-bottom:0px; letter-spacing:-1px;} .title_wrap .btn-morecar {position:absolute;right:0;bottom:10px;color:#fff;font-size:34px;} .title_wrap .btn-morecar:before {content:"\e9c5"; color:#fff; font-size:1.6rem; line-height:2rem; } /* **************************************** * * bxslider * **************************************** */ .main-visual {position:relative; min-width:1000px; } .spotzone{ position:relative; width:100%; overflow:hidden; min-height:700px;max-height:700px; overflow:hidden;} .spotzone:after {content:''; clear:both; display:block; } .spotzone li{width:100% !important;min-height:700px; height:700px; } .spotzone li.n01{background:url('/image/main/main_visual_01.jpg') no-repeat center 0;background-size:cover;} .spotzone li.n02{background:url('/image/main/main_visual_02.jpg') no-repeat center 0;background-size:cover;} .spotzone li .txtbox {padding-top:180px; margin:0 auto; text-align:center;} .spotzone li .txtbox p {padding:0;margin:0;} .spotzone li .txtbox .txt, .spotzone li .txtbox .number, .spotzone li .txtbox .txt, .spotzone li .txtbox .tit1 { color:#333; } .spotzone li .txtbox .tit1, .spotzone li .txtbox .tit2, .spotzone li .txtbox .number {opacity:1;letter-spacing:-.04em; transition:all 1s cubic-bezier(0.165, 0.84, 0.44, 1); transition-delay:0.1s;} .spotzone li .txtbox .tit1 {font-size:32px; line-height:55px; font-weight:bold;color:#fff000;letter-spacing:-1px;text-transform:uppercase; text-shadow:1px 1px 3px rgba(0, 0, 0, 1);} .spotzone li .txtbox .tit2 {font-size:75px; line-height:75px; color:#fff; margin-top:15px;text-shadow:5px 5px 10px rgba(255, 255, 255, 0.2) ; font-weight:600;text-transform:uppercase; font-style:italic; text-shadow:5px 5px 1px rgba(0,0,0,0.6);font-family:'SB-ugr';} .spotzone li .txtbox .tit2 strong {color:#87d8fd; font-family:inherit; } .spotzone li .txtbox .number span {vertical-align:top;display:inline-block;padding:0 5px;margin-top:10px;} .spotzone li .txtbox .number .phone { border:5px solid #00db55;padding:10px 65px 5px;line-height:50px !important; color:#fff; font-size:30px; font-weight:600; border-radius:60px; letter-spacing:-1px;} .spotzone li .txtbox .number .phone span {font-size:24px;} .spotzone li .txtbox .number .phone b {font-size:47px;color:#00e359;font-weight:600;font-family:'Century Gothic'} /* .spotzone li .txtbox .tit1 { transform:translateY(30px);-moz-transform:translateY(30px);-webkit-transform:translateY(30px);-ms-transform:translateY(30px);-o-transform:translateY(30px);transition-delay: .4s;} .spotzone li .txtbox .tit2 {transform:translateY(30px);-moz-transform:translateY(30px);-webkit-transform:translateY(30px);-ms-transform:translateY(30px);-o-transform:translateY(30px);transition-delay: .6s;} .spotzone li .txtbox .txt { transform:translateY(30px);-moz-transform:translateY(30px);-webkit-transform:translateY(30px);-ms-transform:translateY(30px);-o-transform:translateY(30px);transition-delay: .8s;} .spotzone li .txtbox .number{transform:translateY(30px);-moz-transform:translateY(30px);-webkit-transform:translateY(30px);-ms-transform:translateY(30px);-o-transform:translateY(30px);transition-delay:1.0s;} .spotzone li.active .txtbox .tit1 {opacity:1; transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);-ms-transform:translateY(0px);-o-transform:translateY(0px);transition-delay: .4s;} .spotzone li.active .txtbox .tit2 {opacity:1; transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);-ms-transform:translateY(0px);-o-transform:translateY(0px);transition-delay: .6s;} .spotzone li.active .txtbox .txt {opacity:1; transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);-ms-transform:translateY(0px);-o-transform:translateY(0px);transition-delay: .8s;} .spotzone li.active .txtbox .number{opacity:1; transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);-ms-transform:translateY(0px);-o-transform:translateY(0px);transition-delay:1.0s;} */ .spotzone .bx-pager{z-index:33;position:absolute; bottom:35%; left:0; width:100%; text-align:center; opacity:1;} .spotzone .bx-pager div{display:inline-block;} .spotzone .bx-pager a{opacity:1;display:inline-block; position:relative; width:45px; height:4px; margin:0 5px; color:transparent; background:rgba(255,255,255,1); } .spotzone .bx-pager a.active { background:#87d8fd; } @media screen and ( max-width:1300px ) { .main-visual { min-width:100%; } } /* //////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////// /* 메인 빠른차량검색 /////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////*/ .main .main-quickSearch{padding-top:35px;} .main-quickSearch {padding-top:0px;box-sizing: border-box; } .main-quickSearch .title_wrap {padding-bottom:0;background:url(/image/main/main_quickSearch.png) no-repeat 0 10px;} .main-quickSearch .title_wrap h3 {padding:10px 0 10px 35px;font-size:23px;text-align:left;font-weight:500;color:#fff;} .main-quickSearch .searchArea {position:relative; overflow:hidden; border:1px solid #8ac7e3; padding:5px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; display:flex;flex-direction: row; flex-wrap: nowrap; } .main-quickSearch .searchArea .selectarea {display:flex; width:calc(100% - 130px); padding-right:5px; justify-content: space-between; flex-direction: column; flex-wrap: wrap; gap:5px; } .main-quickSearch .searchArea .selectarea .line {width:100%; display:flex; flex-wrap: nowrap; flex-direction: row; gap:5px; } .main-quickSearch .searchArea .selectarea .line .col5 {width:50%; display:flex; flex-wrap: nowrap; flex-direction: row; gap:1px; } .main-quickSearch .searchArea .input_wrap {position:relative; width:50%; } .main-quickSearch .searchArea .input_wrap figure {position:absolute; right:15px; top:15px; width:33px; height:20px; background:url('/image/main/ico_keyboard.png') no-repeat center ;} .main-quickSearch .searchArea .input_wrap input{width:100%;} .main-quickSearch .searchArea input, .main-quickSearch .searchArea select {background-color:#303132; width:50%; border-radius:0;height:50px;line-height:50px;padding:0 10px;border:0 solid; background-position:calc(100% - 12px);background-size:15px 15px;color:#fff; font-weight:300;font-size:16px;letter-spacing:-1px; } .main-quickSearch .searchArea select {cursor:pointer;} .main-quickSearch .searchArea select::-ms-expand { display: none;} .main-quickSearch .searchArea select.maker {width:50%;} .main-quickSearch .searchArea select.model {width:50%;} .main-quickSearch .searchArea select.year {width:50%;} .main-quickSearch .searchArea select.etc {width:50%;} .main-quickSearch .searchArea select.maker.m10, .main-quickSearch .searchArea select.year.m10 {margin-left:10px;} .main-quickSearch .searchArea strong {display:inline-block;margin:0px 0px 0px 25px;width:50px;font-size:14px;} .main-quickSearch .searchArea strong.first {margin:0px !important;} .main-quickSearch .searchArea .btnSearch {display:inline-block; vertical-align:top; width:130px;} .main-quickSearch .searchArea .btnSearch input[type=submit] {border:none;width:100%;height:105px;line-height:105px;color:#FFF;text-align:center;font-size:19px;font-weight:500;background-color:#8ac7e3; text-shadow:2px 2px 4px rgba(0,0,0,0.08); cursor:pointer;} /*.main-quickSearch .searchArea .btnSearch input[type=submit]:hover {border:1px solid #c90010;background:#c90010;}*/ .bdr-lt0 {border-left:0 !important; } .bdr-bt0 {border-bottom:0 !important; } /* .search_carOption {position:relative;display:block; width:100%;height:200px;z-index:40;} .search_carOption .inr {width:100%;max-width:1300px;min-width:1000px;margin-top:-210px;} .search_carOption .classOption {font-size:0; padding:0 20px;background:#8ac7e3; display:flex;flex-wrap: nowrap; justify-content: space-between; } .search_carOption .classOption li {position:relative;display:inline-block;vertical-align:top; width:20%; text-align:center; } .search_carOption .classOption li:before {content:''; width:1px; height:120px; background-color:rgba(255,255,255,0.3); position:absolute; left:0; top:50%; margin-top:-60px;} .search_carOption .classOption li:first-child:before {display:none;} .search_carOption .classOption li a {display:block;height:180px;} .search_carOption .classOption li a em {position:absolute;left:0;top:0;bottom:0;right:0;background:#fff;opacity:0;z-index:0;display:block;transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s;} .search_carOption .classOption li a i {position:absolute;left:50%;top:25px;display:block;width:90px;height:90px;margin-left:-45px;border-radius:50%;background:#6ab4d6;} .search_carOption .classOption li a:hover em {opacity:1;} .search_carOption .classOption li a:hover i {background:#b9dff1;} .search_carOption .classOption li .img-wrap {position:relative;display:block;height:115px;overflow:hidden;background-position:center center;background-size:contain;background-repeat:no-repeat;} .search_carOption .classOption li a h2 {position:relative;display:block; font-size:17px;line-height:36px;color:#222;margin-top:0.5rem; font-weight:400;letter-spacing:-1px;z-index:1;font-family:'SB-ugr';} .search_carOption .classOption li a:hover h2 {color:#65bbe2; } .search_carOption .classOption li a.on i {background:#b9dff1;} .search_carOption .classOption li a.on h2 {color:#65bbe2; } */ .search_carOption {position:relative;display:block; width:100%;height:auto;z-index:40;} .search_carOption .inr {width:100%;max-width:1300px;min-width:1000px;margin-top:-257px;} .search_carOption .classOption {font-size:0; padding:0px 20px;background:#8ac7e3; display:flex;flex-wrap: wrap; justify-content: space-between; } .search_carOption .classOption li {position:relative;display:inline-block;vertical-align:top; width:16.6%; text-align:center; } .search_carOption .classOption li:before {content:''; width:1px; height:120px; background-color:rgba(255,255,255,0.3); position:absolute; left:0; top:50%; margin-top:-60px; display:none;} .search_carOption .classOption li:first-child:before {display:none;} .search_carOption .classOption li:nth-child(7):before {display:none;} .search_carOption .classOption li a {display:block;height:auto; padding:5px 0 5px; position:relative;} .search_carOption .classOption li a em {position:absolute;left:0;top:0;bottom:0;right:0;background:#fff;opacity:0;z-index:0;display:block;transition:all 0.3s ease 0s; -webkit-transition:all 0.3s ease 0s;} .search_carOption .classOption li a i {position:absolute;left:50%;top:50%;display:block;width:70px;height:70px;margin-top:-42px; margin-left:-40px;border-radius:50%;background:#6ab4d6; display:none;} .search_carOption .classOption li a:hover em {opacity:1;} .search_carOption .classOption li a:hover i {background:#b9dff1;} .search_carOption .classOption li .img-wrap {position:relative;display:block;overflow:hidden; height:100px; background-position:center -7px;background-size:auto 100%;background-repeat:no-repeat;} .search_carOption .classOption li a h2 {position:relative;display:block; font-size:16px;line-height:24px;color:#222;margin-top:-0.8rem; font-weight:400;letter-spacing:-1px;z-index:1;font-family:'SB-ugr';} .search_carOption .classOption li a:hover h2 {color:#65bbe2; } .search_carOption .classOption li a.on i {background:#b9dff1;} .search_carOption .classOption li a.on h2 {color:#65bbe2; } .search_carOption .classOption li:nth-child(1) a, .search_carOption .classOption li:nth-child(2) a, .search_carOption .classOption li:nth-child(3) a, .search_carOption .classOption li:nth-child(4) a, .search_carOption .classOption li:nth-child(5) a, .search_carOption .classOption li:nth-child(6) a {padding-top:10px !important;} .search_carOption .classOption li:nth-child(7) a, .search_carOption .classOption li:nth-child(8) a, .search_carOption .classOption li:nth-child(9) a, .search_carOption .classOption li:nth-child(10) a, .search_carOption .classOption li:nth-child(11) a, .search_carOption .classOption li:nth-child(12) a {padding-bottom:15px} .search_carOption .classOption li a.on {background-color:#fff;} .page_sub .search_carOption {margin-top:30px; margin-bottom:20px; height:auto} .page_sub .inr {max-width:970px;min-width:970px;margin-top:0px;} .page_sub .classOption { padding:0 0px;} .page_sub .search_carOption .classOption li:before { height:100px; margin-top:-50px;} .page_sub .search_carOption .classOption li a {height:auto;} .page_sub .search_carOption .classOption li a i {top:25px; width:70px;height:70px;margin-left:-35px;} .page_sub .search_carOption .classOption li a h2 {font-size:15px; } .page_sub .search_carOption .classOption li .img-wrap {height:90px;} .page_sub .search_carOption .classOption li:nth-child(1) a, .page_sub .search_carOption .classOption li:nth-child(2) a, .page_sub .search_carOption .classOption li:nth-child(3) a, .page_sub .search_carOption .classOption li:nth-child(4) a, .page_sub .search_carOption .classOption li:nth-child(5) a, .page_sub .search_carOption .classOption li:nth-child(6) a {padding-top:10px !important;} .page_sub .search_carOption .classOption li:nth-child(7) a, .page_sub .search_carOption .classOption li:nth-child(8) a, .page_sub .search_carOption .classOption li:nth-child(9) a, .page_sub .search_carOption .classOption li:nth-child(10) a, .page_sub .search_carOption .classOption li:nth-child(11) a, .page_sub .search_carOption .classOption li:nth-child(12) a {padding-bottom:15px} /* 추천차량 */ .recomWrap {position:relative;margin:30px 0 0;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} /* 신규차량 */ .bg_newcar {display:block; clear:both;min-width:1000px;padding:40px 0; } .main_specialCar {padding:40px 0;background:url(/image/main/etc_bg.jpg) no-repeat center center #313231;background-size:cover;} .main_specialCar .main_carlist li .subject {color:#fff;} .main_specialCar .main_carlist li .carInfo strong, .main_specialCar .main_carlist li .carInfo {color:#aaa;} .bannerConsult {overflow:hidden;margin:0px 0px 10px 0px;} .bannerConsult li {display:block;} .bannerConsult li a {display:block;width:160px;} .bannerConsult li a span {visibility:hidden;} .bannerConsult li.b1 a {height:110px;background:url(/image/main/banner_consult.gif) left top no-repeat;} .bannerConsult li.b2 a {height:110px;background:url(/image/main/banner_consult.gif) left -110px no-repeat;} .bannerConsult li.b3 a {height:110px;background:url(/image/main/banner_consult.gif) left -220px no-repeat;} .bannerConsult li.b4 a {height:90px;background:url(/image/main/banner_consult.gif) left -330px no-repeat;} .bannerConsult li.b1 a:hover {background:url(/image/main/banner_consult.gif) -160px top no-repeat;} .bannerConsult li.b2 a:hover {background:url(/image/main/banner_consult.gif) -160px -110px no-repeat;} .bannerConsult li.b4 a:hover {background:url(/image/main/banner_consult.gif) -160px -330px no-repeat;} .mainBanner {width:100%; height:250px; background:url(/image/main/direct_bg.png) center top no-repeat; margin:0 auto;} .mainBanner_Wrap {width:960px; margin:0 auto;} .mainBanner_Wrap li{float:left; width:188px; height:188px; margin:31px 5px 31px 0; padding:12px; background:#fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;} .mainBanner_Wrap li:last-child {margin-right:0;} .mainBanner_Wrap .title {font-size:25px; font-weight:bold; letter-spacing:-2px; color:#ff6600;} .mainBanner_Wrap .title span {font-size:14px; height:30px; display:block; font-weight:100;} .mainBanner_Wrap .text {font-size:18px; margin-top:5px; letter-spacing:-1px; line-height:1.2; height:50px;font-weight:500;} .mainBanner_Wrap li button {background:#4c88ee; border:0; width:100%; line-height:40px; color:#fff; letter-spacing:-1px; cursor:pointer; margin-top: 3px;} .mainBanner_Wrap .text.blue {background:#ff6600; color:#fff; font-size:20px; font-weight:bold; height: 42px;line-height: 42px; border-radius: 25px;text-align: center;margin-top: 3px;} .slider {position: relative;max-width: 970px; margin: 5px auto 30px;padding:0px 0px 0;} .slider .inner {overflow: hidden; } .slider .swiper-slide { display:flex;flex-wrap:wrap; justify-content: flex-start; align-items: flex-start; gap:4px; } .slider div.list { width:calc(20% - 3.5px);font-size: 20px; text-align: center; border:0px solid #f00 } .slider div.list:nth-child(5), .slider div.list:nth-child(10), .slider div.list:nth-child(15), .slider div.list:nth-child(20) {margin-right:0} .slider .swiper-prev, .slider .swiper-next {position: absolute;top:-33px;transform: translate(0,-50%);width: 35px;height: 35px;text-align:center; cursor: pointer;font-size: 0; border-radius:50%; border:1px solid rgba(255,255,255,0.1);} .slider .swiper-next:before {content:"\e93e"; display:inline-block; line-height:35px; color:#fff; font-size:1rem;} .slider .swiper-prev:before {content:"\e93b"; display:inline-block; line-height:35px; color:#fff; font-size:1rem;} .slider .swiper-prev {right:90px; } .slider .swiper-next {right:45px;} .slider div.list img {width:100%;} .slider div.list a {display:block; } .slider div.list .img-wrap {display:block;height:160px;overflow:hidden; background-size:cover; background-position:center center; background-repeat:no-repeat; } .slider div.list .info-wrap {display:block; padding:0 5px 25px; text-align:left; } .slider div.list .subject {margin:10px 0 5px 0;font-size:17px; font-weight:600; color:#fff; } .slider div.list .carInfo {color:rgba(255,255,255,0.6);font-size:13px; line-height:16px;} .slider div.list .carInfo span {display:none;} .slider div.list .carInfo strong {display:inline-block; vertical-align:middle; color:rgba(255,255,255,0.7);font-weight:normal !important;margin-right:9px;} .slider div.list .payment {margin:5px 0 0; font-size:20px;color:#f2be5c;font-weight:600;letter-spacing:-.5px;} .slider div.list .payment b {font-size:24px;font-family:'Century Gothic';font-weight:bold;letter-spacing:0;} .slider div.list .payment span {font-size:85%;font-family:'NotoSans';} .slider div.list div.item.sold:after {content:'';position:absolute;left:0;right:0;top:0;width:100%;height:140px;background:url(/image/icon_sold.png) no-repeat center center;background-size:auto 90px;opacity:.8;} .slider .swiper-pagination {display:flex; width:100%; justify-content: center; height:25px;} .slider .swiper-pagination-bullet { width: 13px; height: 13px; text-align: center; line-height: 13px; font-size: 0px; color: #000; opacity: 1; margin:0 3px; background-color: rgba(0, 0, 0, 0.2); border:1px solid rgba(255,255,255,0.1); } .slider .swiper-pagination-bullet-active { color: #fff; background: #8ac7e4; border:1px solid #8ac7e4; }