@charset "UTF-8";

#main{
 width: 100%;
 height: 600px;
 background-image: url(../common/images/headBg.jpg);
 background-position: center center;
 background-size: cover;
 background-repeat: no-repeat;
}
#main .mainIn{
 width: 1830px;
}
#main .mainIn .mainT{
 float: left;
 margin: 74px 0 0 158px;
 width: 522px;
 height: auto;
}
#main .mainIn .img{
 float: right;
 margin: 20px 0 0;
 width: 1100px;
 height: auto;
}
@media screen and (max-width: 1840px){
#main{
 height: auto;
}
#main .mainIn{
 padding: 0 0 1.8vw;
 width: 99%;
}
#main .mainIn .mainT{
 margin: 4vw 0 0 8.7%;
 width: 28.6%;
}
#main .mainIn .img{
 margin: 1.1vw 0 0;
 width: 60.1%;
}

}

#omo{
 padding: 106px 0 182px;
 width: 100%;
}
h2{
 font-size: 32px;
 line-height: 100%;
 text-align: center;
 color: #0b9444;
 font-family: "dnp-shuei-mgothic-std", sans-serif;
 font-weight: 600;
}
#omo p{
 margin: 0;
 padding: 50px 0 60px;
 font-size: 16px;
 line-height: 36px;
 text-align: center;
}
#omo .omoBox{
 margin: 0 auto;
 padding: 0 0 55px;
 width: 654px;
}
#omo .omoBox li{
 float: left;
 margin: 0 0 15px;
 width: 320px;
}
#omo .omoBox li:nth-child(2n){
 float: right;
}
#omo .omoBox li img{
 width: 100%;
 height: auto;
 border-radius: 15px;
}
#omo .mean{
 margin: 0 auto 75px;
 width: 661px;
 position: relative;
}
#omo .mean img{
 width: 100%;
 height: auto;
 position: relative;
}
#omo .mean p{
 margin: 0;
 padding: 0;
 width: auto;
 font-size: 16px;
 line-height: 160%;
 color: #0b9444;
 font-weight: bold;
 position: absolute;
 z-index: 2;
 top: 55px;
 left: 285px;
 letter-spacing: 0.1vw;
}
.bt{
 margin: 0 auto;
 width: 500px;
}
.bt a{
 padding: 13px 0;
 width: 100%;
 font-size: 22px;
 line-height: 100%;
 text-align: center;
 color: #fff;
 font-family: "dnp-shuei-mgothic-std", sans-serif;
 font-weight: 600;
 display: block;
 background-color: #039a42;
 border: 2px solid #039a42;
 background-image: url(../common/images/arrow.png);
 background-position: right 14px center;
 background-size: 30px auto;
 background-repeat: no-repeat;
}
.bt a:hover{
 color: #039a42;
 background-color: #f5f9e7;
 background-image: url(../common/images/arrow2.png);
 background-position: right 10px center;
 opacity:1;
}

#use{
 padding: 0 0 206px;
 width: 100%;
}
#use .useBox{
 margin: 0 auto;
 padding: 86px 0 0;
 width: 1004px;
}
#use .useBox li{
 float: left;
 margin: 0 52px 0 0;
 width: 300px;
}
#use .useBox li:last-child{
 margin: 0;
}
#use .useBox li a{
 width: 100%;
 display: block;
}
#use .useBox li div{
 padding: 0;
 width: 100%;
 height: auto;
 border-radius: 50%;
 overflow: hidden;
}
#use .useBox li div img{
 width: 100%;
 height: auto;
 transition: .3s;
}
#use .useBox li a:hover div img{
 transform: scale(1.1);
}
#use .useBox li p{
 margin: 0 auto;
 padding: 25px 0 18px;
 width: 150px;
 font-size: 22px;
 line-height: 100%;
 text-align: center;
 color: #039a42;
 border-bottom: 5px solid #039a42;
}

#news{
 padding: 63px 0 60px;
 width: 100%;
 background-image: url(../images/news.jpg);
 background-position: center center;
 background-size: cover;
 background-repeat: no-repeat;
}
#news .newsBox{
 margin: 60px auto 55px;
 padding: 30px 0 28px;
 width: 1004px;
 border-radius: 30px;
 background-color: #fff;
}
#news .newsBox dl{
 margin: 0 auto;
 width: 750px;
}
#news .newsBox dl a{
 padding: 10px 0;
 width: 100%;
 display: block;
}
#news .newsBox dt{
 float: left;
 width: 100px;
 color: #039a42;
}
#news .newsBox dd{
 margin: 0 0 0 138px;
 width: 610px;
 color: #000;
}
#news .newsBox dt,
#news .newsBox dd{
 font-size: 16px;
 line-height: 150%;
 text-align: left;
}
#news .newsBox p{
 margin: 0 auto;
 padding: 10px 0;
 width: 100%;
 font-size: 16px;
 line-height: 150%;
 text-align: center;
}

#facility{
 padding: 168px 0 170px;
 width: 100%;
}
#facility .faciBox{
 margin: 0 auto;
 padding: 104px 0 0;
 width: 1004px;
}
#facility .faciBox .faciL{
 float: left;
 width: 504px;
}
#facility .faciBox .faciL .info{
 width: 100%;
}
#facility .faciBox .faciL .info tr{
 border-bottom: 2px dotted #d8d8d8;
}
#facility .faciBox .faciL .info tr.non{
 border-bottom: none;
}
#facility .faciBox .faciL .info th,
#facility .faciBox .faciL .info td{
 padding: 13px 0 8px;
}
#facility .faciBox .faciL .info th{
 width: 95px;
 font-size: 19px;
 line-height: 100%;
 text-align: left;
 font-weight: bold;
 color: #039a42;
}
#facility .faciBox .faciL .info td{
 width: auto;
 font-size: 17px;
 line-height: 100%;
 text-align: left;
 color: #000;
}
#facility .faciBox .faciL .info th.sv{
 padding: 18px 0 12px;
}
#facility .faciBox .faciL .info th .info2{
 margin: 5px 0 0 5%;
 width: 95%;
}
#facility .faciBox .faciL .info  th .info2 th{
 width: 200px;
}
#facility .faciBox .faciL .info  th .info2 td{
 font-weight: normal;
}
#facility .faciBox .faciR{
 float: right;
 width: 480px;
}
#facility .faciBox .faciR iframe{
 width: 100%;
 height: 480px;
 border-radius: 30px;
}



@media screen and (max-width: 1020px){
#use .useBox{
 padding: 8.4vw 0 0;
 width: 98%;
}
#use .useBox li{
 margin: 0 5% 0 0;
 width: 30%;
}
#use .useBox li p{
 padding: 2.5vw 0 1.7vw;
 width: 50%;
 font-size: 2.2vw;
}

#news{
 padding: 6.3vw 0 5.8vw;
 width: 100%;
}
#news .newsBox{
 margin: 6vw auto 5vw;
 padding: 3vw 0 3vw;
 width: 98%;
}
#news .newsBox dl{
 width: 74.7%;
}
#news .newsBox dl a{
 padding: 1vw 0;
}
#news .newsBox dt{
 width: 9.9%;
}
#news .newsBox dd{
 margin: 0 0 0 18.4%;
 width: 86%;
}
#news .newsBox dt,
#news .newsBox dd{
 font-size: 1.55vw;
}
#news .newsBox p{
 padding: 1vw 0;
 font-size: 1.55vw;
}

#facility{
 padding: 16.5vw 0 16.5vw;
 width: 100%;
}
#facility .faciBox{
 padding: 10vw 0 0;
 width: 98%;
}
#facility .faciBox .faciL{
 width: 50.1%;
}
#facility .faciBox .faciL .info th,
#facility .faciBox .faciL .info td{
 padding: 1.3vw 0 8px;
}
#facility .faciBox .faciL .info th{
 width: 18.8%;
 font-size: 1.86;
}
#facility .faciBox .faciL .info td{
 font-size: 1.66vw;
}
#facility .faciBox .faciL .info th.sv{
 padding: 1.8vw 0 1.2vw;
}
#facility .faciBox .faciL .info th .info2{
 margin: 0.5vw 0 0 5%;
 width: 95%;
}
#facility .faciBox .faciL .info  th .info2 th{
 width: 42%;
}
#facility .faciBox .faciR{
 width: 47.8%;
}
#facility .faciBox .faciR iframe{
 height: 47.4vw;
}


}



@media screen and (max-width: 780px){
#main{
 width: 100%;
 height: auto;
 background-image: url(../common/images/headBg.jpg);
 background-position: center center;
 background-size: cover;
 background-repeat: no-repeat;
}
#main .mainIn{
 padding: 4vw 0 10vw;
 width: 100%;
}
#main .mainIn .mainT{
 float: none;
 margin: 5vw auto 0;
 width: 65%;
 height: auto;
}
#main .mainIn .img{
 float: none;
 margin: auto;
 width: 95%;
 height: auto;
}

#omo{
 padding: 12vw 0 20vw;
 width: 100%;
}
h2{
 font-size: 6vw;
 line-height: 100%;
 text-align: center;
 color: #0b9444;
 font-family: "dnp-shuei-mgothic-std", sans-serif;
 font-weight: 600;
}
#omo p{
 margin: 0;
 padding: 5vw 0 8vw;
 font-size: 3.4vw;
 line-height: 220%;
 text-align: center;
}
#omo .omoBox{
 margin: 0 auto;
 padding: 0 0 4vw;
 width: 95%;
}
#omo .omoBox li{
 float: left;
 margin: 0 0 2vw;
 width: 49%;
}
#omo .omoBox li:nth-child(2n){
 float: right;
}
#omo .omoBox li img{
 width: 100%;
 height: auto;
 border-radius: 15px;
}
#omo .mean{
 margin: 0 auto 6vw;
 width: 95%;
 position: relative;
}
#omo .mean img{
 width: 100%;
 height: auto;
 position: relative;
}
#omo .mean p{
 margin: 0;
 padding: 0;
 width: auto;
 font-size: 3vw;
 line-height: 160%;
 color: #0b9444;
 text-align: left;
 font-weight: bold;
 position: absolute;
 z-index: 2;
 top: 6.2vw;
 left: 40%;
 letter-spacing: 0.1vw;
}
.bt{
 margin: 0 auto;
 width: 70%;
}
.bt a{
 padding: 3vw 0;
 width: 100%;
 font-size: 4vw;
 line-height: 100%;
 text-align: center;
 color: #fff;
 font-family: "dnp-shuei-mgothic-std", sans-serif;
 font-weight: 600;
 display: block;
 background-color: #039a42;
 border: 2px solid #039a42;
 background-image: url(../common/images/arrow.png);
 background-position: right 4% center;
 background-size: 5vw auto;
 background-repeat: no-repeat;
}
.bt a:hover{
 color: #039a42;
 background-color: #f5f9e7;
 background-image: url(../common/images/arrow2.png);
 background-position: right 2% center;
 opacity:1;
}

#use{
 padding: 0 0 20vw;
 width: 100%;
}
#use .useBox{
 margin: 0 auto;
 padding: 8vw 0 0;
 width: 90%;
}
#use .useBox li{
 float: left;
 margin: 0 0 6vw;
 width: 47%;
}
#use .useBox li:nth-child(2){
 float: right;
}
#use .useBox li:last-child{
 float: none;
 margin: 0 auto;
}
#use .useBox li a{
 width: 100%;
 display: block;
}
#use .useBox li div{
 padding: 0;
 width: 43vw;
 height: 43vw;
 overflow: hidden;
 background-color: #FFC7C8;
}
#use .useBox li div img{
 width: 100%;
 height: auto;
 transition: .3s;
}
#use .useBox li a:hover div img{
 transform: scale(1.1);
}
#use .useBox li p{
 margin: 0 auto;
 padding: 3vw 0 2vw;
 width: 62%;
 font-size: 3.8vw;
 line-height: 100%;
 text-align: center;
 color: #039a42;
 border-bottom: 4px solid #039a42;
}

#news{
 padding: 10vw 0 12vw;
 width: 100%;
 background-image: url(../images/news.jpg);
 background-position: center center;
 background-size: cover;
 background-repeat: no-repeat;
}
#news .newsBox{
 margin: 4vw auto 6vw;
 padding: 5vw 0 4vw;
 width: 95%;
 border-radius: 30px;
 background-color: #fff;
}
#news .newsBox dl{
 margin: 0 auto;
 width: 90%;
}
#news .newsBox dl a{
 padding: 2vw 0;
 width: 100%;
 display: block;
}
#news .newsBox dt{
 float: left;
 width: 25%;
 color: #039a42;
}
#news .newsBox dd{
 margin: 0 0 0 25%;
 width: 75%;
 color: #000;
}
#news .newsBox dt,
#news .newsBox dd{
 font-size: 3.4vw;
 line-height: 150%;
 text-align: left;
}
#news .newsBox p{
 margin: 0 auto;
 padding: 2vw 0;
 width: 100%;
 font-size: 3.4vw;
 line-height: 150%;
 text-align: center;
}

#facility{
 padding: 18vw 0 12vw;
 width: 100%;
}
#facility .faciBox{
 margin: 0 auto;
 padding: 8vw 0 0;
 width: 90%;
}
#facility .faciBox .faciL{
 float: none;
 padding: 0 0 8vw;
 width: 100%;
}
#facility .faciBox .faciL .info{
 width: 100%;
}
#facility .faciBox .faciL .info tr{
 border-bottom: 2px dotted #d8d8d8;
}
#facility .faciBox .faciL .info tr.non{
 border-bottom: none;
}
#facility .faciBox .faciL .info th,
#facility .faciBox .faciL .info td{
 padding: 3vw 0 2vw;
}
#facility .faciBox .faciL .info th{
 width: 17%;
 font-size: 3.3vw;
 line-height: 100%;
 text-align: left;
 font-weight: bold;
 color: #039a42;
}
#facility .faciBox .faciL .info td{
 width: auto;
 font-size: 3.3vw;
 line-height: 100%;
 text-align: left;
 color: #000;
}
#facility .faciBox .faciL tr.sp th,
#facility .faciBox .faciL tr.sp td{
 line-height: 140%;
}
#facility .faciBox .faciL .info th.sv{
 padding: 3vw 0 2vw;
}
#facility .faciBox .faciL .info th .info2{
 margin: 1vw 0 0 5%;
 width: 95%;
}
#facility .faciBox .faciL .info  th .info2 th{
 width: 40%;
}
#facility .faciBox .faciL .info  th .info2 td{
 font-weight: normal;
}
#facility .faciBox .faciR{
 float: none;
 width: 100%;
}
#facility .faciBox .faciR iframe{
 width: 100%;
 height: 80vw;
 border-radius: 30px;
}


}