﻿@charset "utf-8";


/* 달력 */
.date_view_box{ position:relative; border:1px solid #ddd; text-align:center; border-bottom:0; background-color:#fff; padding:12px 16px 9px; overflow:hidden}
.sp{ float:left; display:inline-block; background:url('/images/ad/calendar/sp_png.png') no-repeat}
.date_view{ display:inline-block;}
.date_view .date{ display:inline-block; font-size:1rem; font-weight:900; line-height:1;}
.date_view .sp{ width:11px; height:16px; margin:0 1px 0 0}
.date_view .ddot{ width:10px; background-position:-149px -22px}
.date_view .d0{ background-position:0 -22px;}
.date_view .d1{ background-position:-16px -22px;}
.date_view .d2{ background-position:-31px -22px;}
.date_view .d3{ background-position:-45px -22px;}
.date_view .d4{ background-position:-61px -22px;}
.date_view .d5{ background-position:-76px -22px;}
.date_view .d6{ background-position:-90px -22px;}
.date_view .d7{ background-position:-105px -22px;}
.date_view .d8{ background-position:-121px -22px;}
.date_view .d9{ background-position:-135px -22px;}
.date_view .btn_area{ display:inline-block; margin:0 0 0 5px; padding: 0; vertical-align:top}
.date_view button{height:20px; padding:0; border:1px solid #b4b4b4; background:#fff url('/images/ad/calendar/sp_png.png') no-repeat; font-family:dotum; font-size:11px; color:#666; letter-spacing:-1px;}
.date_view .prev{ float:left; margin-right:-1px; width:22px; background-position:-58px 4px; *background-position:-59px 3px}
.date_view .next{ float:left; width:22px; background-position:-72px 4px; *background-position:-72px 3px}
.date_view .today{ float:left; margin:0 0 0 8px; padding:2px 6px 0 6px; line-height:12px; background-image:none;}
.btn_common { display:inline-block}
.date_view_box .btn_common { position:absolute; top:11px; right:10px;}
.btn_common a { display:inline-block; font-family:dotum; font-size:11px; color:#666; letter-spacing:-1px; border:1px solid #b4b4b4; background:#fff url('/images/ad/calendar/sp_png.png') no-repeat}
.btn_common .print{ background-position:6px -45px; padding:2px 5px 0 22px;}
/* 달력테이블 181008 수정 */
.cldTbl table{ width:100%; position:relative; border-bottom:1px solid #e4e5e7; border-right:1px solid #e4e5e7;}
.cldTbl th, .cldTbl td{border-top:1px solid #e4e5e7; border-left:1px solid #e4e5e7;}
.cldTbl thead th{ background-color:#f9f9f9; color:#555; font-size:12px; line-height:24px}
.cldTbl thead th:first-child{ color:#ff000a}
.cldTbl thead th:last-child{ color:#005fca}
.cldTbl td{vertical-align:top; position:relative; padding:25px 0 16px; height:84px; font-size:12px}
.cldTbl td.today{ background:#f1f1f1;}
.cldTbl td:hover{ background:#ecf7ff;}
.cldTbl td.on{background:url('/images/ad/calendar/calendar_td_on.png') repeat}
.cldTbl td.closed{background:url('/images/ad/calendar/calendar_td_close.png') repeat}
.cldTbl tbody tr.week td:first-child{ color:#ff000a}
.cldTbl tbody tr.week td:last-child em{ color:#005fca}
.cldTbl .week td em { position:absolute; font-style:normal; top:5px; left:8px; font-family: verdana; font-size: 11px; font-weight: bold}
.cldTbl .week td em span { font-weight:normal; font-size:12px; font-family: Malgun Gothic, '맑은고딕', sans-serif; margin-left:5px;}
/*.cldTbl .week td div { height:84px; overflow:hidden; padding:0 14px; overflow-y:auto; color:#555;}*/
.cldTbl .week td div {  padding:0 14px; color:#555;}
.cldTbl .week td a { display:block;}
.cldTbl .week td .state{ display:block; text-align:center; color:#fff; font-size:13px; height:22px; line-height:20px; margin-top:6px;}
.cldTbl .week td .state.not{background-color:#b7b7b7}
.cldTbl .week td .state.ok{ background-color:#27afbd;}
.cldTbl .sun{color:#ff000a}
.cldTbl .sun.disable{ color:#f0a9a9 !important}
.cldTbl .disable{ color:#b3b3b3}






@media (max-width:800px) {
	
	/* 프로그램캘린더 */
	.date_view_box{ padding:2% 0}
	.cldTbl table{ width:101%; border-bottom:0; border-right:0}
	.cldTbl td{ vertical-align:middle; padding:0; height:auto; min-height:30px}
	.cldTbl .week td em {top:8px; left:8px}
	.cldTbl .week td div { padding:8px 0 8px; height:auto}
	.cldTbl .week td div li { width:100%; box-sizing:border-box; padding:0 15px}
	.cldTbl .week td div li a { margin:0; line-height:25px}
	.cldTbl .week td a { display:inline-block; margin-right:8px;}
	.cldTbl .week td.today{ padding:0}
	.cldTbl .week td.today div{ display:none; background-color:#fff}
	.cldTbl .disable{ display:none !important}	
	/* 달력 Force table to not be like tables anymore 2 */
	#no-more-calendar table, #no-more-calendar thead, #no-more-calendar tbody, #no-more-calendar th, #no-more-calendar td, #no-more-calendar tr {display: block; }
	#no-more-calendar thead tr { position: absolute; top: -9999px; left: -9999px}
	#no-more-calendar tr { border: 1px solid #d2dae2; border-bottom:0; border-top:0 }
	#no-more-calendar tr:first-child { border-top: 1px solid #d2dae2}
	#no-more-calendar td { border: none; border-bottom: 1px solid #d2dae2; position: relative; padding-left: 15%; white-space: normal; text-align:left}
	#no-more-calendar td:before { position:absolute; top:8px; left:6px; width: 80%; padding-right:10px; white-space:nowrap; text-align:left; font-family:'NanumBold'; color:#4e515e}
	#no-more-calendar td:before { content: attr(data-title); }
	/* 캘린더_레이어 */
	.cldTbl .week td div li:hover a div.calendar_show { display:none}

}

