@charset "UTF-8";

.overlay_pay{
display: none;position: fixed;top: 0%;left: 0%;width: 100%;height: 100%;background:#777777;z-index:2001;-moz-opacity: 0.8;opacity:.80;filter: alpha(opacity=80);}	
.white_content2 {/* display: none; */position:fixed;width:98%;min-width:320px;background:#fff;border: 3px solid #ff6600;z-index:2002;margin:0 auto;overflow-y:scroll;max-height:90%; padding: 1em;}

.white_content_relative{ position: relative; width: 100%;}
.white_content2 p{text-align: center;margin: 0.75em 0;}
.white_content2 p img{ width: 100%; max-width: 25px;}
.white_content2 h2{font-size: 1.125em;color:#4d4c4c;text-align: center;font-family:'Nanum GothicB';}
.white_content2 hr{border: 0;border-bottom: 1px dashed #ddd;height: 1px;display: block;width: 98%;margin: 0.7em auto;}

.cancelBox{ width: 100%; overflow-y: scroll;}

/*선결제팝업*/
.grayInfoBox{ background-color:#e8e8e8; border-radius:20px; border:1px solid #c3c3c3; padding:8px 12px; color:#333;}
.grayInfoBox dl{ width:100%; font-size:0; padding: 7px 0;}
.grayInfoBox dl dt{ display:inline-block; font-size:14px; width:92px;}
.grayInfoBox dl dt::after{ content:':'; padding: 0 3px; float:right;}
.grayInfoBox dl dd{ display:inline-block; font-size:14px; letter-spacing:-1px; padding-left:3px;}
.grayInfoBox dl dd.b{ font-weight:bold;}
.noticeText{ font-size:0.825em; color:red; padding: 5px 0; text-align:left !important; margin:0 !important;}
.noticeText2{ font-size:0.825em; color:red; padding: 8px 0; text-align:left !important; margin:0 !important;}

.payWayChoice{ width:100%; padding-bottom:10px;}
.payWayChoice dl{ width:100%; font-size:0; padding: 6px 0; }
.payWayChoice dl dt{ width:30%; max-width:100px; font-size:16px; font-weight:bold; display:inline-block;}
.payWayChoice dl dd{ width:70%; display:inline-block;}
.payWayChoice dl dd label{ font-size:14px;}
.payWayChoice dl dd input[type=radio]{ vertical-align:middle; width:16px; height:16px; margin:0 2px;}

.payWayChoice2{ width:100%;}
.payWayChoice2 dl{ width:100%; font-size:0; padding: 10px 0; }
.payWayChoice2 dl dt{ width:30%; max-width:100px; font-size:16px; font-weight:bold; display:inline-block;vertical-align: middle;}
.payWayChoice2 dl dd{ width:70%; display:inline-block;vertical-align: middle;}
.payWayChoice2 dl .font825{ font-size:0.825em;}
.payWayChoice2 dl dd.red2{font-size:14px; color:red;}

.borderB{ border-bottom:1px dashed #808080;}
.addAdr{ border:1px solid #ddd; border-radius:20px; display:inline-block; color:inherit; background-color:#fff; padding:4px 0; width: 80px; margin:0 10px; text-align:center;font-size:13px;
	position:absolute;
	top:10px; right:0;
}
.withList{ widht:100%; padding-bottom:10px;}
.withList ul{ margin: 4px 0; width:100%; overflow:hidden;}
.withList ul li input[type="text"]{ border:1px solid #ddd; height:40px; text-align:center; font-size:14px;}
.withList ul li .listName{ width:28%; float:left; margin-right:1%;}
.withList ul li .listNum{ width:55%; float:left;}
.withList ul li .payment{ width:15%; float:left; margin-right:1%; display:inline-block; text-align:center; line-height:40px; background-color: #3e8ddc; color:#fff; font-size: 0.875em;}

.withList ul li input::placeholder {color:#bbb8b8;}
.withList ul li input::-webkit-input-placeholder {color:#bbb8b8;}
.withList ul li input:-ms-input-placeholder {color:#bbb8b8;}

.payWayBox{ width:100%; padding:5px 0; border-bottom:1px dashed #808080;}
.payWayBox h2{ text-align:left;}
.payWayBox.noneB{border-bottom:0;}
.payWayBox dl{ width:100%; font-size:0; padding: 6px 0; }
.payWayBox dl dt{ width:30%; max-width:100px; font-size:16px; font-weight:bold; display:inline-block;}
.payWayBox dl dd{ width:70%; display:inline-block; font-size:14px;}

.payWay{ width: 100%; padding:10px 0;}
.payWay li{ width: 30%; display:inline-block;}
.payWay li img{ height:22px; vertical-align:middle;}

.payWayBox2{ width:100%; padding:5px 0; position:relative;}
.payWayBox2 h2{font-size:16px; font-weight:bold; padding: 10px 0 0; text-align:left; font-family:'Nanum Gothic';color: inherit;}
.payWayBox2 h2 span{font-size:0.875em;}
.payWayBox2 textarea{ border:1px solid #c3c3c3; background-color:#e8e8e8; width:100%; height:70px; resize:none; margin:10px 0 0;}
.payWayBox2 p.font16{ font-size:16px;}
.payWayBox2 p.left{ text-align:left;}
.payWayBox2 p span.strong{ font-weight:bold; padding-left:10px;}

.payList{ width:100%; padding-bottom:10px; overflow:hidden;}
.payList dl{ width:100%; float:left; font-size:0; padding: 6px 0; }
.payList dl dt{ font-size:14px; display:inline-block; padding-left:8px;}
.payList dl dd{ width:68%; display:inline-block; font-size:13px; padding-left:20px;}
/* .payList dl.borderR{ position:relative;}
.payList dl.borderR::before{content:''; position:absolute; left:0; width:1px; height:10px; top:6px; display:inline-block; margin: 0 22px; background-color:#333;} */


.urlShare{ width:100%; overflow:hidden; padding:10px 0 20px;}
.urlShare ul{ width: 50%; float:left;}
.urlShare ul li{width:100%; text-align:left;}
.urlShare ul li h2{ font-size:14px; text-align:left; font-weight:normal;  padding:5px 0 15px;}
.urlShare ul li a{ display:inline-block; width:40%; background-color:#e8e8e8; padding:4px; margin-right:1%; text-align:center; border-radius:15px; color:#333; font-size:13px;}
.urlShare ul li a.on{ background-color: #3e8ddc; color:#fff;}

.payInfo{ margin:5px 0; padding: 10px 0; border-top:1px dashed #808080; border-bottom: 1px dashed #808080;}
.payInfo dl{ width:100%; display:table; padding: 5px 0;}
.payInfo dl dt{ width: 20%; display:table-cell; vertical-align:middle; font-size:16px;; max-width:60px;}
.payInfo dl dd{ width: 80%; display:table-cell; vertical-align:middle;}
.payInfo dl dd input[type="text"]{ border:1px solid #ddd; height:40px; font-size:15px; padding: 0 5px;}
.payInfo dl dd select{ border:1px solid #ddd; height:40px; font-size:0.825em; text-indent:12px;}
.payInfo dl dd input::placeholder {color:#bbb8b8; font-size:0.825em;}
.payInfo dl dd input::-webkit-input-placeholder {color:#bbb8b8; font-size:0.825em;}
.payInfo dl dd input:-ms-input-placeholder {color:#bbb8b8; font-size:0.825em;}
.wp80{ width:80%;}
.wp40{ width:40%;}
.padding5{ padding:5px 0;}
.center{ text-align:center;}

.btnBox2{ width:100%; padding: 1em 0; text-align:center;}
.btnBox2 a{ width: 40%; text-align:center; display:inline-block; background-color:#626262; color:#fff; padding:10px 0; margin:0 0.5em;}
.btnBox2 a.on{ background-color:#3e8ddc;}

/*220103*/
.divideBox{ width:100%; font-size:0; padding: 5px 0;}
.divideBox a{ display:inline-block; width:25%; border:1px solid #ddd; font-size:
16px; text-align:center; color:#333; padding: 10px 0; line-height:1.25em;}
.divideBox a span{ font-size: 0.825em; display:block; width:100%;}
.divideBox a.on{ background-color: #3e8ddc; color:#fff; }
.divideBox a.off{ background-color:#e8e8e8; color:#fff; }

/*220118*/
.withMemCheck{ padding: 1em 0; width: 100%; text-align: center;}
.withMemCheck h1{ text-align: left; font-size: 1.125em; font-family: 'Nanum GothicB';}
.withMemBox{ width: 100%; padding: 0.5em 0;}
.withMemBox ul{ overflow:hidden;}
.withMemBox li{ width: 23%; float: left; text-align: center; position: relative; margin-right: 2%;}
.withMemBox li:last-child{margin-right: 0;}
.withMemBox li a{ display: block; top: 0; left: 0; right: 0; bottom:0;}
.withMemBox li a p{ border:1px solid #ddd; border-radius: 10px; padding:1.2em; margin:0; height:65px;}
.withMemBox li.disable a p{ background-color: #C3C3C3 }
.withMemBox li a p img{ width: 90%; margin: auto; max-width: 25px;}
.withMemBox li a span{ display: block; padding-top: 6px; font-size: 0.875em; color: #333;}
.withMemBox li a.on p{ background-color: #3e8ddc; border:1px solid #3e8ddc;}

.withMemBox li a p img{ content:url('../../images/m_hills/icon_ppl.svg') }
.withMemBox li a.on p img{ content:url('../../images/m_hills/icon_ppl_w.svg') }

.btn_plus:before, .btn_plus:after{ 
  position: absolute;
  left:50%;
  top:22px;
  transform: translateX(-50%);
  content: ' ';
  height: 20px;
  width: 2px;
  background-color: #333;
}
.btn_plus:before{ transform: rotate(90deg);}
.btn_plus:after{ transform: rotate(0deg);}

.white_content3 {display: none;position:fixed;width:98%;min-width:320px;background:#fff;border: 3px solid #3e8ddc;z-index:2002;margin:0 auto;overflow-y:scroll;max-height:90%; padding: 1em;}
.white_content3 h2{ color: #3e8ddc; font-weight:bold; font-size:1.25em;}
.withMem{ width:100%; border-top:1px dashed #b9b9b9; padding: 6px 0; border-bottom:1px dashed #b9b9b9; margin:10px 0; display:table;}
.withMem dl{ display:table-row; widht: 100%; padding: 3px 0; border:1px solid red;}
.withMem dl dt{ width: 25%; display:table-cell; font-size:1em; padding: 2px 0; vertical-align:middle; text-align:center;}
.withMem dl dd{ width: 75%; display:table-cell; padding: 2px 0;}
.withMem dl dd input{ border:1px solid #ddd; height:35px;}
.withMemBox2{ padding: 6px 0; width:100%; margin:10px 0;}
.withMemBox2 ul{ clear:both; margin:6xp 0; overflow:hidden; width:100%;}
.withMemBox2 ul li{ float:left; width:49%; margin-right:2%; background-color:#f8f8f8; }
.withMemBox2 ul li:last-child{margin-right:0;}
.withMemBox2 ul li a{ display:block; width:100%; border:1px solid red; padding: 1em 0; border:1px solid #ddd; border-radius:15px; text-align:center; color:#333;}
.withMemBox2 ul li a img{ height: 30px; margin:0 auto 5px; }
.withMemBox2 ul li a span{ display:block; width: 100%; text-align:center;}
.withMemBox2 p{ padding: 1em 0; text-align:center;}

.withBtn{ width:50%; background-color: #3e8ddc; color:#fff; text-align:center; padding: 0.75em 0; display:block; margin:auto;}

.white_content4 {position:fixed;width:60%;min-width:320px;background:#fff;border: 3px solid #3e8ddc;z-index:2002;margin:0 auto;overflow-y:scroll;max-height:90%; padding: 1em;}
.white_content4 h2{ text-align:center; padding-bottom:10px; font-size:1.25em;}
.white_content4 p{ text-align:center; padding-bottom:10px; font-size:1em; line-hight:1.5em;}

.orange{ color: #3e8ddc !important;}

/*220209추가*/
.qrPopup{position:fixed;width:98%;min-width:300px;background:#fff;border: 3px solid #3e8ddc;z-index:2002;margin:0 auto;overflow-y:scroll;max-height:90%; padding: 1em;}
.qrPopup p{text-align: center;margin: 0.75em 0;}
.qrPopup h2{font-size: 1.5em;color:#4d4c4c;text-align: center;font-family:'Nanum GothicB'; padding: 1em 0;}
.qrPopup .qrbox{ margin:10px auto; padding: 10px; width:240px; height:240px; background-color: #fff;}

.reserChoicePop{position:fixed;width:98%;min-width:300px;background:#fff;border: 3px solid #3e8ddc;z-index:2002;margin:0 auto;overflow-y:scroll;max-height:90%; padding: 1em;}
.reserChoicePop h2{font-size: 1.25em;color:#4d4c4c;text-align: center;font-family:'Nanum GothicB'; padding: 0.5em 0;}
.reserChoicePop p{ text-align:center; padding-top:0.5em;}
.reserChoicePop p img{ margin:auto;}
.reserChoicePop hr{border: 0;border-bottom: 1px dashed #ddd;height: 1px;display: block;width: 98%;margin: 0.7em auto;}

.popCheckInList{ padding: 30px 0; text-align:center;}
.popCheckInList a{ font-size:1.125em; color:#404040; position:relative; width: 100%; display:block; margin: 3px 0; padding:0.5em 0; background-color: #3e8ddc; color:#fff; }
.popCheckInList a.on::before{content:''; border-radius:15px; background-color:#ececec; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:96%; margin: auto;  z-index:-1; height:35px; }