@charset "utf-8";
/*반응형!*/

/*BtnArea*/
.BtnArea {text-align:right; margin-bottom:30px}
.BtnArea button {background:#fff; border:1px solid #ddd; cursor:pointer; font-size:14px; font-family:'NotoKR'; height:40px; padding:0 15px; margin-left:-5px; color:#000;}
.BtnArea button:hover {background:#000; border-color:#000; color:#fff; transition:all .2s}

/* 페이지,검색영역 2018-12-13 수정 */
div.board_info {clear:both; font-size:14px; overflow:hidden; position:relative; margin-bottom:25px}
div.board_info .page_info {color:#666; float:left; margin-top:8px}
div.board_info .page_info .txt_bold {font-weight:500}
div.board_info .page_info strong {color: #fd6800}
/*검색*/
div.board_info .Search_rss {float:right; text-align:right; /*width:60%*/}
div.board_info .Search_rss a.icon_rss {display:none}
div.board_info fieldset {clear:both; display:table; width:100%; position:relative; overflow:hidden}
div.board_info fieldset select,
div.board_info fieldset input,
div.board_info fieldset button {border:1px solid #ddd; border-right:0; display:block; width:100%; height:100%; padding:0 5px}
div.board_info fieldset span {display:table-cell; height:40px; margin-left:-4px; vertical-align:middle}
div.board_info fieldset span:first-of-type {margin-left:0}
div.board_info fieldset span.form-select {width:25%}
div.board_info fieldset span.form-input {width:40%}
div.board_info fieldset span.form-btn {width:10%}
div.board_info fieldset span.form-btn button {background-color:#353c47; border:1px solid #353c47; color:#fff; cursor:pointer; font-size:0; position:relative; transition:background .2s; vertical-align:top}
div.board_info fieldset span.form-btn button:after {content:''; color:#fff; display:block; font-family:'xeicon'; font-size:20px}
div.board_info fieldset span.form-btn button:hover,div.board_info fieldset button:focus {background-color:#404759}

/*Board list*/
div.tstyle_list {border-top:1px solid #666; border-bottom:1px solid #e4e4e4; font-size:14px}
div.tstyle_list > div > ul {display:table; table-layout:fixed; width:100%; clear:both; overflow:hidden}
div.tstyle_list > div > ul > li {border-left:1px solid #DCD9D9; display:table-cell; font-weight:normal; min-height:44px; padding:10px; text-align:center; text-overflow:ellipsis; /*white-space:nowrap;*/ width:10%; vertical-align:middle}
div.tstyle_list > div > ul > li:first-child{border-left:0}
div.tstyle_list > div.dhead {border-bottom:1px solid #bfbfbf}
div.tstyle_list > div.dhead > ul li {background:#f9f9f9; color:#333; font-weight:500}
div.tstyle_list > div.dbody > ul {border-bottom:1px solid #e4e4e4}
div.tstyle_list > div.dbody > ul:last-child {border-bottom:0}
div.tstyle_list > div.dbody > ul.notice {background:#f9f9f9}
div.tstyle_list > div.dhead > ul li.title,
div.tstyle_list > div.dbody > ul > li.title {width:auto}
div.tstyle_list > div.dbody > ul > li a {color:#000; display:block; overflow:hidden; text-align:left; text-overflow:ellipsis; white-space:nowrap; width:85%}
div.tstyle_list > div.dbody > ul > li span.re-num {color:#d85430}
div.tstyle_list > div.dbody > ul > li a:hover {text-decoration:underline}
div.tstyle_list > div.dbody > ul > li a.btn-line {color:none; display:inline-block; width:auto}
div.tstyle_list > div.dbody > ul > li a.btn-line:hover {color:#fff; text-decoration:none}

/*Board form*/
div.tstyle_form {border-top:1px solid #666; border-bottom:1px solid #e4e4e4; font-size:14px; margin-bottom:30px}
div.tstyle_form > div > ul {clear:both; overflow:hidden}
div.tstyle_form > div.dhead {display:none}
div.tstyle_form > div.dbody > ul > li {border-bottom:1px solid #DCD9D9; display:table; font-size:14px; font-weight:500; table-layout: fixed; text-align:left; width:100%; min-height:44px}
div.tstyle_form > div.dbody > ul > li:last-child {border-bottom:none}
div.tstyle_form > div.dbody > ul > li > label {background:#f9f9f9; display:table-cell; width:20%; height:50px; line-height:50px; padding-left:20px}
div.tstyle_form > div.dbody > ul > li > div.form-box,
div.tstyle_form > div.dbody > ul > li > div.form-select {border-left:1px solid #DCD9D9; display:table-cell; width:75%; padding:10px}
div.tstyle_form > div.dbody > ul > li > div.form-box input[type="radio"] {height:auto; vertical-align:-2px}
div.tstyle_form > div.dbody > ul > li > div > span {display:inline-block}
div.tstyle_form > div.dbody > ul > li > div select, div.tstyle_form > div.dbody > ul > li > div input {border:1px solid #ddd; height:100%; padding:5px; width:100%}
div.tstyle_form > div.dbody > ul > li > div.form-select span {width:20%}
div.tstyle_form > div.dbody > ul > li > div.form-select .info {width:100%}
div.tstyle_form > div.dbody > div.nodata {text-align:center; padding:50px 0; width:100%}

/*Board View 손윤하 수정*/
div.tstyle_view {border-top:1px solid #666; font-size:14px; margin-bottom:30px}
div.tstyle_view div.title {background:#f9f9f9; color:#333; clear:both; font-size:1.6em; line-height:1.6em; font-weight:500; padding:25px 20px; text-align: center}
div.tstyle_view ul.head {background:#f9f9f9; border-top:1px solid #e4e4e4; border-bottom:1px solid #bfbfbf; width:100%; text-align:center}
div.tstyle_view ul.head li {display:inline-block; margin-left:-4px; padding:6px 10px}
div.tstyle_view ul.head li strong {position:relative; padding-right:5px}
div.tstyle_view ul.head li strong:after {content:':'; padding-left:5px; vertical-align:1px}
div.tstyle_view div.tb_contents {clear:both; padding:20px; border-bottom:1px solid #e2e3e6; word-break:keep-all}

/*programNav 2019-02-07 수정*/
#content .board_pager {clear:both; margin:30px auto; text-align:center; overflow:hidden}
#content .board_pager .inner {display:table; margin:0 auto}
#content .board_pager a {box-sizing:border-box; border:1px solid #ddd; color:#999; display: inline-block; font-size:14px; text-align:center; padding:5px 0 4px; width:32px; margin:0 2px; vertical-align:middle; line-height:normal}
#content .board_pager a.pageNone {border:0 none; color:#373737}
#content .board_pager a.pageNone:hover {border:1px solid #ddd; transition:all .2s}
#content .board_pager a.pageNow {background:#333; border-color:#333; color:#fff}
#content .board_pager a.pageNow strong {color:#fff}
#content .board_pager a.pageFirst,
#content .board_pager a.pagePrev,
#content .board_pager a.pageNext,
#content .board_pager a.pageLast {font-size:0}
#content .board_pager a:before{font-size:12px; font-weight:bold; font-family:'icomoon' !important; line-height:19px}
#content .board_pager a.pageFirst:before{content:'\e910'}
#content .board_pager a.pagePrev:before{content:'\e90f'}
#content .board_pager a.pageNext:before{content:'\e924'}
#content .board_pager a.pageLast:before{content:'\e926'}

/*calendar*/
div.DateArea {clear:both; position:relative; padding:0 0 20px; overflow:hidden; text-align:center}
div.DateArea h1 {display:inline-block; color:#333; font-size:1.5em; font-weight:600; line-height: 39px}
div.DateArea .btn-area {width:100%; display:flex; flex-direction:row; justify-content:flex-end; align-items:center; gap:1rem; padding-right:10px;}
div.DateArea a {}
div.DateArea a.pre_month {display:block; border-top: 1px solid #001b47; border-right: 1px solid #001b47; width: 7px; height: 7px; transform: rotate(-135deg);}
div.DateArea a.next_month {display:block; border-top: 1px solid #001b47; border-right: 1px solid #001b47; width: 7px; height: 7px; transform: rotate(45deg);}
div.DateArea a.All-schedule {border:1px solid #ddd; color:#666; padding:0 20px; width:auto; line-height:34px; border-radius:100px;}

@media screen and (min-width:1025px) {
	div.DateArea a.pre_month:hover {border-color:#005bac;}
	div.DateArea a.next_month:hover {border-color:#005bac;}
	div.DateArea a.All-schedule:hover {border:1px solid #005bac; background:#005bac; color:#fff}
}
div.CalendarList div.Bhead {border-top:1px solid #404759; border-bottom:1px solid #404759;}
div.CalendarList div.Bhead > ul{display:flex; flex-direction:row; width:100%}
div.CalendarList div.Bhead > ul > li {background:#fff; color:#404759; border-left:1px solid #f3f3f3; flex:1;text-align:center; padding:10px 0}
div.CalendarList div.Bhead > ul > li.sun{color:rgb(222, 3, 3); border-left:none;}
div.CalendarList div.Bhead > ul > li.sat{color:rgb(222, 3, 3);}
div.CalendarList div.Bbody > ul > li:first-child{border-left:none;}
div.CalendarList div.Bbody > ul > li div.sat {color:rgba(23, 77, 160, 1); border-right:none;}
div.CalendarList div.Bbody > ul > li div.sun {color:rgb(222, 3, 3); border-left:none;}
div.CalendarList div.Bbody > ul > li {border-bottom:1px solid #eee; width:100%; display:flex; flex-direction:row;}
div.CalendarList div.Bbody > ul > li > div {border-left:1px solid #eee; flex:1; font-size:0.95em; min-height:100px; position:relative; text-align:left; padding:10px; line-height:22px;  position:relative}
div.CalendarList div.Bbody > ul > li > div:after {content:''; clear:both; display:block}
div.CalendarList div.Bbody > ul > li > div span.day {display:inline-block; min-width:20px}
div.CalendarList div.Bbody > ul > li > div span.status-type01 {background:rgb(183, 66, 19); border-radius:3px; color:#fff; display:block; font-size:0.85em; padding:0 5px; text-align:center; width:100%}/*예약상태*/
div.CalendarList div.Bbody > ul > li > div > *:not(.day) + *  {margin-top:0.2rem; padding-top:0.2rem; border-top:1px solid #ddd;}
div.CalendarList div.Bbody > ul > li > div > span {display:block; line-height:1.2;}
div.CalendarList div.Bbody > ul > li > div > span.present{color:#666; font-size:0.9em; letter-spacing:-1px}/*예약현황*/
div.CalendarList div.Bbody > ul > li > div > span.no {text-decoration: line-through; color:#777;}
div.CalendarList div.Bbody > ul > li > div > a {color:#000; display:block;}
div.CalendarList div.Bbody > ul > li > div > a:hover {color:#035836;}

/*리스트*/
div.CalendarList div.Bbody ul.list li {font-size:0.9em}
div.CalendarList div.Bbody ul.list li a {color:#000;  display:block;  position:relative; padding-left:7px}
div.CalendarList div.Bbody ul.list li a:hover {text-decoration:underline}
div.CalendarList div.Bbody ul.list li a:after {content:''; background:#999; border-radius:50px; width:3px; height:3px; position:absolute; left:0; top:8px}
/*효과*/
div.CalendarList div.Bbody > ul > li > div:hover {background:rgba(0,0,0,0.01)}
div.CalendarList div.Bbody > ul > li > a:hover {text-decoration:underline}
/*오늘*/
 div.CalendarList div.Bbody > ul > li > div.current{background:rgba(0,0,0,0.05)}
/*휴관일*/
div.CalendarList div.Bbody > ul > li > div.closeday,
div.holiday {background:rgba(160, 75, 23, 0.01)}
div.holiday span.day {color:rgb(222, 3, 3)}
div.CalendarList div.Bbody > ul > li > div.closeday span.closeday,
span.holiday {background:rgb(218, 108, 108); border-radius:50px; color:#fff; font-size:0.8em; padding:0 5px}

@media screen and (max-width:768px) {

	/*Board form*/
	div.tstyle_form > div.dbody > ul > li > label {padding-left:10px;  width:50%}
	div.tstyle_form > div.dbody > ul > li > span {border-left:0}

	/*calendar*/
	.Bhead {display:none}
	.Bbody {border-top:1px solid #404759}

	div.DateArea {text-align:left}
	div.DateArea .btn-area {width:auto; right:0; left: inherit; text-align:right}
	div.DateArea a.pre_month,  div.DateArea a.next_month, div.DateArea a.All-schedule {position:relative; left:0; right:0; float:left; margin-left:5px}
	div.CalendarList div.Bbody > ul > li {display:block;}
	div.CalendarList div.Bbody > ul > li > div {border:1px solid #f3f3f3 !important; display:block; width:100%; padding:10px; height:auto; margin-top:-1px}
	div.CalendarList div.Bbody > ul > li > div span{vertical-align:middle}
	div.CalendarList div.Bbody > ul > li > div span.day {display:block; float:left;  width:30px}
	div.CalendarList div.Bbody > ul > li > div span.status-type01 {display:inline-block; width:auto}
	div.CalendarList div.Bbody > ul > li > div > a{display:inline-block; width:auto}
	div.CalendarList div.Bbody > ul > li > div span.present{font-size:1em; float:right; padding:10px}
	div.CalendarList div.Bbody > ul > li > div:not(:has(.day)) {display:none;}
	div.CalendarList div.Bbody ul.list {float:left}
	/*예약현황*/

	/*Board list : div style 18-11-27*/
	.m-hidden {display:none !important} /*모바일에서 숨김*/
	div.tstyle_list > div.dhead {display:none}
	div.tstyle_list > div > ul > li {border-left:0; display:block; float:left; width:auto; min-height:auto; padding:0 5px; width:auto !important}
	div.tstyle_list > div.dbody > ul {border-bottom:1px solid #e4e4e4; padding:10px 5px 7px}
	div.tstyle_list > div.dbody > ul:hover {background:#f8f8f8}
	div.tstyle_list > div.dbody > ul > li.title {display:block; width:100% !important}
	div.tstyle_list > div.dbody > ul > li.title:after {content:none}
	div.tstyle_list > div.dbody > div.nodata {text-align:center; padding:50px 0}
}

@media screen and (max-width:640px) {

	/*calendar*/
	div.DateArea h1 {font-size:28px}

	/* 게시판 검색*/
	div.board_info {margin-bottom:15px}
	div.board_info .Search_rss {background:#f9f9f9; border:1px solid #ddd; padding:5%; text-align:center; width:100%}
	div.board_info .page_info {float:right; margin-top:15px}

	div.board_info fieldset span {margin-left:0}
	div.board_info fieldset span.form-select,
	div.board_info fieldset span.form-input,
	div.board_info fieldset span.form-btn {display:block; width:100%}

	div.tstyle_form > div.dbody > ul > li > div.form-select span {width:29%}


}