@charset "utf-8";
@import url('../font/nanumbarungothic/nanumbarungothic.css');
@import url(https://fonts.googleapis.com/css?family=Exo+2:400,500);

body { font:1em 'Exo 2','나눔바른고딕','nanum barun gothic','나눔고딕','nanum gothic',sans-serif; color:#353535; background:#d7dde3}

.allWrap { width:1200px; }

.page-header-wrap
{ position:relative;width:200px;height:100%; float:left; color:#fff;
background:#d7dde3;box-sizing:border-box; z-index:999;
/*border-right:1px solid #053363*/}

.page-header { background:#002042 url('../images/header_bg.png') no-repeat top center;   }
.page-header h1 { text-align:center; padding:36px 0 36px;}

.page-header .nav > li {padding-left:30px; border-bottom:1px solid #053363; height:50px; position:relative; }

.page-header .nav > li:first-child { border-top:1px solid #053363; }
.page-header .nav > li > a{ display:block; line-height:50px; background:url('../images/header_nav_bullet.png') no-repeat -20px center; transition:all .5s; }
.page-header .nav > li a:hover {color:#1da4e4; background-position:0 center;padding-left:22px; }

.member_login { padding:10px 0 10px 22px;}
.member_login button { border-radius:3px; width:75px; font-size:14px; padding:5px 0;}
.member_login button:hover { opacity:.8; }
.member_login .submit { background:#004b85;margin-right:7px }
.member_login .join { background:#30bbb9 }
.member_login p { color:#30bbb9;font-weight:bold;line-height:1.3;padding-top:5px;}

.page-header-wrap .headerBlank { height:727px; background:#d7dde3; }
.page-header-wrap .copyright {}
.page-header-wrap .menu { background:#a3aeba; padding:10px 0 10px 22px; 
font-size:12px; color:#516a83; }
.page-header-wrap .menu a:hover { color:#0080c0 }

.page-header-wrap footer { color:#74879a; padding:20px 0 20px 22px; font-size:12px; line-height:1.2; }
.page-header-wrap footer p b {color:#276aae; font-weight:bold; }
.page-header-wrap footer small {display:block;padding-top:10px;text-transform:uppercase; line-height:1;
font-size:9px;}




/* main_subMenu */
.subBack { position:absolute; width:200px; left:0; top:0; height:100%; 
background:#004b85; background:rgba(0,75,133, .85) ; z-index:900;}
.page-header .subMenu {position:absolute;left:190px; top:0px; width:100%;
padding:10px 0 0;display:none; }

.page-header .nav .subMenu li { padding-left:20px; }
.page-header .nav .subMenu li a {display:block; line-height:30px; background:none; transition:all .2s; }
.page-header .nav .subMenu > li:hover > a {padding-left:5px }
.page-header .nav .subMenu > li:hover > a:before { content:'→'; padding-right:5px; }

.page-header .nav .subMenu .lastMenu li a { color:#21799e; }
.page-header .nav .subMenu .lastMenu li a:hover { color:#1894ef; }
.page-header .nav .subMenu .lastMenu li:hover a { padding-left:5px; }
.page-header .nav .subMenu .lastMenu li:hover a:before { content:'·';padding-right:5px }

/* header 즐겨찾기 */
.favorite { background:#004b85;  height:76px }
.favorite a { display:block; width:100%; position:relative; height:100%; overflow:hidden;}
.favorite img { position:absolute; left:30px; top:20px; transition:all .5s }
.favorite p { position:absolute; left:70px; top:20px;color:#fff; font-size:0.8em;
 transition:all .5s}

.favorite a .star1 {  }
.favorite a .star2 { width:10%; top:80px; left:20px}
.favorite a .star3 { width:5%; top:80px; left:10px }

.favorite a:hover .star1 { left:25px; top:15px; }
.favorite a:hover .star2 { left:50px; top:25px }
.favorite a:hover .star3 { left:60px; top:45px }
.favorite a:hover p { left:75px;color:#74d8d8}

/* 앱다운로드 */
.appdownload {background:#60758a; text-align:center; }
.appdownload h2 { color:#fff; font-size:1.2em; padding:20px  10px; }
.appdownload h2 strong { color:#ffcf63; }
.appdownload p { color:#8cb9e5; font-size:0.8em; text-align:center; margin-bottom:24px;}
.appdownload .img2 { margin:10px 0; transition:all .3s; box-sizing:border-box}
.appdownload .img3 { margin-bottom:10px;transition:all .3s; box-sizing:border-box}
.appdownload .img2:hover { opacity:0.6; outline:1px solid #fff;  }
.appdownload .img3:hover { opacity:0.6; outline:1px solid #fff;  }

/* index-main */
.page-main-wrap { padding:10px; width:900px; float:left;
height:100%;background:#e8e8e8;}

/* main_slideImage */
.page-main-wrap .visual.gallery { overflow: hidden;  position: relative; margin: 0 auto 10px; width: 900px; height: 375px; }
.page-main-wrap .visual.gallery ul li { position: absolute; left: 100%; width: 900px; height: 375px; }
.page-main-wrap .visual.gallery ul li:first-child { left: 0;}
.page-main-wrap .visual.gallery .gicon { position: absolute; bottom: 10px; left: 45%; }
.page-main-wrap .gallery .prev, 
.page-main-wrap .gallery .next { position: absolute; top: 40%; display: block; width: 70px; height: 74px; background:url(../images/btns_nav.png) no-repeat 0 0; text-indent: -9999px; font-size: 0; line-height: 0; cursor: pointer; }
.page-main-wrap .gallery .prev { background-position: 0 0;  left: 20px; }
.page-main-wrap .gallery .next { background-position: -82px 0; right: 20px;  }



.page-main-wrap .innerWrap { margin-bottom:10px; }
.page-main-wrap .brand { background:#fff; border:1px solid #b9b9b9; padding-bottom:12px;  }
.page-main-wrap .brand h2 { background:#004b85; color:#fff; font-size:26px; padding:10px 0 10px 25px}
.page-main-wrap .brand .en { margin-left:10px;color:#0f91f5; font-size:14px; }
.page-main-wrap .brand ul { margin:20px 0; }
.page-main-wrap .brand li { float:left; width:10.7%; border-right:1px solid #d1dce3; 
text-align:center; }
.page-main-wrap .brand li.row { margin-top:30px }
.page-main-wrap .brand li img { transition:all .5s; }
.page-main-wrap .brand li img:hover { opacity:.5 }

.page-main-wrap .right {float:right; width:485px; }
.page-main-wrap .more { position:absolute;right:10px; top:7px; }

.page-main-wrap .storeinfo { font-weight:bolder;background:#fff; border:1px solid #b9b9b9; padding-bottom:12px;  }
.page-main-wrap .storeinfo h2 { background:#004b85; color:#fff; font-size:26px; padding:10px 0 10px 25px;}
.page-main-wrap .storeinfo h2 .and { font-family:tahoma, sans-serif; font-size:18px}
.page-main-wrap .storeinfo .en { margin-left:10px;color:#0f91f5; font-size:14px; }

/* 신규차량 */
.page-main-wrap .new { background:#fff;border:1px solid #b9b9b9; position:relative; padding-bottom:10px}
.page-main-wrap .new ol {  }
.page-main-wrap .right li { float:left; width:30%; margin-left:2%; }
.page-main-wrap .right li:hover { opacity:.8 }
.page-main-wrap .right li:first-child(1),
.page-main-wrap .right li:first-child(4){margin-left:0 }
.page-main-wrap .right li strong{display:block; margin-bottom:2px; }
.page-main-wrap .right li span { font-size:14px; display:block;margin-top:-5px}
.page-main-wrap .new h2 {background:url('../images/main_h202.png') no-repeat;
padding-top:90px; }

.page-main-wrap .popular { background:#fff;border:1px solid #b9b9b9; margin-top:10px; position:relative; padding-bottom:10px}
.page-main-wrap .popular h2 {background:url('../images/main_h203.png') no-repeat;
padding-top:90px; }


/* 매매상사소개 */
.page-main-wrap .store  { background:#fff url('../images/main_h204.png') no-repeat; padding:10px 10px 0 210px; height:233px;  border:1px solid #b9b9b9; overflow:hidden;}
.page-main-wrap .store li { float:left; width:22%; margin:0 10px}

.page-main-wrap .store li:last-child { margin-right:0; }
.page-main-wrap .store h3 { font-weight:bold; }
.page-main-wrap .store h3 img { width:30px; margin-right:8px; vertical-align:middle }
.page-main-wrap .store a img { margin:15px 0 10px; }
.page-main-wrap .store a:hover { opacity:.8 }
.page-main-wrap .store p {font-size:12px; }

/* 메인배너 1 */
.banner01 { margin:10px 0 0;padding-bottom:10px; }
.banner01 article { float:left; margin-left:7px; border:1px solid #b9b9b9; position:relative; height:114px;}
.banner01 .list01 { width:380px; background:url(../images/main_banner_1a.png) no-repeat;margin-left:0; }
.banner01 .innerBox { display:block; position:absolute; width:100%;height:100%;
background:rgba(0,0,0, .85); left:0;top:0; color:#60d2d2; font-size:16px;opacity:0;transition:all .2s; overflow:hidden;}
.banner01 article:hover .innerBox { opacity:1 }
.banner01 .innerBox strong { position:absolute; top:-50px;display:block;text-align:center;  background:#2d9f9f; color:#fff; padding:2px; border-radius:3px; width:100px; left:50%; margin-left:-50px}
.banner01 .innerBox p { position:absolute; bottom:-50px; text-align:center; width:100%; }

.banner01 article:hover .innerBox strong { top:30px; transition:all .4s }
.banner01 article:hover .innerBox p { bottom:30px; transition:all .4s .2s;}

.banner01 .list02 { width:250px; background:url(../images/main_banner_1b.png) no-repeat }

.banner01 .list03 { width:250px; background:url(../images/main_banner_1c.png) no-repeat }

/* 상사소개 &보유차량 검색 */
.storeinfo h3 { border-left:4px solid #004b85; padding-left:10px; margin-left:10px;
font-size:18px; margin-top:18px; margin-bottom:12px}
.storeinfo ul { padding-left:10px }
.storeinfo li { float:left; width:138px;margin-left:10px }
.storeinfo li:first-child { margin-left:0 }
.storeinfo li img.mcar { width:138px; border:1px solid #b6c2c9; transition:all .5s; }
.storeinfo li a img.logo {border:none; }
.storeinfo li a  img.logo:hover { opacity:1 }
.storeinfo li.first { margin-left:0 }
.storeinfo li a img:hover { opacity:0.7 }
.storeinfo .line {border-bottom:1px solid #d1dce3; padding:20px 0; margin:0 10px}

/* banner-wrap */
.banner {margin:10px 0; }
.banner article { background:#fff;float:left; width:291px; border:1px solid #b9b9b9; margin-left:10px; text-align:center; height:208px;position:relative; padding:36px 0 0; color:#4b4b4b; font-weight:bolder;}
.banner article:first-child { width:292px; background:#fff url(../images/banner_phone.png) no-repeat 20px 25px; }
.banner .custom span,
.banner .custom h2 { padding-left:30px }
.banner article span { font-size:14px; letter-spacing:-.3px}
.banner article h2 { font-size:28px; }
.banner article p.img { height:90px; text-align:center; margin-top:10px;}
.banner article:first-child { margin-left:0; }
.banner p.title {text-align:center; font-size:12px}
.banner article p.info {font-size:12px; color:#a94646 ; text-align:center;}
.banner article p.time {font-size:18px; font-weight:bold;}
.banner article p.tel {color:#1276b5; font-size:50px; margin-top:10px;text-align:center; 
margin-bottom:20px;}

.banner article a.innerBox { display:block; position:absolute; width:100%; height:100%; background:rgba(0,0,0, .85); left:0;top:0; color:#60d2d2; font-size:16px;opacity:0;transition:all .2s; overflow:hidden;}
.banner article:hover a.innerBox { opacity:1;  }
.banner article .innerBox strong { position:absolute; top:-50px;display:block;text-align:center;  background:#2d9f9f; color:#fff; padding:2px; border-radius:3px; width:100px; left:50%; margin-left:-50px}
.banner article .innerBox p { position:absolute; bottom:-50px; text-align:center; width:100%; }

.banner article:hover .innerBox strong { top:70px; transition:all .4s }
.banner article:hover .innerBox p { bottom:100px; transition:all .4s .2s;}

.community {}
.community article { float:left; width:49%; margin-left:1%; }
.community article:first-child {margin-left:0px; width: 49.6%;}

.community .container { background:#fff; border:1px solid #b9b9b9 }
.community  h3 { background:#2c2c2c; color:#e8e8e8;height:42px; line-height:42px; text-align:center;}
.community a:hover { color:#30bbb9 }


.community .download .container { position:relative; height:186px; width:100%; background:#d2dde2}
.community .download .container a:hover {opacity:.8; }
.community .download .container .luncher { position:absolute;left:60px; top:30px;}
.community .download .container span.btns { position:absolute;right:60px; top:30px; display:block; width:183px; }

.community .board .container { position:relative; height:228px}
.community .board .title > li { float:left; width:127px;  border-bottom:1px solid #e6e6e6; }
.community .board .title h3 { background:#2c2c2c url('../images/main_comm_04.png') no-repeat left center;}
.community .board .title > li:first-child  h3{ background-image:none; }
.community .board .title > li.second {width:146px; }
.community .board .title > li.last {width:168px; }
.community .board .title > li h3.on { color:#30bbb9}



.community .board .container .content {position:absolute; left:0; top:40px; width:100%; display:none;}
.community .board .container .content a { padding-left:10px;display:inline-block; line-height:48px;width:80%; }
.community .board .container .content .date { display:inline-block; line-height:48px;width:15%; }

/* index-aside */
.page-aside-wrap { background:#c5ccd3; float:right; width:80px; border:1px solid #acbbc4; border-width:0 1px;box-sizing:border-box;}
.page-aside-wrap aside { width:80px;  }
.page-aside-wrap h2 { height:70px; line-height:70px; text-align:center; color:#004b85}
.floorNav > li { height:50px; text-align:center; border-bottom:1px solid #acbbc4; position:relative;}
.floorNav > li:first-child { border-top:1px solid #acbbc4; }
.floorNav > li > a {font-size:14px; display:block; line-height:50px; color:#3d464f; transition:all .5s; }
.floorNav > li > a.color { color:#6589ad; }
.floorNav > li > a:hover { background:#004b85; color:#fff }


.floorNav .sub { z-index:999;display:none; width:150px; padding:10px; border-radius:8px 0 0 8px; background:#004b85; background:rgba(0,75,133, .85) ;position:absolute; top:0; left:-160px; border:1px solid #acbbc4; box-shadow:3px 3px 3px rgba(0,0,0, .3)}
.floorNav .sub li { height:40px;}
.floorNav .sub li a {  color:#fff;display:block;line-height:40px; transition:all .5s; }


.floorNav .sub li a:hover { background:#0aa9a7; border-radius:5px; color:#fff}





/* sub - 카서울 소개 */
.subWrap h2 { border-bottom:1px solid #c9c9c9; padding-bottom:8px;
margin-bottom:20px;}
.subWrap h2 .en {font-size:33px; color:#3c3c3c; }
.subWrap h2 .ko {font-size:18px; color:#1da4e4; padding-left:20px;}
.subWrap .photo {text-align:center; }
.subWrap b { color:#1da4e4; }


.subInner { background:#fff; border:1px solid #b9b9b9; padding:10px; }
.subInner .custom { color:#0080c0; font-size:1.5rem;  text-align:center; font-weight:bold;}
.subInner h3 { background:#1da4e4 url('../images/h3_bullet.png') no-repeat 10px center; padding:10px 10px 10px 30px; border-radius:5px; color:#fff;margin:20px 0 10px }
.subInner p.q {text-align:center; padding:30px 0;}
.subInner p q { font-size:1.2em; }
.subInner h3 + p { margin-bottom:30px; }


.subInner .tbox {width:100%; margin-bottom:10px }
.subInner .tbox th {border:1px solid #b9b9b9; padding:10px; width:20%;}
.subInner .tbox td {border:1px solid #b9b9b9; padding:10px; width:80%; }

.subInner .map iframe { width:100%; height:350px; }
.subInner .visitus p { padding:0 }
.subInner .visitus p.phone {  font-size:1.5rem; color:#bd0000; padding:3% 0;}
.subInner .visitus .bus1 { background:#3b62ab; color:#fff; }
.subInner .visitus .bus2 { background:#4c992e; color:#fff; }
.subInner .visitus .bus3 { background:#cd0f12; color:#fff; }

.subInner .visitus .bus4 { background:#6fbbeb; color:#fff; }
.subInner .visitus .bus  p{ line-height:2; }

.subInner p.img { text-align:center; }
.subInner p.img img {width:70%; }

.subInner input[type=radio] { vertical-align:middle }

.subInner h3 span { color:#000; padding-left:10px; font-size:12px;}
.subInner .line { padding:10px; border-top:1px solid #ddd; }
.subInner .line.submit {text-align:center; }
.subInner .line button { width:200px;background:#b60e0a; padding:10px ; color:#fff; font-size:16px; border-radius:8px; transition:all .5s;}
.subInner .line button:hover {opacity:.8}
.subInner .carSearch input[type=text],
.subInner .carSearch select { border:1px solid #ddd; padding:5px; margin-left:10px;}
.subInner .carSearch input:focus { background:#eee; }
.subInner .carSearch label.title { color:#157cae; background:#eee;padding:10px;display:inline-block; width:130px; text-align:center; }


.subInner .result { text-align:center; padding:10px 0; }
.subInner .result .num { color:#c60000; }
.subInner .result .list { color:#0080c0; }
.tbox.resultList th,.tbox.resultList td { padding:10px; width:auto}
.tbox.resultList .btns a {display:block; padding:5px; transition:all .5s;border-radius:5px; width:80%; margin:0 auto; text-align:center; color:#fff}
.tbox.resultList .btns a:hover { opacity:.8;  }
.tbox.resultList .btns a.btnCar1 { background:#004080; margin-bottom:10px}
.tbox.resultList .btns a.btnCar2 { background:#5ca23c;  }
.tbox.resultList .ccimg img { width:80%; }
.tbox.resultList td li:not(:first-child) { list-style:disc inside; }
.tbox.resultList td li.title { color:#0080c0; font-size:1.1em; }
.tbox.resultList td li.title_b { height:30px; color:#0080c0; font-size:1.1em; }

.tbox.resultList tr:hover { background:#eee; }
.tbox.resultList tr.firstLine:hover { background:none; }
.tbox.resultList td img { width:151px; }



/* 차량상세정보 */
.subInner .galleryWrap { position:relative; z-index:800;}
.subInner .galleryWrap .photo img { width:658px; }
.subInner .galleryWrap .thum {  }
.subInner .galleryWrap .thum img { width:100%; cursor:pointer }



.subInner .detailInfo .tbox caption { font-size:1.4em; padding:10px; margin:10px 0; background:#eee; }

/* 매매상사 */
.subInner .tbox td a { text-align:center; color:#0080ff; transition:all .3s;}
.subInner .tbox.storeList td a:hover { color:#ff8080; }
.subInner .tbox.storeList td img { width:50%; }


.subInner .galleryWrap .thum.cctv img {width:100%; padding:1%;}
.subInner .galleryWrap .photo p.title { position:absolute; width:28%; left:17%;margin-left:-14%; background:#28cac8; padding:1%; top:3%; color:#fff; border-radius:5px; text-align:center;font-size:1.0rem}
.subInner .galleryWrap .photo p.cf { text-align:left; color:#cd0f12; padding:0.8%;font-size:1.0rem}
.subInner .layout { border:4px solid #b8c0c8; margin-top:20px }


.subInner .layout.floor a { background:#5a8abc; font-size:1.4em; padding:10px 0;text-align:center; color:#fff; display:block; color:#fff;}

.subInner .zone1 { width:30.83% ;float:left; padding:2%}
.subInner .zone1 img { width:100% ; margin:2% 0 0}
.subInner .zone2 { width:26%; float:left; padding:2%;}
.subInner .zone2 img { width:100%;}
.subInner .zone3 { width:30.83% ;float:right; padding:2% }
.subInner .zone3 img { width:100%;margin:2% 0 0;}

.subInner .zoneOne { padding:2%; }
.subInner .zoneOne img { width:100%; } /* 1층전시장만 있는경우 */








/* 내차팔기 */
.page-main-wrap .nav5 .mycar { padding-bottom:200px }
.page-main-wrap .nav5 .mycar strong { color:#c24646; display:block; padding:5px 0 5px 10px; font-weight:bold; }
.page-main-wrap .nav5 .mycar .tbox {  margin:0 auto; color:#6d6d6d; font-size:1.2em }

.page-main-wrap .nav5 .mycar .required { background:#eee; }
.page-main-wrap .nav5 .mycar .tbox th {text-align:left; font-weight:bold; padding:1.5%; width:30%; border:none;}
.page-main-wrap .nav5 .mycar .tbox td { padding:10px; border:none;}
.page-main-wrap .nav5 .mycar .tbox input { padding:10px; width:90%;
border:1px solid #bbb;}
.page-main-wrap .nav5 .mycar .required th { color:#c24646; }


.page-main-wrap .nav5 .mycar .btnWrap { text-align:center; border-top:1px solid #7f7f7f; padding-top:10%; width:96%; margin:0 auto;}
.page-main-wrap .nav5 .mycar button { border-radius:5px; padding:10px; color:#fff; font-size:1.2rem; transition:all .5s}

.page-main-wrap .nav5 .mycar button:hover { opacity:0.75 }
.page-main-wrap .nav5 .mycar .cancle {background:#8c9094; width:200px; }
.page-main-wrap .nav5 .mycar .submit { background:#a32929; width:300px; margin-left:3%;}


/* 차량게시판 하단 bbsIndicator */
.bbsIndicator { margin:-20px 0 20px; width:100%; text-align:center}
.bbsIndicator a { padding:0 5px;  }
.bbsIndicator a:hover { color:#0080c0; }
.bbsIndicator button { border-radius:3px; transition:all .5s;}
.bbsIndicator button:hover { opacity:0.8 }
.bbsIndicator .prev { background:#0080c0; color:#fff; padding:5px; margin-right:20px}
.bbsIndicator .next { background:#0080c0; color:#fff; padding:5px; margin-left:20px}

