@charset "utf-8";

/*--------------------------------------------------------------------------------
	# PAGE : 차량 팝업 CSS
---------------------------------------------------------------------------------*/
/* default */
.pop-modal1.car-pop {background:linear-gradient(to right, #018be0 , #5a3fb4);color:#fff;}
.pop-modal1.car-pop .content dd {margin-left: 0}
.pop-modal1.car-pop .label-main2 ul li button {color: #fff;}
/*.pop-modal1.car-pop .label-main2 ul li button span {z-index:1;}*/
.pop-modal1.car-pop div.ui-tab-con {position: relative;width: 400%}
.pop-modal1.car-pop div.ui-tab-con.w500 {position: relative;width: 500%}

.pop-modal1.car-pop fieldset.form-area2 {position: static;width: 25%;float: left;margin: 0}
.pop-modal1.car-pop fieldset.form-area2.w500 {width: 20%;}

/* header 설정*/
.mb .pop-modal1.car-pop .header h2 {font-size: 0.0rem;}
.mb .pop-modal1.car-pop .header button.ui-back:before {width:1.5rem;height:1.5rem;margin:-0.8rem -0.6rem;border-left:0.2rem solid #fff !important;border-bottom:0.2rem solid #fff !important;-webkit-transform:rotate(45deg);transform:rotate(45deg);background: none;}
.mb .pop-modal1.car-pop .header button.ui-back:after {display: none;}
.mb .pop-modal1.car-pop .header .ui-back {left: 0;}

/* 상단 div margin 설정 */
.pc .pop-modal1.car-pop fieldset div.top-info {position: relative;margin: 0 0 2.0rem 0}
.mb .pop-modal1.car-pop fieldset div.top-info {position: relative;margin: 0 0 4.0rem 0}

/* 상단 설명 메시지 */
.pop-modal1.car-pop fieldset div.top-info p strong {color: #fff;font-weight: normal;}
.pc .pop-modal1.car-pop fieldset div.top-info p.info {position: absolute;font-family: 'OneShinhanM';font-size: 1.4rem;color: #bdc8e6;top: 0%; right: 0;}
.mb .pop-modal1.car-pop fieldset div.top-info p.info {position: absolute;font-family: 'OneShinhanM';font-size: 1.4rem;color: #bdc8e6;top: 0%; left: 0;}

.pop-modal1.car-pop fieldset.form-area2 div.info {position: relative;margin: 0 0 2.0rem 0;}
.pop-modal1.car-pop fieldset.form-area2 div.info .pop-data-change dt {overflow: hidden;position: absolute;width: 1px;height: 1px;}
.pop-modal1.car-pop fieldset.form-area2 div.info .pop-data-change dd {font-family: 'OneShinhanM';font-size: 1.8rem;line-height: 3.5rem;padding: 1.0rem 0 0 0;color: #fff;border-bottom: 0.2rem solid #fff;}
.pop-modal1.car-pop fieldset.form-area2 div.info button.btn-icon2.ic3 {position: absolute;right: 0.7rem;top: 30%;}

/* 슬라이드 움직임 제어 */
.pop-modal1.car-pop fieldset.form-area2.active-before, .pop-modal1.car-pop fieldset.form-area2.active-after {display:block;visibility:hidden;opacity:0;-webkit-transition:all 0.6s ease;transition:all 0.6s ease;}
.pop-modal1.car-pop fieldset.form-area2.active {display:block;visibility:visible;opacity:1;}

.pop-modal1.car-pop fieldset.form-area2:nth-of-type(1).active {-ms-transform:translateX(0%);-webkit-transform:translateX(0%);transform:translateX(0%);}
.pop-modal1.car-pop fieldset.form-area2:nth-of-type(1).active-after {-ms-transform:translateX(-100%);-webkit-transform:translateX(-100%);transform:translateX(-100%);}

.pop-modal1.car-pop fieldset.form-area2:nth-of-type(2).active-before {-ms-transform:translateX(100%);-webkit-transform:translateX(100%);transform:translateX(100%);}
.pop-modal1.car-pop fieldset.form-area2:nth-of-type(2).active {-ms-transform:translateX(-100%);-webkit-transform:translateX(-100%);transform:translateX(-100%);}
.pop-modal1.car-pop fieldset.form-area2:nth-of-type(2).active-after {-ms-transform:translateX(-200%);-webkit-transform:translateX(-200%);transform:translateX(-200%);}

.pop-modal1.car-pop fieldset.form-area2:nth-of-type(3).active-before {-ms-transform:translateX(200%);-webkit-transform:translateX(200%);transform:translateX(200%);}
.pop-modal1.car-pop fieldset.form-area2:nth-of-type(3).active {-ms-transform:translateX(-200%);-webkit-transform:translateX(-200%);transform:translateX(-200%);}
.pop-modal1.car-pop fieldset.form-area2:nth-of-type(3).active-after {-ms-transform:translateX(-400%);-webkit-transform:translateX(-400%);transform:translateX(-400%);}

.pop-modal1.car-pop fieldset.form-area2:nth-of-type(4).active-before {-ms-transform:translateX(300%);-webkit-transform:translateX(300%);transform:translateX(300%);}
.pop-modal1.car-pop fieldset.form-area2:nth-of-type(4).active {-ms-transform:translateX(-300%);-webkit-transform:translateX(-300%);transform:translateX(-300%);}
.pop-modal1.car-pop fieldset.form-area2:nth-of-type(4).active-after {-ms-transform:translateX(-600%);-webkit-transform:translateX(-600%);transform:translateX(-600%);}

.pop-modal1.car-pop fieldset.form-area2:nth-of-type(5).active-before {-ms-transform:translateX(400%);-webkit-transform:translateX(400%);transform:translateX(400%);}
.pop-modal1.car-pop fieldset.form-area2:nth-of-type(5).active {-ms-transform:translateX(-400%);-webkit-transform:translateX(-400%);transform:translateX(-400%);}
.pop-modal1.car-pop fieldset.form-area2:nth-of-type(5).active-after {-ms-transform:translateX(-800%);-webkit-transform:translateX(-800%);transform:translateX(-800%);}

/* 데이터가 없을 경우 */
.pop-modal1.car-pop fieldset .label-main2 ul li.nodata {border: 0.1rem solid #bdc8e6;width: 100%;text-align: center;background: linear-gradient(to right, #018be0 , #5a3fb4);}
.pop-modal1.car-pop fieldset .label-main2 ul li.nodata {border: 0.1rem solid #bdc8e6;width: 100%;text-align: center;background: linear-gradient(to right, #018be0 , #5a3fb4);}
.pop-modal1.car-pop fieldset .label-main2 ul li.nodata p {margin: 5rem 0;font-family: 'OneShinhanM'; color: #bdc8e6;font-size: 1.8rem;width: 100%}

/* 다시하기 버튼 */
.pc .pop-modal1.car-pop div.top-info .ui-back:before {content:'';display:block;position:absolute;top:50%;-webkit-transition:all 0.3s ease;transition:all 0.3s ease;}
.pc .pop-modal1.car-pop div.top-info .ui-back:before {left:0;width:1.0rem;height:1.0rem;margin:-0.6rem 0 0 0.5rem;border-left:0.1rem solid #fff;border-bottom:0.1rem solid #fff;-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg);transform:rotate(45deg);}
.pc .pop-modal1.car-pop div.top-info .ui-back {overflow:hidden;position:relative;top:0%;padding:0 0 0 2.5rem;font-family: 'OneShinhanM';font-size:1.4rem;white-space:nowrap;color:#bdc8e6;}
.pc .pop-modal1.car-pop div.top-info .ui-back {letter-spacing:0;}
.pc .pop-modal1.car-pop div.top-info .ui-back:hover, .section-visual .ui-back:focus {color:#fff;}

.mb .pop-modal1.car-pop div.top-info .ui-back:before {content:'';display:none;}
.mb .pop-modal1.car-pop div.top-info .ui-back {display: none;}

/* 팝업 : 차량검색 PC */
.pc .pop-modal1[id^="uiPOPSelectCar"].car-pop {max-height:78.0rem;height:78.0rem;}
.pc .pop-modal1[id^="uiPOPSelectCar"].car-pop .content {max-height:69.2rem;height:69.2rem;}

/* 팝업 : 차량검색 MOBILE */
.mb .pop-modal1.car-pop .content {padding-bottom:4.0rem;}
.mb .pop-modal1.car-pop.open:not(.min) {top:0 !important;height:100%;height:100vh;max-height:100%;max-height:100vh;overflow-y:auto;overflow-x:hidden;}
.mb .pop-modal1.car-pop.open.min {width:auto;left:2.4rem;right:2.4rem;margin:auto;}