﻿@charset "utf-8";
#container_sub{background:#f2f2f2;}

/* tabmenu */
#tabmenu{overflow:hidden; width:100%; margin:0 0 12px 0;}
#tabmenu li{float:left; width:16.66%; padding:0 5px 5px 0; box-sizing:border-box;}
#tabmenu li a{display:block; height:30px; line-height:30px; border:1px solid #b2d97f; color:#5aa000; font-weight:700; text-align:center; text-decoration:none; letter-spacing:-1px;}
#tabmenu li.on a{background:#e0ffba; color:#4b8500; border:1px solid #4b8500;}
#tabmenu li a:hover,
#tabmenu li a:focus,
#tabmenu li a:active{background:#e0ffba; color:#4b8500; border:1px solid #4b8500;}

#sub_summary h3{padding:10px 0 15px 0; font-size:24px;}
#sub_summary dt{padding:0 0 8px 0; font-size:17px; font-weight:700;}
#sub_summary ol{padding-left:7px;}
#sub_summary dd p{padding-bottom:5px;}
#sub_summary ol ul, #sub_summary ol ol{padding-bottom:10px;}

.sns {margin-bottom:30px; text-align:right;}
.sns a{display:inline-block; margin:0 3px 0 0; width:35px; height:35px; font-size:0; text-indent:-999px; background:url(/images/sub/btn_band.png) no-repeat;}
.sns .fb{background-image:url(/images/sub/btn_facebook.png);}
.sns .tw{background-image:url(/images/sub/btn_twitter.png);}
.sns .url{background-image:url(/images/sub/btn_url.png);}

/* 생방송 */
#sub_live{max-width:873px; margin:0 auto}
#sub_live .list{padding:10px 35px 20px; margin:0 0 50px; background:#ecf3fd;}
#sub_live .tit{padding:0 0 24px; text-align:center;}
#sub_live .tit *,
#sub_live .con *{display:inline-block; vertical-align:top;}
#sub_live .tit p{padding:0 5px 0 0; line-height:52px; font-size:42px; color:#283954; letter-spacing:-1px;}
#sub_live .tit p span{color:#295995;}
#sub_live .tit .date strong{width:70px; height:50px; line-height:50px; font-size:36px; color:#fff; font-weight:100; text-align:center; border-radius:10px; background:#295995;}
#sub_live .tit .date span{padding:0 2px 8px 3px; font-size:24px; color:#353536; vertical-align:bottom;}
#sub_live .tit .date .week{width:60px; font-size:30px; background:#f19f00;}
#sub_live .con{overflow:hidden; width:100%; padding:23px 0 6px 0; border:1px solid #efefef; background:#fff; box-sizing:border-box;}
#sub_live .con a{float:left; position:relative; width:31.33%; height:78px; padding:14px 45px 0 15px; margin:0 1% 15px 1%; box-shadow:inset 0 0 0 1px #ccc; box-sizing:border-box; text-align:left; text-decoration:none;}
#sub_live .con a:hover em,
#sub_live .con a:focus em{text-decoration:underline;}
#sub_live .con a em{line-height:110%; font-size:20px; font-weight:800;}
#sub_live .con a span{position:absolute; top:15px; right:16px; width:35px; height:17px; line-height:17px; font-size:12px; color:#fff; border:1px solid #5b5f62; border-radius:3px; text-align:center; background:#7c7c7c;}
#sub_live .con a p{display:block; font-size:15px; color:#b1aeae; font-weight:400;}
#sub_live .con .ready,
#sub_live .con .on{box-shadow:inset 0 0 0 3px #f39197; background:#fef3f4;}
#sub_live .con .on span{color:#f01a27; border-color:#1f1f1f; background:#292929;}
#sub_live .con .on span:before{content:''; display:inline-block; width:7px; height:7px; margin:5px 2px 0 0; border-radius:50%; vertical-align:top; background:#f01a27;}
#sub_live .con .ready p,
#sub_live .con .on p{color:#e1000e;}
#sub_live .con .stop{box-shadow:inset 0 0 0 3px #295995; background:#e9f1f9;}
#sub_live .con .stop p{color:#295995;}
#sub_live .con .stop span{border-color:#12427f; background:#295995;}
#sub_live .con .done{box-shadow:inset 0 0 0 3px #ccc; background:#f4f4f4;}
#sub_live .con .done p{color:#8b8888;}
#sub_live .fc-scroller {height: auto !important;}

#sub_live .list .info{line-height:130%; padding:10px 0 0 0; color:#5d5a5a; font-size:14px;}
#sub_live .list .infocolor_bl{color:#000;font-weight:900;}
#sub_live .list .infocolor_b{color:#00f;display:inline-block;}

#weekscheule h3{margin:25px 0 10px; font-size:24px; font-weight:800;}
.days > ul > li{border-bottom:1px solid #ddd;}
.days > ul > li:before{top:20px; left:8px;}
.days > ul > li > a{display:block; padding:10px 0 10px 10px;}
.days > ul > li > ul{padding:10px 0 10px 15px; margin:0 0 0 -8px; background:#f0f0f0;}

@media all and (max-width:1200px) {
	#sub_live .con a{padding:15px 35px 0 12px;}
	#sub_live .con a em{font-size:18px;}
	#sub_live .con a span{top:13px; right:10px;}

	#tabmenu li{width:20%;}
	#tabmenu li:nth-child(5n){padding-right:0;}
}
@media all and (max-width:1024px) {
	#sub_live .tit p{line-height:48px; font-size:37px;}
	#sub_live .tit .date strong{width:auto; padding:0 12px; height:45px; line-height:45px; font-size:32px;}
	#sub_live .tit .date span{padding-bottom:6px; font-size:22px;}
	#sub_live .tit .date .week{width:auto; font-size:28px;}
}
@media all and (max-width:768px) {
	.sns a{width:32px; height:32px; background-size:contain;}

	#sub_live .list{padding:5px 27px 20px; margin:0 0 40px;}
	#sub_live .tit{padding:0 0 15px;}
	#sub_live .tit p{line-height:40px; font-size:29px;}
	#sub_live .tit .date strong{height:37px; line-height:37px; padding:0 10px; font-size:25px;}
	#sub_live .tit .date span{padding-bottom:2px; font-size:18px;}
	#sub_live .tit .date .week{font-size:22px;}
	#sub_live .con a{width:48%;}

	#tabmenu li{width:33.3%;}
	#tabmenu li:nth-child(5n){padding-right:5px;}
	#tabmenu li:nth-child(3n){padding-right:0;}
	
	#sub_summary h3,
	#weekscheule h3{font-size:23px;}
}
@media all and (max-width:530px) {
	.sns a{width:29px; height:29px;}

	#sub_live .list{padding:5px 13px 15px; margin:0 0 30px;}
	#sub_live .tit{padding:0 0 11px;}
	#sub_live .tit p{line-height:33px; font-size:26px;}
	#sub_live .tit .date strong{height:31px; line-height:31px; padding:0 8px; font-size:21px;}
	#sub_live .tit .date span{font-size:16px;}
	#sub_live .tit .date .week{font-size:19px;}
	#sub_live .con{padding:9px 0 0 0;}
	#sub_live .con a{height:85px; margin:0 1% 9px 1%;}
	#sub_live .con a em{font-size:16px;}
	#sub_live .con a p{padding:5px 0 0 0; font-size:14px;}
	#sub_live .con a span{width:26px; font-size:11px;}
	#sub_live .con .on span:before{width:6px; height:6px; margin:6px 1px 0 0;}
	#sub_live .list .info{font-size:13px;}

	#tabmenu li{width:50%;}
	#tabmenu li:nth-child(3n){padding-right:5px;}
	#tabmenu li:nth-child(2n){padding-right:0;}

	#sub_summary h3,
	#weekscheule h3{font-size:22px;}
}
@media all and (max-width:395px) {
	#sub_live .list{padding:5px 9px 12px; margin:0 0 25px;}
	#sub_live .tit{padding:0 0 8px;}
	#sub_live .tit p{line-height:29px; font-size:23px;}
	#sub_live .tit .date strong{height:27px; line-height:27px; padding:0 6px; font-size:19px;}
	#sub_live .tit .date span{font-size:15px;}
	#sub_live .tit .date .week{font-size:17px;}
	#sub_live .con a em{font-size:15px;letter-spacing: -1.9px;}
	#sub_live .list .info{font-size:12px;}

	#sub_summary h3,
	#weekscheule h3{font-size:21px;}
}

/* 통합검색*/
#sub_search .search{position:relative; width:100%; padding:62px 0; margin:0 0 30px 0; border:1px solid #e6e6e6; background:#f1f1f1;}
#sub_search .search:before{content:''; display:block; position: absolute; top:40px; left:30px; width:221px; height:163px; background:url(/images/sub/bg_search.png) no-repeat;}
#sub_search .search *{display:inline-block; vertical-align:top;}
#sub_search .search form{width:100%; text-align:center;}
#sub_search .search fieldset{display:block; position:relative; width:100%; max-width:64.4%; margin:0 0 0 31%; box-sizing:border-box;}
#sub_search .search label{display:block; position:absolute; top:0; left:32px; line-height:61px; color:#2d3f6c; font-size:19px; font-weight:900;}
#sub_search .search input[type="text"]{width:100%; height:61px; line-height:61px; padding:0 70px 0 120px; border-radius:61px; border:3px solid #e6e6e6; box-sizing:border-box;}
#sub_search .search button{position:absolute; top:11px; right:23px; width:38px; height:37px; padding:0; font-size:0; text-indent:-999px; background:transparent;}
#sub_search .search button:before,
#sub_search .search button:after{content:''; display:block; position:absolute; top:0; left:0; width:31px; height:31px; border:6px solid #2d3f6c; border-radius:50%; box-sizing:border-box;}
#sub_search .search button:after{top:auto; left:auto; bottom:0; right:3px; width:18px; height:6px; border:none; border-radius:6px; transform:rotate(45deg); transform-origin:100% 100%; background:#2d3f6c;}
#sub_search .result .tit{padding:0 0 20px; font-size:20px; font-weight:700; text-align:center;}
#sub_search .result h4{padding:0 0 10px 0; margin:0 0 8px 0; font-size:24px; font-weight:800; border-bottom:2px solid #707070;}
#sub_search .result h4 span{display:inline-block; padding:0 0 0 5px; font-size:16px; color:#707070;}
#sub_search .result li{padding:20px 0 20px 10px; border-bottom:1px solid #ccc;}
#sub_search .result li em{display:inline-block; padding:0 5px 0 0; font-size:18px; font-weight:700;}
#sub_search .result li .red{font-weight:800;}
#sub_search .result li .con{display:block; padding:0px 0px 0px 15px; height:44px; line-height:22px; margin:10px 0; color:#707070; overflow:hidden; text-overflow:ellipsis; white-space:normal; word-wrap:break-word; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
#sub_search .result li .con2{display:block; padding:0px 0px 0px 15px; line-height:22px; margin:10px 0; color:#707070; overflow:hidden; text-overflow:ellipsis; white-space:normal; word-wrap:break-word; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
#sub_search .result .more{display:block; width:120px; height:35px; line-height:37px; margin:20px auto 30px; box-shadow:3px 3px 5px #ccc; color:#fff; background:#636a7d; text-align:center; transition:0.3s ease;}
#sub_search .result .more:hover{box-shadow:2px 2px 2px #ccc; background:#515868;}
@media all and (max-width:1220px) {
	#sub_search .search:before{width:25%; background-size:contain;}
}
@media all and (max-width:768px) {
	#sub_search .search{padding:40px 0; margin:0 0 25px;}
	#sub_search .search:before{top:25px; left:20px;}
	#sub_search .search fieldset{text-align:center;}
	#sub_search .search label{left:20px; line-height:55px; font-size:18px;}
	#sub_search .search input[type="text"]{height:55px; line-height:55px; padding:0 60px 0 90px; border-radius:55px;}
	#sub_search .search button{width:30px; height:30px;}
	#sub_search .search button:before{width:25px; height:25px;}
	#sub_search .search button:after{width:16px;}
	#sub_search .result h4{font-size:23px;}
}
@media all and (max-width:568px) {
	#sub_search .search{padding:30px 0;}
	#sub_search .search:before{display:none;}
	#sub_search .search fieldset{max-width:85%; margin:0 auto;}
	#sub_search .search label{font-size:17px;}
	#sub_search .search input[type="text"]{padding-left:85px;}
	#sub_search .result .tit{font-size:19px;}
	#sub_search .result h4{font-size:22px;}
	#sub_search .result h4 span{font-size:15px;}
	#sub_search .result li{padding:18px 0 18px 5px;}
}
@media all and (max-width:400px) {
	#sub_search .search{padding:25px 0;}
	#sub_search .search label{font-size:16px;}
	#sub_search .search input[type="text"]{padding-left:78px;}
	#sub_search .result .tit{font-size:18px;}
	#sub_search .result h4{font-size:21px;}
	#sub_search .result h4 span{font-size:14px;}
	#sub_search .result li{padding:16px 0 16px 3px;}
}