/* CSS Document */

img{
	max-width:100%;
}


.book_shadow{
	-moz-box-shadow: 0 0 1px #000;
	-webkit-box-shadow: 0 0 1px #000;
}

.youtube {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
}
.youtube iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100% !important;
	height: 100% !important;
}



div#top_wrap{
	width:100%;
	background:#fff;
}

div#content{
	background:#FFF url("https://www.oita-ebooks.jp/wp-content/themes/ebooks/sub-img/page-2951/bg.gif");
}


/*▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼*/

header#page_header{
	background:#fff;
	max-width:1000px;
	margin:0 auto;
	padding:0%;
}
	
	div#page_header_bnr{
		max-width:60%;
		margin:0 auto;
	}
		#top_title{
		}




div#header_img{
	width:100%;
	padding:50px 0;
	background:url("https://www.oita-ebooks.jp/wp-content/themes/ebooks/sub-img/page-2951/kv.jpg") no-repeat center;
	position:relative;
	top:0;
	left:0;
}

div#img_wrap{
	margin:0 auto;
	width:50%;
}

	div#header_mov{
	}
	
	/*カタムー*/
	img#img_ktm{
		display:block;
		max-width:10%;
		height:auto;
		position:absolute;
		bottom:25%;
		right:10%;
		z-index:220;
	}
	
	/*ソボさん*/
	img#img_sbsn{
		display:block;
		max-width:10%;
		height:auto;
		position:absolute;
		bottom:25%;
		left:9%;
		z-index:210;
	}
	
	img#book_img_clickball{
		display:block;
		max-width:11%;
		height:auto;
		position:absolute;
		top:250px;
		right:30%;
		z-index:200;
	}
	
	img#test{
		display:block;
		width:10%;
		height:auto;
		position:absolute;
		top:200px;
		right:10%;
		z-index:100;
	}
	

/*▼▼▼▼▼▼▼▼▼リンクボタン▼▼▼▼▼▼▼▼▼▼*/

ul#book_link_btn{
	max-width:70%;
	margin:0 auto;
	margin-left:16%;
}
	li#top_bnr_1{
		max-width:31%;
		float:left;
		margin:2% 2% 0 0;
	}
	li#top_bnr_2{
		max-width:31%;
		float:left;
		margin:2% 2% 0 0;
	}
	li#top_bnr_3{
		max-width:31%;
		float:left;
		margin:2% 2% 0 0;
	}

/* information wrap*/
div#unesco_information_wrap{
	width:90%;
	max-width:860px;
	padding:10px;
	margin: 20px auto;
}
	div#unesco_information_wrap h2{
		max-width:510px;
		margin:30px auto;
	}

	div#unesco_information_wrap img{
		width:100%;
	}

	div#unesco_information_wrap p{
		text-align:justify;
		line-height:30px;
		border:#FFDA7F dotted 5px;
		padding:30px;
		background:#fff;
		color:#777;
	}

/*mov wrap*/
div#movie_wrap{
	max-width:930px;
	margin:20px auto;
}
	div#movie_wrap h2{
		max-width:500px;
		margin:0 auto;
	}
		div#movie_wrap h2 img{
			width:100%;
		}
	
	div#movie_wrap ul{
		margin-left:4%;
	}
		div#movie_wrap ul li{
			width:46%;
			margin-right:4%;
			margin-top:6%;
			float:left;
		}
		
		div#movie_wrap .single_list li{
			margin:3% auto;
			float:none;
		}
		
		div#movie_wrap ul h3{
			font-weight: bold;
			color:#451900;
			font-size:12px;
		}
		
		
		
div#map_wrap{
	width:100%;
	height:auto;
}

img#unesco_map{
	width:90%;
	height:auto;
	display:block;
	margin:0 auto;
}

div#book_wrap{
	width:100%;
}

h2#book_wrap_header{
	margin:30px;
}

h2#book_wrap_header img{
	display:block;
	width:250px;
	height:auto;
	margin: 0 auto;
}
	
	ul#book_list_wrap{
		width:80%;
		margin:0 auto;
	}
	
		ul#book_list_wrap li{
			float:left;
			height:200px;
			width:20%;
			box-sizing: border-box;
		}
		
		ul#book_list_wrap li img{
			width:auto;
			height:70%;
			display:block;
			margin:0 auto;
		}
		
		ul#book_list_wrap li h3{
			max-width:100px;
			height:20%;
			font-size:12px;
			text-align:center;
			margin:0 auto;
		}

	div#next_button{
		width:80%;
		height:40px;
		margin:0 auto;
	}
	
		div#next_button img{
			width:73px;
			height:auto;
			display:block;
			margin-left: auto;
		}

div#fb_wrap{
	max-width:840px;
	margin:20px auto;
	margin-bottom:20px;
}

	div#fb_wrap iframe{
		float:left;
		margin:0 10px;
	}


div#bottom_wrap{
	padding:8px 0 8px 0;
	border-top:#CCA441 solid 1px;
	background:#fff;
}

div#movie_wrap ul#sbktm_img  li{
	width:80%;
}

@media only screen and (max-width: 980px){
	
	div#top_navigation{
		/*ナビゲーションを横幅いっぱいにする*/
		max-width:100%;
		background:#fff;
	}
	div#top_navigation li,div#bottom_navigation li{
		float:left;
		width:100%;
		margin:0 auto;
		border-bottom:#eee solid 1px;
		background:#FFF;
	}
}

/*タブレット*/
@media only screen and (max-width: 768px){
	
	
	
	
	
	
header#page_header{
	height:auto;
}
	
	div#page_header_bnr{
		float:none;
		max-width:90%;
		margin:0 auto;
	}
		#top_title{
		}
	
	ul#book_link_btn{
	}
		li#top_bnr_1{
			
		}
		li#top_bnr_2{
		}
	
	
	
	
	
	
	
	
	/*◯◯ebooksの文字を中央寄せ*/
	header#page_header img{
		width:100%;
		display:block;
		margin:0 auto;
	}
	
	div#top_navigation li,div#bottom_navigation li{
	}
		div#top_navigation li a,div#bottom_navigation li a{
			width:100%;
			height:100%;
			line-height:30px;
			padding:2px;
			display:block;
			text-align:center;
			text-decoration:none;
			font-weight: bolder;
			text-shadow: 1px 0px 0px #fff, 0px 1px 0px #fff, -1px 0px 0px #fff, 0px -1px 0px #fff;
		}
			div#top_navigation li a span , div#bottom_navigation li a span{
				display:block;
				font-size:8px;
				font-weight:normal;
				line-height:10px;
			}
	
	ul#book_list_wrap{
		width:90%;
	}
		ul#book_list_wrap li{
			float:left;
			height:200px;
			width:33.3%;
			box-sizing: border-box;
		}
		
		ul#book_list_wrap li img{
			width:auto;
			height:70%;
			display:block;
			margin:0 auto;
		}
		
		ul#book_list_wrap li h3{
			max-width:100px;
			height:20%;
			font-size:12px;
			text-align:center;
			margin:0 auto;
		}
}

/*スマートフォン*/
@media only screen and (max-width: 600px){
	
	/*◯◯ebooksの文字を中央寄せ*/
	div#movie_wrap ul li{
		width:85%;
		float:none;
		padding-bottom:20px;
		margin:0 auto;
	}
	
	div#fb_wrap{
		display:none;
	}
	
}

/*スマートフォン*/
@media only screen and (max-width: 420px){
	
	/* SP表示にて段組みの変更を行う */
	
	div#header_img{
		height:400px;
		padding:0;
	}
	
	div#img_wrap{
		width:100%;
		max-width:100%;
		height:100%;
		margin:0 auto;
		position:relative;
		top:0;
		left:0;
	}
	
	
	ul#book_link_btn{
		margin-top:4%;
	}
		li#top_bnr_1{
			max-width:100%;
			float:none;
		}
		li#top_bnr_2{
			max-width:100%;
			float:none;
		}
		li#top_bnr_3{
			max-width:100%;
			float:none;
		}
	
	
	/*ソボさん*/
	img#img_sbsn{
		display:block;
		max-width:22%;
		height:auto;
		position:absolute;
		bottom:15%;
		left:17%;
		z-index:200;
	}
	
	/*カタムー*/
	img#img_ktm{
		display:block;
		max-width:22%;
		height:auto;
		position:absolute;
		bottom:16%;
		right:13%;
		z-index:220;
	}
}