@charset "utf-8";

@import "base_layout.css";
@import "common_parts.css";



article{
	padding: 0 ;
}
#head_block{
	width: 100%;
	position: relative;
	overflow: hidden;
}

#head_block:before {
	content:"";
	display: block;
	padding-top: 44%;
}
#head_block img.mainphoto{
	width: 100%;
	height: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	margin: auto;
	z-index: 10;
}
#head_block .head_information {
	position: absolute;
	width: 100%;
	height:  75px;
	top: 0;
	left: 0;
	background-color: rgba( 255, 255, 255, 0.7 );
	z-index: 50;
}
#head_block .head_information .logo{
	position: absolute;
	width: 309px;
	top: 23px;
	left: 23px;
	z-index: 60;
}
#head_block .head_information .logo img{
	width: 309px;
	height: auto;
}

#head_block .mainCatch{
	position: absolute;
	top: 40%;
	right:  140px;
	text-align: right;
	font-size:  24px;
	z-index: 60;
	color: #FFF;
	text-shadow: 1px 1px 3px #000;
}
#head_block .mainCatch p{
	padding: 0 0 2em 0;
}
#head_block .mainCatch img{
	max-width:  100%;
	width:  auto;
	height:  auto;
	margin: 0 0 2em auto;
	display:  block;
}

@media screen and (max-width: 979px) {
/*tablet*/

#head_block{
	width: 100%;
	min-height: 500px;
	position: relative;
	overflow: hidden;
	background: url(../../img/toppage/mainphoto.jpg) no-repeat top center;
	background-size: auto 500px;
	-moz-background-size: auto 500px;
	-webkit-background-size:  auto 500px;
}

#head_block:before {
	content:"";
	display: block;
	padding-top: 0;
}
#head_block img.mainphoto{
	display: none;
}
#head_block .head_information {
	position: absolute;
	width: 100%;
	height:  75px;
	top: 0;
	left: 0;
	background-color: rgba( 255, 255, 255, 0.7 );
	z-index: 50;
}
#head_block .head_information .logo{
	position: absolute;
	width: 309px;
	top: 23px;
	left: 23px;
	z-index: 60;
}
#head_block .head_information .logo img{
	width: 309px;
	height: auto;
}

#head_block .mainCatch{
	position: absolute;
	top: 120px;
	right:  0;
	font-size: 20px;
}
#head_block .mainCatch p{
	padding: 1em;
}
#head_block .mainCatch img{
	max-width:  100%;
	width:  auto;
	height:  auto;
	margin: 0 1em 2em auto;
	display:  block;
}




}

@media screen and (max-width: 768px){
/*smart phone*/
#head_block .mainCatch{
	text-align: left;
}

#head_block .mainCatch img{
	max-width:  90%;
	margin: 1em auto;
}

}


@media screen and (max-width: 620px) {
/*sp*/
#head_block .mainCatch{
	top: 100px;
}
#head_block .mainCatch img{
	max-width:  80%;
}

}


main#main{
}

@media print {
main#main {
overflow: visible !important;
}
}




/*greeting
************************************************************************************/
#greeting{
	background: url("../../img/toppage/bg_greeting.jpg") no-repeat top center;
	background-size:  cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
	margin: auto;
	padding:  0;
	width:  100%;
	min-height: 1000px;
	height: auto;
}
#greeting .greeting{
	width: 850px;
	margin: auto;
	padding-top: 12%;
	font-size: 16px;
	color:  #FFF;
	font-weight: 700;
	line-height: 2.5;
}
#greeting .greeting h1 {
	margin:  0 auto 30px auto;
	display:  block;
}
#greeting .greeting h1 img{
	margin:  0 auto;
	max-width: 100%;
	width: auto;
	height: auto;
}
#greeting .greeting p{
	padding-bottom:  1.5em;
}
#greeting .greeting p span{
	font-size: 18px;
}

@media screen and (max-width: 979px) {
#greeting{
	background: url("../../img/toppage/bg_greeting.jpg") no-repeat top center;
	background-size:  cover;
	-moz-background-size: cover;
	-webkit-background-size: cover;
	margin: auto;
	padding:  0;
	width:  100%;
	min-height: initial;
	min-height: auto;
}
#greeting .greeting{
	width: 100%;
	margin: 0 auto;
	padding: 20px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	line-height: 2;
}
#greeting .greeting h1 {
	margin:  0 auto 30px auto;
	display:  block;
}
#greeting .greeting h1 img{
	margin:  0 auto;
	max-width: 100%;
	width: auto;
	height: auto;
}
#greeting .greeting p{
	padding-bottom:  1.5em;
}
#greeting .greeting p span{
	font-size: 18px;
}

}

@media screen and (max-width: 768px){
}
@media screen and (max-width: 620px) {
/*sp*/
}
@media screen and (max-width: 480px){
}