/********** �깋�긽 **********/
:root{
	/*--main-color-blue:#0f40b2;*/
	--main-color-blue:#184c88;
	--main-color-lightblue:#f4f7ff;
	--main-color-darkblue:#dee4f4;
	--main-color-white:#fff;
	--main-color-black:#111;
	--main-color-darkgray:#333;
	--main-color-gray:#ccc;
	--main-color-lightgray:#666;
	--main-color-lightgray2:#f7f7f7;
	--main-color-pink:#ff0090;
	--main-color-lightpink:#ffe5f4;
	--main-tbl02-thead:#f3f6fe;
	--check-bg-color:#b3b9c6;
}
/* �룷�씤�듃而щ윭 */
.fontWt{color:var(--main-color-white);}
.fontBl{color:var(--main-color-blue);}
.fontGray{color:var(--main-color-lightgray);}
.fc01{color:var(--main-color-blue);} /* �뙆�옉 */
.fc02{color:var(--main-color-pink);} /* 遺꾪솉 */

/* common */
body{font-size:14px; background: var(--main-color-blue); color:var(--main-color-black);}
#wrap{width: 100%; margin:0 auto;}
.conTit2{font-size:1.643em;/*23px*/ font-weight:bold; margin-bottom:25px;}
.conTit3{font-size:1.214em;/*17px*/ font-weight:normal; margin-bottom:10px;}
.conTit4{font-size:1.071em;/*15px*/ font-weight:bold; margin-bottom:10px;}
.accordionContent::-webkit-scrollbar {width: 10px; }
.accordionContent::-webkit-scrollbar-thumb {background: var(--main-color-gray); border-radius: 5px;}
.accordionContent::-webkit-scrollbar-track {background-color: var(--main-color-lightgray2); border-radius: 5px;}

/* input */
input[type=text]{padding:15px 10px; border:1px solid var(--main-color-gray); border-radius: 5px; font-size:1em;}
.ipW100{width:100%;}
.check_wrap{margin-top:10px; display:flex; align-items: center; }
.check_wrap label{margin-left:4px;}

/* 湲곕낯 踰꾪듉 */
.basicbtn{margin-top:25px; padding:17px; display:flex; justify-content: center; align-items: center; width:100%; border-radius:5px; color:var(--main-color-white); background:var(--main-color-blue);}
.basicbtn .icon-arrow{font-size:0.5em; padding-left:5px; margin-top:2px;}

.paybtn{margin-top:10px; padding:17px; display:flex; justify-content: center; align-items: center; width:100%; border-radius:5px; color:var(--main-color-white); background:var(--main-color-blue);}
.btnBk{background:var(--main-color-white); color:var(--main-color-lightgray); border:1px solid var(--main-color-lightgray);} /*�씛+寃�踰꾪듉 .btnBk*/ 

/* 湲곕낯 �뀒�씠釉� */
.tbl01{width:100%; border-bottom:1px solid var(--main-color-gray); border-top:2px solid var(--main-color-blue);}
.tbl01 tr th, .tbl01 tr td{padding:15px 10px; border-bottom:1px solid var(--main-color-gray); }
.tbl01 tr th{text-align: left;}
/* �븷�씤紐⑸줉 �뀒�씠釉� */
.tbl02{width:100%; border-bottom:none; }
.tbl02 tr th{text-align: center;}
.tbl02 tr th, .tbl02 tr td{padding:12px 0; border-bottom:1px dashed var(--main-color-gray);}
.tbl02 tr:last-child th,
.tbl02 tr:last-child td{border-bottom:none;}

/* �긽�떒 ���씠�� */
#header{margin-top:25px; display:flex; justify-content: center; flex-direction: column; align-items: center;}
#header .conTit{padding-left:35px; position:relative; display:inline-block; font-weight:bold; letter-spacing: -0.1em; font-size:1.786em;}
#header .conTit:before{content:''; position:absolute; top:50%; left:0; transform:translateY(-50%); width: 30px; height: 30px; background:url(../img/title.png) no-repeat left center; background-size:contain;}
#header .parking{margin-top:20px; align-items: center; padding:15px; display:flex; width:calc(100% - 20px);  background:rgba(0,0,0,0.4); border-radius:5px;}
#header .parking p{font-size:1em;}
#header .parking .park_tel{position:relative;}
#header .parking .park_tel span{margin-right:4px;}

/* 濡쒓렇�씤,濡쒓렇�븘�썐 異붽� */
#header .nav{width:calc(100% - 20px); display:flex; justify-content: space-between; align-items: center;}
#header .nav .homeBtn{font-size:0.9em; padding:10px ; color:var(--main-color-white); border:1px solid rgba(255,255,255,0.3); border-radius: 5px; transition: all 0.3s;}
#header .nav .logBtn{position:relative; font-size:0.9em; padding:10px 10px 10px 30px; color:var(--main-color-white); border:1px solid rgba(255,255,255,0.3); border-radius: 5px;}
#header .nav .logBtn:before{content:''; position:absolute; top:50%; left:10px; transform: translateY(-50%); background:url(../img/login.png) no-repeat; width:15px; height:15px;}
#header .nav .logoutBox span{color:var(--main-color-white); margin-right:10px;}
#header .nav .logoutBox span strong{text-decoration: underline; font-weight:normal; margin-right:3px;}
#header .nav .logoutBox .logBtn:before{background:url(../img/logout.png) no-repeat; width:18px;}

/* 諛뺤뒪 */
.content{margin-top:50px; padding:20px 10px; position:relative; display:flex; justify-content: flex-start; flex-direction: column; align-items: center;  width:100%; min-height:calc(100vh - 110px); background:var(--main-color-lightblue); }
.content:before{content:''; position:absolute; top:-20px; left:0; width: 100%; height: 20px; border-radius:10px 10px 0 0; background:var(--main-color-lightblue);}
.content .container{width:100%; padding:28px 15px; border-radius: 10px; box-shadow: 0 10px 24px rgba(0,0,0,0.08); background:var(--main-color-white);}
.content .container .searchBx{margin-bottom:40px;}
.content .container .resultBx .conTit4 span{font-weight:normal;}
.tbl01 .noResult{padding:100px 10px; color:var(--main-color-lightgray);}
.carNumb{display:block; margin-bottom:8px;}
.inTime{color:var(--main-color-lightgray);}


/********** �엯李⑥젙蹂� 議고쉶 **********/
.infoTop{display:flex; margin-bottom:20px; flex-direction: column; align-items: center;}
.infoTop .infoL{width:60%; margin-bottom:20px;}
.infoTop .infoL .carPic{width:100%; border-radius:10px; overflow: hidden;}
.infoTop .infoL .carPic img{width:100%;}
.infoTop .infoR{width:100%;}
.infoTop .infoR .conBx{margin-bottom:10px;}
.infoTop .infoR .conBx .inputBx .inputTit{display:inline-block; margin-bottom:7px; font-size:1em; font-weight:bold;}
.infoTop .infoR .conBx:nth-of-type(2){display:flex; justify-content: space-between; align-items: center;}
.infoTop .infoR .conBx:nth-of-type(2) .inputBx:first-child{width:25%;}
.infoTop .infoR .conBx:nth-of-type(2) .inputBx:last-child{width:calc(75% - 10px);}

.infoBot table tr td strong{font-size:1.214em;}
.infoBot .parkingTime{font-size:1em;}
.infoBot table .finalFee th,
.infoBot table .finalFee td{background:var(--main-color-lightpink);}
.infoBot .countListBtn{display:inline-block; margin-left:5px; padding:5px 4px; font-size:0.929em; border:1px solid var(--main-color-lightgray); color:var(--main-color-lightgray); border-radius: 5px;}

.countList > th,
.countList > td{padding:0!important;}
.countList thead th{background:var(--main-tbl02-thead);}
.hide{display:none;}

/********** �꽌鍮꾩뒪 �씠�슜�빟愿� **********/
.termBx{}
.termBx .conTit3{font-weight:bold; margin-bottom:15px;}
.termBx .termCheck{border-radius: 5px; font-weight:bold; }
.termBx .termCheck:hover{cursor: pointer;}
.termBx .termCheckAll{background:var(--main-color-darkblue); padding:15px 10px;}
.termBx .termCheckAll:after{display:none;}

/*�빟愿��룞�쓽�뿉 �벐�뒗 泥댄겕諛뺤뒪*/
.termBx input[type=checkbox] {display:none;}
.termBx input[type=checkbox] + label{cursor:pointer; display: flex; align-items: center; text-align: center;}
.termBx input[type=checkbox] + label > span{vertical-align: middle; padding-left:10px; font-weight:bold; font-family:'Noto Sans KR', sans-serif; }
/* 泥댄겕�븯湲� �쟾 */
.termBx input[type=checkbox] + label:before{display:inline-block; width:20px; height:20px; border-radius: 5px; vertical-align:middle; font-size:1.3em; background:var(--check-bg-color);}
/* 泥댄겕 �맂 �긽�깭 */  
.termBx input[type=checkbox]:checked + label:before{background:var(--main-color-blue);}

/* �븘肄붾뵒�뼵 硫붾돱 */
.accordionTitle{display:flex; align-items: center; justify-content: space-between; padding:15px 10px;}
.accordionTitle + .accordionContent{padding:15px 10px; margin-left:10px; height:200px; overflow-Y: scroll; border-radius: 5px; line-height:1.35em; background:var(--main-color-lightgray2); color:var(--main-color-darkgray); word-break: keep-all;}
.accordionTitle + .accordionContent {display: none;}
.accordionTitle.active + .accordionContent {display: block;}
.accordionTitle .icon-arrow_open{font-size:0.05em;}

/********** �젙�궛�셿猷� **********/
.completeBx{display:flex; flex-direction: column; align-items: center; margin:30px 0 25px;}
.completeBx img{max-width:106px;}
.completeBx .tit{margin:25px 0 20px; font-size:1.286em;}
.completeBx .txt{font-size:1em; line-height:1.429em; word-break: keep-all;}
.completeBx .txt br{display:none;}

#header .parking{flex-direction: column;}
#header .parking .park_select{width:100%; margin-bottom:10px; padding:8px 20px 8px 8px; border-radius: 8px; background:rgba(0,0,0,0.4); color:var(--main-color-white);}

/* �뫖�꽣 */
#footer{width: 100%; padding:25px 0; border-top:1px solid var(--main-color-gray); background-color:#f4f7ff; line-height:120%;}
#footer p{color: var(--main-color-lightgray); text-align: center; font-size:0.929em;}

/* �뿉�윭�럹�씠吏� - 怨듯넻�쑝濡� �벐�뒗 嫄�*/
.errorWrap{width:100%;height:100vh; display:flex; justify-content: center; align-items: center;}
.errorBx{max-width:1000px; width:100%; border-radius: 10px; padding:100px 60px; display:flex; justify-content: center; align-items: center; background:#fff; box-shadow: 10px 10px 30px rgba(0,0,0,0.1);}
.errorBx img{width:auto; max-width: 152px; margin-right:70px;}
.errorBx .errorTxt .bot {display:flex; justify-content: flex-start;}
.errorBx .errorTxt .bot a{width:50%;}
.errorBx .errorTxt,
.errorBx .errorTxt .top,
.errorBx .errorTxt .mid{margin-bottom:30px;}
.errorBx .errorTxt .top .errorNumb{font-size:6em; line-height: 1em; font-weight:bold;}
.errorBx .errorTxt .top .errorTit{margin-top:10px; font-size:1.8em;}
.errorBx .errorTxt .mid{color:var(--main-color-lightgray); font-size:1em; line-height:1.5em;}


@media screen and (min-width: 361px){
	/********** �엯李⑥젙蹂� 議고쉶 **********/
	.infoTop{flex-direction: row; justify-content: space-between;}
	.infoTop .infoL{width:35%; margin-bottom:0;}
	.infoTop .infoR{width:calc(100% - (35% + 15px));}
	.infoTop .infoR .conBx:nth-of-type(2){margin-bottom:0;}

	/********** �젙�궛�셿猷� **********/
	.completeBx .txt br{display:block;}

	#header .parking{justify-content: space-between; flex-direction: row; padding:8px 15px;}
	#header .parking .park_select{width:auto; margin-bottom:0;}

}


@media screen and (min-width: 769px){
	#wrap{max-width:750px; margin:0 auto;}
	body{font-size:16px;}

	/********** �젙�궛�셿猷� **********/
	.completeBx img{max-width: none;}


}