@charset "utf-8";
/* CSS Document */


.footer1 span{font-size: 14px;}
	


@media screen and (min-width: 767px){
	
	
	
section iframe{
	display: block; 
	width: 1200px;
	height: 30%;
	margin: 0.5% auto 1% auto;	
	min-width:640px;}
.back{background: url(../images/back_01.jpg) center center /cover no-repeat;
width: 1200px;
height: 587px;}
	
.box1{
    width: 285px;
	height: 285px;
	float: left; 
	text-align: center;
	margin-right: 1.5%;
	 border-radius: 4px;        /* CSS3草案 */  
    -webkit-border-radius: 4px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 4px;   /* Firefox用 */  
}
.blue a{
	background: url(../images/image01.png) center center no-repeat;
	width: 238px;
	height:93px;
	padding: 180px 20px 20px 20px;
	background-color:#77d6ee;
	margin-right: 1.5%;
	 border-radius: 4px;        /* CSS3草案 */  
    -webkit-border-radius: 4px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 4px;   /* Firefox用 */  
	display: block;
	color: #FFFFFF;
	text-decoration: none;
}

.blue-line a{
	background: url(../images/image02.png) center center no-repeat;
	width: 288px;
	height: 288px;
	 border-radius: 4px;        /* CSS3草案 */  
    -webkit-border-radius: 4px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 4px;   /* Firefox用 */  
	border:1px solid #77d6ee;
	display: block;
	text-indent: -9999px;
}
	
.box2{
	width: 520px;
	margin-left: 300px;
	padding: 3%;
	clear: both;
	text-align: center;
}
	

	
}

@media screen and (max-width: 767px) {
	
	
section iframe{
	display: block; 
	width: 100%;
	height: 30%;
	margin: 0.5% auto 1% auto;}
	

.header{
width: 100%;
}
	

/*
.blue a{
	background: url(../images/image01.png) center center no-repeat;
	width: 45.4%;
	height:100px;
	float: left; 
	padding: 180px 2% 2% 2%;
	border:1px solid #77d6ee;
	background-color:#77d6ee;
	display: block;
	color: #FFFFFF;
	text-decoration: none;
}

.blue-line a{
	background: url(../images/image02.png) center center no-repeat;
	width: 45.4%;
	height:100px;
	float: left;
	padding: 180px 2% 2% 2%;
	border:1px solid #77d6ee;
	display: block;
	text-indent: -9999px;
}
*/
	
.blue a{
	display: none;
}

.blue-line a{
	display: none;
}

	
.imagepohoto img{display: none;}
	
	
.imagepohoto {
	background:url(../images/image04.png) center center / cover no-repeat;
	width: 100%;
	height: 0;
	padding-top: calc(699 / 1200 * 100%); /* calc(画像高さ ÷ 画像横幅 × 100%) */
	clear: both;}
	
.box2{
	width: 94%;
	padding: 3%;
	clear: both;
	text-align: center;
}
	
	
}