@charset "utf-8";
/*----------------------------------------------------
 検索トップ
 ----------------------------------------------------*/

form#bangumiForm {
	position: relative;
	min-height:50px;
}

.main_img {
	background-position: center 0;
    background-repeat: no-repeat;
    height: 470px;
    position:relative;
    z-index:10;
}

.bg {
	height:431px;
}

.bg.broadcast {
	position:absolute;
	width:100%;
	
	background: #93DBFF;
	z-index:1;
}

.bg.storage {
	position:absolute;
	width:100%;
	
	background: #ffbfb5;
	z-index:1;
}

.bg.nod {
	position:absolute;
	width:100%;
	
	background: #ffd7ad;
	z-index:1;
}

.bg.opl {
	position:absolute;
	width:100%;
	
	background: #ceefc7;
	z-index:1;
}

.main_img .snsContainer {
	margin: 0;
    padding: 5px 0;
    max-width: 980px;
    margin: 0 auto;
    position: relative;
}

.main_img div#nhksocialbtn {
	text-align: right;
    margin: 5px 0 10px 0;
    width: 289px;
    position: absolute;
    right: 0;
}

.main_img .snsContainer span {
    font-size: 12px;
    display: block;
    width: 275px;
    text-align: right;
    position: absolute;
    right: 0;
	top: 43px;
}

.socialbookmark_style li {
    list-style-type: none;
    float: left;
    margin: 0 0 0 12px !important;
}

.main_img_arrow {
	height:60px;
}

.main_img.broadcast {
	background-image: url(../images/top/top.png);
}

.main_img.storage {
	background-image: url(../images/top/top_storage.png);
}

.main_img.nod {
	background-image: url(../images/top/top_nod.png);
}

.main_img.opl {
	background-image: url(../images/top/top_opl.png);
}


/* infoArea */
#infoArea {
	display: none;
    margin-top: 15px;
}

#infoArea .info_header {
	font-weight: bold;
	font-size: 15px;
	background-color: #ccc;
}

#infoArea .info_text{
	color: #333 !important;
	padding: 5px;
	font-weight: bold;
	font-size: 14px;
	line-height: 1.7;
	background-color: #fff;
}

.desc {
	margin: 10px 0 10px 0;
}

@media screen and (max-width: 960px) {
	.main_img {
	    background-size: 1201px 364px;
	    height:364px
	}
	.bg {
		height: 333px;
	}
}
 

@media screen and (max-width: 740px) {
	.main_img {
	    background: none;
	    background-image: none;
	    height: auto;
	    position: relative;
	    line-height: 0;
	    background-size: auto auto;
	}
	.main_img_sp img {
		width:100%;
	}
	.main_img .snsContainer {
	    margin: 0;
	    padding: 10px 0;
	    position: absolute;
	    right: 2%;
	    top: 0;
	}
	.main_img.broadcast {
		 background-image: none;
	}
	
	.main_img.storage {
		 background-image: none;
	}
	
	.main_img.nod {
		 background-image: none;
	}
	
	.main_img.opl {
		 background-image: none;
	}
	
	.main_img .snsContainer span {
	    font-size: 12px;
	    display: block;
	    width: 275px;
	    text-align: right;
	    position: absolute;
	    right: 0;
	    top: 56px;
	}
}


/*----------------------------------------------------
 othersView
 ----------------------------------------------------*/

.other_sites {
	margin: 0 auto 0 auto;
	box-sizing: border-box;
}

.other_sites a.thumbnail, .other_sites a.site_name {
	display: block;
	text-indent: -9999px;
	border: none;
	overflow: hidden;
}

.other_sites .other_left a.site_name {
	background: url(../images/top/opl_othersites.png) no-repeat 0 0;
	width: 184px;
	height: 16px;
}

.other_sites .other_center a.site_name {
	background: url(../images/top/nod_othersites.png) no-repeat 0 0;
	width: 226px;
	height: 18px;
	margin-bottom: 3px;
}
.other_sites .other_right a.banner_01 img {
	margin-top: 10px;
}
.other_sites * {
	box-sizing: border-box;
}
.other_sites {
	background: #bbbbbb;
	width: 100%;
	padding: 40px 15px;
	text-align: left;
	border-right: 0px;
	border-left: 0px;
	box-sizing: border-box;
}
.other_sites .another_site {
	float: left;
	background-color: #FFF;
}
.other_sites .other_left {
	width: 39%;
    margin: 0 1% 0 0;
    padding: 15px;
}
.other_sites .other_center {
	width: 35%;
    margin: 0 2%;
    padding: 15px;
}
.other_sites .other_right {
	width: 15%;
    margin: 0 1% 0 0;
    padding: 15px;
    background-color: inherit;
}
.other_sites a.thumbnail {
	margin-right: 8px;
}
.other_sites a.site_name {
	margin-bottom: 5px;
}
.other_sites p.lead {
	font-size: 12px;
	width: 100%;
	border-top: 1px solid #ccc;
	padding: 10px 0 0 0;
}

.other_sites .other_thum {
	width: 30%;
	max-width: 100px;
	min-width: 100px;
	float: left;
}

@media screen and (max-width: 960px) {
	.other_sites p.lead {
		line-height: 1.5;
	}
}

@media screen and (max-width: 740px) {
	.other_sites .other_left {
		margin: 5%;
		padding: 10px;
		width: 90%;
	}
	.other_sites .other_center {
		margin: 0 5% 5%;
		padding: 10px;
		width: 90%;
		border-top: 1px solid #ccc;
	}
	.other_sites .other_right {
		padding: 10px;
		width: 100%;
		text-align: center;
		/* border-top: 1px solid #ccc; */
		padding: 0;
		margin: 0 0 5% 0;
	}
	.other_sites p.lead {
		width: 95%;
		line-height: 1.5;
		font-size: 13px;
	}
	.other_sites {
		padding: 0;
	}
	.other_sites .other_right a.banner_01 img {
		margin: 0;
	}
	.other_thum {
		width: 20%;
		min-width: none;
	}
	.other_sites .other_left a.site_name {
		width: 100%;
	}
	.other_sites .other_center a.site_name {
		width: 100%;
	}
	
}

/* top */
#top_box h2 {
	font-size: 150%;
	margin-top: 30px;
}

#top_box form {
	margin: 20px 0 20px 0;
}

#top_links {
	margin: 20px 0 150px 0;
}

#top_links p {
	font-size: 14px;
}

#top_box input, #top_box label {
	margin-right: 20px;
}

#top_links .harf {
	text-align: left;
}


.toAbout span {
	display: inline-block;
	width: 16px;
	height: 12px;
	margin: 0 5px 0 0;
	background-image: url(../images/top/toAboutArrow.png);
}

.toAbout {
	display: inline-block;
	background: none;
	border: 0px;
	background-color: #1B7CB8;
	color: #FFF;
	border-radius: 5px;
	    padding: 10px 90px;
	font-size: 12px;
	margin: 10px 0;
}

.archivesWrap {
	max-width: 600px;
	margin: 0 auto;
}

.btn_submit {
	    display: inline-block;
    background-image: url(../images/top/search.png);
    border: none;
    width: 66px;
    height: 50px;
    background-repeat: no-repeat;
    text-indent: -9999px;
    /* margin: 3px 0 0 0; */
    background-color: transparent;
    vertical-align: middle;
}

#keyword {
	border: 2px solid #979797;
	vertical-align: middle;
}

@media screen and (max-width: 740px) {

	#top_links {
		margin: 20px 0 20px 0;
	}

	#top_links .harf {
		text-align: left;
		padding: 0 30px;
	}

	#top_links a {
		font-size: 15px;
	}

	#top_links p {
		font-size: 12px;
	}
	
	.toAbout {
		width: 100%;
		margin: 25px 0;
	}
	
	.desc {
		text-align: left !important;
		font-size:13px;
		line-height: 2.0;
	}
	
	#bangumiForm input#keyword {
		position: absolute;
	    top: 0;
	    left: 4%;
	    width:71%;
	}
	
	#bangumiForm .btn_submit {
		position: absolute;
		left:76%;
		top:0px;
	}
}


input.btn_submit {
    cursor: pointer;
}

.oplLibOnTop {
	width: 70%;
	max-width:200px;
    text-align: center;
    margin: 15px 0 0 0;
    display: inline-block;
	background: none;
	border: 0px;
	background-color: #40783C;
	color: #FFF;
	border-radius: 5px;
	padding: 8px 10px;
	font-size: 16px;
	margin-bottom:-45px;
}

.prevOplLib {
	margin-top:25px;
}