@charset 'UTF-8';


/* ページタイトル */
header #site_title { width:1350px; margin:0 auto; padding:0.5em 0.5em 0; }
#logo { width:600px; margin-top:0.5em; float:left; }
#logo_t { width:60px; float:right; }

#en_link { text-align:right; margin:-1em 0 0; float:right;clear: both; }

#en_link img { width:22px; }
#en_link a { color:#336; }

header nav { background-color:#06a; margin:0 auto; padding:0; text-align:center; border-top:2px solid #17b; border-bottom:2px solid #059; }
header nav ul {  margin:0.5em auto; text-align:center; }
header nav ul li { display:inline-block; list-style-type:none; margin:0 0.5em; font-weight:bold; font-size:18px; }
header nav ul li a { color:#fff; }
header nav ul li a:hover { text-decoration:none; }
header nav#nav { box-shadow:0px 0px 6px #336; }
header nav#nav2 { margin-bottom:2em; box-shadow:0px 2px 10px #669; }

#top_img { background:url('../design/top.jpg') center center no-repeat; width:100%; height:500px; background-size: cover; text-align:center; clear:both; box-shadow:0px 0px 16px #336 inset; }
#top_img img { width:75%; filter: drop-shadow(0px 2px 8px #336); margin-top:3em; max-height:350px; }
@media only screen and (max-width:1350px) {
	#top_img { height:400px; }
}
@media only screen and (max-width:980px) { 
	#top_img { height:300px; }
}
@media only screen and (max-width:768px) { 
	#en_link { margin:0; }
	#top_img { height:230px; }
}
@media only screen and (max-width:480px) { 
	#top_img img { width:80%; }
	#top_img { height:180px; }
}

/*共通*/

.page_width { width:980px; margin:2em auto; overflow:hidden; }

/* ページトップ */
#page-top { position: fixed; bottom: 20px; right: 20px; }
#page-top a { display: block; background:url('pagetop.png') no-repeat; text-indent:100%; white-space:nowrap; overflow:hidden; width:60px; height:60px; filter: alpha(opacity=60); -moz-opacity:0.6; opacity:0.6; }
#page-top a:hover { filter: alpha(opacity=100); -moz-opacity:1; opacity:1; }


/* フッター */
footer { background:#016; color:#fff; text-align:center; margin-top:6em; }
footer nav { background:#eeeef3; border-top:1px solid #ccd; border-bottom:1px solid #ccd; padding:1em; box-shadow:0px 4px 10px #003; }
#u_nav { width:1350px; margin:0 auto; }
#u_nav li { display:inline-block; margin:0 0.5em; font-size:14px; }
#u_nav li a { color:#667; }
#u_nav li a:hover { text-decoration:none; }
#count { color:#016; }
address { font-style:normal; margin:2em; }
address dt { font-weight:bold; }

/* モニター幅1350px以下 */
@media only screen and (max-width:1350px) {
	body { font-size:18px; }
	nav ul { width:100%; }
	#u_nav { width:100%; }
	header #site_title { width:100%; }
	header nav ul { width:100%; }
	#top_img { width:100%; }
}

/* モニター幅980px以下 */
@media only screen and (max-width:980px) { 
	body { font-size:16px; }
	#logo { width:650px; }
	.page_width { width:95%; }
}


/* スマートフォン 横(ランドスケープ) タブレット*/
@media only screen and (max-width:768px) { 
	#logo { width:400px; }
	#logo_t { width:60px; }
	body { font-size:14px; }
}


/* スマートフォン 縦(ポートレート) */
@media only screen and (max-width:480px) { 
	body { font-size:13px; }
	#logo { width:250px; }
	#logo_t { width:50px; }
	h1.t01 { font-size:1.6em; }
	.t02 { font-size:1.6em; margin:0 0 0.5em 0; font-weight:normal; }
}
