/* wrap css-----------------------------------------------------------------------------------------------------------*/

header {
  height: 60px; 
  color: #141414; 
  float: left;
  background-color: #ffc300;
  width: 100%; 
  text-align: center;
  position: fixed;
  top:0;
  left: 0;
  z-index: 1000;
  border-bottom: 1px solid #dde2ea
}
header a{display: inline-block;}
header p{ line-height: 60px; color:#111; display: inline-block; vertical-align: top}
header .logo{display: inline-block; padding: 10px 15px; font-size: 30px; line-height: 40px}
header .title{line-height: 60px; font-size: 18px; font-weight: 500}

.container{width:100%; margin-top:60px; }
.box{width: 100%;padding:15px; position: relative;background-color: #fff;margin-bottom: 25px;}
.box h3{font-weight: 500;}
.box .carful:before{content:'\e9ab'; margin-right:8px; color:#ff6a00}

footer{ padding:15px 10px; background-color:#ebebeb; color:#141414;}
    
footer p{color: #141414; line-height: 60px}


/* btn css-----------------------------------------------------------------------------------------------------------*/
a[class*="btn"]{
	width:49%;
	line-height: 36px;
	padding:0 20px; 
	cursor: pointer;    
	display: inline-block;
	background-color: #eff3f8; 
	border: 1px solid #dfe6ee; 
	margin:0 0.5%;
	position: relative;
	font-size: 15px;
	border-radius: 3px;
	-moz-border-radius:3px; 
	-o-border-radius:3px; 
	-ms-border-radius:3px; 
	-webkit-border-radius:3px; 
	transition: all 0.2s ease;
	user-select: none;
	vertical-align: top;
	text-align: center;

}

/*-- 버튼 padding으로 사이즈 조절 */
a[class*="-p10"]{padding:0 10px !important; font-size: 13px}
a[class*="-p20"]{padding:0 20px !important;}
a[class*="-p30"]{padding:0 30px !important;}
a[class*="-p40"]{padding:5px 40px !important; font-size: 18px;}
a[class*="-p50"]{padding:5px 50px !important; font-size: 18px;}
a[class*="-p60"]{padding:10px 60px !important; font-size: 20px;}
a[class*="-p70"]{padding:10px 70px !important; font-size: 23px;}


/*-- 버튼 퍼센트로 사이즈 조절 */
a[class*="-10"]{width:10%; padding:15px 0px !important; font-size: 20px; }
a[class*="-20"]{width:20%; padding:15px 0px !important; font-size: 20px;}
a[class*="-30"]{width:30%; padding:15px 0px !important; font-size: 20px;}
a[class*="-50"]{width:50%; padding:15px 0px !important; font-size: 20px;}
a[class*="-100"]{width:100%; padding:15px 0px !important; font-size: 20px;}


/*-- 버튼 픽셀로 사이즈 조절 */
a[class*="-100px"]{width:100px; padding:5px 10px !important; font-size: 18px;}
a[class*="-150px"]{width:150px; padding:5px 10px !important; font-size: 20px;}
a[class*="-180px"]{width:180px; padding:5px 10px !important; font-size: 20px;}
a[class*="-200px"]{width:200px; padding:5px 10px !important; font-size: 20px;}
a[class*="-250px"]{width:250px; padding:10px 10px !important; font-size: 20px;}
a[class*="-300px"]{width:300px; padding:10px 10px !important; font-size: 20px;}
a[class*="-350px"]{width:350px; padding:10px 10px !important; font-size: 20px;}
a[class*="-400px"]{width:400px; padding:15px 10px !important; font-size: 23px;}
a[class*="-500px"]{width:500px; padding:20px 10px !important; font-size: 25px;}

/*-- 버튼 작은사이즈 */
.btn-sm{
  font-size: 13px !important; 
  padding:0 15px !important; 
  line-height: 24px !important; 
  position: absolute!important; 
  right: 15px; 
  top:15px; 
  border-radius: 24px !important; 
}
.btn-sm:hover{ background-color: #77b6c2; color:#fff !important; }


.btn-lg{padding:0 50px !important; font-size: 18px; line-height: 45px}

@media (max-width: 768px){
  .btn-lg{padding:0 15px !important; font-size: 16px }
}

/*-- 닫기버튼 */
.btn-close{top:0; right:0; line-height: 32px; padding:0 20px; margin: 0;position: absolute;border-radius: 0; border: 0 }

.backB{position: absolute; left:5px; top:0; line-height: 60px; padding:0 15px;}

/*-- 버튼 모서리 동그랗게*/
.btn-rad0{border-radius: 0px; -moz-border-radius:0px;-o-border-radius:0px; -ms-border-radius:0px;-webkit-border-radius:0px; }
.btn-rad5{border-radius: 5px; -moz-border-radius:5px;-o-border-radius:5px; -ms-border-radius:5px;-webkit-border-radius:5px; }
.btn-rad10{border-radius: 10px; -moz-border-radius:10px;-o-border-radius:10px; -ms-border-radius:10px;-webkit-border-radius:10px; }
.btn-rad15{border-radius: 15px; -moz-border-radius:15px;-o-border-radius:15px; -ms-border-radius:15px;-webkit-border-radius:15px; }
.btn-rad20{border-radius: 20px; -moz-border-radius:20px;-o-border-radius:20px; -ms-border-radius:20px;-webkit-border-radius:20px; }
.btn-rad30{border-radius: 30px; -moz-border-radius:30px;-o-border-radius:30px; -ms-border-radius:30px;-webkit-border-radius:30px; }
.btn-rad50{border-radius: 50px; -moz-border-radius:50px;-o-border-radius:50px; -ms-border-radius:50px;-webkit-border-radius:50px; }


/*-- 버튼 메인 / 서브 색상*/
.b-main{background-color: #3f4d5c !important; border:1px solid #3f4d5c !important; color:#fff !important;}
.b-main:hover{background-color:#242e39 !important; border:1px solid #242e39 !important; }
.b-sub{background-color: #77b6c2  !important; border:1px solid #60a7b4  !important;  color:#fff !important;}
.b-sub:hover{background-color:#5496a2  !important}

/*-- 버튼 메인 / 서브 색상(화이트)*/
.b-wmain{background-color: #fff !important; border:1px solid #444d58 !important;  color:#444d58 !important;}
.b-wmain:hover{background-color:#29313a !important; color:#fff !important; }
.b-wsub{background-color: #fff !important; border:1px solid #fde366 !important;color:#fde366 !important;}
.b-wsub:hover{background-color:#d7ae1f !important; color:#fff !important;}


/*-- 버튼 색상*/
.b-black{background-color: #141414; border:1px solid #000; color:#fff  !important;}
.b-black:hover{background-color: #000; color:#fff  !important;}
.b-white{background-color: #fff;}
.b-white:hover{background-color: #f0f0f0; border:1px solid #aaa;}
.b-red{background-color: #e86e6e !important; color:#fff  !important; border-color: #e86e6e !important; }
.b-wred{background-color: #fff; border:1px solid #ce0000; color:#ce0000  !important;}
.b-blue{background-color:#5fbcff !important; color:#fff  !important; border-color: #5fbcff !important; }
.b-wblue{background-color: #fff; border:1px solid #0033da; color:#0033da  !important;}



.Bnext:before{content:'\e93e'; position:absolute; right:15px; top:15px; line-height:36px; color:#fff; }

/* label css------------------------------------------------------------------------- */

.label{width: 150px;
    height: auto;
    font-size: 16px;
    font-weight: 500;
    display: inline-block;
    padding:10px 0;
  }

/* table css-----------------------------------------------------------------------------------------------------------*/

.table-container{
  position: relative; 
  border:1px solid #d0d0d0;
  border-radius: 3px;
  -webkit-border-radius:3px;
  -moz-border-radius:3px; 
  overflow: hidden;
  table-layout: fixed;
}
.table-container > h3{padding:15px;  }

.table{
  width:100%; 
  padding:0; 
  margin:0;
  border-spacing: 0;
  border-collapse: collapse;
  table-layout: fixed;
}

.table tr{
  border-top:1px solid #d0d0d0;
  background-color: #fff; 
  overflow-x: auto;
}
.table tr:first-child{border-top:0;}
.table th{
  padding:8px 10PX;
  text-align: center;
  background-color:#f2f2f2;
}
.table td{
  border:0;
  word-break: break-all;
  background-color: #fff; 
  text-align: center;
  vertical-align: middle;
  empty-cells: show;
}
.table td:empty{height: 23px}
.table td a:link{text-decoration: none; color:#141414;}
.table td{padding:8px 10px ;}

.table p.btn_point{color:#141414;}
.table .btn{padding:0 10px;}

.divHeadScroll {
  overflow-x: hidden;
  overflow-y: hidden;
  border-radius: 5px 5px 0 0;
  -moz-border-radius: 5px 5px 0 0;
  -webkit-border-radius: 5px 5px 0 0;
}

.divBodyScroll {
  width: 100%;
  height: 200px;  /* 원하는 세로 길이 ! */
  overflow: auto;
}

.tb_hover td:hover{background-color: #f2f2f2}
.tb-th30 th{width: 30%; background-color: #f2f2f2}
.tb-th30 th,
.tb-th30 td{padding:8px 8px; vertical-align: middle;}
.tb-th30 td{text-align: left;}
.tb-th30 td input{line-height: 32px; height: 32px}
.tb-th30 td a.icon{vertical-align: middle;padding: 0 5px; font-size: 25px; line-height: 32px; color:#444d58;}

.tb-th40 th{width:40%}
.tb-th40 th,
.tb-th40 td{padding:8px 8px; vertical-align: middle;}
.tb-th40 td{text-align: left;}
.tb-th40 td input{line-height: 32px; height: 32px}
.tb-th40 td a.icon{vertical-align: middle;padding: 0 5px; font-size: 25px; line-height: 32px; color:#444d58;}



.tb-search{padding:20px; text-align: center; border-top:1px solid #d0d0d0;}

.tb-border tr td:not(:first-child){border-left:1px solid #d0d0d0}



/* ====================
   Responsive table 768  
  ==================== */
@media (max-width: 768px){
	
   .td_block {
	   border: 0 !important;
   }
   .td_block td, .td_block th{
		display: block;
		width: 100%;
		height:33px;
		line-height:33px !important;
		padding:0;
		font-size:14px;
		text-align: left;
		position:relative;
		border-top:0 !important;
		border-left:0 !important;
		border-right:0 !important;
		border-bottom: 1px solid #d0d0d0;
	}
	.td_block td.twoline {
		display: inline-block;
		width:50%;
   }
  .td_block thead{
	   display: none;
   }
   .td_block tr {
		font-size:0;
		display: block;
		position:relative;
		word-spacing:0;
		border: 1px solid #d0d0d0 !important;
		border-bottom: 1px solid #d0d0d0 !important ;
		margin-bottom: 10px;
	}
	.td_block tr:after{
		position: absolute;
		top:0;left:0;
		line-height: 37px;
		color:#111;
		font-size:14px;
		padding:0 5px;
		text-align:center;
	}
	.td_block td:first-child{background-color:#eee}
	.td_block td:empty{min-height:33px} /* td높이*/

}


/* ----------------------------------------체크박스----- */


input[type="checkbox"]{width:20px !important; height:20px !important; line-height:20px !important; vertical-align: middle;}
input[type="checkbox"]:before {
	content: '';
	border-width: 0 8.5px;
    border-color: #fff;
    border-style: solid;
    width: 17px;
    height: 16px;
	line-height: 1;
	border-radius: 2px;
	position: absolute;
	top: 1.5px;
	left: 1px;
}

input[type= "checkbox" ]:checked:after {
    font-family: 'xeicon';
    content: '\e929';
    display: block;
    color: #444d58;
    font-size: 18px;
    z-index: 100;
    position: absolute;
    line-height: 20px;
    left: 0;
    top: 0; 
}

/*----------------------------------------------- 라디오박스----- */

.radio li{display:inline-block; margin-right:10px }

input[type="radio"] {
    width: 20px;
    height: 20px;
    vertical-align: middle;
}

input[type="radio"]:before {
	content: '';
	border-width: 0 8.5px;
	border-color: #fff;
	border-style: solid;
	width: 17px;
	height: 17px;
	line-height: 1;
	border-radius: 50%;
	position: absolute;
	top: 0.5px;
	left: 1px;
}

input[type= "radio" ]:checked:after {
    content: '●';
    font-family: 'NotoSansKr';
    font-size: 12px;
    color: #77b6c2;
    width: 17.5px;
    text-align: center;
    position: absolute;
    line-height: 17px;
    left: 0;
    top: 1px;
}

/* select css-----------------------------------------------------------------------------------------------------------*/

select{width:100% !important}


/* table css-----------------------------------------------------------------------------------------------------------*/


.btnScroll{margin-bottom: 20px ; display: block;}
.btnScroll .tb_search{float: right;padding:0;}


.notice_tr td{background-color: #e0efe5}

.form_tb th{background-color: #eff3f8; line-height: 39px; width:150px;}
.form_tb td{text-align: left; padding:10px 15px; line-height: 39px}
.form_tb label{line-height: 39px}

.Fileinput{visibility:hidden; width: 0; padding: 0}


.file_input label{vertical-align: middle; line-height: 36px}
.file_input label input {
    position:absolute;
    width:0;
    height:0;
    overflow:hidden;
    border:0;
}
.file_input input[type=text] {
    vertical-align:middle;
    display:inline-block;
    width:400px;
    padding:0 10px;
}


/* board view css-----------------------------------------------------------------------------------------------------------*/

.view-title{padding:15px; background-color: #eff3f8;} 
.view-title span{display:inline-block;margin-right: 20px; margin-top: 15px}
.view-box{min-height: 400px; padding:15px;}
.view-box img{width: 100%}


.addfile{ font-size: 13px;  padding:15px 40px; list-style: circle;}
.addfile li{ line-height:30px;}
.addfile li a.btn{line-height:26px; padding: 0 8px; margin:4px 0 4px 10px; font-size: 11px; font-family: '돋움'}
.addfile li span{line-height:30px;}
.addfile li span:before{font-size: 18px; margin-right: 10px; color:#141414;}
.addfile li span.imgfile:before{content:'\ea85'; }
.addfile li span.txtfile:before{content:'\ea83'; }

.notice_icon{padding:0 10px; line-height: 28px; background-color: #141414; color:#fff;  border-radius:3px; vertical-align: top; margin:0 10px 0 0 !important ;}


/* login css-----------------------------------------------------------------------------------------------------------*/

.login{width:600px; margin:80px auto 15px; padding:80px 10px;}
.login h2{text-align: center; font-size: 45px}
.login h4{text-align: center}
.login .btn{width:100%;}

.bottom-text{width:100%; text-align: center}


/* error css-----------------------------------------------------------------------------------------------------------*/

.error{width:100%; max-width: 450px; margin:0 auto; text-align: center;}
.error .box{margin-top:50px; padding:30px; word-break: keep-all;}
.error i{color:#3f4d5c }
.error h1,
.error h2,
.error p{margin-bottom:15px;}
.error .btn{margin-top:20px;}


/* custom css-----------------------------------------------------------------------------------------------------------*/


.reservlist{padding:30px 20px; background: linear-gradient(120deg , #a0a0a0, #666); margin-bottom:20px;background-color: #666 }
.reservlist p{color:#fff;margin-bottom:20px; font-size: 15px; font-weight: 300;}
.reservlist div{
  background-color: #fff;
  padding: 0 15px;
  border-radius: 15px;
  height: 180px;
  text-align: center;
  line-height: 50px;
  color:#aaa;
}

.commu-fac{padding:15px;}
.commu-fac h3{ font-weight: 500; font-size: 17px; margin-bottom: 10px; }
.commu-fac ul{width: 100%; font-size: 0; margin:0; padding: 0; word-spacing:0;}
.commu-fac ul li{
  width:32%; 
  margin-left: 1%; margin-bottom:5px; 
  border:2px solid #d0d0d0;
  padding: 20px 0; 
  border-radius: 10px; 
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  -o-border-radius: 10px;
  display: inline-block; 
  text-align: center;
}
.commu-fac ul li:nth-child(3n){margin-right:1%;}
.commu-fac ul li img{max-width: 40px; width: 100%}
.commu-fac ul li p{line-height: 1.2; font-size: 13px; word-spacing: -2pt}
a.btn-Bfix{
  position: fixed !important;
  bottom: 0;
  left: 0;
  height: 60px;
  width: 100%;
  background-color: #3f4d5c;
  border:1px solid #3f4d5c;
  border-radius:0;
  color: #fff !important;
  line-height: 60px;
  margin:0 !important;
  font-size: 18px;
}
a.btn-Bfix:hover {background-color: #242e39;}