@charset "utf-8";
@import url("NotoKR.css");
/* CSS Document */
/*-- reset css --*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}
html, body {font-family: 'Noto Sans Regular';}
body {
   line-height:1;
	overflow-x: hidden;
}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { 
    display:block;
}
ul {list-style:none;}
blockquote, q { quotes:none;}
blockquote:before, blockquote:after,
q:before, q:after {
    content:'';
    content:none;
}
a {
    margin:0;
    padding:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
	 text-decoration: none;
}
/* change colours to suit your needs */
table {
    border-collapse:collapse;
    border-spacing:0;
	 vertical-align:middle;
}
input, select {
    vertical-align:middle;
}
/*-- END reset css --*/



/*-- header --*/
div.top {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:73px;
	background:#fff;
	z-index:7777;
	border-bottom:1px solid #eee;
}
div.logo {
	margin:18px 20px;
}
div.logo a {
	display:block;
	width:180px;
	height:35px;
	background:url('../img/logo.png') no-repeat;
	background-size:180px auto;
}
div.menu-btn {
	position:absolute;
	top:26px;
	right:20px;
	width:25px;
	height:20px;
	background:url('../img/menu.png') no-repeat;
	background-size:25px auto;
	cursor:pointer;
}
div.navi-bg.menu-click {
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.6);
	z-index: 8888;
}
div.slide-navi {
	position:fixed;
	top:0;
	right:-200px;
	width:200px;
	height:100%;
	background:#fff;
	z-index:99999;
}
div.slide-navi.slide {
	width:200px;
	right:0;
	transition: .3s;
}
div.close-btn {
	margin:10px;
	width:15px;
	height:15px;
	background:url('../img/close.png') no-repeat;
	background-size:15px auto;
	cursor:pointer;
}
div.login-box {
	position:relative;
	padding:15px 10px;
	width:100%;
	background-color:#a19284;
}
div.login-inner {
	margin:0 auto;
	width:180px;
	height:160px;
}
div.login-box > h1 {
	margin-bottom:10px;
	font-size:16px;
	letter-spacing:2px;
	color:#fff;
}
div.login-box > input {
	padding-left:10px;
	margin-bottom:7px;
	width:180px;
	height:30px;
	background:#f7f7f7;
	border:none;
	font-size:12px;
	box-sizing: border-box;
}
div.login-box > label {
	position:absolute;
	top:16px;
	right:30px;
	font-size:12px;
	color:#fff;
}
div.login-box > label > input {
	border-radius:0;
	margin-top:0.5px;
	width:12px;
	height:12px;
}
div.login-btn {
	width:180px;
	height:30px;
	background-color:#117097;
	text-align:center;
	line-height:30px;
	font-size:14px;
	color:#fff;
	cursor:pointer;
}
div.idpw-btn {
	margin-top:5px;
	width:90%;
}
div.idpw-btn a {
	display:inline-block;
	width:49%;
	height:30px;
	line-height:30px;
	text-align:center;
	background-color:#535353;
	font-size:14px;
	color:#fff;
}
div.idpw-btn a:first-child {
	background-color:#efad60;
}
/*로그인후*/
h2.login-txt01 {
	font-family: 'Noto Sans Regular';
	color:#fff;
	margin: 5px 0 10px 0;
}
p.login-txt02 {
	font-size:12px;
	color:#333;
	margin-bottom:12px
}
p.login-txt03 {
	font-size:15px;
	color:#fff;
}
div.inner-contents {
	margin-bottom:12px;
	width:180px;
	height:35px;
	background-color:#83766c;
	text-align:center;
	line-height:35px;
}


div.slide-navi > ul > li {
	height:40px;
	line-height:40px;
	border-bottom:1px solid #dfe0d2;
}
div.slide-navi > ul > li > a.ic {
	display:block;
	margin:0 auto;
	padding-left:50px;
	width:180px;
	font-size:15px;
	font-family: 'Noto Sans Medium';
	color:#555555;
	background:url(../img/ic01.png) no-repeat 10px 9px;
	background-size:23px;
}
div.slide-navi > ul > li > a.ic02 {
	background:url(../img/ic02.png) no-repeat 10px 9px;
	background-size:23px;
}
div.slide-navi > ul > li > a.ic03 {
	background:url(../img/ic03.png) no-repeat 10px 9px;
	background-size:23px;
}
div.slide-navi > ul > li > a.ic04 {
	background:url(../img/ic04.png) no-repeat 10px 9px;
	background-size:23px;
}
div.slide-navi > ul > li > a.ic05 {
	background:url(../img/ic05.png) no-repeat 10px 9px;
	background-size:23px;
}
div.slide-navi > ul > li > a.ic06 {
	background:url(../img/ic06.png) no-repeat 10px 9px;
	background-size:23px;
}
div.slide-navi > ul > li.privacy {
	border-bottom:none;
	text-align:center;
}
div.slide-navi > ul > li.privacy > a {
	font-size:12px;
	color:#777;
}
div.slide-navi > ul > li.privacy > a.personal {
	padding-left:20px;
	color:#117097;
}

/*-- END header --*/



/*-- footer --*/
footer {
	margin-bottom:70px;
	display:table;
	width:94%;
	border-top:2px solid #eee;
	padding:3%;
}
footer > div {
	display:table-cell;
	font-size:12px;
	line-height:17px;
	color:#afafaf;
	vertical-align:middle;
}
footer > div:first-child {
	width:68%;
	padding-right:4%;
}
footer > div:last-child {
	border-left:2px solid #52c3f1;
	text-align:center;
	width:25%;
}
footer > div > a.telbox {
	text-align:center;
	line-height:26px;
	color:#52c3f1;
}
footer > div > a.telbox span {
	display:block;
	font-size:16px;
	font-family: 'Noto Sans Medium';
}
/*-- END footer --*/



/*-- quick-menu --*/
div.quick-menu {
	position:fixed;
	bottom:0;
	width:100%;
	height:70px;
}
div.quick-menu li {
	float:left;
	width:20%;
	text-align:center;
	line-height:110px;
	background-color:#535353;
}
div.quick-menu li.brown {
	background:#a19284;
}
div.quick-menu li a {
	display:block;
	font-size:0.9em;
	font-family: 'Noto Sans Medium';
	color:#fff;
	background:url('../img/ic07.png') no-repeat 50% 12px;
	background-size:26px auto;
}
div.quick-menu li a.quick_ic01 {}
div.quick-menu li a.quick_ic02 {
	background:url('../img/ic11.png') no-repeat 50% 12px;
	background-size:26px auto;
}
div.quick-menu li a.quick_ic03 {
	background:url('../img/ic09.png') no-repeat 50% 12px;
	background-size:26px auto;
}
div.quick-menu li a.quick_ic04 {
	background:url('../img/ic08.png') no-repeat 50% 12px;
	background-size:26px auto;
}
div.quick-menu li a.quick_ic05 {
	background:url('../img/ic10.png') no-repeat 50% 12px;
	background-size:26px auto;
}
/*-- END quick-menu --*/



/*---- common ----*/
section {margin-top:74px;}
div.endline {clear:both;}

/*-- 타이틀 --*/
h2.title {
	padding-left:22px;
	font-size:18px;
	font-family: 'Noto Sans Medium';
	color:#535353;
	background:url('../img/point.png') no-repeat 0 5px;
	background-size:14px 6px;	
}

h3.sub-title {
	width:100%;
	height:60px;
	line-height:60px;
	font-family: 'Noto Sans Medium';
	background:#535352;
	background-size:cover;
	font-size:20px;
	color:#fff;
	text-align:center;
}

h4.sub-m-tit {padding-left:15px; font-size:16px; background:url('../img/point_02.png') no-repeat 0 5px; background-size:10px 4px; margin:30px 0 10px}

p.sub-txt {
	margin-top:15px;
	margin-bottom:7px;
	font-family: 'Noto Sans Medium';
	font-size:14px;
	line-height:20px;
	color:#555;
}
/*-- 탭메뉴 --*/
ul.tab-menu {width:100%; height:61px; margin-bottom:-20px}
ul.tab-menu > li {
	float:left;
	width:50%;
	height:50px;
	line-height:50px;
	text-align:center;
	background-color:#eee;
	font-family: 'Noto Sans Medium';
	border-bottom:1px solid #ddd;
}
ul.tab-menu > li.on {
	background-color:#fff;
	border-bottom:none;
}
ul.tab-menu > li.on > a {
	color:#52c3f1;
}
ul.tab-menu > li > a {
	font-size:17px;
	color:#aaa;
}

ul.tab-menu-course > li {width:33.3%;}
ul.tab-menu-course > li {width:33.3%;}

/*-- 테이블 --*/
/* 예약 - calenda */
table.calenda {
	width:100%;
}
table.calenda tr th {
	height:30px;
	vertical-align:middle;
	background-color:#535353;
	border:1px solid #fff;
	font-size:14px;
	color:#ada9a6;
}
table.calenda tr th.red {color:#ec6941}
table.calenda tr th.blue {color:#00b7ee}
table.calenda tr td {
	padding-top:5px;
	width:40px;
	height:40px;
	text-align:center;
	background-color:#666666;
	border:1px solid #fff;
	font-size:12px;
	line-height: 16px;
}
table.calenda tr td a {
	display:block;
	color:#fff;
}
table.calenda tr td a span.team {
	display:block;
	font-size:14px;
	color:#22ac38;
}
/* 회원가입 - tbl01 */
table.tbl01 {
	width:100%;
	text-align:center;
	font-size:0.8em;
	line-height:1.2em;
}
table.tbl01 tr {
	height:40px;
}
table.tbl01 tr th {
	vertical-align:middle;
	border:1px solid #aaa;
	color:#a19284;
}
table.tbl01 tr td {
	position:relative;
	padding:5px;
	vertical-align:middle;
	border:1px solid #aaa;
	color:#535353;
	line-height:22px;
}

/* 공지사항 - tbl02 */
table.tbl02 {
	width:100%;
	text-align:center;
	font-size:14px;
	border:1px solid #ddd;
	border-top:2px solid #645b52;
}
table.tbl02 tr {
	height:40px;
}
table.tbl02 tr th {
	vertical-align:middle;
	background-color:#eee;
	border:1px solid #ddd;
	color:#a19284;
}
table.tbl02 tr td {
	text-align:left;
	padding-left:15px;
	vertical-align:middle;
	border:1px solid #ddd;
	color:#535353;
}
table.tbl02 tr td > a {
	font-size:13px;
	color:#555;
}

/* 기타 - tbl03 */
table.tbl03 {
	width:100%;
	text-align:center;
	font-size:14px;
	border:1px solid #bbb;
}
table.tbl03 tr {
	height:40px;
}
table.tbl03 tr th {vertical-align:middle; border:1px solid #bbb; background-color:#ddd; color:#a19284;}
table.tbl03 tr td {vertical-align:middle; border:1px solid #bbb; color:#535353; padding:5px 2px; line-height:1.4}



/*-- 버튼 --*/
/*예약하기작은버튼*/
a.reserv_btn {
	display:inline-block;
	width:80%;
	height:25px;
	line-height:25px;
	background-color:#52c3f1;
	color:#fff;
}

/*예약취소버튼*/
a.cancel_btn {
	margin-top:15px;
	display:block;
	width:100%;
	height:35px;
	font-size:14px;
	line-height:35px;
	text-align:center;
	background-color:#117097;
	color:#fff;
}

div.btn-box {
	margin:20px 0 0 0;
	text-align:center;
}
/*작은버튼*/
a.btn01 {
	font-family: 'Noto Sans Medium';
	display:inline-block;
	width:20%;
	height:35px;
	background-color:#52c3f1;
	font-size:14px;
	line-height:35px;
	text-align:center;
	color:#fff;
}
a.gray {
	margin-right:5px;
	background-color:#ccc;
}

a.m-gray {	
	background-color:#ccc;
}