echajoa/m/css/common.css

@charset "utf-8";

/* ///// font ///// */
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+KR:300,400,500,700');

/* ///// reset ///// */
*{-webkit-box-sizing: border-box;-moz-box-sizing: border-box;box-sizing:border-box;}
html,body{width:100%;/*height:100%;*/-webkit-touch-callout:none;-webkit-user-select:none;-webkit-tap-highlight-color:rgba(0, 0, 0, 0);}
html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video, strong {margin:0;padding:0;border:0;font:inherit;vertical-align:baseline;}
body, textarea, input, select {font:12px/1 'Noto Sans KR', sans-serif;color:#636363;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display: block;}
ol,ul{list-style: none;}
img, label, input, select, a {vertical-align:middle;}
input,textarea,select{border:none;background:none;border-radius:0;-webkit-appearance:none;}
textarea{resize:none;}
select{padding:0 35px 0 10px;height:33px;border:1px solid #dadbde;background:#fff url('/m/img/btn_select.gif') right 50% no-repeat;background-size:28px;-webkit-appearance:none;}
input,textarea,button {outline-style:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after, q:before, q:after {content:''; content: none;}
table {width:100%;border-collapse:collapse;border-spacing:0;}
a{outline:none;select-dummy:expression(this.hideFocus=true);color:inherit;line-height:inherit;text-decoration:none;}
a:hover,a:active{text-decoration:none;}
.hidden {text-indent:-5000px;width:0;height:0;font-size:0;line-height:0;}
strong{font-weight:700;}
img{width:100%;}

input[type=checkbox]{margin-right:8px;width:20px;height:20px;background:url('/m/img/ic_checkbox.png') no-repeat;}
input[type=checkbox]:checked{background-position:0 bottom;}
input[type=radio]{margin:0 6px 0 0;width:16px;height:16px;background:url('/m/img/ic_radio.png') no-repeat;background-size:16px;}
input[type=radio]:checked{background-position:0 bottom;}

.dim{position:fixed;width:100%;height:100%;top:0;left:0;z-index:300;background:#000;opacity:.5;}
.dim_off{pointer-events:none;opacity:.5;}

/* ///// common ///// */
.inner{position:relative;margin:0 auto;width:1200px;}
.inner:after{content:'';display:block;clear:both;}

input[type=submit]{cursor:pointer;}
input.inp_txt{padding:0 10px;height:33px;background:#fff;border:1px solid #dadbde;line-height:31px;}

input::-moz-placeholder,
textarea::-moz-placeholder{color:#adadad;}
input:-ms-input-placeholder,
textarea:-ms-input-placeholder{color:#adadad;}
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder{color:#adadad;}

textarea{padding:5px 10px;width:100%;height:235px;border:1px solid #dadbde;background:#fff;line-height:18px;}

.check_wrap{display:inline-block;position:relative;}
.check_wrap input{position:absolute;top:0;left:0;z-index:5;opacity:0;}
.check_wrap input[type=checkbox]{width:12px;height:12px;margin:0;}
.check_wrap input[type=radio]{top:2px;width:9px;height:9px;margin:0;}
.check_wrap i{overflow:hidden;display:block;position:absolute;left:0;text-indent:-9999px;}
.check_wrap input[type=checkbox] + i{top:0;width:12px;height:12px;background:url('/m/img/ic_checkbox.png') no-repeat;background-size:12px;}
.check_wrap input[type=radio] + i{top:2px;width:9px;height:9px;background:url('/m/img/ic_radio.png') no-repeat;background-size:9px;}
_:-ms-input-placeholder, :root .check_wrap input[type=radio] + i {top:4px;}
.check_wrap input:checked + i{background-position:0 bottom;}
.check_wrap label{display:inline-block;padding-left:15px;vertical-align:top;/*line-height:25px;*/}
.check_wrap input[type=radio] + i + label{margin-right:20px;padding-left:15px !important;line-height:12px;vertical-align:middle !important;}

.agree_chk{text-align:right;}

.f_wrap:after{content:'';display:block;clear:both;}
.fl{float:left;}
.fr{float:right;}

.ac{text-align:center;}
.al{text-align:left !important;}
.ar{text-align:right !important;}

/* font style */
.txt_red{color:#be0606;}
.txt_blue{color:#2c87c1;}
.txt_bold{font-weight:700;color:#000;}

a.link{display:inline-block;padding-bottom:3px;border-bottom:1px solid #464646;color:#464646;}

/* button */
.btn_center{text-align:center;}
.btn_right{margin-top:40px;text-align:right;}
.btn_right a{margin-left:2px;}

.rnd_btn{display:inline-block;width:135px;height:35px;line-height:33px;border-radius:3px;font-size:13px;color:#fff;text-align:center;}
.rnd_btn.gray{background:#505560;}
.rnd_btn.black{background:#000;}
.rnd_btn.ty2{width:75px;}
.rnd_btn.ty3{height:30px;line-height:27px;}
.rnd_btn.ty4{padding:0 10px;width:auto;height:23px;line-height:21px;font-size:12px;}

.rnd_s_btn{display:inline-block;padding:0 17px;height:26px;border:1px solid #e3e3e3;background:#efefef;border-radius:3px;box-shadow:1px 1px 1px #ececec;line-height:23px;font-size:12px;text-align:center;}

/* tab menu */
.tab_menu{overflow:hidden;margin-top:55px;background:#efefef;}
.tab_menu li{float:left;width:20%;}
.tab_menu.tab6 li{width:17%;}
.tab_menu.tab6 li:first-child{width:15%;}
.tab_menu li a{display:block;margin-left:-1px;height:40px;border:1px solid #e3e3e3;border-radius:3px 3px 0 0;font-size:15px;line-height:38px;color:#464646;text-align:center;}
.tab_menu li a.on{position:relative;z-index:10;background:#202328;border:1px solid #202328;color:#fff;}
.tab_menu li:first-child a{margin:0;}
.dealer_info + .tab_menu{margin-top:40px;}


/* ///// layout /////*/
.fixed{overflow:visible !important;position:fixed !important;height:100% !important;width:100% !important;}

header{position:fixed;top:0;left:0;z-index:50;width:100%;background:#fff;}
#header{padding-top:7px;height:37px;}
#header h1 a{overflow:hidden;display:block;margin:0 auto;width:67px;height:22px;background:url('/m/img/logo.png') no-repeat;background-size:100%;text-indent:-9999px;}
#menu{overflow:hidden;display:block;position:absolute;top:0;right:9px;width:37px;height:37px;background:url('/m/img/btn_menu.png') center no-repeat;background-size:15px;text-indent:-9999px;}
nav{display:none;position:absolute;top:0;right:0;z-index:800;padding:53px 20px 0;width:298px;/*height:100%;*/height:500px;font-size:13px;background:#fff;}
nav .close{overflow:hidden;position:absolute;top:12px;right:20px;width:13px;height:13px;background:url('/m/img/btn_nav_close.png') no-repeat;background-size:100%;text-indent:-9999px;}
nav .area_btn{overflow:hidden;}
nav .area_btn a{float:left;width:126px;background:#000;font-size:12px;line-height:30px;color:#fff;text-align:center;}
nav .area_btn a:first-child{margin-left:0;}
nav .area_btn a:nth-child(2n){margin-left:5px;}
nav .area_btn a:nth-child(3),
nav .area_btn a:nth-child(4){margin-top:5px;}
nav .login_user{margin:15px 0;padding-left:33px;background:url('/m/img/ic_user.png') no-repeat;background-size:25px;line-height:25px;}
nav .login_user em{font-style:italic;font-size:15px;color:#000;}
nav .login_user .logout{overflow:hidden;width:17px;height:17px;display:inline-block;margin:5px 0 0 3px;background:url('/m/img/btn_logout.png') no-repeat;background-size:100%;text-indent:-9999px;vertical-align:top;}
nav > ul{margin-top:10px;border-bottom:1px solid #b2b2b2;}
nav > ul > li{border-top:1px solid #b2b2b2;}
nav > ul > li > a{display:block;background:url('/m/img/ic_nav_open.png') right 50% no-repeat;background-size:9px;line-height:33px;color:#000;}
nav > ul > li > a.on{background-image:url('/m/img/ic_nav_close.png');}
nav ul ul{display:none;padding:3px 0 3px 10px;border-top:1px solid #b2b2b2;font-size:12px;}
nav > ul > li > a.on + ul{display:block;}
nav ul ul li{margin:10px 0;}
nav ul ul li a.on{font-weight:700;color:#000;}
#contentLayer{display:none;position:fixed;top:0;left:0;width:100%;height:100%;z-index:500;background:#000;opacity:.5;}

#container{padding:37px 0 45px;}

footer{padding:66px 20px 24px;background:#000 url('/m/img/footer_logo.png') 20px 23px no-repeat;background-size:88px;font-size:11px;color:#535252;}
footer .area_link{padding-top:13px;border-top:1px solid #333;}
footer .area_link span{display:inline-block;margin-left:15px;color:#999;}
footer .area_link span:before{content:'';display:inline-block;margin:2px 14px 0 0;width:1px;height:10px;background:#999;vertical-align:middle;}
footer .area_link span:first-child{margin:0;}
footer .area_link span:first-child:before{display:none;margin:0;}
footer .address{margin-top:15px;line-height:17px;}
footer .address span{display:block;}
footer .copy{margin-top:25px;font-size:9px;}