@charset "utf-8";
@import "reset.css";

/* html5 reset */
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}


/* common */
html,body{height:100%}
body{background:#000;-webkit-text-size-adjust:none}
.blind{position:relative;z-index:-1;width:0;height:0;font-size:0;text-indent:-9999em;visibility:hidden}
.clr{*zoom:1}
.clr:after{content:".";display:block;clear:both;font-size:0;width:0;height:0}
#body_today{position:relative;color:#fff;font-size:100%;}
.today_wrap{position:absolute;width:100%;height:100%;z-index:10}

/* background */
.bg_container{height:100%;position:relative;overflow-x:hidden;}
.bg_container img{width:100%;height:100%}
.bg_container .bg_dot{position:absolute;width:100%;height:100%;background:url(../image/today/bg_dot.png) 0 0 repeat}

/* top */
.tv_top{width:100%;height:58px;background:url(../image/today/bg_top.png) 0 bottom repeat-x;position:relative; z-index:1000; }
.tv_top h1{padding:16px 0 0 28px;float:left;font-size:150%}
.tv_top h1 a {color:#fff;}
.tv_top h1 span{padding-left:10px;font-size:13px;}
.tv_top .tv_preview{padding:15px 28px 0 0;float:right;width:150px;position:relative}
.tv_top .btn_monthly{display:block;width:100%;height:28px;line-height:28px;border:1px solid #CCCDCC;outline:none;background:#191919;color:#fff;cursor:pointer}
.tv_top .tv_preview .scrollWrap{height:100px;background:url(../image/today/bg_common.png) 0 0 repeat}

/*.tv_top .slogan {font-size:100%;width:30%;position:absolute;top:0;left:50%;margin-left:-15%;text-align:center;}*/
.tv_top .slogan {font-size:13px; padding-top:26px; }
.tv_top .internet_banner {font-size:13px; padding-top:26px; }


.today1224 {padding-bottom:351px;background:url(../image/today/bg_top_1224snow.png) 0 52px repeat-x;}
.today1224snow {padding-bottom:510px;background:url(../image/today/bg_top_1224.png) 0 52px repeat-x;}
.today1225 {padding-bottom:165px;background:url(../image/today/bg_top_1225.png) 0 44px repeat-x;}
.today0101 {padding-bottom:84px;background:url(../image/today/bg_top_201501.png) 0 100% repeat-x;background-size:auto 80px;}

/* .tv_preview ul{padding:10px 0} */
.tv_top .tv_preview ul li a{display:block;padding:3px 20px 3px 30px;font-size:13px;color:#fff}
.tv_top .tv_preview ul li:hover{background:url(../image/today/bg_common.png) 0 0 repeat}
.tv_top .tv_preview ul li:hover a{color:#00b4ff;background:url(../image/today/icon_over_arrow.png) 16px 7px no-repeat}
.tv_top .scroller_area,.tv_top .scroller_area.off{display:none;padding:10px 0;background:url(../image/today/bg_common.png) 0 0 repeat}
.tv_top .scroller_area.on{display:block}
#scroller_today{z-index:1;width:100%;height:200px;position:relative;overflow:hidden}

.login ul{float: right;  padding: 26px 28px 0 0;}
.login ul li{float: left; margin-right: 20px;}
.login ul li:last-child{margin-right: 0;}
.login ul li a{color: #fff; font-size:13px;}

/* flexible area */
.boundary{margin:0 auto 30px;width:872px;/* height:604px; */position:relative}
.visual{position:relative;height:460px;margin:0 auto}

.cover_box{position:absolute;left:50%;top:85px;margin-left:-115px;z-index:10}
.cover_box .frint {z-index:10;}
.cover_box .tv_character{position:absolute;z-index:3}
.cover_box .face {position:absolute}
.cover_box .front p {bottom: 18%;
color:#D8FF00;
font-size:24px;
left: 0;
position: absolute;
text-indent: 25px;
width: 100%;}
.cover_box .back {z-index:9;display:none;}
.cover_box .back .conts{position:absolute;top:51px;width:100%}
.cover_box .back .conts p{padding:0 14px;text-align:center}
.cover_box .back .conts .tt1{margin-bottom:3px;font-size:24px;letter-spacing:-1px;color:#d8ff00}
.cover_box .back .conts .tt2{margin-bottom:6px;font-size:24px;color:#d8ff00}
.cover_box .back .conts .tt3{font-size:13px}

.cover_box.on .back {display:block;}
.cover_box.on .tv_character,
.cover_box.on .front {display:none;}


/* 2014-10-15 */
.today_nav li a{display:block;}
.today_nav li a span{display:block;/* width:156px; height:36px;*/}

.cover_box .tv_character{position:absolute;left:118px;top:-40px;width:120px;}

/* thinki , playi */
.ibox{width:164px;height:164px;position:absolute;top:115px;}
.ibox.thinki{left:95px}
.ibox.playi{right:95px}
.ibox .cc{position:absolute}
.ibox .cc p{width:100%;position:absolute;top:49%;margin-top:-17px;text-align:center;font-size:95%}
.ibox .tt{position:absolute;top:60px}
.ibox .tt h3{width:195px;height:37px}
.ibox .tt p{width:145px;position:absolute;top:-18px;font-size:75%;text-align:center;letter-spacing:-1px;text-shadow:1px 1px 1px #666}
.ibox.thinki .tt{right:105px}
.ibox.thinki .tt h3{background:url(../image/today/label_thinki.png) 0 0 no-repeat}
.ibox.thinki .tt p{left:0}
.ibox.playi .tt{left:105px}
.ibox.playi .tt h3{background:url(../image/today/label_playi.png) 0 0 no-repeat}
.ibox.playi .tt p{right:0}

.today_title{width:783px;margin:0 auto;text-align:center}
.today_title .st{margin-bottom:4px}
.today_title .st img{height:17px}
.today_title .tt{height:52px;background:url(../image/today/bg_common.png) 0 0 repeat-x;font-size:46px;line-height:1.2;color:#D8D8D8;}

.today_nav{width:783px;margin:0 auto}
.today_nav h3{margin-bottom:6px;text-align:center}
.today_nav h3 img{height:17px}
.today_nav ul{width:100%}
.today_nav ul li{float:left;position:relative;width:25%;*width:24.9%;background:url(../image/today/bg_common.png) 0 0 repeat}
.today_nav ul li > img.hotmark {position:absolute;top:2px;left:10px;}
.today_nav ul li a{display:block;margin:31px 10px;padding:0 8px;font-size:13px;text-align:center;color:#fff;opacity:0.8}
.today_nav ul li:hover{background:url(../image/today/bg_common_over.png) 0 0 repeat}
.today_nav ul li:hover a{margin:24px 10px;padding:5px 8px;border-top:2px solid #fff;border-bottom:2px solid #fff;opacity:1}

/*
.today_footer{width:100%;position:absolute;bottom:0;background:#000}
.today_footer P{padding:8px 10px;font-size:11px;color:#4D4D4D}
*/

.today_footer {width:100%;position:absolute;bottom:0;left:0;background:#262731;color:#505367;}
.today_footer .wrap {width:930px;margin:0 auto;padding:10px 0;font-size:12px;display:table;table-layout:fixed;}
.today_footer .wrap > div > div {padding-left:115px;}
/* .today_footer .wrap > div {height:36px;padding-top:3px;background:url('../image/today/txt_foot03.png') no-repeat;} */
.today_footer .wrap > div p {color:#939dc7;margin-top:7px;}
.today_footer .footCopy {display:none;}
.today_footer .mobile-txt img {width:100%}

.today_footer .footCopy p.pCopy span {display:block;}
.today_footer .wrap > div p .fnews {padding:0 10px;color:#939dc7;}
.today_footer .wrap > div p .fnews:hover {text-decoration:underline;}
/* .today_footer .wrap > p {height:25px;padding-top:3px;background:url('../image/today/txt_foot04.png') no-repeat;} */
.today_footer .wrap > .copy > div {height:23px;line-height:22px;}
.today_footer .wrap > .copy span {color:#939dc7;}
.today_footer .wrap > div {position:relative;}
/*.today_footer .wrap > div > a {position:absolute;top:0;left:0;}*/

.today_title .tt:hover{background:url(../image/today/bg_common_over.png) 0 0 repeat}

.layCalendar {position:absolute;top:100px;left:50%;margin-left:-250px;width:500px;z-index:100;display:none;}
.bgMask01 {position:fixed;top:0;left:0;width:100%;height:100%;background:url('/image/common/bg_opa/bg_opa_b80.png');display:none;}
#datepicker .ui-datepicker {width:100%;padding:0;}
#datepicker .ui-datepicker-inline {border-radius:11px 11px 0 0;}
#datepicker .ui-widget-content {border:0 none;}
#datepicker .ui-datepicker-header {background:#4d2364;border:0 none;border-radius:10px 10px 0 0;}
#datepicker .ui-datepicker td span, .ui-datepicker td a {width:30px;height:30px;margin:0 auto;border-radius:25px;text-align:center;font-size:21px;line-height:30px;}
#datepicker .ui-state-default {background:rgba(255,255,255,0);border:2px solid #4d2364;color:#4d2364;}
#datepicker .ui-datepicker-other-month span {border:0 none !important;color:#fff;}
#datepicker .ui-state-on {background:rgba(255,255,255,0.5);color:#4d2364;}
#datepicker .ui-priority-secondary {background:rgba(255,255,255,0);border:0 none;color:#fff;}
#datepicker .ui-state-highlight {background:#4d2364 !important;color:#fff !important;}
#datepicker .ui-widget-content {background:rgba(255,255,255,0.8);}
#datepicker .ui-datepicker table {width:400px;margin:20px auto;}
#datepicker .ui-datepicker th {padding:0;color:#4d2364;}
#datepicker .ui-datepicker td {padding:5px 0;}
#datepicker .ui-datepicker td:hover a,
#datepicker .ui-state-active {background:#7b389f !important;color:#fff !important;}
#datepicker .ui-datepicker-calendar span {width:44px;text-align:center;font-size:20px;}
#datepicker .ui-datepicker .ui-datepicker-prev {display:block;width:14px;height:21px;background:url('/image/common/btn_cal_prev.png') no-repeat 0 50%;left:140px;}
#datepicker .ui-datepicker .ui-datepicker-next {display:block;width:14px;height:21px;background:url('/image/common/btn_cal_next.png') no-repeat 0 50%;right:140px;}
.ui-datepicker .ui-datepicker-title {font-size:21px;}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {top:13px;}
.layCalendar .ui-datepicker-prev-hover,
.layCalendar .ui-datepicker-next-hover {border:0 none;background:none;cursor:pointer;}
.layCalendar .titToday {padding:15px 58px;background:rgba(255,255,255,0.9);border-radius:0 0 10px 10px;border-top:1px solid #b8b8b8;min-height:65px;}
.layCalendar .titToday > a {display:block;padding-left:14px;background:url('/image/today/bull_tit_today.png') no-repeat 0 6px;}
.layCalendar .titToday > a > strong {display:block;color:#000;}
.layCalendar .titToday > a > p {margin-top:5px;font-size:13px;color:3e3e3e;}
.layCalendar .titToday > a > img {display:block;margin:10px auto 0;}

.today_footer .logoArea {display:none;}

/* 모바일 세로 */
@media all and (max-width:320px){
	body{min-height:713px}

}

@media all and (min-width:321px) and (max-width:640px){
	body{min-height:650px}
}

@media all and (max-width:733px) {
	.tv_top .slogan {display:none;}
}

@media all and (max-width:540px) {
	.tv_top .internet_banner {display:none;}
}
@media all and (max-width:500px) {
/* 투데이 지난호보기 */
.layCalendar {top:80px;left:0;margin-left:2%;width:96%;}
#datepicker .ui-datepicker-inline {border-radius:11px;}
#datepicker .ui-datepicker .ui-datepicker-prev {left:10%;}
#datepicker .ui-datepicker .ui-datepicker-next {right:10%;}
#datepicker .ui-datepicker table {width:100%;}
.layCalendar .titToday {display:none;padding:15px 38px;}
}

@media all and (max-width:768px) {
	.tv_top h1{padding:12px 0 0 12px;}
}

@media all and (max-width:768px) and (orientation:landscape) {
.layCalendar {top:80px;}
/*.tv_top h1{padding:10px 0 0 12px !important;}*/
.layCalendar .titToday {display:none;padding:15px 38px;}
#datepicker .ui-datepicker-inline {border-radius:11px;}

}

@media all and (min-width:640px) {
	.today_footer .footCopy {display:block;}
	.today_footer .mobile-txt {display:none;}
}

@media all and (max-width:640px) {
	.today0101 {padding-bottom:45px;background-size:auto 40px;}
	/* top */
	.visual{width:320px;height:290px}

	.cover_box{margin-left:0;left:8%}
	.cover_box .tv_character{left:70px;top:-31px;width:95px;}
	.cover_box .front{width:145px;height:145px}
	.cover_box .back{width:145px;height:145px}

	.cover_box .back .conts{position:absolute;top:27px;width:100%}
	.cover_box .back .conts p{padding:0 14px;text-align:center}
	.cover_box .back .conts .tt1{margin-bottom:3px;font-size:16px;letter-spacing:-1px;color:#d8ff00}
	.cover_box .back .conts .tt2{padding:0 5px;margin-bottom:6px;font-size:16px;color:#d8ff00}
	.cover_box .back .conts .tt3{font-size:10px}

	.ibox{width:145px;height:145px}
	.ibox.playi{width:105px;height:105px;left:175px;top:165px}
	.ibox.thinki{width:125px;height:125px;right:10px;top:25px;left:auto;}

	.ibox.playi .cc{width:105px}
	.ibox.thinki .cc{width:125px}
	
	.ibox.playi .cc p{font-size:78%;letter-spacing:-1px}
	.ibox.thinki .cc p{font-size:78%;letter-spacing:-1px}
	
	.today_title .tt{height:45px;font-size:26px;line-height:47px}
	.today_title .tt{height:37px;font-size:24px;line-height:37px}
	
	.ibox.playi .cc p{width:100%;padding:0;top:50%;margin-top:-17px}
	.ibox.thinki .cc p{width:100%;padding:0;top:50%;margin-top:-17px}
	
	.today_nav ul li:before{font-size:30px;top:-11px}
	.ibox .cc span{font-size:15px}

	.bg_container{height:420px;}
	.today_footer .wrap {font-size:11px;}
	.today_footer .wrap > div > a {display:none;}
	.today_footer .wrap > div > div {padding-left:0;}
	.today_footer .wrap > div p .fnews {padding-left:0;}	




}

/****2016-11-22 add code  2016-11-29이후 삭제****/
@media all and (max-width:780px) {
	.bg_container{height:420px; overflow:hidden;}
	.bg_container img{position:absolute;width:auto; height:100%;}
}
/****2016-11-22 add code  2016-11-29이후 삭제****/

/*  */
@media all and (min-width:641px) and (max-width:871px) {
	body{min-height:820px}
	/* top */
	.visual{width:527px;height:423px}
	.cover_box{margin-left:0;left:10%;top:100px}

	.cover_box .front{width:230px;height:230px}
	.cover_box .back{width:230px;height:230px}
	.tv_character{left:123px;top:-31px;width:80px}

	
	.ibox.playi {width:155px;height:155px;left:270px;top:225px;}
	.ibox.thinki {width:195px;height:195px;right:55px;top:11px;left:auto;}
	
	.ibox .cc{top:25px;}
	.ibox.playi .cc{width:155px;}
	.ibox.thinki .cc{width:195px;}
	
	.ibox.thinki .cc p{font-size:100%;letter-spacing:-1px}
	.ibox.playi .cc p{font-size:100%;letter-spacing:-1px}
	
	.today_title .tt{height:52px;font-size:40px;line-height:55px}
	.today_title .tt{height:53px;font-size:35px;line-height:55px}
	
	.ibox.thinki .cc p{width:100%;padding:0;top:50%;margin-top:-19px;letter-spacing:0}
	.ibox.playi .cc p{width:100%;padding:0;top:50%;margin-top:-19px;letter-spacing:0}
	
	.today_nav ul li:before{font-size:30px;top:-8px}
	.today_nav ul li a{font-size:18px}
	
	.ibox .cc span{font-size:20px}

	.bg_container{height:552px}
	.cover_box .front p {left:43px;}
	
	
}

/*@media all and (min-width:700px) and (max-width:785px) {
	.today_footer {position:absolute !important;}
}*/


@media all and (min-width:1024px) and (orientation:landscape) {
	.bg_container img{width:100%;height:100%}
}

@media all and (max-width:1024px){
	.tv_top{height: 80px;}
	.tv_top h1{padding: 38px 0 0 28px;}
	.tv_top .slogan{padding-top:48px;}
	.tv_top .internet_banner{padding-top: 48px;}
	.tv_top .tv_preview{padding: 38px 28px 0 0;}
	.tv_top .login{position: absolute; top:-20px; right: 0;}

}

@media all and (max-width:960px) {
	body{overflow-x:hidden;}
	.logoArea2{display:none;}
	.today_footer .wrap{width: 98%;}
}


/* desktop 이하 디바이스 공통 */
@media all and (max-width:871px) {
	/* top */
	.tv_top{height:65px}
	.tv_top h1{float:left;font-size:100%; padding: 30px 0 0 28px;}
	.tv_top h1 span{padding-left:5px;font-size:12px}
	.tv_top .tv_preview{padding:18px 13px 0 0;float:right;font-size:12px}
	.tv_top .tv_preview dd{display:none}
	/*.tv_top h1{padding:16px 0 0 12px;font-size:100%}*/
	.tv_top .internet_banner{padding:33px 0 0 12px;}
	.login ul{padding:26px 8px 0 0;}
	.boundary{width:100%}
	.cover_box{margin-left:0;left:8%}
	.cover_box img{width:100%}

	.ibox .tt{display:none}
	.ibox img{width:100%}

	.today_title{width:100%;margin-bottom:30px}
	.today_nav h3{margin-bottom:12px;padding-left:20px;text-align:left}
	.today_nav{width:100%;left:0;margin-left:0}
	.today_nav ul li{width:100%;border-bottom:1px solid #070707}
	.today_nav ul li:before{content:"";display:block;width:13px;height:13px;position:absolute;left:11px;color:#292929}
	.today_nav ul li a{margin:0;padding:30px 10px 15px 10px;text-align:left;background:url(../image/today/icon_arrow.png) 97% center no-repeat;background-size:13px 23px;-webkit-background:13px 23px}
	.today_nav ul li:hover a{margin:0;padding:30px 10px 15px 10px;border:none}

	/* .bg_container{height:420px} */
	.ibox .cc span{display:block;width:100%;position:absolute;bottom:9%;font-weight:bold;color:#d8fe01;text-align:center;text-shadow:1px 1px 1px #535353}
	
	/* scroll */
	.tv_top .tv_preview{padding:0 6px 0 0; margin-top:30px; float:right;width:100px;position:relative;z-index:999;}
	.tv_top .btn_monthly{display:block;width:100%;height:23px;line-height:23px;font-size:12px;border:1px solid #CCCDCC;outline:none;background:#191919;color:#fff;cursor:pointer}
	
	/* .tv_preview ul{padding:10px 0} */
	.tv_top .tv_preview ul li a{display:block;padding:2px 0 2px 17px;font-size:12px;color:#fff}
	.tv_top .tv_preview ul li:hover{background:url(../image/today/bg_common.png) 0 0 repeat}
	.tv_top .tv_preview ul li:hover a{color:#00b4ff;background:url(../image/today/icon_over_arrow.png) 5px 7px no-repeat}
	#scroller_today{z-index:1;overflow:hidden;height:100px}

	.today_nav ul {
		background: #444444;
		background: -moz-linear-gradient(top,  #444444  0%, #0E0E0E  100%);
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#444444 ), color-stop(100%,#0E0E0E )); 
		background: -webkit-linear-gradient(top,  #444444  0%,#0E0E0E  100%);
		background: -o-linear-gradient(top,  #444444  0%,#0E0E0E  100%);
		background: -ms-linear-gradient(top,  #444444  0%,#0E0E0E  100%); 
		background: linear-gradient(top bottom,  #444444  0%,#0E0E0E  100%);
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#444444, endColorstr='#0E0E0E);
	}
	
	
	
	.tv_top {position:absolute;top:0;left:0;}
	.login ul li a{font-size: 11px;}
	.boundary {margin:48px 0 0 0 ;}
	.today_footer {position:static;}
	.today_footer .wrap {width:96%;}
	.today_footer .wrap > div,
	.today_footer .wrap > p {height:auto;}
	
	
	.cover_box .front p {font-size:1.1em;}
	.today1224 {padding-bottom:351px;background:url(../image/today/bg_top_1224snow.png) 0 42px repeat-x;}
	.today1224snow {padding-bottom:510px;background:url(../image/today/bg_top_1224.png) 0 42px repeat-x;}
	.today1225 {padding-bottom:165px;background:url(../image/today/bg_top_1225.png) 0 34px repeat-x;}

	.tv_top .slogan {padding-top:33px; }
	

}

/* desktop */
@media all and (min-width:872px) {
	body{min-height:790px}
	.visual{height:345px}
	.today_title{margin:0 auto;padding-bottom:80px;width:783px}

	.today_nav li a{display:table}
	.today_nav li a span{display:table-cell;width:160px;height:36px;vertical-align:middle}

	.ibox .cc span{display:none}
	.cover_box .tv_character{position:absolute;left:118px;top:-40px;width:80px;}

	.today_footer .logoArea {display:block;}
	.today_footer .logoArea a {width:88px;display:block;position:static;}
	.today_footer .logoArea a img {width:100%;;}
	.today_footer .logoArea a:first-child {margin-left:0;}
	.firstLogo{margin-top:0;}
	.today_footer .logoArea,
	.today_footer .footCopy {display:table-cell;vertical-align:top;}
	.today_footer .logoArea {margin-top:10px;width:88px}
	.today_footer .logoArea2 {margin-top:10px;width:130px;}
	.today_footer .logoArea2 a{width: 130px; margin-left: 10px; }
	.today_footer .logoArea2 a img{width: 100%; }
	.today_footer .footCopy {padding-left:15px;width:695px;}
	.today_footer .footCopy p.pCopy {color:#505367;margin-top:0;}
/*	.today_footer .footCopy p.pCopy span {color:#939dc7;}*/


	.today_footer .footCopy p.rights {margin-top:7px;}
	.today_footer .wrap:after {content:'';display:block;clear:both;}
	.cover_box .front p {left:27px;}
}


@media all and (min-width:340px) and (max-width:871px){
	.today_nav ul li > img.hotmark {position:absolute;top:2px;left:15px;}
	.today_nav ul li a,
	.today_nav ul li:hover a {padding:25px 15px 15px 15px;}
}