@charset "utf-8";

/* common
------------------------------------------------ */
#container { min-height: 670px; }
#side_column .time { display: none; }

/* top_main
------------------------------------------------ */
#top_main {
	position: relative;
	float: left;
	width: 46%;
	z-index: 2;
}

	#top_main .slide {
		position: relative;
		width: 100%;
		z-index: 1;
	}

		#top_main .slide .frame {
			position: relative;
			width: 100%;
			height: 100%;
			overflow: hidden;
		}

			#top_main .slide .move {
				position: relative;
				width: 100%;
				height: 100%;
			}

				#top_main .slide .move li {
				}

					#top_main .slide .move li a { display: block; }
					#top_main .slide .move li img { width: 100%; }

	#top_main .sns {
		position: absolute;
		top: 10px;
		right: 10px;
		z-index: 2;
	}

	#top_main .banner {
		position: absolute;
		bottom: 4%;
		left: 6%;
		width: 88%;
		z-index: 3;
	}

		#top_main .banner a { display: block; }
		#top_main .banner img { width: 100%; }

/* time_broadcast
------------------------------------------------ */
#time_broadcast {
	position: absolute;
	top: 0;
	left: 46%;
	width: 24%;
	height: 100%;
	z-index: 1;
}

	#time_broadcast .box {
		height: 100%;
	}
	#time_broadcast .time_box { display: none; }

/* time_box */
#time_box {
}

	#time_box img { width: 100%; }

/* highlight_video */
#highlight_video {
}

	#highlight_video h2 {
		padding-top: 30px;
		height: 16px;
		text-align: center;
		font-size: 10px;
		font-size: 1rem;
		font-weight: normal;
		line-height: 1;
	}

		#highlight_video h2 img { height: 100%; }

	#highlight_video .video {
		margin: 10px auto 0;
		width: 82%;
	}

		#highlight_video .video .movie {}
			#highlight_video .video .movie a { display: block; }
			#highlight_video .video .movie img { width: 100%; }
		#highlight_video .video .title { margin-top: 16px; font-size: 14px; font-size: 1.4rem; font-weight: normal; }

/* broadcast */
#broadcast {
	background: #f4f7f9;
}

	#broadcast .date_movie {
	}

		#broadcast h2 {
			padding-top: 30px;
			height: 22px;
			text-align: center;
			font-size: 10px;
			font-size: 1rem;
			font-weight: normal;
			line-height: 1;
		}
	
			#broadcast h2 img { height: 100%; }

		#broadcast .date {
			margin-top: 14px;
			text-align: center;
			font-size: 28px;
			font-size: 2.8rem;
			font-weight: bold;
			line-height: 1.2;
			color: #2377bd;
		}
	
			#broadcast .date .day { color: #cf1912; }

		#broadcast .movie {
			display: none;
			padding: 10px;
		}

			#broadcast .movie a { display: block; }
			#broadcast .movie .ulizahtml5 { width: 100% !important; }
			#broadcast .movie video { width: 100%; height: auto; }

	#broadcast .excerpt {
		margin-top: 10px;
		padding: 0 5%;
		font-size: 16px;
		font-size: 1.6rem;
	}

/* blog_report
------------------------------------------------ */
#blog_report {
	position: absolute;
	top: 0;
	left: 70%;
	width: 30%;
	height: 100%;
	z-index: 2;
}

	#blog_report .time {
		display: table;
		width: 100%;
		height: 18%;
		text-align: center;
	}

		#blog_report .time span {
			display: table-cell;
			vertical-align: middle;
		}

			#blog_report .time span img { width: 90%; max-width: 447px; }

	#blog_report .box {
		float: left;
		width: 50%;
		height: 82%;
	}
	#blog_report .time_box { float: none; padding: 20px; width: auto; height: auto; }

		#blog_report .box h2 {
			padding-top: 30px;
			height: 16px;
			text-align: center;
			font-size: 10px;
			font-size: 1rem;
			font-weight: normal;
			line-height: 1;
		}

			#blog_report .box h2 img { height: 100%; }

		#blog_report .box .list {
			margin: 0 auto;
			width: 82%;
		}

			#blog_report .box .list li {
				position: relative;
				margin-top: 20px;
			}
			#blog_report .box .list li a { display: block; color: #222; }

				#blog_report .box .list li .photo { position: relative; margin-bottom: 4px; padding: 26% 0; width: 100%; overflow: hidden; z-index: 1; }
					#blog_report .box .list li .photo img { width: 100%; }
					#blog_report .box .list li .photo .play { position: absolute; bottom: 10px; right: 10px; display: block; width: 30px; height: 30px; background: url(../../img/share/play.png) no-repeat left top; text-indent: 100%; white-space: nowrap; overflow: hidden; z-index: 2; }
				#blog_report .box .list li .movie { position: relative; display: none; width: 100%; z-index: 2; }
					#blog_report .box .list li .movie object { vertical-align: top; }
					#blog_report .box .list li .movie video { width: 100%; height: auto; }
				#blog_report .box .list li .title { font-size: 12px; font-size: 1.2rem; font-weight: normal; line-height: 1.2; }
				#blog_report .box .list li .update { font-size: 12px; font-size: 1.2rem; }

		#blog_report .box .more {
			margin: 20px auto 0;
			width: 114px;
		}

			#blog_report .box .more a { display: block; }
			#blog_report .box .more img { width: 100%; }

/* blog */
#blog {
	background: #fff;
}

/* report */
#report {
	background: #f4f7f9;
}
#report .list li .photo { padding: 0 !important; }
#report .list li .photo a { padding: 26% 0; }
#report .list li .update { color: #8e8c8c !important; }


/* responsive style
------------------------------------------------ */
@media screen and (max-width: 1360px) {
	/* top_main */
	#top_main { width: 50%; }
	/* time_broadcast */
	#time_broadcast { position: relative; top: auto; left: auto; display: table; width: 50%; }
	#time_broadcast .box {}
	#broadcast {}
	#broadcast .date_movie,
	#broadcast .excerpt { display: inline-block; width: 50%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; -o-box-sizing: border-box; box-sizing: border-box; vertical-align: top; }
	#broadcast.nomovie .date_movie,
	#broadcast.nomovie .excerpt { display: block; width: auto; }
	#broadcast .date_movie {}
	#broadcast .excerpt { margin-top: 0; padding: 10px; }
	#time_broadcast .time_box { display: block; padding: 20px; }
	/* blog_report */
	#blog_report { left: 50%; width: 50%; }
	#blog_report .time_box { display: none; }
}

@media screen and (max-width: 900px) {
	/* top_main */
	#top_main { width: 100%; }
	/* time_broadcast */
	#time_broadcast { float: none; width: 100%; }
	/* blog_report */
	#blog_report { position: relative; top: auto; left: auto; display: table; width: 100%; }
	#blog_report .box { display: table-cell; float: none; padding-bottom: 30px; }
	/* blog */
	#blog { background: #f4f7f9; }
	/* report */
	#report { background: #fff; }
}

@media screen and (max-width: 640px) {
	/* side_column */
	#side_column { padding-bottom: 0; }
	/* top_main */
	#top_main {}
	#top_main .sns { display: none; }
	/* time_broadcast */
	#time_broadcast { display: block; }
	#time_broadcast .box { display: block; width: 100%; }
	#broadcast .date_movie,
	#broadcast .excerpt { display: block; width: auto; }
	#broadcast .excerpt {}
	.time_box { display: none !important; }
	#highlight_video { padding-bottom: 30px; }
	#highlight_video h2 { margin: 0 auto; width: 50%; height: auto; }
	#highlight_video h2 img { width: 100%; height: auto; }
	#highlight_video .video {}
	#highlight_video .video .move {}
	#highlight_video .video .title { margin-top: 8px; font-size: 1.2rem; }
	#broadcast { padding-bottom: 30px; }
	#broadcast h2 { margin: 0 auto; width: 28%; height: auto; }
	#broadcast h2 img { width: 100%; height: auto; }
	/* blog_report */
	#blog_report { display: block; }
	#blog_report .time { display: none; }
	#blog_report .box { display: block; width: 100%; }
	#blog_report .box h2 { margin: 0 auto; height: auto; }
	#blog_report .box h2 img { width: 100%; height: auto; }
	#blog_report .box .more { width: 55%; }
	/* blog */
	#blog { background: #fff; }
	#blog h2 { width: 42%; }
	/* report */
	#report { background: #f4f7f9; }
	#report h2 { width: 45%; }
}
