@charset "UTF-8";

#blockimg480 { display: none; }


/* CSS Document */

/* ************************************************** */
/* PC  Display */
/* ************************************************** */

@media screen and (max-width:1300px) {

nav.common ul { display: none; }
nav.common .logo { display: none; }
nav.common .main { margin: 100px 0 0;height: 280px; }
nav.common .main h1 { font-size: 180%;letter-spacing: 0; }
nav.common .main .photo { margin: 0;height: 280px;background-size: cover; }
	
}

/* ************************************************** */
/* PC  Display */
/* ************************************************** */

@media screen and (max-width:1100px) {

.wrpper-main { margin: 0 5%;width: 90%; }

nav.common .main h1 { width: 100%;margin: 0;padding: 0; }
nav.common .main .photo { width: 100%; }
	
}


/* **************************************************************** */
/*  RESPONSIVE  RAYOUT  MAX-WIDTH 980px */
/* **************************************************************** */
@media only screen and (max-width:980px){

.contents .banner .block { width: 100%;margin: 0 0 50px; }

}


/* **************************************************************** */
/*  RESPONSIVE  RAYOUT  MAX-WIDTH 880px */
/* **************************************************************** */
@media only screen and (max-width:880px){

.footer .foot-wrapper .address { width: 100%;margin: 0;text-align: center; }
.footer .foot-wrapper .navi { width: 90%;margin: 0 5%; }
.footer .foot-wrapper .navi ul { width: 50%;text-align: center; }
.footer .foot-wrapper .navi ul li { margin: 0 0 20px; }

.page-title h1 {
	font-size: 30px;
	line-height: 30px;
}

.page-title h1 span { font-size: 18px; }

}

/* **************************************************************** */
/*  RESPONSIVE  RAYOUT  MAX-WIDTH 640px */
/* **************************************************************** */

@media screen and (max-width:640px) {

nav.common .main .photo {
	height:50vw;
	background-size: cover;
}

.contents .banner .block .banner-button { height: 80px; }
.contents .banner .block .banner-button a { padding: 15px 0 0;font-size: 20px;font-weight: bold; }
.contents .banner .block .banner-button .efect {  height:80px; }

.footer .foot-wrapper .logo { margin: 0 auto;float: none;text-align: center; }

.footer .foot-wrapper nav.foot li {
	width: 90%;
	margin: 0.3em 5%;
	letter-spacing: 0.2em;
	text-align: center;
}

}

/* ************************************************** */
/* Smart-Phone Tate(Portrayte) */
/* ************************************************** */
@media only screen and (max-width:580px){

nav.common .main { height: 200px; }
nav.common .main h1 { font-size: 150%;margin: 0; }
nav.common .main .photo { height:35vw; }

.logo { height: auto;margin: 5px 0 0; }

.footer .foot-wrapper .logo {
	width: 80%;
	float: left;
	margin: 10px 10%;
}

.footer .foot-wrapper .navi { margin: 20px; 0; }
.footer .foot-wrapper .navi ul { width: 100%;margin: 0; }
.footer .copyright {
	height: auto;
	padding: 10px 0;
	line-height: 20px;
	color: #FFF;
	text-align: center;
	font-size: 85%;
	letter-spacing: 0;
}

.footer .foot-wrapper .address br.mb { display: block; }

}

/* ************************************************** */
/* Smart-Phone Tate(Portrayte) */
/* ************************************************** */
@media only screen and (max-width:480px){

.contents .banner .block .banner-button { width: 90%;height: 80px; }
.contents .banner .block .banner-button a { padding: 20px 0 0;font-size: 18px; }
.contents .banner .block .banner-button a span { font-size: 16px; }
.contents .banner .block .banner-button .efect { width:90%; height:80px; left:-90%; }

}