@charset "utf-8";

/* RESET */
html,body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,img,table,tr,th,td { margin:0; padding:0; }
ul,li { list-style:none;}

/* LAYOUT */
.clearfix:after {
	content:" "; display:block; clear:both;}
.clr { clear: both; }
img { border: 0; vertical-align: bottom; }

.pc { display:block;}
.sp { display:none;}

html {
	position: relative; font-size: 62.5%;
}

body {
	font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","游ゴシック Medium",YuGothic,YuGothicM,"Hiragino Kaku Gothic ProN",メイリオ,Meiryo,sans-serif;
	text-align: center;
	width:100%;background:#fefcf4;
	}
/*@media screen and (max-width: 1024px) {
	body{background:#009de4;}
}*/

ul.sns {position: relative;}
ul.sns li {
	width: 30px;
	height: 30px; 	margin:0 5px;
}
ul.sns a li:hover {
	opacity:0.8;
	filter:alpha(opacity=80);
	-ms-filter: "alpha( opacity=80 )";
}
ul.sns li img {
	width:100%; /*100%;*/
/*	width:40px; height:40px;
	margin:3px auto;*/
}

h1 {
	font-size: 5.0rem;
	line-height: 5.8rem;
	margin-top: 0%;
}
p {	font-size: 2.0rem;}
a {	color: black;}

#toparea {
	height:auto; padding:150px 0;
	margin: 0 auto 10px auto;
	background:#03c3ff;
	/*background:url(img/bg.jpg) repeat-x #fff;*/
}
#toparea img { width:100%; max-width:767px; height:100%;}


#toparea2 {
	height:auto; padding:0;
	margin: 0 auto 10px auto;
	background:url(img/bg1.jpg) repeat #4475ba;
}
#toparea2 img { width:100%; max-width:554px; height:100%;}
#toparea3 {
	height:auto; padding:0;
	margin: 0 auto 10px auto;
	background:#fff;
}
#toparea3 img { width:100%; max-width:554px; height:100%;}

.btn { /*position:absolute; z-index:5; top:5%; right:10%;  */
		font-size: 14px; font-size:1.4rem; 
		padding:10px;  width:200px; margin:50px auto 0 auto;
		background:#fff; filter: drop-shadow(2px 2px 5px #000); 
		border-radius: 10px;  -webkit-border-radius: 10px; -moz-border-radius: 10px;}
a:hover .btn  { opacity:0.7; filter:alpha(opacity=70); -ms-filter: "alpha( opacity=70)";filter: drop-shadow(0px 0px 0px #000); }

ul li {
	list-style-type: none;
	display: inline-block;
	position: relative;
	width: 15%;
	height: 80px;
}
ul li img {
	position: absolute;
	width: 100%;
	margin: 0 5%;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	margin: auto;
}
/*=====================================================================*/


.fs80{ font-size:80%!important;}
.bt0 { border-top:none!important;}
.mt20 { margin-top:20px;} 
/*--------------*/
@media screen and (max-width: 780px) {
	body { width:100%; min-width:inherit; background:#fff;
		font-size:14px; font-size: 1.4rem; line-height: 1.5;}
	.pc { display:none;}
	.sp { display:block;}
	#toparea img { width:90%;}
}