@charset "utf-8";
#container_main{background:#f2f2f2;}
.content{overflow:hidden; padding:17px 0 26px; box-sizing:border-box;}

/* 검색*/
#search{z-index:94; width:100%; margin:0 0 15px;}
#search form{padding:24px 167px 24px 165px; box-sizing:border-box; background:#37405b url(/images/main/bg_search.jpg) no-repeat 100% 0;}
#search form fieldset{display:block; position:relative; width:100%; max-width:1200px; margin:0 auto; box-sizing:border-box;}
#search label{display:block; position:absolute; top:0; left:52px; line-height:61px; color:#2d3f6c; font-size:19px; font-weight:900;}
#search input[type="text"]{width:100%; height:61px; line-height:61px; padding:0 70px 0 150px; border-radius:61px; border:none; background:#fff; box-sizing:border-box;}
#search ::-webkit-input-placeholder{color:rgba(0,0,0,0.3);}
#search :-ms-input-placeholder{color:rgba(0,0,0,0.3);}
#search ::placeholder{color:rgba(0,0,0,0.3);}
#search button{position:absolute; top:11px; right:23px; width:38px; height:37px; padding:0; font-size:0; text-indent:-999px; background:transparent;}
#search button:before,
#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;}
#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;}

.sec2{float:left; width:32.5%; position:relative; background:#fff;}
.sec3{margin:0 0 0 15px;}
.sec1{position:relative; float:right; width:32.5%; height:599px; border:1px solid #cdcdcd; box-sizing:border-box; background:#fff;}
.sec1:before{content:''; display:block; position:absolute; bottom:20px; left:0; width:100%; height:157px; background: url(/images/main/bg_live.png) no-repeat 50% 100%;}

.sec2 > .tit{height:133px; color:#fff; font-size:14px; word-break:keep-all; letter-spacing:-1px; background:#0098dc;}
.sec3 > .tit{background:#65b400;}
.sec2 > .tit *{display:block;}
.sec2 > .tit a{position:relative; height:100%; padding:28px 0 0 31px; color:#fff; text-decoration:none; box-sizing:border-box;}
.sec2 > .tit strong{margin:0 0 7px; font-size:22px; font-weight:900;}
.sec2 > .tit span{width:60%; line-height:150%; color:#d2f1ff;}
.sec2 > .tit a:hover span,
.sec2 > .tit a:focus span,
.sec2 > .tit a:active span{text-decoration:underline;}
.sec3 > .tit span{color:#e9fecd;}

.sec2 > .tit a:after{content:""; display:block; position:absolute; bottom:-11px; right:10px; width:150px; height:126px; background:url(/images/main/bg_tit1.png) no-repeat;}
.sec3 > .tit a:after{background-image:url(/images/main/bg_tit2.png);}

.con{overflow:hidden; width:100%; padding:34px 39px 10px 25px; border:1px solid #cdcdcd; border-top:none; box-sizing:border-box;}
.con h4{height:35px; font-size:19px; color:#383838; font-weight:900;}

#slogan{padding:35px 0 0 28px; color:#8f8686; font-weight:100; letter-spacing:-1px; word-break:keep-all;}
#slogan .tit1{font-size:20px; color:#fc8001; font-weight:800;}
#slogan .tit2{padding:3px 0 13px 0; line-height:110%; color:#2f2f2f; font-size:37px; font-weight:900; letter-spacing:-3px;}  

#live{position:relative; padding:59px 29px 0 30px; box-sizing:border-box;}
#live .tit{position:relative; overflow:hidden; width:100%; font-weight:100;}
#live h4{font-size:18px; font-weight:100; color:#535353;}
#live h4 a:after{content:''; display:inline-block; width:15px; height:15px; margin:0 0 0 5px; transition:0.3s ease; background:url(/images/main/ico_more2.gif) no-repeat 100% 50%;}
#live h4 a:hover:after{transform:rotate(180deg);}
#live .onair{float:left; margin:0 0 7px; line-height:100%; font-size:52px; color:#fc8001; letter-spacing:-2px;}
#live .onair span{font-weight:900;}
#live .today{float:right; padding:5px 0 0 0; color:#6e6c6d; font-size:14px; font-weight:800; text-align:center;}
#live .today .day{line-height:110%; font-size:24px; font-weight:900;}
#live .list_wrap{position:relative; height:100px; width:100%; margin:0 auto; padding:12px 0 0 15px; box-sizing:border-box; color:#4d4c4c; border:1px solid #ccc; background:#fbfbfb;}
#live .list_wrap *{vertical-align:top;}

#live .list{width:100%; padding:0 35px 0 0; box-sizing:border-box;}
#live .list p:not(:first-of-type){display:none;}
#live .list.slick-initialized p:not(:first-of-type){display:block;} 
#live .list p{position:relative; width:100%; height:24px; padding:0 40px 0 8px; box-sizing:border-box;}
#live .list p:before{content:''; display:block; position: absolute; top:8px; left:0; width:3px; height:3px; background:#727272;}
#live .list p.none{padding-right:0;}
#live .list p *{display:block; vertical-align:top;}
#live .list a{width:100%; color:#4d4c4c;}
#live .list em{width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
#live .list a:hover em,
#live .list a:focus em,
#live .list a:active em{text-decoration:underline;}
#live .list .ico{position:absolute; top:2px; right:0; width:40px; line-height:18px; font-size:12px; border-radius:18px; text-align:center; color:#fff; background:#9c9b99;}
#live .list .ico.on{background:#f49101;}
#live .list .ico2.on{background:#5191ae;}
#live .list .ico3.on{background:#f49101;}
#live .control{z-index:55; position:absolute; top:-1px; right:-1px; width:22px;}
#live .control a{position:relative; display:block; width:100%; height:35px; font-size:0; text-indent:-9999px; border:1px solid #ccc; box-sizing:border-box; background:#f7f7f7 url(/images/main/ico_control.png) no-repeat 5px 0;}
#live .control .btn_next{margin:-1px 0 0 0; background-position:5px -68px;}
#live .control .btn_stop{margin:-1px 0 0 0; height:32px; background-position:7px -35px;}
#live .control .btn_stop.on{background-position:7px -102px;}
#live .control a:hover,
#live .control a:active,
#live .control a:focus{z-index:1; border-color:#555; background-color:#f7f7f7;}

.board{position:relative; float:left; width:100%; height:196px;}
.board1{margin:0 0 30px; border-bottom:1px solid #cdcdcd;}
.board ul{overflow:hidden; width:100%;}
.board li{position:relative; float:left; width:100%; height:26px; padding:0 0 0 9px; box-sizing:border-box;}
.board li a{position:relative; float:left; width:100%; padding:0 70px 0 0; box-sizing:border-box; color:#4c4c4c;}
.board li .tit{float:left; max-width:98%; padding:0 16px 0 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; box-sizing:border-box;}
.board li a:focus .tit,
.board li a:hover .tit{text-decoration:underline;}
.board li .new{float:left; width:15px; height:15px; line-height:15px; margin:3px 0 0 -16px; font-size:9px; font-weight:bold; text-transform:uppercase; text-align:center; color:#fff; background:#dd3743; border-radius:50%;}
.board li .date{position:absolute; top:0; right:1px; color:#878787; font-size:14px;}
.board .none{padding:3em 0; text-align:center; box-sizing:content-box;}
.board .none:before{display:none;}
.board .more{display:block; position: absolute; top:0; right:0; padding:2px 0 0 15px; color:#999; letter-spacing:-1px; background:url(/images/main/ico_more.gif) no-repeat 0 50%;}

@media all and (max-width:1220px){
	#search form{background-size:cover;}
	
	#slogan .tit1{font-size:19px;}
	#slogan .tit2{font-size:33px;}
}
@media all and (max-width:1024px){
	.content{padding:10px 0;}
	#search{margin:0 0 10px;}
	#search form{padding:23px 8%;}
	#search input[type="text"]{height:45px; line-height:46px; padding:0 55px 0 100px; border-radius:50px;}
	#search label{left:25px; line-height:46px; font-size:17px;}
	#search button{top:7px; right:15px; width:30px; height:30px;}
	#search button:before{width:25px; height:25px;}
	#search button:after{width:16px;}

	#slogan{padding:25px 0 0 0; text-align:center;}
	#slogan br{display:none;}
	#slogan .tit2{padding:3px 0 7px;}

	#live{padding:30px 27px 0;}

	.sec1{width:100%; height:auto; margin:0 0 10px; padding:0 0 20px 0; background-size:cover;}
	.sec1:before{left:210px; bottom:125px; width:85px; height:85px; background-size:contain;}

	.sec2{width:49.4%;}
	.sec3{float:right; margin:0;}

	.con{padding:25px 5% 5px;}

	.board{height:185px;}
	.board1{margin:0 0 20px;}
}
@media all and (max-width:768px){
	.content{padding:5px 0 0 0;}
	#search,
	.sec1{margin:0 0 5px;}

	#slogan {padding:20px 0 0 0; font-size:14px;}
	#slogan .tit1{font-size:17px;}
	#slogan .tit2{font-size:30px;}
	
	#live .onair{font-size:48px;}
	#live .today{padding:0;}
	#live .today .day{font-size:23px;}

	.sec1:before{left:185px;}

	.sec2 > .tit{height:115px;}
	.sec2 > .tit a{padding:20px 0 0 8%;}
	.sec2 > .tit span{line-height:130%;}
	.sec2 > .tit strong{font-size:21px;}
	.sec2 > .tit a:after{right:0; bottom:-8px; width:115px; height:95px; background-size:contain;}

	.con{padding:20px 6% 5px;}
	.con h4{font-size:18px;}
}
@media all and (max-width:568px){
	#search form{padding:20px 6%;}
	#search label{left:20px;}
	#search input[type="text"]{padding-left:90px;}

	#live{padding:30px 25px 0 6%;}
	#live h4{font-size:16px;}
	#live .onair{font-size:40px;}
	#live .today{margin:-3px 0 0 0; font-size:13px;}
	#live .today .day{font-size:20px;}

	#slogan {padding:17px 0 0 0; font-size:13px;}
	#slogan .tit1{font-size:16px;}
	#slogan .tit2{padding:1px 0; font-size:28px;}

	.sec1:before{left:160px; width:70px; height:70px;}

	.sec2{width:100%; margin:0 0 0.3em;}
	.sec2 > .tit{height:95px; font-size:13px;}
	.sec2 > .tit a{padding:18px 0 0 6%;}
	.sec2 > .tit strong{font-size:20px;}
	
	.board{height:180px;}
	.board1{margin:0 0 17px;}
}

@media all and (max-width:400px){
	#search label{font-size:16px;}
	#search input[type="text"]{padding-left:85px;}

	.sec1{padding:0 0 17px;}

	#live{padding:27px 6% 0;}
	#live h4{font-size:15px;}
	#live .onair{font-size:37px;}
	#live .today{font-size:12px;}
	#live .today .day{font-size:19px;}

	#slogan {padding:15px 0 0 0; font-size:12px;}
	#slogan .tit1{font-size:14px;}
	#slogan .tit2{padding:1px 0 4px; font-size:25px;}
	#slogan .tit3{line-height:120%;}
	
	.sec1:before{left:145px; width:63px; height:63px;}

	.sec2 > .tit{font-size:12px;}
	.sec2 > .tit strong{font-size:19px;}
}