:root {
    --main-color:  #45D0D6;
	--animation-back : #44A683;
	--sub-color: #2E3136;
	--title_check-url: url('/web/assets/brand/HIPLUS/images/title_check.png');
	--card_bi-url: center center / auto 22px url('/web/assets/brand/HIPLUS/images/bi.png') no-repeat;
	--card_logo-url: center center / auto 43px url('/web/assets/brand/HIPLUS/images/logo.png') no-repeat;
	--card_charge-url: url('/web/assets/brand/HIPLUS/images/mileage_charge.png');
	--card_coupon-url: url('/web/assets/brand/HIPLUS/images/coupon.png');
	--card_withdraw-url: url('/web/assets/brand/HIPLUS/images/mileage_withdraw.png');
	--cancel_reason_selected-url: url('/web/assets/brand/HIPLUS/images/cancelReason_selected.png');
}

body{overscroll-behavior: contain;}

/* Loading Img */
.loading>.center>.loadingImage{
    background: no-repeat center/70px url('/web/assets/brand/HIPLUS/images/loading.png');
    border-radius: 16px;
    animation: unset;
}

.confirmLayerPop .btnsWrap a.btnBlue2{
    background: var(--main-color);
    border: 1px solid var(--main-color);	
}
.confirmLayerPop .btnsWrap a.btnGray2{
	color: #000;
    border: 1px solid #000;	
}
.confirmLayerPop .btnsWrap a.single{
	color: #FFF;
    background: var(--main-color);	
    border: 1px solid var(--main-color);
}
.completeMsg .icon:before{background:var(--main-color);} 

.couponResult .price{
    color: var(--main-color);	
}
.tabWrap{
	border: 1px solid #b5c1c5;
    border-bottom: 1px solid var(--main-color);	
}
input:focus {
	box-shadow: none;
}
/* 결제 내역 */
.historyList > li.deposit .price{color:#3e82f4;}
/* 충전금 충전 */
.useMileage .cash{color:var(--main-color);} 
.myCard{background:var(--main-color);} 
.myCard{border-radius:16px;} 
.myCard:before{background:left center / auto 19px url('/web/assets/brand/HIPLUS/images/bi.png') no-repeat;}
.myCard:before{height:26px;} 
.myCard:after{background:center center / auto 43px url('/web/assets/brand/HIPLUS/images/logo.png') no-repeat;}
.fixBtn > button, .fixBtn > a{background:var(--main-color);} 

ul.historyList{
	background: #fff;
}
li.notfound {
    text-align: center;
    height: 100vh;
    padding: calc(50vh - 100px) 0;
}

/* 간편 결제 페이지 */
.easy-pay-head {
  padding: 12px 12px 0;
  background: linear-gradient(180deg, var(--main-color) 0%, var(--main-color) calc(100% - 28px), rgba(255,255,255,1) calc(100% - 28px));
}
.easy-pay-head.coupon {
  background: linear-gradient(180deg, var(--main-color) 0%, var(--main-color) 54px, rgba(255,255,255,1) 54px);
}
.easy-pay-head .form-select-dummy .amount {
  color: var(--main-color);
}
.pay-list-wrap .pay-label input[type=radio]:checked {
  border-color: var(--main-color);
}
.easy-card-item input[type=radio]:checked ~ .easy-card-label .card-num {
  color: var(--main-color);
}
.easy-card-list-wrap .swiper-pagination .swiper-pagination-bullet-active {
  background: var(--main-color);
}
/* 운행 내역 */
.historyDetail > li .price{
  color: var(--main-color);
}
/* 쿠폰 결제 */
.couponView .infor > .thumb{
	box-shadow: none;
}

/* text애니메이션 추가 */
.textAnimationWrap{
	background-color: #F2F6F9;
	height: 32px;
	z-index: 3;
}
.textAnimation{
	animation:slidein 15s infinite;
	animation-delay:0;
	animation-timing-function:linear;
	color: var(--main-color);
	line-height: 32px;
}
@keyframes slidein {
  0% {
    margin-left: 100%;
    width: 120%
  }

  100% {
    margin-left: -120%;
    width: -100%;
  }
}


/*새로 추가 css*/
.btnChk.gender > li{flex:0 0 calc(50% - 4px);margin:0 0 0 8px;}
.btnChk.gender > li:first-child{margin-left:0;}
.msg strong{color: var(--main-color);}

/*카드 등록 renew*/
 .cardArea.renew .cardTitle {background-color: var(--main-color);}
 .cardArea{ border: dashed 1px var(--main-color) }
.cardArea .cardMsg{ color: var(--main-color);}
.cardAddForm .brnWrap .payMsg {
	color : #3273d5;
	margin-top : 6px;
	font-size: 12px;
}
.historyList > li.reject .price, .historyList > li.withdraw .price{color:#176B55;}
.historyList > li.cancel .price{color:#176B55;}

/*게시판*/
.tabWrap > a.active {
    border-color: var(--main-color);
    color: var(--main-color);
}
.mainTitle{color: var(--main-color);}

/* 쿠폰 */
.regBtn button {
    background-color: var(--main-color);
}
.my-coupon-list-wrap .coupon-infor .coupon-reward{
    color: var(--main-color);
}
.my-coupon-list-wrap .coupon-used strong {
    color: var(--main-color);
}
.my-coupon-btn-wrap .btn-add-coupon{
    background-color: var(--main-color);
}
.my-coupon-head .main-title .count{
    color: var(--main-color);
}

/* 호출현황 */
.call_confirm_button_wrap{
    background: unset;
}
.call_confirm_contents .call_confirm_title.logoTitle img{
    width: 125px;
    margin: 0 6px;
}

/* 팝업 */
.call_confirm_button_wrap #left_button{
    color: #FFFFFF;
    font-weight: 400;
    background-color: var(--main-color);
}
.call_confirm_button_wrap #right_button{
    background-color: var(--sub-color);
}

/* button */
 .btns_g.type1 {
     background-color: var(--main-color);
     border-color: var(--main-color);
     color: #FFFFFF;
 }
 .btns_g.type3{
     background-color: #FFFFFF;
     border-color: var(--main-color);
     color: var(--main-color);
 }
 .btns_g.type4 {
 	background-color : var(--main-color);
 	border-color : var(--main-color);
 }
.btnBusinessCard.active {
	color: var(--main-color);
	background : left center / 18px auto url('/web/assets/brand/HIPLUS/images/title_check.png') no-repeat;
}
.easy-card-item.checked {
	border : solid 2px var(--main-color);
}
.easy-card-item input[type=radio]:checked ~ .easy-card-label:after {
	border-color : var(--main-color);
	background : center center / 25px auto url('/web/assets/brand/HIPLUS/images/title_check.png') no-repeat;
}

.confirmBtnsWrap button.singleBtn {
	background-color : var(--main-color);
}
.confirmBtnsWrap button.positiveBtn {
	background : var(--main-color);
}
.confirmBtnsWrap button.normalBtn {
	background : var(--main-color);
}

/*리워드*/
.reward-tab .reward-tab-list-item > a.active {
   color: var(--main-color);
   border-color: var(--main-color);
}
.reward-history-tab .reward-history-tab-item > a.active {
    color: var(--main-color);
}
.reward-modal .complete-title .msg strong {
    color: var(--main-color);
}
.reward-modal .reward-modal-inner .btn-wrap .btn-positive {
    background-color: var(--main-color);
}
.reward-head .point strong {
    font-size: 33px;
    color: var(--main-color);
}
.fc_type1 {
	color : var(--main-color) !important;
}

/* 마일리지*/
.myInfor .infor .tel{color:var(--main-color);} 
.useMileage .cash{color:var(--main-color);} 
.useMileage > button{background:var(--main-color) ; color:#FFF;} 
.myCard{background: var(--main-color);} 
/* .myCard{border-radius:${_CSS_radius};}  */
.myCard:before{background: var(--card_bi-url);} 
/* .myCard:before{height:${_CSS_fontHeigth};}  */
.myCard:after{background:var(--card_logo-url);} 
.mileageOpt > li > a.charge{background-image: var(--card_charge-url);} 
.mileageOpt > li > a.coupon{background-image: var(--card_coupon-url);} 
.mileageOpt > li > a.withdraw{background-image: var(--card_withdraw-url);} 

.completeMsg .icon:before{background: var(--main-color);} 
.new_fc_type1{color:#FFF;} 
.useMileageCard > .mileage .cash{color:var(--main-color);} 
.autoUsed{background:var(--main-color);}

/*마이페이지*/
.mypage__section.top .now-point strong {
    font-size: 22px;
    color: #176B55;
    margin-right: 4px;
}
.mypage__section.point .reward-btns .btns.charge {
    margin-left: 2px;
    color: #176B55;
    border-color: #176B55;
}
.mypage__section.quick .quick-item i.gift {
    background: center center / 36px auto url('../images/ico_mp_gift.png') no-repeat;
}
.mypage__section.quick .quick-item i.event {
    background: center center / 36px auto url('../images/ico_mp_event.png') no-repeat;
}
.mypage__section.quick .quick-item i.bookmark {
    background: center center / 36px auto url('../images/ico_mp_bookmark.png') no-repeat;
}
.mypage__section.quick .quick-item i.driver {
    background: center center / 36px auto url('../images/ico_mp_driver.png') no-repeat;
}
.mypage__section.quick .quick-item i.tacsong {
    background: center center / 36px auto url('../images/ico_mp_tac.png') no-repeat;
}
.mypage__section.quick .quick-item i.daily {
    background: center center / 36px auto url('../images/ico_mp_daily.png') no-repeat;
}

.setting-wrap__setting-list .setting-toggle input:checked ~ label {
    background: var(--main-color);
}
.setting-wrap__setting-list .setting-toggle input:checked ~ label:before{
    border-color: var(--main-color);
}

/** 운행 현황 **/
.call-header-list .list-item.active{
    color: var(--main-color);
    border-bottom: 4px solid var(--main-color);
}

.call-status-content .call-progress .callBadge.type1 {
    background-color: var(--main-color);
}
.call-status-content .call-progress .cash-msg .cash .t {
    color: var(--main-color);
}
.call-status-content .call-route .route-list-item:first-child:before {
    background-color: var(--main-color);
}

.call-modal-charge-up .charge-guide strong {
    color: var(--main-color);
}
.call-delay-content .price strong {
    color: var(--main-color);
}
.btn-call-close{
    background-color: var(--main-color);
    z-index : 9999;
}
.call-modal-charge-change .charge-form .minus {
    background: center center / 32px auto url("/web/assets/brand/HIPLUS/images//ico_charge_minus.png")
}
.call-modal-charge-change .charge-form .plus {
    background: center center / 32px auto url("/web/assets/brand/HIPLUS/images/ico_charge_plus.png")
}
.call_confirm_contents .reasonSelect .reasonOption.active {
    color: var(--main-color);
    background-image: var(--cancel_reason_selected-url);
    background-color: unset;
}

.topBackBtn {
    position: absolute;
    width: 28px;
    height: 28px;
    top: 25px;
    border: 0;
    padding: 0;
    display: block;
    left: 0px;
    background: url(/web/dweb/images/common/gnb_back.png) no-repeat 0 0 / 28px;
}