/* CSS Document */

@import url(navi.css);
@import url(common.css);



#main {
	width:100%;
	height:480px;
	margin:30px 0 0 0;
}

#danjo {
	width:1000px;
	height:273px;
	margin:0 auto;
	position:relative;
}

	#danjo #ii {
		width:184px;
		height:182px;
		position:absolute;
		left:408px;
		top:-82px;
	}
	
	#danjo #st1 {
		width:542px;
		height:26px;
		position:absolute;
		left:235px;
		top:120px;
	}
	
	#danjo #st1 h1 {
		width:542px;
		height:26px;
		background:url(../img/top/st1.png) no-repeat;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
	}
	
	#danjo p.msg {
		width:542px;
		position:absolute;
		left:235px;
		top:170px;
		margin:0;
		padding:0;
		text-align:center;
	}
		
		
@media screen and (max-width: 500px) {
	

#main {
	width:100%;
	height:200px;
	margin:70px 0 0 0;
}

#danjo {
	width:100%;
	height:auto;
	margin:0 auto;
	position:static;
}

	#danjo #ii {
		width:40%;
		height:auto;
		position:static;
		margin:-60px auto 0 auto;
		text-align:center;
	}
	
	#danjo #ii img {width:100%; height:auto;}
	
	#danjo #st1 {
		width:90%;
		height:26px;
		position:static;
		margin:0 auto;
		clear:both;
	}
	
	#danjo #st1 h1 {
		width:100%;
		height:26px;
		background-size:contain;
	}
	
	#danjo p.msg {
		width:90%;
		position:static;
		margin:0 auto;
		padding:0;
		font-size:0.8em;
		text-align:left;
	}
			
	
}


#djlink {
	width:868px;
	margin:0 auto;
	padding:20px 0 0 0;
}

	#djl {
		width:425px;
		float:left;
		background:url(../img/top/pink.png) no-repeat bottom;
		padding-bottom:20px;
	}
	
	
	#djr {
		width:425px;
		float:right;
		background:url(../img/top/blue.png) no-repeat bottom;
		padding-bottom:20px;
	}
	
	#djl h1,
	#djr h1 {
		font-size:1em;
		font-weight:normal;
		padding:0;
		margin:0 0 0 10px;
	}
	
	#djl h1 a {
		padding:5px 10px 5px 30px; 
		background:url(../img/top/yaji1.png) no-repeat left;
	}
	
	#djr h1 a {
		padding:5px 10px 5px 30px; 
		background:url(../img/top/yaji2.png) no-repeat left;
	}
	
	#djl p,
	#djr p {
		margin:0;
		padding:5px 0 0 40px;
		font-size:0.9em;
	}
	
@media screen and (max-width: 500px) {
	
#djlink {
	width:90%;
	margin:0 auto;
	padding:20px 0 0 0;
}

	#djl,
	#djr {
		width:100%;
		float:none;
		background-size:100%;
		padding-bottom:20px;
		margin-bottom:20px;
	}
	
	#djl img,
	#djr img {width:100%; height:auto;}
	

	
	#djl p,
	#djr p {
		margin:0;
		padding:5px 0 0 40px;
		font-size:0.8em;
	}	
}


	
#ie {
	width:1000px;
	margin:0 auto;
}

	#ie h1 {
		width:391px;
		height:121px;
		margin:0 auto 40px auto;
		padding:0;
	}
	
	#ie h1 a {
		width:391px;
		height:121px;
		background:url(../img/top/st2.png) no-repeat;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
		display:block;
	}
	
	#ie .box {
		width:250px;
		float:left;
		padding:0 0 20px 0;
	}
	
	#ie .box p {
		margin:0;
		padding:0 18px;
		font-size:0.8em;
		line-height:180%;
		font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	}
	
	#ie .box.b1 {background:url(../img/top/b1.png) no-repeat center bottom;}
	#ie .box.b2 {background:url(../img/top/b2.png) no-repeat center bottom;}
	#ie .box.b3 {background:url(../img/top/b3.png) no-repeat center bottom;}
	#ie .box.b4 {background:url(../img/top/b4.png) no-repeat center bottom;}
	
	#ie .box img {
		margin:0; 
		padding:0; 
		display:block;
		}
	
		#ie .box h3 {
			font-size:0.8em;
			font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
			color:#FFFFFF;
			font-weight:normal;
			padding:5px 0;
			text-align:center;
			width:100%;
			margin:0 0 15px 0;
		}
		
		#ie .box h3.col1 {background-color:#D70700;}
		#ie .box h3.col2 {background-color:#FF4D4D;}
		#ie .box h3.col3 {background-color:#004C66;}
		#ie .box h3.col4 {background-color:#008C69;}
	

@media screen and (max-width: 500px) {
	
#ie {
	width:100%;
	margin:0 auto;
}

	#ie h1 {
		width:100%;
		height:90px;
		margin:0 auto 40px auto;
		padding:0;
	}
	
	#ie h1 a {
		width:100%;
		height:90px;
		background-size:contain;
		background-position:center top;
	}
	
	#ie .box {
		width:50%;
		float:left;
		padding:0 0 20px 0;
	}
	
	#ie .box img {width:100%; height:auto;}
	
	#ie .box p {
		margin:0;
		padding:0 18px;
		font-size:0.8em;
		line-height:180%;
		font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	}
	
	#ie .box.b1 {background-position:left bottom;}
	#ie .box.b2 {background-position:left bottom;}
	#ie .box.b3 {background-position:left bottom;}
	#ie .box.b4 {background-position:left bottom;}
	
	#ie .box img {
		margin:0; 
		padding:0; 
		display:block;
		}
	
		#ie .box h3 {
			font-size:0.75em;
			color:#FFFFFF;
			font-weight:normal;
			padding:5px 0;
			text-align:center;
			width:100%;
			margin:0 0 15px 0;
		}
}

#info {
	width:1000px;
	margin:0 auto;
	padding:40px 0 0 0;
}

	#infol {
		width:490px;
		float:left;
	}
	
		#infol .waku {
			width:100%;
			background:url(../img/top/kage.png) no-repeat bottom;
			padding:0 0 24px 0;
		}
		
		#infol .waku .blueberry {
			padding:15px;
			box-sizing:border-box;
			border:1px solid #eeeeee;
		}
	
	#infor {
		width:490px;
		float:right;
	}
	
	#infor dl {
		padding:0;
		font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "メイリオ", Meiryo, serif;
		margin:0 0 0 20px;
		font-size:0.9em;
	}

	#infor dt {
		float:left;  
		width:100px;  
		padding:0 0 5px 0;  
		clear:both;  
	}

	#infor dd {  
		margin-left:100px;  
		padding:0 0 5px 5px;  
	}
	
	#infor .bnr {padding:20px 0 0 20px;}
	#infor .bnr img {border:1px solid #d6d6d6;}
			




	#info h3 {
		width:95px;
		height:50px;
		text-indent:100%;
		white-space:nowrap;
		overflow:hidden;
		margin:0 0 0 20px;
	}
	
		#info h3#h31 {background:url(../img/top/sst1.png) no-repeat;}
		#info h3#h32 {background:url(../img/top/sst2.png) no-repeat;}
		
	
	#infol p {
		margin:0;
		padding:0 0 0 20px;
		font-family: "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
		font-size:0.8em;
		}

@media screen and (max-width: 500px) {

#info {
	width:100%;
	margin:0 auto;
	padding:0;
}

	#infol {
		width:100%;
		float:none;
		padding-bottom:20px;
	}
	
		#infol .waku {
			width:90%;
			background:none;
			padding:0 0 10px 0;
			margin:0 auto;
		}
		
		#infol .waku .blueberry {
			padding:10px;
			box-sizing:border-box;
			border:1px solid #eeeeee;
		}
	
	#infor {
		width:100%;
		float:none;
	}
	
	#infor dl {
		padding:0;
		font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "メイリオ", Meiryo, serif;
		margin:0 0 0 20px;
		font-size:0.8em;
	}

	#infor dt {
		float:none;  
		width:100px;  
		padding:0 0 5px 0;  
		clear:both;  
	}

	#infor dd {  
		margin-left:0;  
		padding:0 0 5px 0;  
	}
	
	#infor .bnr {padding:20px 0 0 0; width:90%; margin:0 auto;}
	#infor .bnr img {border:1px solid #d6d6d6; box-sizing:border-box; width:100%; height:auto;}
			




	#info h3 {
		width:100%;
		height:auto;
		padding:10px 0;
		text-indent:0;
		white-space:nowrap;
		margin:0 0 10px 0;
		font-size:1.2em;
		text-align:center;
		font-family: "Times New Roman", "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "メイリオ", Meiryo, serif;
	}
	
		#info h3#h31 {background:none; background-color:#f6f6f6;}
		#info h3#h32 {background:none; background-color:#f6f6f6;}
		
	
	#infol p {text-align:center; padding:0;}
}


