﻿@charset "utf-8";
body{
margin:0;
padding:0;
font-family: "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", "Meiryo", "sans-serif";
font-weight:500;
}

.clearfix:after {
    content: "";
    display: block;
    clear: both;
}

#header{
border-bottom: 10px #8FC31F solid;
}

#header-content{
width: 80%;
margin: 0 auto;
}
#header-content h1{
margin: 0 auto;
}

.header-left{
float:left;
width: 30%;

}
.header-left img{
width:100%;
max-width: 100%;
height:auto;
}
.header-right{
float:right;
text-align:right;
width: 40%;
}

.sub{
font-size:1vw!important;
margin:0;
padding:0;
}

.header-right h2{
font-size:1.2vw;
color:#006934;
margin:0 1vw;
padding:0;
}
.header-right h2 span{
font-size:1.5vw;
margin-left:0.3vw;
}

.header-right h2 img{
width:100%;
max-width: 100%;
height:auto;
}

.tel{
font-size:1.8vw;
margin:0 1vw;
padding:0;
font-weight:bold;
line-height: 1.5vw;
}

#mainimg{
background-color:#009CDB;
}


#compimg{

}

.catch{
width: 100%;
background-color: rgba(0,162,154,.29);
position: relative;
z-index: 3;
background-image: url(img/3346541_m.jpg);
height: 32vw;
background-size: cover;
background-attachment: fixed;
border-bottom:  20px #00A0E9 solid;
}

.catch-in{
	margin:0 auto;
	width:60%;
	background-color: rgba(255,255,255,.29);
	height:50%;
	position: absolute;
top: 20%;
left: 20%;
}


.ccatch-in p{
font-size:3vw;
text-align:center;
vertical-align:middle;
padding-top: 5%;
margin:0;	
color:white;
font-weight:500;


}

.ccatch{
width: 100%;
position: relative;
z-index: 3;
background-image: url(img/1027189_m.jpg);
height: 32vw;
background-size: cover;
background-attachment: fixed;
}

.ccatch-in{
	margin:0 auto;
	width:60%;
	background-color: rgba(0,0,0,.29);
	height:50%;
	position: absolute;
top: 20%;
left: 20%;
}


.catch-in p{
font-size:3vw;
text-align:center;
vertical-align:middle;
padding-top: 5%;
margin:0;	
font-family: "HG明朝E";
font-weight:500;


}

#compimg ul{
margin: 0 auto;
width: 45vw;
}

#compimg li{
display: inline-block;
font-size: 1.5vw;
margin: 1vw 1vw;
width: 20vw;

}


#topmiddle{
margin: 1vw auto;
}

.tit{
	margin:0 auto;
	width:60%;
	background-color: rgba(255,255,255,.29);
	height:50%;
	
}
.tit p{
	font-size:2vw;
text-align:center;
vertical-align:middle;
padding-top: 5%;
margin:0;	

	
}

.tit span{
	font-size:3vw;
	font-family: "HG明朝E";
font-weight:500;
}


#topmiddle ul{
width: 65%;
    margin: 1vw auto;
position: relative;
}

#topmiddle li{
display: inline-block;
    position: relative;
    width: 32%;
    vertical-align: bottom;

}
#topmiddle li img{
width:100%;
height:auto;
max-width:100%;
vertical-align: top;
}

.imgbox1 {

    position: absolute;
    top: 0vw;
    background: linear-gradient(90deg, #6FBA2C, #5E753D);
    width: 100%;

}

.imgbox1 p{
color: white;
    font-size: 1.2vw;
    margin: 0.5vw;
    text-align: center;

}

.imgbox2 {

    position: absolute;
    top: 0vw;
    background: linear-gradient(90deg, #001D35, #1D2088);
    width: 100%;

}

.imgbox2 p{
color: white;
    font-size: 1.2vw;
    margin: 0.5vw;
    text-align: center;

}

.imgbox3 {

    position: absolute;
    top: 0vw;
    background: linear-gradient(90deg, #006934, #8DB3A3);
    width: 100%;

}

.imgbox3 p{
color: white;
    margin: 1vw;
    text-align: center;
font-size: 1vw;
}

.bun{
display: inline-block;
    position: relative;
    width: 32%;
    vertical-align: top!important;

}

.bun p{
margin: 2vw;
font-size: 1.5vw;
}



#navtop{
clear:both;
background-image:URL(img/nav-bacl.jpg);
margin: 0;
}

#navtop ul{
width:60vw;
margin:0 auto;
padding: 0 0 0 2vw;
}

#navtop li{
display:inline-block;
width: 11vw;
}
#navtop li img{
width:100%;
height:auto;
max-width:100%;
}

#nav{
clear:both;
background-image:URL(img/nav-bacl.jpg);
margin-top: 0.5vw;
}

#nav ul{
width:60vw;
margin:0 auto;
padding: 0 0 0 2vw;
}

#nav li{
display:inline-block;
width: 11vw;
}
#nav li img{
width:100%;
height:auto;
max-width:100%;
}

#infoimg{
background-image: URL(img/42496587.jpg);
    background-attachment: fixed;
    height: 15vw;
    background-size: cover;
background-position: top;
}
#comimg{
background-image: URL(img/32484066.jpg);
    background-attachment: fixed;
    height: 15vw;
    background-size: cover;
background-position: top;
}
#serimg{
background-image: URL(img/32485922.jpg);
    background-attachment: fixed;
    height: 15vw;
    background-size: cover;
background-position: bottom;
}

.imgtitle{
margin: 0 auto;
    padding: 0;
    position: relative;
width:65%;
}
.imgtitlec{
margin: 0 auto;
    padding: 0;
    position: relative;
width:65%;
}

.imgtitle h3{
    position: absolute;
    top: 4vw;
    width: 15vw;
}
.imgtitlec h3 {
    position: absolute;
    top: 4vw;
    width: 20vw;
}
.imgtitle img{
width:100%;
height:auto;
max-width:100%;
}
.imgtitlec img{
width:100%;
height:auto;
max-width:100%;
}

#pan{
width:65%;
margin: 0 auto;
}

.content-inner{
width:65%;
margin: 0 auto;
}

#maintitle{
height:4.5vw;
background: linear-gradient(90deg, #6FBA2C, #5E753D);
width:30%;
}

#maintitle p{
float: left;
    font-size: 1.5vw;
    margin: 1vw 0vw 0vw 18vw;
    color: white;

}

#infomationtitle{
height:4.5vw;
background: linear-gradient(90deg, #001D35, #1D2088);
width:70%;
margin-top:20px;
}
.info-inner{
width:50%;
margin-top:20px;
}
#infomationtitle span{
font-size: 1vw;
margin-right:1vw;
}

#infomationtitle p{
float: left;
    font-size: 1.5vw;
    margin: 1vw 0vw 0vw 18vw;
    color: white;

}


#middletitle{
height:4.5vw;
background: linear-gradient(90deg, #001D35, #1D2088);
width:50%;
margin-top:20px;
}

#middletitle p{
float: left;
    font-size: 1.5vw;
    margin: 1vw 0vw 0vw 18vw;
    color: white;

}

#undertitle{
height:4.5vw;
background: linear-gradient(90deg, #006934, #8DB3A3);
width:70%;
margin-top:20px;
}

#undertitle p{
float: left;
    font-size: 1.5vw;
    margin: 1vw 0vw 0vw 18vw;
    color: white;

}

.info-inner {
    width: 50%;
margin: 3vw 0% 3vw 20%;
    font-size: 1vw;
}

#com-inner {
    width: 65%;
margin: 2vw auto;
    font-size: 1.1vw;
position: relative;
}
#com2-inner {
    width: 55%;
margin: 2vw auto;
    font-size: 1.1vw;
}
#com-inner img{
width:100%;
height:auto;
max-width:100%;
}
#con-inner {
    width: 60vw;
margin: 2vw auto;
    font-size: 1.1vw;
position: relative;
}

.left{
padding-right: 10vw;
}
.com-left{
float:left;
width: 65%;
}
.com-left span{
float:right;
font-size:1.8vw;
}
.com-right{
float:right;
width: 30%;
font-size: 0.9vw;
}
.com-right img{
width:100%;
height:auto;
max-width:100%;
}

.ser1-left{
width:35%;
float:left;
}

.ser1-right{
width:60%;
float:right;
}

.ser2-left{
width:60%;
float:left;
}

.ser2-right{
width:35%;
float:right;
}

.top1-left{
width:50%;
float:left;
margin-top: 2vw;
position: relative;
}

.top1-right{
width:45%;
float:right;
}
.top1-right p{
font-size:0.8vw;
margin:0;
padding:0;
}

.top2-left{
width:60%;
float:left;
overflow: auto;
height: 17vw;
}
.top2-left a{
color:black;
}

.top2-left p{
font-size:0.9vw;
}
.top2-left span{
font-size:1.1vw;
margin-left:5vw;
}

.top2-right{
width:35%;
float:right;
}




#contact{
	
	
}

#contact-img{
width: 100%;
position: relative;
z-index: 3;
background-image: url(img/1102232_m.jpg);
height: 32vw;
border-top:  3vw #007BC7 solid;
margin:0;
padding:0;
background-size: cover;
}

#cont ul{
margin: 0 auto;
width: 25vw;
font-size: 1.5vw;
font-weight:600;
}

#middle-f {
    clear: both;
    position: relative;
    margin-bottom: 5vw;
}

.form {
    position: relative;
    width: 100%;
    height: 0;
    padding-top: 55%;
}


.form iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


#footer{
border-top: 10px #006934 solid;
}

#footer-content{
width: 70%;
margin: 1vw auto;
}
#footer-content h1{
margin: 0 auto;
}

.footer-left{
float:left;
}
.footer-left img{
width:100%;
max-width: 100%;
height:auto;
}
.footer-right{
float:right;
text-align:left;
}

.subf{
font-size:1vw!important;
color:#595757;
margin:0;
padding:0;
}

.footer-right h2{
font-size:1.2vw;
color:#595757;
margin:0;
padding:0;
}
.footer-right h2 span{
font-size:1.5vw;
margin-left:0.3vw;
}

.telf{
font-size:1vw;
color:#595757;
margin:0;
padding:0;
line-height: 1vw;
}
.footer-right ul{
padding: 0;
margin: 1vw auto;
}
.footer-right li{
display:inline-block;
margin-right:1vw;
}

.footer-right li a{
color:green;
text-decoration:none;
font-size: 1.2vw;
}

.access-inner{
width:65%;
margin:0 auto;
font-size:1.1vw;
}

.border{
height: 0.5vw;
    width: 65%;
    background-color: #006934;
    margin: 0 auto;

}
.border-dot{
height: 0.1vw;
    border-bottom: dotted;
    margin: 0 auto;

}

.syousai1{
    position: absolute;
    left: 15vw;
    top: 25vw;
    width: 6vw;
    z-index: 3;
}
.syousai2{
position: absolute;
    left: 37vw;
    top: 25vw;
    width: 6vw;
    z-index: 3;

}
.syousai3{
position: absolute;
right: 3vw;
    top: 25vw;
    width: 6vw;
    z-index: 3;

}
.syousai4{
position: absolute;
right: 0vw;
top: 15vw;
width:6vw;
z-index: 3;
}

.syousai1 img{
width:100%;
height:auto;
max-width:100%;
}
.syousai2 img{
width:100%;
height:auto;
max-width:100%;
}
.syousai3 img{
width:100%;
height:auto;
max-width:100%;
}
.syousai4 img{
width:100%;
height:auto;
max-width:100%;
}
.syousai5{
position: absolute;
left: 41.7vw;
top: 21.5vw;
width: 6vw;
z-index: 3;
}
.syousai5 img{
width:100%;
height:auto;
max-width:100%;
}

#containermail{
width:60vw!important
}

#contentsmail{
width:60vw!important
}
table.mailform tr td{
}


.copy{
    position: absolute;
    right: 25vw;
    top: 40%;
    z-index: 5;
    font-size: 3vw;
    font-weight: 600;
    color: white;
    text-shadow: 5px 5px 1px #444444;
}
.th-inner {
    width: 50%;
margin: 3vw 0% 3vw 20%;
    font-size: 1vw;
}
.th-inner p{
    font-size: 1.5vw;
}