/*@import url(http://fonts.googleapis.com/earlyaccess/notosansjp.css);*/

html { font:10px "ヒラギノ角ゴ ProN", "HiraKakuProN", "メイリオ", Meiryo, sans-serif, "ＭＳ Ｐゴシック"; font-weight:300; color:#333; }
body { margin:0; }
a { color:#333; text-decoration:none; cursor:pointer; }
a:hover { text-decoration:underline; }
dl, dt, dd, ul, ol, li, div, h1, h2, h3, h4, h5, h6, p { padding:0; margin:0; }
li{ list-style-type:none; }
hr{ clear:both; border:0; margin:0; }

@media screen and (max-width: 768px) {
    html { font-size:3.0vw; };
}
header,#main{max-width: 1000px; width: 100%; margin:0 auto;}
header{padding-top: 1%;}
header h1 {width:100%; height: 20vw;}
header h1 img{ width:40%; max-width:180px; margin: 3%;}
header.contact h1{height: 10%;}
header.contact #btn_menu{display: none;}
header>div#btn_menu{ padding:20px;  margin-top:-20vw; display:block; }
header>div#btn_menu>a{ width:61px; height:52px; display: block;  background-color:#1c3d2d; border-radius:5px; cursor:pointer; margin:0 0 0 auto; text-align:center; padding-top:8px; }
header>div#btn_menu>a>i{ color:#fff; font-size:42px; }
header>div#btn_menu>a>i.fa-bars{ display:inline; }
header>div#btn_menu>a>i.fa-times{ display:none; }
header>div#btn_menu.on>a>i.fa-bars{ display:none; }
header>div#btn_menu.on>a>i.fa-times{ display:inline; }
/*#spmenu{ display: none; background-color: RGBa(202,214,206,.95); font-size: 20px; position:absolute; top: 110px; width: 100%; max-width: 1000px;}*/
#spmenu{ display: none; background-color: rgba(0, 98, 90, 0.95); font-size: 20px; position:absolute; top: 110px; width: 100%; max-width: 1000px;}
#spmenu div{border: 1px #fff solid; margin: 2%; padding: 2%;}
#spmenu div p{text-align: center; font-size: 20px; font-weight: bold; color: #fff; padding-bottom:20px;}
#spmenu div ul{width: 100%;}
#spmenu div ul li{display: inline-block; width: 24%; padding:1% 0;}
#spmenu div ul li a{display: block; width:100%; background-color: rgba(255,255,255,.6);padding: 5% 0;}
#spmenu div ul li img{ display: block; margin: 0 auto;max-width: 80px; width: 98%;}
#spmenu div ul li a:hover{background-color: rgba(255,255,255,.8); transition:1s;}
#main div.form-wrapper p img{width: 100%; max-width:1000px; margin-bottom: 5%;}
@media screen and (max-width:768px){
    header h1 img{margin:5% 3% 3% 3%;}
    header>div#btn_menu{ padding:3vw;  margin-top:-20vw; display:block; }
    header>div#btn_menu>a{ width:14vw; height:12vw; display: block;  background-color:#1c3d2d; border-radius:1vw; cursor:pointer; margin:0 0 0 auto; text-align:center; padding-top:2vw; }
    header>div#btn_menu>a>i{ color:#fff; font-size:10vw; }
    #spmenu div ul li{width: 49%;}
    #spmenu{ position:absolute; top:20vw;}   
}
#main h2{background: #1c3d2d; color: #fff; line-height: 40px; font-size: 1.6em; font-weight: bold; padding: 0 10px; margin-bottom: 20px;}
p#gototop{ font-size:0; line-height:0; position:fixed; bottom:-150px; right:100px; z-index:98; }
p#gototop>a{ display:block; width:80px; height:80px; }
p#gototop>a>img{ width:100%; }
@media screen and (max-width: 768px) {
    p#gototop{ position:fixed; bottom:12% !important; right:5px; width:60px; height:60px; z-index:999;}
    p#gototop>a{ width:60px; height:60px; }
}
footer {background-color: #cad6ce; width: 100%;}
footer p{text-align: center; padding: 20px 5px;}