@charset "utf-8";

@import url('reset.css');
@import url('zwicon.css');
@import url('jquery-ui.css');

.Wrapper {width: 100%; min-height: 100vh;}
.Wrapper.main{ background:#f1f4f9;}
.main .header { border:none}
.header { position: fixed; /*display: flex;*/ justify-content: space-between; align-items: center; background: #fff; border-bottom: 1px solid #e1e2e7; padding: 0 18px;width: 100%; height: 50px; z-index: 10; top: 0;}
.header .logo { width:60px; height:20px; }
.header .logo.sg { width:100px; height:auto; margin:8px auto 0;}
.header .logo img { width:100%;}
.header .headmenu { /*position:relative;*/ position:absolute; right:18px; top:9px;}
.header .menuicon { display:inline-block; width:18px; height:24px;}
.header .headmenu .text {display: block; width:18px; height:2px; background:#1f1f20; font-size:0; margin:5px 0;}
.header .headmenu .menuicon:before,.header .headmenu .menuicon:after { display:block; content:''; width:18px; height:2px; background:#1f1f20;}
.header .alram {display:inline-block; position:relative;color: transparent;  font-size:0; width:32px; height:32px; margin-right:5px;}
.header .alram.new:after { position:absolute; content:''; right:5px; top:5px; width:7px; height:7px; background-color:#ff6800; border-radius:10px; }
.header .left { display:flex; align-items:center;}
.header .btnBack { position:absolute; display:inline-block; top:16px; left:18px; width:10px; height:17px; margin-right:10px; background:url(../images/icon_arrow_left.png) no-repeat; background-size:auto 100%;}
.header .left .logo {display:inline-block; margin-bottom:6px;}
.header .title { font-size:1.28em !important; margin-left:10px;}
	
.contWrap { top: 50px; margin: 0 0; position: relative; overflow: hidden; min-height: calc(100vh - 105px); padding-bottom:55px;}
.contWrap h2.title { padding:10px 20px; font-size:20px;}
.contWrap .body_title { font-size:2em; color:#081236; margin:40px 20px 20px;}
.contWrap .body_title + .pd20 { padding:0 20px 20px 20px;}
.pd20 { padding:20px;}
.pdT30 { padding-top:30px;}
.pdB30 { padding-bottom:30px;}
.mgT5 { margin-top:5px;}
.formGr .inpUt + .inpUt { margin-top:20px;}
.info_s { text-align: right; margin: 10px; font-size: 12px; color: #686868;}
.info_s +.info_s { margin-top:-5px;}

.fio:after { position:absolute; top:0; left:0;font-family: 'zwicon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1;  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;text-indent:0;}
.h4 {font-size: 18px; font-weight:500;}
.Nodata { justify-content: center !important;}
.Nodata .txt { position:relative; padding-top:50px; color:#999; }
.Nodata .txt:after { content:"\eae4"; top:0; left:50%; transform:translateX(-50%); width:40px; height:40px; font-size:40px}

/**/
.referencetxt { color:#666; font-size:15px; line-height:1.2; text-align:center; padding:20px 0; margin-bottom:30px; border-bottom:1px solid #999;}
.s_tt {    font-size: 18px;line-height: 1.3;color: #222; font-weight:600;}
.referenceList { background:#f1f4f9; padding:30px 20px; margin:20px 0; color:#666;}
.referenceList li { position:relative; padding-left:60px}
.referenceList li:after { position:absolute; top:0; left:0; width:45px; height:45px; border-radius:30px; background-color:#fff; content:'';}
.referenceList li.location:after  { background:url(../images/ico_location.png) center center no-repeat #fff;}
.referenceList li.camera:after  {content:'\eaa0'; font-size:30px; text-align:center; line-height:45px;}
.referenceList li + li{ margin-top:30px;}
.referenceList li .iconTT { font-size:16px; padding-bottom:10px; font-weight:600; color:#222;}

.intro { margin:0;position: relative;overflow: hidden; min-height:100vh; padding:50px 0 0;}
.intro input[id*="slide"] {display:none;}
.intro .slidewrap {max-width:1200px;margin:0 auto;padding-top:5%;}
.intro .slidelist {white-space:nowrap;font-size:0;overflow:hidden;position:relative;padding:0 0 100px;}
.intro .slidelist > li {display:inline-block;vertical-align:middle;width:100%;transition:all .5s;}
.intro .slidelist .slideitem { padding-top:110px; position:relative;}
.intro .slidelist > li > a {display:block;padding: 0 40px;}
.intro .slidelist > li > a img {width:100%;}
.intro .slidelist label {z-index:10;cursor:pointer;line-height: 45px;}
.intro .slidelist .skip{padding-top:10px; font-size: 12px; text-align: center; text-decoration:underline; color:#666;}
.intro .slidelist .textbox {position:absolute;z-index:1;top:0;left:50%;transform:translateX(-50%);line-height:1.6;text-align:center;}
.intro .slidelist .textbox h3 {font-size:25px;color:#000;;transform:translateY(30px);transition:all .5s; font-weight:600; line-height:1.2; }
.intro .slidelist .textbox p {font-size:25px;color:#000;opacity:0;transform:translateY(30px);transition:all .5s;font-weight:600; line-height:1.2; margin-top:20px;}
.intro .slidelist .txt_bl { color:#2a6fd4;}
.intro .slidelist .txt_or { color:#ff6800;}
.intro .slidelist .textbox .tx_s { font-size:22px !important;}

/* input에 체크되면 슬라이드 효과 */
.intro input[id="slide01"]:checked ~ .slidewrap .slidelist > li {transform:translateX(0%);}
.intro input[id="slide02"]:checked ~ .slidewrap .slidelist > li {transform:translateX(-100%);}
.intro input[id="slide03"]:checked ~ .slidewrap .slidelist > li {transform:translateX(-200%);}
.intro input[id="slide04"]:checked ~ .slidewrap .slidelist > li {transform:translateX(-300%);}

/* input에 체크되면 텍스트 효과 */
.intro input[id="slide01"]:checked ~ .slidewrap li:nth-child(1) .textbox h3 {opacity:1;transform:translateY(0);transition-delay:.2s;}
.intro input[id="slide01"]:checked ~ .slidewrap li:nth-child(1) .textbox p {opacity:1;transform:translateY(0);transition-delay:.4s;}
.intro input[id="slide02"]:checked ~ .slidewrap li:nth-child(2) .textbox h3 {opacity:1;transform:translateY(0);transition-delay:.2s;}
.intro input[id="slide02"]:checked ~ .slidewrap li:nth-child(2) .textbox p {opacity:1;transform:translateY(0);transition-delay:.4s;}
.intro input[id="slide03"]:checked ~ .slidewrap li:nth-child(3) .textbox h3 {opacity:1;transform:translateY(0);transition-delay:.2s;}
.intro input[id="slide03"]:checked ~ .slidewrap li:nth-child(3) .textbox p {opacity:1;transform:translateY(0);transition-delay:.4s;}
.intro input[id="slide04"]:checked ~ .slidewrap li:nth-child(4) .textbox h3 {opacity:1;transform:translateY(0);transition-delay:.2s;}
.intro input[id="slide04"]:checked ~ .slidewrap li:nth-child(4) .textbox p {opacity:1;transform:translateY(0);transition-delay:.4s;}


/* 좌,우 슬라이드 버튼 */
.intro .slide_control{    position: absolute;  display: block; bottom: 0; width: 60%; left:50%; transform:translateX(-50%);}
.intro .slide_control > div {display:none; min-height:70px}
.intro input[id="slide01"]:checked ~ .slidewrap .slide_control > div:nth-child(1) {display:block;}
.intro input[id="slide02"]:checked ~ .slidewrap .slide_control > div:nth-child(2) {display:block;}
.intro input[id="slide03"]:checked ~ .slidewrap .slide_control > div:nth-child(3) {display:block;}
.intro input[id="slide04"]:checked ~ .slidewrap .slide_control > div:nth-child(4) {display:block;}

/* 페이징 */
.intro .slide_pagelist {/* position:absolute; top:72%; bottom:26%; left:50%; transform:translateX(-50%);*/ text-align:center;}
.intro .slide_pagelist > li {display:inline-block;vertical-align:middle;}
.intro .slide_pagelist > li > label {display:block;padding:4px;border-radius:30px;background:#ccc;margin:20px 8px;cursor:pointer;}
.intro input[id="slide01"]:checked ~ .slidewrap .slide_pagelist > li:nth-child(1) > label {background:#2a6fd4;}
.intro input[id="slide02"]:checked ~ .slidewrap .slide_pagelist > li:nth-child(2) > label {background:#2a6fd4;}
.intro input[id="slide03"]:checked ~ .slidewrap .slide_pagelist > li:nth-child(3) > label {background:#2a6fd4;}
.intro input[id="slide04"]:checked ~ .slidewrap .slide_pagelist > li:nth-child(4) > label {background:#2a6fd4;}



/*login*/
.login_ck {display: flex; justify-content: space-between; align-items: center; margin-top:14px;}
.login_ck .btnArea { margin:0; display:inherit;}
.login .formGr .checkText { margin:24px 0;}
.formGr .checkText { color:#ff003e; line-height:1.5; margin:5px 0;}
.formGr .inpUt { font-size:0; position:relative;}
.formGr .checkUt .inp_func { width:45%;}
.formGr .checkUt { margin:5px 0 10px;}
.login .btnArea.loginBtn { margin-top:40px;}
.login .btnArea.loginBtn .login { display: block; width: 100%; height: 45px; font-size: 16px !important; font-weight: 400; background-color: #2a6fd4; color: #fff;border-radius: 10px;}
.login .infotxt { margin-top:50px;}
.login .btnArea.loginBtn.join { margin-top:20px;}
.login .btnArea.loginBtn .login.join { background-color: #fff; color: #081236; border:1px solid #081236;}
.login.linkGrp  {display: flex; align-items: center; margin-top:20px; justify-content: center;}
.login.linkGrp a { padding:0 20px; position:relative; color:#999}
.login.linkGrp a + a:before { position:absolute; width:1px; height:12px; background-color:#ccc; content:''; left:0; top:2px;}

/*회원가입*/
.ToS { color:#666; line-height: 1.5;}
.ToS dl,.ToS ol,.ToS li { list-style:revert !important; padding:revert !important; margin:auto; padding-bottom:5px !important; }
.ToS h4 { color:#333; margin:30px 0 10px;}
.ToS h4:first-of-type { margin:0 0 10px;}
.process { display:flex; align-items:center; justify-content: space-between; background:#f1f4f9; height:84px; padding:0 10px;}
.process li { margin:0 5px; width:100%; text-align:center;}
.process li .stepTit { display:block; padding:5px 0; font-size:9px; border:1px solid #acb4c1; border-radius:20px;color:#acb4c1;  font-weight:500;}
.process li .stepTit em { display:inline-block; margin-left:4px; font-size:12px;}
.process li .stepTxt { margin-top:10px; font-size:14px; font-weight:600; color:#acb4c1;}
.process li.on .stepTit { background:#2a6fd4; border:0; color:#fff;}
.process li.on .stepTxt { color:#222;}
.join .h3, .find .h3 { font-size:18px; line-height:1.3; color:#222;}
.join .infoTxt, .find .infoTxt { margin-top:15px; font-size:14px; color:#666; line-height:1.6; }

.find .h4 { font-size:18px; padding:10px 0; border-top: 1px solid #081236; border-bottom: 1px solid #081236;} 
.find .tabArea { margin-top:10px;}
.tabArea { margin-top:30px; }
.tabMenu {display:flex;justify-content: space-between;}
.tabMenu li { display:block; width:100%; margin:0 5px; padding:10px 0; color:#ccc; font-size:15px; text-align:center; border:1px solid #ccc; border-radius:20px;}
.tabMenu li.active { border-color:#081236; color:#081236;}
.tabCont { display:none; margin-top:42px;}
.tabCont.active { display:block;}

.find .tabCont { margin-top:20px;}
textarea.inp_txt { padding:10px;}
.inp_txt + textarea.inp_txt { margin-top:20px;}
.inpUt.line{border-bottom:1px solid #999;}
.inpUt .num { position:absolute; top:10px; right:10px; color:#2a6fd4; font-size:16px;}
.inpUt em { display:inline-block; font-size:16px; text-align:center; vertical-align: middle;}
.btnArea { margin-top:45px; display: flex; justify-content: space-between;}
.btnArea .btn +.btn { margin-left:4px;}
.find .btnArea { margin-top:20px;}
.btnArea.foot { margin-bottom:50px;}

.snsLoginWr { display:flex; align-items:center; justify-content: space-evenly; margin:48px 0;}
.snsLoginWr a { display:inline-block; width:100px; text-align:center; font-size:12px; color:#666; padding-top:62px; background:url(../images/join_sns_kakao.png) top center no-repeat; background-size:53px 53px;}
.snsLoginWr a.facebook { background-image:url(../images/join_sns_f.png);}
.snsLoginWr a.naver { background-image:url(../images/join_sns_n.png);}

.allChk label.inp_func, .agreeWrap .agreeChk label.inp_func { display:block;}
.allChk label.inp_func span { display: block; padding:10px; border:1px solid #ccc; border-radius: 10px; font-weight:600; color:#999;}
.allChk label.inp_func span:before {left: 10px;}
.allChk label.inp_func input[type='checkbox']:checked + span { border-color:#2a6fd4; background-color:#f1f4f9; color:#222; }

.agreeWrap { margin-top:20px; }
.agreeWrap .agreeTt { display:flex; margin-bottom:5px; justify-content: space-between; font-weight:600; }
.agreeWrap .agreeTt .agreeView { text-decoration:underline; font-size:0.8em;}
.agreeWrap .agreeBox { border:1px solid #eaeaea; color: #999; font-weight: 300; padding:14px; height:40px; overflow-y: scroll;}
/*.agreeWrap .agreeChk { margin:5px 0;}*/
.agreeWrap .agreeChk label.inp_func span { display: block; padding:2px 5px;border: 1px solid #eaeaea; border-top:0;background-color:#fff;}
.agreeWrap .agreeChk label.inp_func input[type='checkbox']:checked + span { background-color:#f1f4f9; color:#222;}
.agreeWrap .agreeChk label.inp_func span:before {left: 5px;}

.formGr { min-height:40px;}
.formGr .inpUt .label {display: block; font-size:14px; line-height:1.5;}
.formGr + .formGr { margin-top:20px;}
.inpUtin { display: flex; justify-content: space-between; align-items: flex-end;}
.inpUtin .btn, .btn.btn_in { width:auto; height: 36px; font-size: 12px; border-radius: 0;}
.inpUtin + .inp_txt { margin-top:5px;}
.inpUt .label + .btn_in { float:right; margin-top:-20px} 

.joinResult .topMesg { font-size:2em; text-align:center; font-weight:300; position:relative; padding:70px 0 10px;}
.joinResult .topMesg:after {font-size:60px; font-family: 'zwicon' !important; speak: none;font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; -webkit-font-smoothing: antialiased -moz-osx-font-smoothing: grayscale; content: '\ea46'; position:absolute; top:0; left:50%; transform:translateX(-50%); width:60px; height:60px; color:#91bfe4; }
.joinResult .centerMesg.line{ text-align:center; text-decoration:underline; padding:0 0 30px 0px;}
.joinResult .centerMesg { text-align:center; padding:0 0 10px 0;}
.membInfo { padding:20px; background:#f1f4f9; border-bottom: 1px solid #e1e2e7; border-top: 1px solid #e1e2e7;}
.membInfo dt { display: inline-block; width:30%; padding:5px 10px;}
.membInfo dd { display: inline-block; width:70%;  padding:5px 10px;}
.myinfo .inp_txt { color:#2a6fd4;}
.formGr .bg { background-color:#f8f8f8;}
.formGr.modify { margin-bottom:40px;}
.formGr.modify .btn_in  { width:100%; margin-top:20px;}

/*등록*/
.topTxt { display:flex; padding:20px 20px 20px 110px; background:#f1f4f9; font-size:16px; line-height:1.5;align-items: center;min-height: 74px;}
.topTxt p { position:relative;}
.Reg.topTxt p:before { content:''; display:block; position:absolute; top:50%; transform:translateY(-50%); left:-74px; width:54px; height:34px; background:url(../images/main_icon_car.png) no-repeat; background-size:54px auto;}
.ad.topTxt p:before { background:url(../images/main_icon_ad.png) no-repeat; background-size:54px auto; height:44px;}
.Reg .stepBox { text-align:center; margin-bottom:20px;}
.Reg .stepBox p { margin:20px 0 10px 0; font-size:24px; font-weight:600;}
.Reg .stepBox p em {background: linear-gradient(180deg,rgba(255,255,255,0) 70%, #dee5f0 30%); padding:0 10px;}
.Reg .selectList, .ad .selectList { margin:20px;}
.Reg .selectList li { padding:5px 0;}
.contUt.Reg .btnArea, .contUt.Review .btnArea, .contUt.Qna .btnArea.foot, .contUt.Prop .btnArea.foot { margin-left:20px; margin-right:20px;}
.Reg .locationList { padding:20px; border-bottom:10px solid #f1f3f5; }
.Reg .locationList .tt { margin-bottom:8px;}
.Reg .locationList .tt span { color:#666; margin-left:10px; vertical-align:middle;}
.Reg .locationList .list .choice { position:relative; display:inline-block; padding:8px 30px 8px 10px; margin-bottom:5px; color:#2a6fd4; font-weight:500; border:1px solid #2a6fd4; border-radius:4px;}
.Reg .locationList .list .choice .del { position:absolute; top:5px; right:5px; width:16px; height:16px; text-indent:-9999px;}
.Reg .locationList .list .choice span { vertical-align:middle;}
.Reg .locationList .list .choice .del:after { width:16px; height:16px; content:"\ea4c"; font-size:16px;}
.Reg .locationList .list .text { height:70px; display:flex;align-items: center;justify-content: center; color:#666}
.Reg .locationList .SettBox { margin-top:20px; display: flex; justify-content: space-between;}
.Reg .locationList .SettBox .add { position:relative; padding:0 0 0 30px; line-height:24px;}
.Reg .locationList .SettBox .add:after {content:"\ea6f"; font-size:24px;}
.adListWr .adList .listInfo {display: flex; justify-content: space-between; align-items: center; border-bottom:1px solid #e1e2e3; padding:20px;}
.adListWr .adList .listInfo .infoName { font-size:18px; line-height:1.5; margin-right:5px;}
.adListWr .adList .listInfo .infoName .name { font-size:16px;}
.adListWr .adList .listInfo .infoPrice .unit { font-size:13px; color:#999; text-align:right}
.adListWr .adList .listInfo .infoPrice .price{ font-size:18px; font-weight:600; text-align:right;}
.adListWr .adList .active .listInfo  { border-top:3px solid #0080ff;  border-left:3px solid #0080ff; border-right:3px solid #0080ff;}
.adListWr .adList .active .listInfo .infoName { color:#2a6fd4; font-weight:500}
.active .listdetail { display:block;}
.listdetail { display:none; padding:20px; border:3px solid #0080ff; border-width:0 3px 3px 3px;}
.detailView { margin-bottom:20px}
.detailView li { display:flex; justify-content: space-between; align-items: center; padding:5px 0;}
.detailView li .tit { font-size:15px; color:#999;}
.detailView li .cont { font-size:16px; text-align:right;}
.detailView li .cont em { text-decoration:underline;}
.detailView.carinfo .inp_txt { margin-bottom:20px;}
.designBox select {border: 1px solid #999; padding-left:10px;}
.footGuide { padding:30px 20px 50px; background:#f7f8f9;}
.footGuide .ico_point { position:relative; padding:0px 0 0 30px; line-height:1.5}
.footGuide .ico_point:after { width:22px; height:22px; content:"\ea5f"; font-size:22px;}

.listdetail .detailView.carinfo li, .listdetail .detailView.carinfo li span { display:block;}
.listdetail .detailView.carinfo li { margin-bottom:20px;}
.listdetail .detailView.carinfo li .inp_txt::-webkit-input-placeholder {color:#2a6fd4;}

.period.formGr { padding:10px 20px 20px; margin-bottom:20px; background:#f8f8f8;}
.ad .cost { padding:20px;}
.ad .cost .h4 {background: #ededed;  padding: 10px;  margin-bottom: 20px;  border-radius: 20px;  text-align: center;}
.ad .cost .h4 em, .ad .cost .formGr .inpUt .label em  { font-size:14px; margin-left:5px; color:#999}
.ad .cost .inp_txt { text-align:right; padding-right:30px;}
.ad .cost .formGr .inpUt .label { position:relative; font-size:16px; font-weight:600; padding-left:28px; }
.ad .cost .formGr .inpUt .label:after{position:absolute; top:0; left:0;font-family: 'zwicon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1;  -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;text-indent:0;}
.ad .cost .formGr .inpUt .label:after { content:"\e90c"; font-size:22px;}
.ad .cost .totalCost { margin:0 -20px; padding:20px; /*border-top: 10px solid #f1f3f5;*/}
.ad .cost .totalCost li { display:flex; justify-content: space-between; }
.ad .cost .totalCost li span { padding:6px 10px; }
.ad .cost .totalCost li .label { color:#333;}
.ad .cost .totalCost li .value { color:#000; font-weight:500}
.ad .cost .totalCost li.total { display:block; padding:10px;margin-top: 10px; background:#f1f4f9; color:#000; text-align:right; font-size:16px;}
.ad .cost .totalCost li.total em { font-size:20px; font-weight:800}
.ad .cost .checkUt { display:flex; justify-content: space-evenly;}
.ad .cost .checkUt .inp_func { width:auto;}
.footMessage { text-align: center; padding: 50px 20px 0 20px; border-top: 10px solid #f1f3f5;}
.footMessage .ico_smile {position: relative; display: inline-block; padding-left: 50px; font-size: 16px; line-height: 1.5;text-align: left;}
.footMessage .ico_smile:after { width:40px; height:40px; content:"\eae6"; font-size:40px; color:#91bfe4;}
.placett{ padding:0 20px 10px 20px; font-size:16px;}
ul.place { padding:0 20px; }
ul.place li { padding:10px 0;border-top:1px solid #2a6fd4; }
ul.place li .inp_func, .place li label.inp_func span, .place li label.inp_func span em { display:block;}
ul.place li label.inp_func span:before { top:50%; transform:translateY(-50%);}

/* file_wrap */
.file_wrap {display:inline-block;  position:relative; width:100%; line-height:30px; height:32px; padding:0; color:inherit; cursor:pointer; padding:0;}
.file_wrap .file_input {opacity:0; width:0; height:0; position:absolute; top:0; left:0; font-size:0;}
.file_wrap .file_input:disabled {cursor:not-allowed !important;}
.file_wrap .file_input:disabled ~ .file_control {cursor:not-allowed !important; opacity:0.5; background:#eee;}
.file_wrap .file_input:disabled ~ .btnText{cursor:not-allowed !important; opacity:0.5;}

.file_wrap .file_control {display:inline-block; padding: 10px; border-bottom:1px solid #999; width:100%; height:40px; font-size:16px;vertical-align: middle;text-align: right;white-space: nowrap; overflow: hidden;text-overflow: ellipsis;}
.file_wrap .file_control:empty::after {display:inline-block;  font-weight:normal; color:#aaa;}
.file_wrap .btnText {display:inline-block; vertical-align:middle; text-align:center; border:1px solid #4366ea; background:#fff; color:#4366ea; padding:0 10px; border-radius:4px;}

.file_wrap>label {display: flex; align-items: flex-end; height:100%; padding:0; margin:0; width:100%;}

input[type=range] {
  -webkit-appearance: none;
  width: 100%;
  height: 8px;
  background: #d5d4d3;
  cursor: pointer;
  border-radius: 5px; /* iOS */
  transition: background 450ms ease-in;
}

input[type=range]:focus {
	outline: none;
}

input[type=range]::-webkit-slider-thumb{
  -webkit-appearance: none;
  width: 30px;
  height: 30px;
  background: #fff;
  border: 1px solid #2a6fd4;
  border-radius:15px;
  cursor: pointer;
  box-shadow:-1px 2px 8px 1px rgb(55 55 55 / 10%);
  
}

input[type=range]::-moz-range-thumb{
  -webkit-appearance: none;
  width:10px;
  height:10px;
  background: #fff;
  border: 1px solid dodgerblue;
  border-radius:50%;
  cursor: pointer;
}
.rangeBox { margin:60px 20px 100px;}
.rangeBox .img { margin-top:60px;}
.rangeBox .img img { width:100%;}


/*slide*/
.section input[id*="slide"] {display:none;}
.section .slidewrap { position:relative; max-width:1200px;margin:0 auto;}
.section .slidewrap .pageTxt { border:1px solid #999; padding:10px; font-size:16px;border-radius: 5px;text-align:center;}
.section .slidelist {white-space:nowrap;font-size:0;overflow:hidden;position:relative; margin-top:50px;}
.section .slidelist > li {display:inline-block;vertical-align:middle;width:100%;transition:all .5s;}
.section .slidelist > li > a {display:block;position:relative;}
.section .slidelist > li > a img {width:100%;}
.section .slidelist label {position:absolute;z-index:10;top:50%;transform:translateY(-50%);width:30px; height:30px; cursor:pointer;}
.section .slidelist .textbox {position:absolute;z-index:1;top:45%;left:50%;transform:translate(-50%,-50%);line-height:1.2;text-align:center;}
.section .slidelist .textbox h3 {font-size:18px;color:#000;;transform:translateY(10px);transition:all .5s;}
.section .slidelist .textbox p {font-size:14px;color:#000;/*opacity:0;*/transform:translateY(10px);transition:all .5s;}
.section .slidelist .textbox.sty02 h3, .section .slidelist .textbox.sty02 p{ color:#39F !important;}
.section .slidelist .textbox.sty03 h3, .section .slidelist .textbox.sty03 p{ color:#F00 !important;}
.section .slidelist .textbox.sty04 h3, .section .slidelist .textbox.sty04 p{ color:#F3C !important;}

/* input에 체크되면 슬라이드 효과 */
.section input[id="slide01"]:checked ~ .slidewrap .slidelist > li {transform:translateX(0%);}
.section input[id="slide02"]:checked ~ .slidewrap .slidelist > li {transform:translateX(-100%);}
.section input[id="slide03"]:checked ~ .slidewrap .slidelist > li {transform:translateX(-200%);}
.section input[id="slide04"]:checked ~ .slidewrap .slidelist > li {transform:translateX(-300%);}
.section input[id="slide05"]:checked ~ .slidewrap .slidelist > li {transform:translateX(-400%);}
.section input[id="slide06"]:checked ~ .slidewrap .slidelist > li {transform:translateX(-500%);}
.section input[id="slide07"]:checked ~ .slidewrap .slidelist > li {transform:translateX(-600%);}
.section input[id="slide08"]:checked ~ .slidewrap .slidelist > li {transform:translateX(-700%);}
.section input[id="slide09"]:checked ~ .slidewrap .slidelist > li {transform:translateX(-800%);}
.section input[id="slide10"]:checked ~ .slidewrap .slidelist > li {transform:translateX(-900%);}


/* 좌,우 슬라이드 버튼 */
.slide-control > div {display:none;}
.section .left {left:0;background:url('../images/slide_left.png') center center / 100% no-repeat;}
.section .right {right:0;background:url('../images/slide_right.png') center center / 100% no-repeat;}
.section input[id="slide01"]:checked ~ .slidewrap .slide-control > div:nth-child(1) {display:block;}
.section input[id="slide02"]:checked ~ .slidewrap .slide-control > div:nth-child(2) {display:block;}
.section input[id="slide03"]:checked ~ .slidewrap .slide-control > div:nth-child(3) {display:block;}
.section input[id="slide04"]:checked ~ .slidewrap .slide-control > div:nth-child(4) {display:block;}
.section input[id="slide05"]:checked ~ .slidewrap .slide-control > div:nth-child(5) {display:block;}
.section input[id="slide06"]:checked ~ .slidewrap .slide-control > div:nth-child(6) {display:block;}
.section input[id="slide07"]:checked ~ .slidewrap .slide-control > div:nth-child(7) {display:block;}
.section input[id="slide08"]:checked ~ .slidewrap .slide-control > div:nth-child(8) {display:block;}
.section input[id="slide09"]:checked ~ .slidewrap .slide-control > div:nth-child(9) {display:block;}
.section input[id="slide10"]:checked ~ .slidewrap .slide-control > div:nth-child(10) {display:block;}

/* 슬라이드 페이징 */
.slide-pagelist { position:absolute; text-align:center; top:42px; z-index:100; width:100%}
.slide-pagelist > li {display:block; vertical-align:middle;}
.slide-pagelist > li > label {display:block;padding:15px 10px; font-size:16px;background:#fff;cursor:pointer; border:1px solid #e1e2e3; border-width:0 1px 1px 1px;}


/*배송*/
.drvInfo { padding:20px;}
.drvInfo .h4 { padding:10px 0; border-bottom:1px solid #999; }
.Drv.topTxt p:after { width:54px; height:54px; content:"\e9fb"; font-size:54px; top:-2px; left:-75px; color:#2d70d5;}
.drvInfo .detailView { padding:20px 10px; border-bottom:1px solid #999; margin-bottom:0;}
.drvInfo .detailView li .cont { font-weight:500;}


/*운행*/
.Dving.topTxt p:before { content:''; display:block; position:absolute; top:50%; transform:translateY(-50%); left:-70px; width:36px; height:52px; background:url(../images/icon_coin.png) no-repeat; background-size:36px auto;}
.Dving.topTxt p strong { font-size:1.5em;}
.inpUt .flx { display:flex; justify-content: space-between;align-items: flex-end;}
.inpUt .flx em { line-height:36px; margin:0 5px;}
.inpUt .flx .inpDateW { width:100%;}
.inpUt .flx .inpDateW + .inpDateW { margin-left:10px;}
.dvingList { margin: 0 -20px 0 -20px; border-top: 10px solid #f1f3f5;}
/*.drvInfo .formGr + .dvingList {border-top: 10px solid #f1f3f5;}*/
.dvingList .th {border-bottom:1px solid #e1e2e7; display:flex;justify-content: space-between; padding: 15px 20px; font-size:16px;}
.dvingList .th .date { font-weight:600}
.dvingList .th .more { position:relative; padding-right:10px;}
.dvingList .th .more:after {    position: absolute; top: -30%; left: 75%; width: 30px;height: 30px; content: "\e920";font-size: 30px;}
.dvingListIn { display:flex; align-items: center; margin:10px 0;padding: 0 20px}
.dvingListIn .left { width:25%;}
.dvingListIn .left .icoLv { padding:10px; max-width:80px; text-align:center; border-radius:10px 10px 0 10px; line-height:1; background:#fff; color:#ccc; border:1px solid #999} 
.dvingListIn .left .icoLv span { display:block;}
.dvingListIn .left .icoLv span:last-of-type { font-weight:600; font-size:16px;}
.dvingListIn .left .icoLv.Lv1 { background:#c1c1c1; color:#fff; border:0;}
.dvingListIn .left .icoLv.Lv2 { background:#97bad3; color:#fff; border:0;}
.dvingListIn .left .icoLv.Lv3 { background:#3da6f4; color:#fff; border:0;}
.dvingListIn .left .icoLv.Lv4 { background:#06F; color:#fff; border:0;}
.dvingListIn .left .icoLv.Lv5 { background:#0046b0; color:#fff; border:0;}
.dvingListIn .left .icoLv.Lv6 { background:#002a6a; color:#fff; border:0;}
.dvingListIn .right { width:75%; padding:10px 20px; font-size:16px;}
.dvingListIn .right p { line-height:1.8; text-overflow: ellipsis; white-space: nowrap; word-wrap: normal;overflow: hidden;}
.dvingListIn .right .num span { display:inline-block; width:48%; font-weight:600; padding-left:20px; line-height:1.5; background:url(../images/icon_gps_bl.png) left center no-repeat; background-size:14px 18px;}
.Driving .drvInfo .formGr .label { color:#9d9d9d}
.Driving .mapWr { width:100%; height:400px; background-color:#000}
.Driving .timeWr {}
.timeWr .topinfo { display:flex; color:#999; padding: 15px 20px; justify-content: space-between; border-bottom: 10px solid #f1f3f5;}
.timeWr .topinfo em { color:#000;font-weight:500; font-size:16px; display:inline-block; margin-left:10px; }
.DrivingInfo { padding:20px; margin-bottom:50px}
.DrivingInfo li { padding:15px 0; color:#000;}
.DrivingInfo .savings, .DrivingInfo .savings .tt { font-weight:600; color:#000 !important;}
.DrivingInfo .savings { border-bottom:1px dotted #999; font-size:22px}
.DrivingInfo .total { border-top:1px dotted #999; font-weight:600;font-size:22px; }
.DrivingInfo .tt { display:inline-block; width:100px; margin-right:20px; border-right:1px solid #ebebeb; color:#999;font-size:14px;}


/*후기*/
.topTxt.reviewTop { display:block; position:relative; background:url(../images/bg_coin_s.png) top left #f1f4f9; background-size:90% auto; line-height:1; padding:30px 20px; text-align:center;font-size:20px;}
/*.topTxt.reviewTop:after { width:50px; height:50px; font-size:50px; content:"\eb16"; top:50%; left:35px; transform:translateY(-60%); color:#2a6fd4;}*/
.topTxt.reviewTop em { font-size:24px; font-weight:700;}
.topTxt.reviewTop .savings { display:inline-block; margin:10px 10px 12px 10px; color:#2a6fd4; font-size:34px;}
.topTxt.reviewTop .icon { position:relative; /*padding-right:20px;*/}
.topTxt.reviewTop .icon:after { width:20px; height:20px; top:2px; left:102%; font-size:20px; content:"\e985"}

.reviewList li { padding:20px; border-bottom: 10px solid #f1f3f5;}
.reviewList .grade{display: flex; justify-content: space-between; margin-bottom:10px;}
.reviewList .grade .like .up ,.reviewList .grade .like .down  { position:relative; padding-left:20px; font-weight:600;}
.reviewList .grade .like .up:after, .reviewList .grade .like .down:after { width:20px; height:20px; top:-4px; font-size:20px; content:"\ea79";}
.reviewList .grade .like .down { }
.reviewList .grade .like .down:after{ top:0; content:"\ea78";}
.reviewList .grade .like .up + .down { margin-left:20px;}

/*별점*/
.star_rating { display: flex; flex-direction: row-reverse; justify-content: center; text-align: center;}
.star_rating input { display: none;}
.star_rating label, .star_rating .label { width:20px; height:20px; color: transparent; cursor: pointer; background: url('../images/star_gr.png') top left / 20px 20px no-repeat; }
.star_rating label.star_l, .star_rating .label {background-position:top right; margin-right:8px;}
.star_rating :checked ~ label, .star_rating .label.on { background-image: url('../images/star_y.png');}
.star_rating label:hover,
.star_rating label:hover ~ label {background-image: url('../images/star_y.png');}
.star_rating.row {flex-direction: row;}

.reviewList .reviewCont {display: flex; justify-content: space-between;}
.reviewList .reviewCont .photo { width:80px; min-width:80px; height:80px; overflow:hidden; border-radius:5px;}
.reviewList .reviewCont .photo img { width:80px; height:80px;}
.reviewList .reviewCont .photo +.contentSt { margin-left:20px;}
.reviewList .reviewCont .contentSt { line-height:1.4; width:100%;}
.reviewList .reviewCont .contentSt .more { position:relative; display:block; text-align:right; padding: 0 15px;margin-top: 5px; color: #999;}
.reviewList .reviewCont .contentSt .more:after{top: -6px; left: auto; right: -10px; font-size: 32px; content: "\e91e";}
.reviewList .reviewCont .contentSt .more.short:after{transform:rotate(180deg); transition:all 0.2s;}

/*main*/
.mainContent.gotoad { background:#f1f4f9;}
.mainContent.gotoad .text { padding:46px 0 0 18px;}
.mainContent.gotoad .text .h1 { font-size:30px; color:#081236; line-height:1; padding-bottom:26px;}
.mainContent.gotoad .text .h1 span { font-size:36px; font-weight:800;}
.mainContent.gotoad .text .h1 span em{ color:#ff6800;}
.mainContent.gotoad .text .h2 {color:#081236; font-size:16px; line-height:1.6;}
.mainContent.gotoad .imgWr { position:relative; background:#2a6fd4; margin-top:176px;}
.mainContent.gotoad .imgWr:after { content:''; position:absolute; width:0;  left:50%; transform:translateX(-50%); bottom:-11px;border-top: 20px solid #2a6fd4; border-left: 20px solid transparent;border-right: 20px solid transparent;}
.mainContent.gotoad .imgWr .img { position:absolute; top:-137px; right:0}
.mainContent.gotoad .imgWr .img img { width:334px;}
.mainContent.gotoad .imgWr .text { text-align:center; font-size:21px; font-weight:200; color:#fff; line-height:1.52; padding:60px 0 28px;}
.mainContent.gotoad .imgWr .text span { font-weight:700}
.mainContent02 { padding:73px 18px 100px; background:url(../images/main_bg_coin.png) no-repeat #dee5f0; background-size:100% auto;}
.mainContent02 .h1 { position:relative; font-size:30px; color:#081236; text-align:center; line-height:1; margin-bottom:120px;}
.mainContent02 .h1 span { font-weight:800; display:inline-block; padding-bottom:3px; background: linear-gradient(180deg,rgba(255,255,255,0) 70%, #fff 30%);}
.mainContent02 .h1:after { position:absolute; content:''; left:50%; transform:translateX(-50%);  bottom:-68px;  width:56px; height:34px; background:url(../images/main_icon_car.png) no-repeat; background-size:100% auto;}
.mainContent02 .txtBox { position:relative; text-align:center; font-size:14px; color:#081236; line-height:2;}
.mainContent02 .txtBox img { width:100%; height:auto; margin-bottom:25px; border-radius:10px;}
.mainContent02 .txtBox .btn_more { display:inline-block; margin:20px auto 50px; font-size:15px; font-weight:800; line-height:1; color:#081236; padding:8px 15px 8px 27px; border:1px solid #081236; border-radius:40px; vertical-align:middle;}
.mainContent02 .txtBox .btn_more:after { display: inline-block; font-size:36px; font-family: 'zwicon' !important; speak: none;font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 0.4;-webkit-font-smoothing: antialiased -moz-osx-font-smoothing: grayscale; content: '\e910'; vertical-align:text-top;}
.mainContent02 .txtBox .main_register { display: block; width:100%; height:50px; font-size:20px !important; font-weight:800; background-color:#2a6fd4; color:#fff; border-radius:10px;}
.shadow { box-shadow: 0px 10px 18px rgb(0 0 0 / 20%) !important;}
.mainContent02.ad {  background:url(../images/main_bg_line.png) no-repeat #fff; background-size:100% auto;}
.mainContent02.ad .h1 { color:#081236;}
.mainContent02.ad .h1 span { background: linear-gradient(180deg,rgba(255,255,255,0) 70%, #ff6800 30%);}
.mainContent02.ad .h1:after { width:50px; height:42px; background:url(../images/main_icon_ad.png) no-repeat; background-size:100% auto;}
.mainContent02.ad .txtBox .main_register {background-color:#ff6800; color:#fff;}
.main .snslink { display:flex; height:76px;align-items: center; padding:0 13px;}
.main .snslink li { margin-right:7px;}
.main .snslink > li:last-of-type { margin-right:0}
.main .snslink li a { display:flex; align-items: center; justify-content: space-around; width:41px; height:41px; border:1px solid #4c546f; border-radius:50%;}
.main .snslink li a img { max-height:14px; max-width:30px; margin:auto;}

/*혜택*/
.benefitCont { padding:0 18px 30px; text-align:center;}
.benefitCont .h1 {font-size:27px; color:#081236; text-align:center; line-height:1.3; font-weight: 700; padding:36px 0 42px;}
.benefitCont .h2 {color: #081236; font-size: 15px; line-height: 1.6;}
.benefitCont .h2 + .h2 { margin-top:30px;}
.benefitCont .imgWr { margin-top:40px;}
.benefitCont .imgWr .img { padding-bottom:10px;}
.benefitCont .imgWr .img img { width:100%; border-radius:10px;}
.benefitCont .imgWr .grh img { height:125px; padding-bottom:10px;}
.benefitCont .imgWr.mgT0 { margin-top:0; margin-bottom:20px;}
.benefitCont .imgWr + .text { margin-bottom:30px;}
.benefitCont .checkTt { color:#2a6fd4; font-size:18px; font-weight:800;display: inline-block; background:url(../images/img_checkbox.png) no-repeat; background-size:43px auto; padding:14px 0 10px 35px;}
.benefitCont .step { margin:20px -6% 40px -3%;}
.benefitCont .step li { display:inline-block; position:relative; width:90px; height:90px; margin:0 6% 20px 0; background:#d7dfed; border-radius:100%; box-sizing: content-box;vertical-align: top;}
.benefitCont .step li .num { display:block; color:#053162; font-weight:800; font-size:16px; margin-top:15px;}
.benefitCont .step li p { font-size:15px; color:#000; font-weight:700;margin-top:2px;}
.benefitCont .step li .line {background: linear-gradient(180deg,rgba(255,255,255,0) 70%, #fff 30%);}
.benefitCont .step li.fin { background:#2a6fd4;}
.benefitCont .step li.fin .num { color:#b0cdff;}
.benefitCont .step li.fin p { color:#fff; background:url(../images/benefit_icon_car.png) no-repeat top center; background-size:31px auto; padding-top:22px; }
.benefitCont .step li:after { position:absolute; top:50%; right:-20%; width:9px; height:17px; background:url(../images/ico_arrow_right.png) no-repeat; background-size:9px auto; content:''; }
.benefitCont .step li:last-of-type:after { display:none;}
.benefitCont.bg01 { background:#f1f4f9; }
.benefitCont.bg02 { background:url(../images/bgimg_bl.png) no-repeat #262626; background-size:100% auto;}
.benefitCont.bg03 { background:#2a6fd4; }
.benefitCont.bg04 { background:#1a2242; }
.benefitCont.bg02 .h1, .benefitCont.bg02 .h2, .benefitCont.bg03 .h1, .benefitCont.bg03 .h2, .benefitCont.bg04 .h2, .benefitCont.bg04 .h1 {color:#fff !important;}
.benefitCont.driver.bg03 { background:url(../images/main_bg_coin.png) #2a6fd4; background-size:100%; background-position:center;}
.benefitCont.ad.bg04 { background:url(../images/bgimg_nv.png) no-repeat #1a2242; background-size:100%; background-position:center bottom;}
.benefitCont.ad.bg05 { background:url(../images/main_bg_line.png) no-repeat; background-size:100%; background-position:center bottom;}
.benefitCont .register { display: block; width: 100%; height: 50px; font-size: 20px !important; font-weight: 800; background-color: #fff;  color: #081236; border-radius: 10px; margin:30px 0;}
.benefitCont .ad.register { background-color:#ff6800; color:#fff;}


/*광고진행*/
.ad .adList {border-top: 10px solid #f1f3f5;}
.ad .adListWr .adList .active .listInfo { border:none;}
.ad .adListWr .adList .listdetail {background-color: #f8f9f9; border:none; border-bottom: 1px solid #e1e2e3;}
.adList.topTxt + .adProList {}
.adList.topTxt p:after { width:54px; height:54px; content:"\e9f7"; font-size:54px; top:-2px; left:-75px; color:#ff6800;}
.adProList { border-bottom: 10px solid #f1f3f5;}
.adProList .th { position:relative; border-bottom:1px solid #e1e2e3;  padding:20px; display: flex; justify-content: flex-start; align-items: center; }
.adProList .th .date { min-width:72px; text-align:center; font-weight:600; color:#fff; padding:5px 0; background:#999; border-radius:50px; margin-right:10px;}
.adProList.ing .th .date { background:#2a6fd4; }
/*.adProList .th:after { position: absolute; top: 50%; left: auto; right:0; transform:translateY(-50%); width: 50px;height: 50px; content: "\e920";font-size: 50px;}*/
.adProList .detailView { margin-bottom:0; padding: 20px;}

.adProList .listInfo {/* border-top:1px solid #e1e2e3; border-bottom:1px solid #e1e2e3;*/ line-height:1.5; font-size:16px;}
.adProList .listInfo .name { font-weight:600}
.adProList.end .listInfo { color:#999;}
.adProList .btnArea { padding:0 20px 20px; margin:0}
.adProc .member { display:flex; justify-content:space-between ;align-items: center; padding:20px;border-bottom: 1px solid #e1e2e7;}
.adProc .member ul { width:70%}
.adProc .member ul li {  display:flex; justify-content: flex-start; padding:2px 0; }
.adProc .member ul li .tit { width:40%}
.adProc .member ul li .cont { font-size:16px;}
.adProc .member .btn { width:30%; padding:0;}
.adProc .member .btn i { margin:0 -8px 0 -5px;}

/*.design .section input[id*="slide"] { display:block;}*/
.designWr { padding:20px;}
.designWr .h4 { margin-bottom:10px;}
.designWr .section .slidelist > li {text-align: center; transition:none;}
.designWr .section .slidelist > li .textbox {top: 55%;}
.designWr .section .slidelist > li .textbox h3 { font-size:14px;}
.designWr .designMsg { padding:10px; background:#fff; border:1px solid #ccc; border-radius:10px; width:100%; font-size:16px;}
.designWr .sianList { display:inline-block; width:47%; margin-bottom:10px; padding:10px 4px; border:1px solid #e1e1e1; border-radius:4px; text-align:center; }
.designWr .sianList:nth-of-type(even) { margin-left:5px;}
.designWr .sianinput:checked + .sianList { border:2px solid #2a6fd4; padding:9px 3px;}
.designWr .st01 { color:#000 !important; font-weight:200;}
.designWr .st02 { color:#2a6fd4 !important; font-weight:400;}
.designWr .st03 { color:#f00000 !important; font-weight:600;}
.designWr .st04 { color:#7800cc !important; font-weight:800;}


/*진행현황*/
/*h2.title + .adProc.detail { border-top: 10px solid #f1f3f5; }*/
.adProc.detail { margin-bottom:20px;}
.adProc.detail .dvingList { margin:0}
.adProc.detail .timeWr .topinfo { border-bottom:0}
.adProc.detail .timeWr .savings { display:flex; justify-content:space-between; margin: 0 20px; padding:15px 0; font-size:18px; font-weight:800;border-top: 1px dotted #e1e2e7;}
.adProc.detail .timeWr .savings .tt { font-size:16px; font-weight:600;}

/*고객센터*/
.board .boardT { padding:20px; border-bottom: 10px solid #f1f3f5;}
.board .boardList li { border-bottom: 1px solid #e1e2e3;}
.board .boardList li .boardTT { position:relative; padding:20px;}
.board .boardList li .boardTT:after { width:40px; height:40px; font-size: 40px;content: "\e91e"; top:calc(50% - 20px); left:auto; right:5px;}
.board .boardList li.active .boardTT:after{ transform: rotate(180deg); transition: all 0.2s;}
.board .boardList li .boardTT .Title { font-size:16px;line-height: 1.2; white-space: normal;  text-overflow: ellipsis; -webkit-line-clamp: 2; -webkit-box-orient: vertical; display: -webkit-box;  word-wrap: normal; overflow: hidden;}
.board .boardList li.active .boardTT .Title { -webkit-line-clamp: initial; -webkit-box-orient: horizontal;}
.board .boardList li .boardTT .Title .type { display:inline-block; margin-right:8px;}
.board .boardList li .boardTT .listInfo { margin-top:8px; font-size:13px;}
.board .boardList li .boardTT .listInfo .bdType { display:inline-block; margin-right:8px; color:#2a6fd4}
.board .boardList li .boardTT .listInfo .Date { color:#999} 
.board .boardList li .boardView { display:none;padding:10px 20px 20px 20px;}
.board .boardList li .boardView .btn_Wr { margin-top:30px; text-align:right;}
.board .boardList li .boardView .btn_Wr button { font-size:14px;}
.board .boardList li .boardView .btn_Wr button i { font-size:24px;}
.board .boardList li .boardView .btn_Wr button + button { position:relative; margin-left:15px; padding-left:15px;}
.board .boardList li .boardView .btn_Wr button + button:after { position:absolute; left:0; top:50%; transform:translateY(-50%); width:1px; height:14px; background:#dedede; content:'';}
.board .boardList li .boardView .qna_a { margin:20px -20px -20px; padding:20px; background:#f3f3f3;}
.board .boardList li .boardTT .listInfo .state { font-weight:500; padding:3px 10px; margin-right:10px; color:#fff; background:#666; border-radius:4px;}
.board .boardList li .boardTT .listInfo .state.end { background:#fff; color:#0e87ff; padding:2px 9px; border:1px solid #9CF;}

.Faq.topTxt p:after { width: 54px; height: 54px;content: "\ea4f"; font-size: 54px; top: -5px;left: -75px; color: #081236;}
.categoryWrap { margin-top:10px;}
label.inp_func.tagType { margin:4px 0;}
label.inp_func.tagType span { text-indent:0; padding:10px; min-width:65px; text-align:center; background-color:#f6f6f6; border-radius:30px; box-sizing:border-box;}
label.inp_func.tagType span:before { display:none;}
label.inp_func.tagType input[type='radio']:checked + span { border:1px solid #2a6fd4;padding:9px; background:#fff; color:#2a6fd4; font-weight:600; }

.Qna.topTxt p:after, .Prop.topTxt p:after { width: 48px; height: 48px;content: "\e9cc"; font-size: 48px;top: 50%;left: -70px; transform:translateY(-50%);color: #081236;}
.Prop.topTxt p:after { content:"\ea64"; }
.boardT.btnArea { margin-top:0}
.topTxt.Event { background:url(../images/event_bg.png) no-repeat #f1f4f9; background-size:100% auto;}
.Event.topTxt p:after { width: 48px; height: 48px;content: "\eae3"; font-size: 48px;top: 50%;left: -60px; transform:translateY(-50%);color: #0e87ff;}
.EventList { padding:20px;}
.EventList li { margin:10px 0; padding-bottom:10px; border-bottom:1px solid #ededed; min-height:95px;}
.EventList li .tt img {border-radius:10px; width:100%;}
.EventList li .info { display:flex; justify-content: space-between; align-items: center; margin-top:10px;} 
.EventList li .date { font-size:14px;margin:5px 0;}
.EventList li .state { text-align:right}
.EventList li .state span { display:inline-block; padding:2px 10px; border-radius:3px; background:#ccc; font-weight:600;}
.EventList li .state span.ing { color:#fff; background:#0e87ff;}
.EventList li .state span.winner { color:#fff; background:#ff6800;}
.EventList li a { position:relative; display:block;}
/*.EventList li a:after { width:30px; height:30px; font-size:30px; content:"\e920"; left:auto; right:-10px; top:50%; transform:translateY(-50%);}*/
.eventDetail .imgView img { width:100%; }
.eventDetail .textView { padding:10px 20px;}
.eventDetail .textView dt { display:inline-block; margin:10px 0; font-size: 16px; font-weight:600; background: linear-gradient(180deg,rgba(255,255,255,0) 70%, #fff477 30%);}
.eventDetail .textView dd { padding:0 0 20px 0 ;}

.Prop .mesg { margin-top:40px; padding-top:50px; position:relative;}
.Prop .mesg:after { width:70px; height:70px; content:"\ea73"; font-size:70px; top:0; left:50%; transform:translateX(-45%); color:#91bfe4;}
.Prop .mesg p { margin:20px; font-size:20px; font-weight:600; line-height:1.5; text-align:center;}




/*TopBtn*/
.gotoTopBtn {position:fixed; z-index:10; bottom:60px; right:15px; border:0; line-height:1.0; width:36px; height:36px; margin-bottom:10px; color:#fff; background: rgb(8 18 53 / 41%); border-radius:50%;}
.gotoTopBtn:before {
	font-family: 'zwicon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; 
	-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
	font-size:24px; text-indent:0;	content:"\e918";}
.gotoTopBtn .text {display:block; font-size:0; margin-top:0px;}
.gotoTopBtn,.gotoTopBtn:focus {box-shadow:0 3px 6px rgba(0,0,0,0.3);}
.gotoTopBtn {display:none;}
.gotoTopBtn.active {display:block; animation: ani_fadeIn 0.4s ease-out 0s 1 alternate;}

/* quickMenu*/
.quickMenu {position:fixed; width:100%; height:55px; z-index:10; bottom:0; background:#fff; font-size:0; border-radius:10px 10px 0 0; box-shadow: 0 -2px 6px rgb(0 0 0 / 10%);} 

.quickMenu .unit {display:inline-block; width:33%; height:100%; border:0; font-size:1.0rem; color:#000;}
.quickMenu .unit .qMenu {border:0; width:100%; height:100%; text-align:center; background-color:transparent; color:inherit;}

.quickMenu .unit .text  {display:block; font-size:12px; color:inherit; }
.quickMenu .qMenu:before {display:inline-block; content:''; border:0;}
.quickMenu .qMenu:before { height:19px; width:22px; background:url('../images/q_icon_faq.png') no-repeat 0 0; background-size:100% auto;}
.quickMenu .qMenu.qna:before {height:20px; width:20px; background-image:url('../images/q_icon_qna.png');}
.quickMenu .qMenu.mydriver:before {height:18px; width:18px;  background-image:url('../images/q_icon_mydriver.png') ;}

.quickMenu .unit.active .qMenu:before {background-image:url('../images/q_icon_faq_active.png');}
.quickMenu .active .qMenu.qna:before {height:20px; width:20px; background-image:url('../images/q_icon_qna_active.png');}
.quickMenu .active .qMenu.mydriver:before {height:18px; width:18px;  background-image:url('../images/q_icon_mydriver_active.png') ;}
.quickMenu .unit.active {color:#2a6fd4; font-weight:500;}




/* nav menu */
.navWrap {position:fixed; z-index:11; top:0; bottom:0; width:100%;}
.navWrap .navBg {position:absolute; top:0; left:0; right:0; bottom:0;}
.navWrap .navCont {position:relative; margin-left:20px; height:100%; background:#fff;}
.navWrap .btn.close {width:50px; height:50px; position:absolute; right:0; top:0; background:transparent; z-index:1; color:#1f1f20;}
.navWrap .btn.close:before {
	font-family: 'zwicon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; 
	-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
	font-size:32px; text-indent:0; line-height:;	
	content:"\ea4c"
}
.navWrap .loginBox {padding:20px 20px 10px;}
.navWrap .navMenuBox  {padding:0 25px 20px;}

.navWrap .loginInfo { display:flex;align-items: center;    justify-content: space-between;}
.navWrap .loginInfo .name { font-size:1.3em;white-space: nowrap;}
.navWrap .loginInfo .name i { font-size:2.1em !important;}
.navWrap .loginInfo .my {  margin:0 30px 0 0;white-space: nowrap;}
.navWrap .loginInfo .my i {font-size:24px !important;}

.navWrap .loginBox .logout {width:100%; border:1px solid rgba(255,255,255,0.8); background:rgba(255,255,255,0.2); color:#fff; height:40px;}

.navWrap .navMenuBox {height:calc(100% - 155px);}
.navWrap .menuWrap {overflow:auto; height:calc(100% - 75px); position:relative;}
.navWrap .menuWrap .navMenuBox {height:auto; min-height:calc(100% - 105px);}
.navWrap .menuWrap .btnArea {display:block; margin:0; height:auto; text-align:center; padding:0px 20px 15px;}
.navWrap .menuWrap .btnArea .logout {display:block; width:100%; height:40px; border:1px solid #ccc; background-color:#fff; color:#666;}
.navWrap .navMenuBox { overflow:auto;}
.navWrap .navMenu li>a {display:block; padding:16px 0; position:relative; font-size:1.1em; border-bottom:1px solid #efefef; word-break:break-all; color:#081236;}
.navWrap .navMenu li>ul {display:none; background:rgba(0,0,0,0.05); padding:10px 25px; margin:0 -25px;}
.navWrap .navMenu li>ul>li>a { border-bottom:none; font-size:1.0em; padding:9px 0 9px 10px !important;}
.navWrap .navMenu li>ul>li:last-of-type >a {border-bottom:0;}

.navWrap .navMenu li.subDepth > a {padding-right:30px;}
.navWrap .navMenu li.subDepth > a:after {position:absolute; right:0; top:10px; color:#081236;}
.navWrap .navMenu li.subDepth > a:after {
	font-family: 'zwicon' !important; speak: none; font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; 
	-webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
	font-size:32px; content:"\e91e"}

.navWrap {display:block;}
.navWrap .navMenu li.subDepth.active > a:after {transform:rotate(180deg); transition:all 0.2s;}

.navWrap {right:-100%; transition:all 0.2s;}
.navWrap.open {right:0; background:rgba(0,0,0,0.2); transition:all 0.2s; }
.navWrap.open .navCont {box-shadow:-5px 0 10px rgba(0,0,0,0.2);}
.loginInfo +.loginInfo { margin-top:10px;align-items: stretch;}
.navIn .btn{ height:revert; min-height:34px; font-size: 13px; padding: 0 5px; border-radius:5px}
.navIn .btn + .btn { margin-left:5px;}
.btn.start { padding-left:15px;}
.btn.start:after { width:18px; height:18px; top:50%; transform:translateY(-50%); left:10px; font-size:18px; content:'\eab8';}
.btn.end { padding-left:15px;}
.btn.end:after { width:10px; height:10px; top:50%; transform:translateY(-50%); left:12px; content:''; border:1px solid #2a6fd4; }


/* switchSty */
label.inp_func.switchType {margin:2px 1px;}
label.inp_func.switchType {position:relative; display:inline-block;}
label.inp_func.switchType > input[type="checkbox"] {font-size:0; width:0; height:0; position:absolute; opacity:0; visibility:hidden;}

label.inp_func.switchType .slider {display:block; text-indent:0; position:relative; width:48px; height:28px; border-radius:30px; background-color:#ccc;}
label.inp_func.switchType .slider {}
label.inp_func.switchType .slider:before, 
label.inp_func.switchType .slider:after {background:none; height:0;}
label.inp_func.switchType .slider:before, 
label.inp_func.switchType .slider:after {position:absolute; top:50%; transform:translateY(-50%); width:30px; font-size:11px; line-height:0; color:#fff; text-align:center;}
label.inp_func.switchType .slider:before {left: 2px; content: 'ON';  display:none;}
label.inp_func.switchType .slider:after  {right:2px; content: 'OFF'; display:none;}

label.inp_func.switchType .slider > em {position:absolute; content:""; width:24px; top:2px; left:2px; bottom:2px; border-radius:50%; background-color:#fff; transition:0.2s;}
label.inp_func.switchType .slider > em {background:linear-gradient(180deg, #ffffff, #f0f3f5)}

label.inp_func.switchType input[type='checkbox']:checked + .slider       {background-color:#2a6fd4;}
label.inp_func.switchType input[type='checkbox']:checked + .slider > em  {transform:translateX(-100%); left:calc(100% - 2px); box-shadow:0 2px 5px -1px rgba(0,0,0,0.3);}
label.inp_func.switchType input[type='checkbox']:disabled + .slider      {opacity:0.4;}

label.inp_func.switchType input[type='checkbox'] + .slider:before {display:none;}
label.inp_func.switchType input[type='checkbox'] + .slider:after  {/*display:block;*/}

label.inp_func.switchType input[type='checkbox']:checked + .slider:before {/*display:block;*/}
label.inp_func.switchType input[type='checkbox']:checked + .slider:after  {display:none;}


/*paging*/
.paging_wrap {display:flex; justify-content: center; padding:10px 0px; margin:30px 0 50px; line-height:30px; clear:both; overflow:auto; }
.paging_wrap .btnArea {padding:0 0;}
.paging_wrap ul.paginglist {display:inline-block; overflow:hidden; margin:0 0px; vertical-align:middle; text-align:center; }
.paging_wrap ul.paginglist:before,
.paging_wrap ul.paginglist:after {display:block; content:''; clear:both;}
.paging_wrap ul.paginglist li {display:inline-block; float:left; padding:0 2px; margin:0 5px; border:1px solid #d7d7d7; background:#fff; border-radius:4px;}
.paging_wrap ul.paginglist li a {display:block; line-height:30px; height:28px; min-width:24px; padding:0; font-weight:500; cursor:pointer;}
.paging_wrap ul.paginglist li:hover {background-color:#eee;}
.paging_wrap ul.paginglist li.active {background-color:#fff; border-color:#2a6fd4;}
.paging_wrap ul.paginglist li.active a,
.paging_wrap ul.paginglist li.active a:hover {color:#4389ea;}
.paging_wrap ul.paginglist li a i {display:inline-block; height:26px; font-size:16px; line-height:22px; vertical-align:middle;}
.paging_wrap ul.paginglist a,
.paging_wrap ul.paginglist a:hover {color:#222;}

.paging_wrap ul.paginglist li.prev{font-size:0; color:transparent; background:url(../images/ico_arrow_prev.png) no-repeat 50% 50% transparent;}
.paging_wrap ul.paginglist li.next{font-size:0; color:transparent; background:url(../images/ico_arrow_next.png) no-repeat 50% 50% transparent;}




/*modal*/
body.modal_open { overflow:hidden !important;}
.modal_wrap{display:none;z-index:2000;position:fixed;left:0;top:0;right:0;bottom:0; overflow:hidden; box-sizing:border-box;background:rgba(0,0,0,.4);text-align:center;overflow-y:auto;white-space:nowrap;}
.modal_wrap.open{display:block;}
.modal_wrap:after{content:"";display:inline-block;vertical-align:middle;width:0;font-size:0;height:100%;}
.modal_wrap .modalPop{position:relative; width:95%; min-height:300px;display:inline-block;text-align:left;vertical-align:middle;white-space:normal;background:#fff;animation: ani_popupZoom2 0.2s ease-out 0s 1 alternate;}
.modal_wrap .modalPop .modal_header .tit{ background:#fff; color:#333;height:40px;line-height:40px;padding:0 10px;font-size:18px;font-weight:400;border-radius: 5px 5px 0 0;}
.modal_wrap .modalPop .modal_header .btn_close { position:absolute; top:10px; right:10px; font-size:0; width:24px; height:24px;}
.modal_wrap .modalPop .modal_header .btn_close:after { width:24px; height:24px; font-size:24px; content:"\ea4c";}

.modal_wrap .modalPop .modal_conts {/* padding:30px 15px 20px;*/ max-height:500px; overflow-y:auto }
.modal_wrap .modalPop .modal_conts .ToS { padding:20px;}
.modal_wrap .modalPop .modal_footer{ display:flex; padding:15px 20px;}
.modal_wrap .modalPop .modal_footer:after{content:"";display:block;clear:both;}
.modal_wrap .modalPop .modal_footer .btn { min-width:60px;}
.modal_wrap .modalPop .modal_footer .btn + .btn{margin-left:3px;}


.reviewWrite { padding:20px;}
.reviewWrite .writeTop { display:flex; align-items: center;}
.reviewWrite .tt { margin-right:20px; font-size:16px; margin:10px 10px 10px 0;}
.reviewWrite textarea { padding:10px; border:1px solid #ccc; height:140px;}


.field .filePhoto { display:inline-block; position: relative; vertical-align: middle;height: 80px;}
.field .filePhoto + .filePhoto { margin-left:10px;}
.field .filePhoto span.img { display: block; position:relative; width:80px; height: 80px; border: 1px solid #ccc;}
.field .filePhoto span.img:after { width:30px; height:30px; font-size:30px; content:"\eaa2"; left:50%; top:50%; transform:translate(-50%,-50%); color:#CCC}
.field .filePhoto span.img img { width:79px; height: 79px;}
.field .filePhoto .btn_del { background-color: #fff; position: absolute; top: -5px; right: -5px; width:22px; height: 22px; border-radius:20px; font-size: 0 !important; z-index:10}
.field .filePhoto .btn_del:after { font-size: 22px; width:22px; height:22px; top:50%; left:50%; transform:translate(-50%,-50%); content: "\ea66";}
.inp_txt[type=file] { display: none;}


@keyframes ani_popupZoom2 {
  0%   {transform:translate(calc(0% + 0px)) scale(0);}
  100% {transform:translate(calc(0% + 0px)) scale(1.0);}
}
/*alert, confirm*/
.modal .btn{/*cursor: pointer;border: 1px solid #999999;text-align: center;border-radius: 5px;outline: none;font-weight: 500;*/}
.dimLayer{display: block;width: 100%;background-color: rgba(0, 0, 0, 0.4);position: fixed;left: 0;top: 0px;margin: 0;padding: 0;z-index: 9998;}
.modal{width: 90%; max-width:400px; min-height: 200px; padding:20px;text-align: center;animation: ani_popupZoom 0.3s ease-out 0s 1 alternate;}
.modal-section{background: #ffffff; box-sizing: border-box; display: none ;position:fixed; top: 50% ;left: 50%; -webkit-transform: translate(-50%, -50%);-ms-transform: translate(-50%, -50%);-moz-transform: translate(-50%, -50%);-o-transform: translate(-50%, -50%);transform: translate(-50%, -50%); z-index: 9999;}
.menu_msg{ text-align:center;}
.enroll_box { min-height:100px; display: flex;justify-content: center;align-items: center;}
.enroll_btn { display:flex; margin-top:15px;}
.enroll_btn a.btn { line-height:45px;}
.enroll_btn .btn +.btn { margin-left: 4px;}
@keyframes ani_popupZoom {
  0%   {transform:translate(calc(-50% + 0px), calc(-50% + 0px)) scale(0);}
  100% {transform:translate(calc(-50% + 0px), calc(-50% + 0px)) scale(1.0);}
}


 
input.sian { background:none; font-size:20px; color:#FF0; font-family:"MaruBuri-R", "NanumSquare", "나눔고딕", NanumGothic, "맑은고딕";}