body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {margin:0; padding:0;}table { border-collapse:collapse; border-spacing:0;}fieldset,img { border:0; vertical-align:bottom;}address,caption,cite,scode,dfn,em,th,var {font-style:normal; font-weight:normal;}ol,ul { list-style:none; padding:0; margin:0;}caption,th { textron-align:left;}h1,h2,h3,h4,h5,h6 {font-size:100%;	font-weight:normal;}q:before,q:after {content:'';}abbr,acronym { border:0;}

/** **/

body{
width:100%;
	font-size:18px;
	font-family:'Lucida Grande', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', Meiryo, メイリオ, sans-serif;
	 line-height:1.6;
	-webkit-text-size-adjust: 100%;
	background:url(../images/bg.jpg) #22e4f0;
	background-position: center center;
	background-attachment: fixed;
}


.clear{clear:both;}
.clear hr{display:none;}


/*-------------------------------------*/
h1{
	width:1200px;
	margin:80px auto 50px;
}
h1 img{
	width:95%;
}
#wrapper{
	width:100%;
	text-align:center;
	margin:20px auto 0;
	color:#3F3F3F;

}
section{
	width:1200px;
	margin-left:auto;
	margin-right:auto;
}
.msg{
	text-align:right;
	margin:20px;
	font-size:1.1em;
	font-weight: bold;
}
.txt{
	text-align:center;
	margin:20px;
	font-size:0.9em;
}
.photo_wrap{
	padding:0;
}
.photo_box{
	margin-bottom:1.5em;
	padding:1em 1em 0 1em;
	background:rgba(255,255,255,0.8);
}
.photo_box ul{
	padding:1em;
	display:flex;
	justify-content:flex-start;
	flex-wrap:wrap;
}
.photo_box ul li{
	width:calc((100% - 30px) / 4);
	margin-right:10px;
	margin-bottom:50px;
	display:block;
	line-height:2em;
	font-weight:bold;
	font-size:0.8em;
}
.photo_box ul li p
{
	display:none;
}
.photo_box ul li span{
	display:block;
	margin:20px auto 0;
	line-height:1;
	background:#191d8d;
	padding:5px;
	color:#fff;
	font-weight:normal;
}
.photo_box ul li:nth-child(4n){
	margin-right:0;
}
.photo_box ul li img{
	width:100%;
	max-width:274.5px;
	height:274.5px;
	object-fit: contain;
	cursor: pointer;
}
#footer p{color:#333;margin-bottom:0.8em;}

@media only screen and (max-width: 767px) {
	h1{
		width:100%;
		margin:30px auto 20px;
	}
	section{
		width:100%;
	}
	.msg{
		text-align:right;
		margin:5px;
		font-size:0.5em;
	}
	.txt{
		width:80%;
		text-align:center;
		margin:5px auto;
		font-size:0.5em;
	}
	.photo_box{
		margin-bottom:1.5em;
		padding:5px;
		background:rgba(255,255,255,0.8);
	}
	.photo_box ul{
		padding:0em;
	}
	.photo_box ul li{
		width:calc((100% - 10px) / 2);
		margin-right:10px;
		margin-bottom:30px;
		display:block;
		line-height:1.5em;
		font-weight:bold;
		font-size:0.6em;
	}
	.photo_box ul li span{
		margin:5px auto 0;
		padding:3px;
	}
	.photo_box ul li:nth-child(2n){
		margin-right:0;
	}
	.photo_box ul li img{
		width:100%;
		max-width:274.5px;
		height:calc(50vw - 10px);
		object-fit: contain;
		cursor: pointer;
	}
	#footer p{font-size:0.8em}
}
