@charset "UTF-8";

#pagehead{
background:url(img/pagehead.jpg) no-repeat center;
}
#pagehead h1 span{
letter-spacing: 1.3px;
}
#contents01 .wrapper2{
background:url(img/photo.jpg) no-repeat right top;
}
#contents01 h2{
border-top:solid 2px #0060a5;
padding-top:10px;
font-family: 'Shuei Mincho M';
font-size:24px;
margin-bottom:20px;
display:inline-block;
}
#contents01 h2 span{
color:#8a9a9a;
font-size:16px;
display:block;
font-family: "proxima-nova",sans-serif;
font-style: normal;
font-weight: 600;
letter-spacing: 1.3px;}
#contents01 h2:after{
content: none;}
#contents01 h2 + p{
line-height: 1.3;
margin-bottom:10px;
}
#contents01 h4{
margin-top:20px;
margin-bottom:10px;
}
#contents01 .tellink{
font-family: "proxima-nova",sans-serif;
font-style: normal;
font-weight: 400;
font-size: 24px;
margin-top:15px;
}
#contents01 .tellink span.text{
font-size:18px;
vertical-align: top;
display:inline-block;
margin-right:5px;
}

/*#contents02*/
#contents02 #gmap{
width:100%;
height:445px;
}

/*#contents03*/
#contents03{
margin-bottom: 80px;
}
#contents03 .box{
	-js-display: flex;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-wrap: wrap;
	flex-wrap: wrap;
  -webkit-justify-content: row; 
  justify-content:         row;
margin-bottom:20px;}
#contents03 .box h3{
background:#67b3ee;
color:#fff;
width:25%;
font-size:22px;
text-align: center;
position: relative;
line-height: 1.4;}
#contents03 h3 + div{
padding:25px 3%;
width:75%;
background:url(../common/img/bg.gif) repeat 0 0;
}
#contents03 .box h3 span{
position:absolute;
top:50%;
left:0;
right:0;
margin:0 auto;
display:inline-block;
}
#contents03 .train h3 span{
top:45%;
}
#contents03 .box h3 span:before{
content:"";
background:url(img/car.gif) no-repeat 0 0;
width:40px;
height:40px;
display:block;
position:absolute;
top:-50px;
left:0;
right:0;
margin:0 auto;
}
#contents03 .train h3 span:before{
content:"";
background:url(img/train.gif) no-repeat 0 0;
}
#contents03 .box h3 span:after{
content:"";
background:#0060a5;
width:60px;
height:2px;
display:block;
position:absolute;
bottom:-10px;
left:0;
right:0;
margin:0 auto;
}
#contents03 .box h4{
margin-bottom:10px;
}
#contents03 .box p{
line-height: 1.8;
}


@media screen and (max-width: 1040px) {
#contents01 .wrapper2 {
    background-size:45%;
}



}

@media screen and (max-width: 900px) {
#contents01 .wrapper2 {
background-position:top center;
background-size:60%;
padding-top:45%;
}
#contents01 .wrapper2 .btn + div{
float:right;
margin-top:-130px;
}
#contents03 .box h3{
width:40%;
}
#contents03 h3 + div {
    width: 60%;
}

}

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

#contents01 .wrapper2 {
background:none;
margin: 0 auto;
width:90%;
padding:0;}
#contents01 .wrapper2 .btn + div{
float:none;
margin-top:auto;
}
#contents01 .wrapper2 .content{
margin:0 auto;
width:90%;
}
#contents01 .wrapper2 .content p{
text-align: center;}

#contents01 .btn{
margin-bottom:20px;
}
#contents01 h4 + p br{
display:none;
}
/*
#contents01 .wrapper2 p br{
display:none;}
*/

/*#contents02*/

#contents02 #gmap{
height:250px;
}
/*#contents03*/

#contents03 .box {
display:block;
}
#contents03 .box h3,#contents03 h3 + div{
width:100%;
}
#contents03 .box h3{
min-height: 80px;
}
#contents03 .box h3 span{
position:static;
padding-top:25px;
font-size:20px;}
#contents03 .box h3 span br{
display:none;}
#contents03 .box h3 span:before {
width:30px;
height:30px;
background-size: 100%;
position:static;
display: inline-block;
margin-right:10px;
vertical-align: middle;}
#contents03 .box h3 span:after {
bottom:20px;}

