@charset "UTF-8";
/* CSS Document */
body {
	text-align:center;
	}
img {
	display:block;
	width:100%;
	}	
	
/*common-------------*/	
header > div,
section .item {
	width:80%;
	max-width:1000px;
	margin:0 auto;
	}
header,
footer {
	background-color:#004125;
	}
	
/*header------------------------------------*/	
header {
	text-align:center;
	}
header .top_img {
	height:32em;
	background-image:url(../img/top.png);
	background-size:contain;
	background-position:center;
	background-repeat:no-repeat;
	}		
header .top_text h1 {
	font-size:2.75em;
	font-weight:bold;
	line-height:150%;	
	margin-bottom:0.5em;
	color:#FFFFFF;
	}
header .top_text div {
	padding-bottom:3em;
	font-size:1em;
	line-height:200%;
	color:rgba(255,255,255,0.5);
	}
header .top_text div br {
	display:none;
	}
		
/*section--------------------------*/	
section {
	margin-bottom:4em;
	}	
section .item {
	margin-top:3em;
	}	
.photo {
	margin-bottom:1.25em;
	}
.text h2 {
	line-height:140%;
	font-size:3em;
	margin-bottom:0.5em
	}
.text ul  {
	line-height:150%;
	font-size:1em;
	border:1px solid #999;
	padding:1em;
	margin-bottom:1.5em
	}
.text p {
	line-height:200%;
	font-size:1em;
	margin-bottom:2em;
	}
/*img_thumbs*/
.text .img_thumbs img {
	width:18%;
	float:left;
	cursor:pointer;
	margin:0 2% 2% 0%;
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
	opacity:1.0;
	}
.text .img_thumbs img.pager-active {
	opacity:0.5;
	}
	
/*footer--------------------------*/	
footer {
	font-size:1em;
	color:#E5A840;
	padding:3em 0;
	text-align:center;
	letter-spacing:0.1em;
	}
footer span {
	font-size:1.25em;
	}
	
/*scroll------------------------------------*/
#footer_top {
	border:2px solid #666;
	background-color:rgba(255,255,255,0.8);
	font-size:1.5em;
	position:fixed;
	z-index:100;
	right: 2em; 
	top: 2em;
	width:5em;
	text-align:center;
	}
#footer_top a {
	line-height:210%;
	}
#footer_top a:link		{ color:#666; }
#footer_top a:visited	{ color:#666; }
#footer_top a:hover	{ color:#ccc; }
#footer_top a:active	{ color:#666; }		

	
/*-------------------------------------------------------------------------
  1024px
---------------------------------------------------------------------------*/
@media screen and (min-width : 1024px) {
body { text-align:left;	}
.pc { display:block; }
.sp { display:none; }	
header .top_text div br {
	display:block;
	}
header .top_text h1 br {
	display:none;
	}
.photo {
	width:48%;
	float:left;
	}
.text {
	width:48%;
	float:right;
	}
}