@charset "utf-8";


#head_nav{

    height: 110px;

}

.inner_head_nav{

    width: 1100px;
    padding: 10px 20px 10px 20px;
    margin: 0px;
    position: relative;
    top: 0px;
    height: 90px;
    left: 50%;
    margin-left: -570px;

}

.inner_head_nav li{

    display: inline-block;

}

.top_logo{

    position: relative;
    top: 0px;
    left: 0px;
    width: 280px;
    height: 90px;
    float: left;
    padding: 0px 20px 0px 0px;

}

.top_menu_bt{

    text-align: right;
    position: relative;
    top: 0px;
    left: 0px;
    float: left;
    width: 800px;

}

.top_menu_bt2{

	text-align: left;
	position: relative;
	top: 0px;
	left: 0px;
	float: left;

}

.menu{

    margin: 0px 20px 0px 20px;

}

.menu2{

	margin: 0px 20px 0px 20px;

}

.menu2:first-child{

	margin: 0px 0px 0px 0px;

}

.menu:first-child{

	margin: 0px 20px 0px 0px;

}

.menu:last-child{

    margin: 0px 0px 0px 20px;

}

#inner_container{

    width: 1100px;
    position: relative;
    top: 0px;
    left: 50%;
    margin-left: -570px;
    padding: 0px 20px 50px 20px;

}

#loading_area{
	
    width: 100%;
	height: 2346px;
	position: absolute;
	top: 0px;
	left: 0px;
	z-index: 999;
	background: #fff;
	overflow: hidden;
	
}

#loading_img_area{
	
    width: 	300px;
	height: 200px;
	position: fixed;
	top: 50%;
	left: 50%;
	margin-left: -100px;
	margin-top: -150px;
	background: url(../img/loading_logo.gif) no-repeat;
	
}

#main_contents{

	padding: 0px;
	margin-left: -200px;
	position: relative;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 1600px;
	float: left;
	z-index: 100;

}

#side{

	position: relative;
	top: 0px;
	left: 0px;
	width: 280px;
	height: 990px;
	padding: 0px;
	margin: 50px 20px 0px 0px;
	background: #fff;
	z-index: 200;
    float: left;

}

.side--logo{

	position: relative;
	top: 0px;
	left: 0px;
	margin: 0px 20px 20px 20px;
	text-align: center;

}

.side--menu{

	position: relative;
	top: 0px;
	left: 0px;
	padding: 20px;
	margin: 0px;
	text-align: center;

}

.top--sns{

	position: relative;
	top: 12px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	text-align: center;
	float: right;

}

.top_sns_bt{

	margin: 0px 5px 0px 5px;

}

.top_sns_bt:last-child{

	margin: 0px 0px 0px 5px;

}

.side--sns li{

	display: inline-block;

}

.side--banner{

	position: relative;
	width: 240px;
	top: 0px;
	left: 0px;
	padding: 10px 0px 0px 0px;
	margin: 20px 20px 0px 20px;
	text-align: center;

}

.side--news{

	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px 20px 0px 20px;
	margin: 0px;
	text-align: center;


}

.side--twitter{

	position: relative;
	top: 0px;
	left: 0px;
	padding: 20px 20px 0px 20px;
	margin: 0px;
	text-align: center;


}

.side--copy{

	position: relative;
	padding: 20px;
	margin: 0px;
	text-align: center;

}

.side--copy img{

	padding: 10px 0px 10px 0px;

}

.copyright{

	color: #333;
	position: relative;
	padding: 20px 0px 0px 0px;
	top: 0px;
	left: 0px;
	text-align: center;
	font-size: 12px;

}

.policy{

	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	color: #333;
	font-size: 11px;
	font-weight: bold;
	text-align: center;

}

#main{

	position: relative;
	top: 0px;
	left: 0px;
	width: 100%;
	padding: 0px;
	margin: 0px;
	z-index: 100;

}

#kv--main{

	position: relative;
	padding-top: 0px;
	background-color: #516a92;
	background: url("../img/ehime_kv.jpg") top no-repeat;
	background-attachment: scroll;
	background-size: 100% auto;
	width: 800px;
    height: 1131px;
    top: 0px;
    left: 0px;
    margin-top: 10px;
    float: left;

}

.pop_dvd{

	position: absolute;
	z-index: 300;
	top: 20px;
	left: 20px;
	padding: 0px;
	width: 365px;
	margin: 0px;
	overflow: hidden;

}

.text1, .text2, .text3{

	position: relative;
	top: 0px;
	left: -100%;
	padding: 0px;
	margin: 5px 0px 5px 0px;
	display: block;

}

.pop_area{

	position: relative;
	float: left;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	min-width: 800px;
	width: 100%;

}

.top_menu_inner{

	position: relative;

}

.chara_area{
	
    width: 1200px;
	height: 1032px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -500px;
	margin-left: -600px;
	background-repeat: no-repeat;
	background-size: auto;
	max-width: 1920px;
	
}

.banner_area{
	
    width: 100%;
	position: relative;
	top: 0px;
	left: 300px;
	height: 100px;
	padding: 0px;
	margin-top: 10px;
	float: left;
	
}

.inner_banner{
	
    width: 1160px;
	padding: 20px;
	position: relative;
	top: 0px;
	left: 50%;
	margin-left: -600px;
	
}

.banner300_area{
	
    width: 100%;
	position: relative;
	top: 0px;
	left: 0px;
	
}

.top_banner{

	text-align: center;

}

.banner300{

    width: 240px;
    overflow: hidden;
	display: inline-block;
	vertical-align: middle;
	margin: 10px 0px 10px 0px;
	
}

.banner300 img{

    width: 100%;

}

#side_banner_area{
	
	width: 1200px;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 50%;
	margin-left: -600px;
	padding: 0px;
	
}

.banner_inner_area{
	
    width: 100%;
	height: 100%;
	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;	
	
}

.subtitle{
	
    width: 88px;
	height: 700px;
	position: absolute;
	z-index: 300;
	top: 10px;
	left: 20px;
	background: url(../img/subtitle.png) no-repeat;
	
}

.onair{
	
    width: 100%;
	position: relative;
	padding: 0px;
	margin: 0px;
	top: 0px;
	left: 0px;
	
}

.onair_label{

	width: 150px;
	height: 150px;
	position: absolute;
	top: 160px;
	right: 30px;
	z-index: 300;
	padding: 0px;
	margin: 0px;

}

.pop_banner{

	position: absolute;
	width: 264px;
	height: 200px;
	bottom: 100px;
	right: 10px;
	padding: 0px;
	margin: 0px;
	z-index: 300;
	background: url("../img/top_pop_banner_ehime_dvd.png") no-repeat;

}

.movie{
	
    width: 220px;
	position: relative;
	top: 0px;
	left: 50%;
	margin-left: -130px;
	padding: 20px;
	z-index: 300;
	
}

.movie_title{
	
    width: 220px;
	height: 20px;
	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	background: url(../img/movie_title.png) no-repeat;	
	
}

.movie_thumb{
	
    width: 220px;
	height: 124px;
	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 5px 0px 0px 0px;
	overflow: hidden;
	
}

.movie_thumb_ol{
	
    width: 100%;
	height: 100%;
	position: absolute;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	background: url(../img/bg_tile_w.png) repeat;
	z-index: 900;
	
}

.movie_thumb_ol_p{
	
    width: 50px;
	height: 50px;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -25px;
	margin-top: -25px;
	padding: 0px;
	background: url(../img/movie_p_bt.png) no-repeat;	
	z-index: 900;
	
}

#news_tw_area{
	
    width: 100%;
	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	background: #eca84a;
	
}

.inner_news_tw{
	
	width: 1200px;
	position: relative;
	top: 0px;
	left: 50%;
	margin-left: -600px;
	padding: 20px 0px 30px 0px;
	
}

.news_block{
	
    width: 600px;
	padding: 25px 0px 25px 0px;
	position: relative;
	top: 0px;
	left: 0px;	
	float: left;
	
}

.news_title_block{

	position: relative;
	top: 0px;
	left: 0px;
	padding: 20px;
	border-bottom: 1px solid #e5d5bf;	
	
}

.tw_title_block{

	position: relative;
	top: 0px;
	left: 0px;
	padding: 20px;
	border-bottom: 1px solid #e5d5bf;

}

.news_main{
	
    width: 575px;
	position: relative;
	top: 0px;
	left: 0px;
	margin: 3px 25px 25px 0px;
	font-family: 'Roboto', sans-serif;
	
}

.news_main li{
	
    display: inline-block;	
	
}

.top_news_list{

	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	text-align: center;
	width: 240px;
	height: 320px;
	overflow: hidden;

}

.news_list{
	
	color: #333;
	position: relative;
	border-bottom: 1px solid #e5d5bf;
	cursor: pointer;
	text-align: center;
	white-space: nowrap;
	
}

.news_list dt{
	
	font-weight: bold;
	width: auto;
	font-size: 13px;
	margin: 0px 10px 10px 10px;
    padding-top: 20px;
	line-height: 13px;
    vertical-align: text-top;
	
}

.news_list dd {

	font-size: 13px;
	width: 220px;
	margin: 20px 10px 20px 10px;
	line-height: 20px;
	vertical-align: text-top;
	text-align: center;
	text-overflow: ellipsis;
	overflow: hidden;

}

.time_line{

	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	overflow: hidden;

}


/* 

main
====================================== */

#marsonry_area{
	
	position: relative;
	top: 0px;
	left: 0px;
	padding: 1250px 0px 0px 0px;
	z-index: 100;
	margin-left: 300px;
	
}

.inner_marsonry{
	
    width: 100%;
	top: 0px;
	left: 0px;
	
}

.m_box{
	
    width: 300px;
	height: 300px;
	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 5px;	
	background: url(../img/box_bg.png) no-repeat #fff;
	border-radius: 7px;
	overflow: hidden;
	display: inline-block;
	
}

.inner_box{
	
    width: 280px;
	height: 240px;
	position: relative;
	top: 0px;
	left: 0px;
	padding: 50px 10px 10px 10px;	
	
}

.label_area{
	
    width: 90px;
	height: 33px;
	position: absolute;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	z-index: 200;
	
}

.thumb_area{
	
	width: 280px;
	height: 162px;
	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	overflow: hidden;
	background-size: cover;
	
}

.thumb_area img{
	
    width: 100%;	
	
}

.color_ol_area{
	
    width: 280px;
	height: 162px;
	position: absolute;
	top: 0px;
	left: 0px;
	background: #eca84a;
	opacity: 0;
	z-index: 100;
	
}

.title_area{
	
    width: 280px;
	position: relative;
	top: 0px;
	left: 0px;
	padding: 18px 0px 0px 1px;
	margin: 0px;
	color: #333;
	font-weight: bold;
	font-size: 14px;
	
}

.main_banner_area{

	position: relative;
	top: 0px;
	left: 0px;
	width: 100%;
	z-index: 300;
	padding: 10px 0px 10px 0px;

}

.inner_banner_area{

	position: relative;
	top: 0px;
	left: 0px;
	height: 100px;
	margin: 20px 20px 20px 30px;
	text-align: center;

}

.top_banner_list{

	text-align: left;
	margin: 0px 17px 0px 17px;
	padding: 0px;
	width: 1000px;
	height: 150px;
	position: relative;
	overflow: hidden;
	float: left;

}

.slide_container{

	position: absolute;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	height: 150px;

}

.t_banner{

	display: inline-block;
	margin: 0px 5px 0px 5px;
	width: 250px;
	height: 150px;
	position: relative;
	top: 0px;
	left: 0px;

}

.t_banner img{

	width: 100%;

}

.t_banner:first-child{

	margin: 0px 5px 0px 0px;

}

.new_bt{

	position: absolute;
	float: right;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	width: 80px;
	height: 50px;
	z-index: 300;
	background: url("../img/new.png") no-repeat;

}

.banner_list_title{

	width: 100px;
	height: 170px;
	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	float: left;
	background: url("../img/top_banner_title.png") no-repeat;

}

.nav_bt_l{

	position: relative;
	top: 0px;
	left: 0px;
	float: left;
	width: 3%;
	height: 100px;
	line-height: 195px;
	cursor: pointer;

}

.nav_bt_r{

	position: relative;
	top: 0px;
	left: 0px;
	float: left;
	width: 3%;
	height: 100px;
	line-height: 195px;
	cursor: pointer;

}

.nav_bt_disable{

	position: relative;
	top: 0px;
	left: 0px;
	float: left;
	width: 30px;
	height: 130px;
	line-height: 180px;
	opacity: 0.5;

}

.side_banner_area{

	position: absolute;
	top: 320px;
	right: 0px;
	padding: 0px;
	margin: 0px;
	width: 250px;
	z-index: 300;

}

.side_banner_list_title{

	position: relative;
	top: 16px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	text-align: right;

}

.side_banner{

	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;

}

.s_banner{

	display: inline-block;
	top: 0px;
	left: 0px;
	margin: 10px 0px 10px 0px;

}

#top_footer1{

	width: 100%;
	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	float: left;
	background: url("../img/bg_tile_b.png") repeat;
	border-top: 1px solid #ccc;

}

#top_footer2{

	width: 100%;
	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	float: left;
	background-color: #e17683;

}

.inner_footer1{

	width: 1100px;
	position: relative;
	top: 0px;
	left: 50%;
	margin-left: -550px;
	padding: 20px 0px 30px 0px;
	text-align: center;

}

.bt_footer_title{

	position: relative;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 50px;
	padding: 10px 0px 10px 0px;
	text-align: center;
	background: url("../img/bt_footer_title.png") no-repeat;

}

.block_area{

	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	text-align: center;

}

.sp_block{

	display: inline-block;
	margin: 10px;
	width: 300px;
	height: 300px;
	position: relative;
	background: #fff;

}

.inner_sp_block{

	position: relative;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	overflow: hidden;

}

.block--title{

	background: #e17683;
	color: #fff;
	font-size: 17px;
	text-align: left;
	bottom: 0px;
	left: 0px;
	position: absolute;
	width: 100%;
	min-height: 60px;
	background: rgba(225, 118, 131, 0.8);

}

.block--title p{

	padding: 7px 10px 10px 10px;

}

.block--date{

	position: absolute;
	top: 0px;
	right: 0px;
	background: #e17683;
	color: #fff;
	font-size: 12px;
	font-weight: bold;
	text-align: center;
	z-index: 200;

}

.block--date p{

	padding: 2px 5px 2px 5px;

}

.block--img{

	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin: 0px;
	width: 100%;
	height: 100%;
	background-size: cover;
	overflow: hidden;

}

.block--img img{

	width: 100%;

}

.new_label{

	position: absolute;
	top: -20px;
	left: -20px;
	width: 60px;
	height: 60px;
	padding: 0px;
	z-index: 200;
	margin: 0px;

}

.top_bt{

	width: 80px;
	height: 100px;
	position: fixed;
	bottom: -120px;
	right: 30px;
	padding: 0px;
	margin: 0px;
	z-index: 999;

}

.special_banner{

	position: relative;
	top: 0px;
	left: 0px;
	padding: 0px;
	margin-top: 10px;
	z-index: 999;

}