@charset "utf-8";


/* 로그인 */
#loginB{width:100%;height:auto;margin:0 auto; z-index:2;text-align:center;padding-top:0px;}
.loginTitle{font-size:40px;letter-spacing:-1px;padding:10px 0;color:#40b99a;font-weight:bold;}

.login_box{position:relative;overflow:hidden;padding:0 50px}

.login_box ul {text-align:center; padding:20px 0px}
.login_box ul li{margin-bottom:8px; position:relative; height:47px; line-height:28px;}

.login_box ul li input[type="text"],
.login_box ul li input[type="password"]{ border:1px #ddd solid; background:#fff; width:100%; height:47px; font-size:14px; vertical-align:top; padding:0 2%; border-radius:5px;}

.login_help{padding-bottom:20px;display:block;margin:0 auto; width:100%;}
	.chk_id_login{float:left;color:#999;}
	.chk_id_login input{border:1px solid #999 !important;}
	.chk_pw_login{float:right;color:#737373;}

.login_box .loginBtn input {display:block;margin:0 auto; width:100%; height:53px; font-size:16px; font-weight:bold; background:#40b99a; color:#fff; border:0px solid; border-radius:5px;cursor:hand;}

.btn_lnk{margin:30px auto; width:100%; border-top:1px solid #e6e6e6;}
	.btnTxt{float:left;width:160px;text-align:left;color:#737373;padding-top:30px;line-height:20px}
	.joinBtn{float:right;border:1px solid #dbdbdb; padding:12px 25px; border-radius:3px;color:#737373; font-size:14px;margin-top:30px}
@media only screen and (max-width:640px) {
	.btnTxt{float:none;}
	.joinBtn{float:none;}
}

/* 회원가입 */

/*form*/
.txtarea {padding:20px 20px 30px 20px; width:100%; font-size:14px; line-height:1.6em; overflow-x:hidden; overflow-y:scroll; border:1px solid #cdcccc; box-sizing:border-box; margin-bottom:20px;text-align:left;}
.checkbox {height:30px; position:relative; font-size:16px; margin-top:0 !important;}
.checkbox label {line-height:30px; float:left; padding:0;}
.checkbox i {float:left; display:block; margin-right:8px; width:30px; height:30px; background:url('../images/checkbox.png') no-repeat left top; background-size:30px 60px; z-index:3;}
.checkbox input.inputChkbox {opacity:0; cursor:pointer; z-index:5;}
.checkbox input.inputChkbox:checked+i {background-position:left bottom;}
.table_insert input[type=text], .table_insert input[type=password], .table_insert input[type=tel], .table_insert input[type=email], .table_insert select {height:40px; padding:0 10px; margin:5px 0; border:1px solid #d1d0cd; box-sizing:border-box; font-size:16px;}
.agree_box p {color:#8a8a8a; font-size:14px; line-height:1.4em !important;}
.agree_box ul {background-color:#e9e9e9; padding:16px 24px; margin:10px 0 0;}
.agree_box ul li {padding:2px 0; font-size:14px; line-height:1.4em !important;}

/*join_user*/
.join_user {margin-top:60px;}
.join_user table+p {text-align:center; margin-top:50px;}

.table_insert th {width:20%;}
.table_insert td {width:80%}
.inp_user, .inp_id, .inp_birth, .inp_kid, .inp_phone, .inp_pw, .inp_pw2 {width:240px;}
.sel_phone, .inp_email, .sel_email, .inp_email2, .inp_pn, .sel_sex {width:200px;}

.table_insert table {width:100%;}
.table_insert input[type=text], .table_insert input[type=password], .table_insert input[type=tel], .table_insert input[type=email], .table_insert select {height:40px; padding:0 10px; margin:5px 0; border:1px solid #d1d0cd; box-sizing:border-box; font-size:16px;border-radius:5px;}
.table_insert select {background:url('../images/select_arrow.png') no-repeat right center; background-size:36px 18px; vertical-align:bottom;}
.table_insert input[type=button] {height:40px; padding:0 30px; box-sizing:border-box;border-radius:5px;}
.inp_btn1 {font-size:16px; color:#fff; background-color:#f5a635; border:1px solid #f5a635;letter-spacing:-1px;}
.inp_btn2 {font-size:16px; color:#595656; background-color:#fff; border:1px solid #595656;letter-spacing:-1px;}
.table_insert .cr_o{font-size:14px;color:#f16a00}
.table_insert th {width:16%; font-size:18px;letter-spacing:-1px;line-height:20px;font-weight:normal}
.table_insert th > span {font-size:24px; color:#f5a635; width:12px; display:inline-block;}
.table_insert td {width:84%; text-align:left;color:#646464}
.table_insert th, .table_insert td { padding:5px; vertical-align:middle;}
.inp_user, .inp_id, .inp_birth, .inp_kid, .inp_phone, .inp_pw, .inp_pw2 {width:300px;}
.sel_phone, .inp_email, .sel_email, .inp_email2, .inp_pn, .sel_sex {width:200px;}
.inp_title, .inp_addr {width:100%;}
.inp_radio {font-size:16px; height:34px;}
.inp_radio input[type="radio"] {vertical-align:top; width:16px; opacity:0;}
.inp_radio input[type="radio"]+label {display:inline-block; line-height:1.1em; width:auto; height:16px; background:url('../images/radio_btn.png') no-repeat left top; background-size:16px 32px; margin-left:-32px; padding-left:22px; padding-right:15px;}
.inp_radio input[type="radio"]:checked+label {background-position:left bottom;}

.table_insert table.noLine{border-top:0px solid #595656;}
.table_insert table {border-top:1px solid #595656;}

@media only screen and (max-width:768px) {
	/*form*/
	.agree_box ul {padding:12px 14px; margin:4px 0;}
	.agree_box ul li {padding:0;}
	.table_insert th {width:25%;}
	.table_insert td {width:75%;}
	.cr_o{font-size:11px;padding-right:30px;}
}
@media only screen and (max-width:640px) {
	/*form*/
	.checkbox {height:20px; font-size:14px;}
	.checkbox label {line-height:20px;}
	.checkbox i {margin-right:6px; width:20px; height:20px; background-size:20px 40px;}
	.agree_box p {font-size:12px;}
	.agree_box ul li {font-size:12px;}
	.table_insert th {font-size:14px; padding-left:0;}
	.table_insert th > span {font-size:18px; width:8px;}
	.table_insert select {background-size:29px 14px;}
	.table_insert input[type=text], .table_insert input[type=password], .table_insert input[type=tel], .table_insert input[type=email], .table_insert select {height:32px; padding:0 6px; margin:2px 0; font-size:14px;}
	.table_insert input[type=button] {height:32px; padding:0 10px;}
	.inp_btn1 {font-size:14px;}
	.inp_btn2 {font-size:12px;}
	.table_insert textarea {font-size:14px;}
	.inp_user, .inp_id, .inp_birth, .inp_kid, .inp_phone, .inp_pw, .inp_pw2 {width:150px;}
	.sel_phone, .inp_email, .sel_email, .inp_email2, .inp_pn, .sel_sex {width:120px;}
}
@media only screen and (max-width:480px) {
	/*form*/
	.table_insert th {width:30%;}
	.table_insert td {width:70%;}
	.inp_user, .inp_id, .inp_birth, .inp_kid, .inp_phone, .inp_pw, .inp_pw2 {width:120px;}
	.sel_phone, .inp_email, .sel_email, .inp_email2, .inp_pn, .sel_sex {width:100px;}
}


/*join_agree*/
.join_agree{position:relative;overflow:hidden;padding:0 50px}
.join_agree ul {width:100%;}
.join_agree ul:after {content:""; display:block; clear:both;}
.join_agree ul li {float:left; width:49%; margin-left:2%; margin-top:60px;}
.join_agree ul li:first-child {margin-left:0;}
.join_agree h5 {font-size:24px; display:block; text-align:center; background-size:76px 5px; background-position:center bottom; padding-bottom:20px; background-repeat:no-repeat; margin-bottom:20px;}
.join_agree_01 h5 {background-image:url('../images/line_gg.png');}
.join_agree_02 h5 {background-image:url('../images/line_y.png');}
.join_agree ul+p {text-align:center; margin-top:50px;}
.join_agree ul+p a {padding-left:130px; padding-right:130px;}
.join_agree .txtarea {height:400px;}

@media only screen and (max-width:999px) {
	/*join_agree*/
	.join_agree ul li {margin-top:30px;}
	.join_agree h5 {font-size:18px; background-size:60px 3px; padding-bottom:12px;}
	.join_agree ul+p {margin-top:40px;}
	.join_agree ul+p a {padding-left:80px; padding-right:80px;}
	.join_agree .txtarea {height:300px;}

	/*join_user*/
	.join_user {margin-top:30px;}
	.join_user table+p {margin-top:40px;}
}

@media only screen and (max-width:640px) {
	/*join_agree*/
	.join_agree ul li {width:100%; margin-left:0;}
	.join_agree h5 {margin-bottom:10px;}
	.join_agree ul+p {margin-top:30px;}
	.join_agree .txtarea {height:100px;}
	.join_agree_02{padding-top:30px;}
}

@media only screen and (max-width:360px) {
	/*join_agree*/
	.join_agree ul li {margin-top:20px;}

	/*join_user*/
	.join_user {margin-top:20px;}
}


/* 예약달력 */
.calendar_year{width:100%;}
.calendar{border-collapse:collapse; width:100%;}
.calendar thead th{background:#74808e;color:#fff;border:1px solid #b8c2cc;height:48px;padding:10px;text-align:center !important; }
.calendar tbody td{text-align:right;padding:5px 10px 15px 10px;vertical-align:top;border:1px solid #ddd;line-height:24px;}
.calendar .check{font-weight:600;position:relative;}
.calendar .today td{background-color:#fcf8e3;}

.checkTip{width:100%;height:auto;margin:0 auto; z-index:2;text-align:center;padding-top:30px;}
.checkTip li{display:inline;padding:5px 10px;font-size:14px;}
.checkTip img{vertical-align:middle;}


/* 예약확인 */
#reservation{width:100%;height:auto;margin:0 auto; z-index:2;text-align:center;padding-top:30px;}
/* tblType01 */
.tblType01{width:100%;}
.tblType01 tbody th{padding:25px 0 24px;font-size:15px;color:#fff;font-weight:700;background:#74808e;border-bottom:1px solid #b8c2cc;}
.tblType01 tbody td{padding:25px 0 24px;font-size:14px;text-align:center;color:#6b6b6b;border-bottom:1px solid #e7e7e7;}
.tblType01 tbody td.bg{background:#f4f4f4}
.tblType01 tbody td .bSub{display:block;font-size:12px}
.tblType01 tbody tr.bdl td{border-left:1px solid #e7e7e7}
.tblType01 tbody tr.bdl td:first-child{border-left:0}
.tblType01 tbody td.tl{border-top:1px solid #e7e7e7}
.tblType01 tbody th.tl{border-top:1px solid #b8c2cc}

.cost_info {width:100%; position:relative;}
.cost_info .cost_info_title { width:25%; height:100%; position:absolute; top:0; left:0; background:#d4cdc6; color:#fff; border-top-left-radius:10px; border-bottom-left-radius:10px; }  
.cost_info .cost_info_title strong {font-size:25px; color:#fff; font-weight:600; line-height:1.2;}
.cost_info .cost_info_title .tb{width:100%; height:100%; }
.cost_info .cost_info_title .tbc {text-align:center; padding-top:50px}
.cost_info .cost_info_txt {padding:30px 20px; box-sizing:border-box; width:100%; padding-left:calc(25% + 20px); background:#f7f5f3; border-top-right-radius:10px; border-bottom-right-radius:10px;}
.cost_info .cost_info_txt li {color:#58585a; font-size:17px; border-top:1px solid #e2ddd8; padding-left:15px; position:relative; box-sizing:border-box; line-height:30px; padding-top:5px; padding-bottom:5px;  }
.cost_info .cost_info_txt li:first-child {border-top:0; }
.cost_info .cost_info_txt li:before {width:5px; height:5px; border-radius:5px; position:absolute; left:0; top:17px; background:#ff9b34; clear:both; content:''; display:block; }
.cost_info .cost_info_txt li span {font-size:16px; line-height:25px;}
.cost_info .cost_info_txt li b {font-weight:700;}


/* 예약리스트 */
#res_list{width:100%;height:auto;margin:0 auto; z-index:2;text-align:center;padding-top:30px;}
#res_list .titleTxt{float:left;font-size:14px;color:#657174;margin:20px 10px}
#res_list .titleDay{float:right;width:300px;margin:20px 0}

#res_list .titleDay input[type=text] {height:30px; width:100px; padding:0 10px; box-sizing:border-box;border-radius:5px;font-size:14px;border:1px solid #c9c9c9;}
#res_list .inp_btn1 {display:inline;width:50px; padding:0px 15px 7px 15px;margin-top:5px;background-color:#f99d1c; border:1px solid #f5a635;letter-spacing:-1px;border-radius:5px;}
#res_list .inp_btn1 a{font-size:13px; color:#fff; font-weight:600;}
	
	.tblType02{width:100%;}
	.tblType02 thead th{padding:25px 0 24px;font-size:15px;color:#fff;font-weight:700;background:#74808e;border-bottom:1px solid #b8c2cc;}
	.tblType02 thead td{padding:25px 0 24px;font-size:14px;text-align:center;color:#6b6b6b;border-bottom:1px solid #e7e7e7;}
	.tblType02 tbody th{padding:25px 0 24px;font-size:15px;color:#fff;font-weight:700;background:#74808e;border-bottom:1px solid #b8c2cc;}
	.tblType02 tbody td{padding:25px 0 24px;font-size:14px;text-align:center;color:#6b6b6b;border-bottom:1px solid #e7e7e7;}
	.tblType02 tbody td.bg{background:#f4f4f4}
	.tblType02 tbody td .bSub{display:block;font-size:12px}
	.tblType02 tbody tr.bdl td{border-left:1px solid #e7e7e7}
	.tblType02 tbody tr.bdl td:first-child{border-left:0}
	.tblType02 tbody td.tl{border-top:1px solid #e7e7e7}
	.tblType02 tbody th.tl{border-top:1px solid #ffe180}

@media only screen and (max-width:640px) {
	#res_list .titleTxt{float:none;font-size:14px;color:#657174;margin:20px 10px}
	#res_list .titleDay{float:none;margin:20px auto;}
	#res_list .inp_btn1 {display:inline;width:50px; padding:4px 15px 7px 15px;margin-top:5px;background-color:#f5a635; border:1px solid #f5a635;letter-spacing:-1px;border-radius:5px;}
	
}

/* 달력 클릭 후 리스트 */
#pickBox{width:100%;height:auto;margin:30px auto; z-index:2;text-align:center}
.pickDate{background:#bdbdbd;padding:15px 0;font-size:35px;color:#fff;letter-spacing:-1px;font-weight:bold}

	/* 공통테이블 */
	table.cStyle { width:100%; border-top:1px solid #0e71b8; border-left:1px solid #e0e0e0;  border-bottom:2px solid #e0e0e0; border-collapse:collapse; text-align:center;}
	table.cStyle th { padding:22px 0; background:#fbfbfb; font-size:18px; color:#333; border-left:1px solid #e0e0e0; border-right:1px solid #e0e0e0;}
	table.cStyle td { padding:22px 5px; color:#555; border:1px solid #e0e0e0; border-bottom:1px solid #ddd; }
	table.cStyle td.fontRed a{color:#e20001;}

	table.cStyle_left { width:100%; border-top:1px solid #e0e0e0; border-left:1px solid #e0e0e0;  border-bottom:2px solid #e0e0e0; border-collapse:collapse; text-align:center;}
	table.cStyle_left th { padding:22px 0; background:#fbfbfb; font-size:18px; color:#333; border-left:1px solid #e0e0e0; border-right:1px solid #e0e0e0; border-bottom:1px solid #e0e0e0;}
	table.cStyle_left td { padding:22px 10px; color:#555; border:1px solid #e0e0e0; border-bottom:1px solid #ddd; }
	table.cStyle_left td.fontRed a{color:#e20001;}

	@media only screen and (max-width:600px) {
		.pickDate{font-size:25px;}
		table.cStyle th {font-size:13px;}
		table.cStyle td {font-size:12px;} 

		table.cStyle_left th {font-size:13px;}
		table.cStyle_left td {font-size:12px;}
	}

.courseBox{position:absolute;top:-3px;}
.courseList{padding:5px;font-size:18px;}
@media only screen and (max-width:420px) {
	.courseBox{position:absolute;left:20px;top:40px;}
	.tableBox{padding-top:50px;}
}

/* 예약확인 및 취소 */
.hlight_dot{position:relative;margin:30px 10px 20px 10px;text-align:left;padding:0 30px;font-size:22px;color:#021d38;font-weight:bold;background:url('../images/hlight_dot.png') no-repeat left 3px;}
.hlight_box{background:#f2faf8;padding:25px 10px;font-size:17px}
.hlight_box li{padding:0 30px;line-height:28px;color:#021d38;background:url('../images/dot2.png') no-repeat 15px 12px;}
.cancel_text{margin:0px auto;width:100%;border:1px solid #b2b2b2;font-size:14px;padding:20px;}

.check1{text-align:center;font-size:36px;color:#323232;font-weight:bold;margin-top:50px;letter-spacing:-1px;}
.check2{text-align:center;font-size:17px;color:#636363;margin-top:50px;line-height:26px;letter-spacing:-1px;}
@media only screen and (max-width:600px) {
	.check1{font-size:24px;}
	.check2{font-size:14px;line-height:24px;margin-top:30px;}
}

/* dot */
.dot1{position:relative;margin:30px 10px 20px 10px;text-align:left;padding:0 25px;font-size:22px;color:#021d38;font-weight:bold;background:url('../images/dot1.gif') no-repeat left 3px;}
.dot2{padding:0 30px;line-height:28px;font-size:17px;color:#021d38;background:url('../images/dot2.png') no-repeat 15px 12px; word-break:keep-all;}
.dot2 li{padding:0 30px;line-height:28px;font-size:17px;color:#021d38;background:url('../images/dot2.png') no-repeat 15px 12px;}