@charset "utf-8";/* CSS Document */


body {
margin: 0;
width:100%;
line-height:1.2;
letter-spacing: 1px;
font-size: 18px;
font-family: 'Noto Sans JP', sans-serif;
color: #111;
}

a{
outline:none !important;
letter-spacing: 1px;
}

a:hover{
outline:none !important;
text-decoration: none;
opacity: 0.8;
}

ul{
list-style:none;
padding:0;
margin: 0;
letter-spacing: -.4em; /* 文字間を詰めて隙間をなくす */

}

ul li{
letter-spacing: normal; /* 文字間を詰めて隙間をなくす */
}

div,
ul,
li,
p{
box-sizing: border-box;
}

div,
p,
li a{
letter-spacing: 1px;
line-height: 1.4;
}

p{
margin: 0;
}

.warp{
width: 1000px;
margin: 0 auto;
overflow: hidden;
}

.pc_none{
display:none;
}



/* header */
header{
width:100%;
padding:0;
z-index:9999;
background:　none;
position: relative;
height: 170px;
}

header .warp{
height: 100px;
}

header h1{
width: 250px;
float: left;
margin: 15px auto 0;
}

header h1 span{
display: block;
font-size: 14px;
letter-spacing:2.6px;
margin-bottom: 10px;
color: #003F3F;
}

header .box01 .right{
float: right;
width: 516px;
}

header .box01 .right ul.tel{
float: left;
width: 325px;
margin-right: 20px;
}

header .box01 .right ul.tel li:first-child{
padding: 12px 0 8px 54px;
font-size: 16px;
letter-spacing: 3px;
font-weight: 600;
}

header .box01 .right ul.btn{
float: left;
width: 170px;
margin-top: 8px;
}

nav{
background: url(../img/navbg.png) repeat-x;
width: 100%;
text-align: center;
height: 70px;
}

#menu {
max-width: 1000px;
margin: 0 auto;
padding: 0;
}
#menu li{
display: block;
float: left;
width: 20%;
margin: 0;
padding: 0;
background: url(../img/bavbg02.png) no-repeat;
}
#menu li a {
display: block;
color: #003F3F;
text-align: center;
text-decoration: none;
line-height: 70px;
font-weight: 600;
font-size: 16px;
}
#menu li:last-child a{
border: none;
}
#menu li a:hover{

}
#toggle {
display: none;
}



/* 画面サイズが768px以下の場合に適用 */
@media only screen and (max-width: 980px) {
#menu li {
width: 20%;
}
}

/* 画面サイズが480px以下の場合に適用 */
@media only screen and (max-width: 480px) {
#menu {
display: none;
}
#menu li {
width: 100%;
}
#toggle {
display: block;
position: relative;
width: 100%;
}
#toggle a{
display: block;
position: relative;
color:#FFF;
text-align: center;
text-decoration: none;
}
#toggle:before {
display: block;
content: "";
position: absolute;
top: 50%;
left: 10px;
width: 30px;
height: 30px;
margin-top: -15px;
background: #FFF;
}
#toggle a:before, #toggle a:after {
display: block;
content: "";
position: absolute;
top: 50%;
left: 10px;
width: 30px;
height: 6px;
background: #00979D;
}
#toggle a:before {
margin-top:-9px;
}
#toggle a:after {
margin-top: 3px;
}
}
.fixed {
position: fixed;
top: 0;
left: 0;
width: 100%;
background: rgba(255,255,255,0.9);
}


footer{
background: #00979D;
}

footer .box01{
padding: 40px 0;

}

footer .left{
width: 370px;
float: left;
color: #fff;
}

footer .left p.text01{
font-size: 11px;
margin-bottom: 4px;
margin-top: 15px;
}

footer .left p.text02{
font-size: 16px;
}

footer .right{
width: 550px;
float: right;
}

footer .right img.come{
margin-bottom: 20px;
}

footer .right .tel{
width: 320px;
float: left;
}

footer .right .btn{
width: 184px;
float: right;
}

footer .right .btn li:first-child{
margin-bottom: 4px;
}

footer p.copy{
font-size:12px;
line-height:46px;
font-weight: 400;
text-align: center;
background: #fff;
color: #00979D;
}

a.btn{
width: 300px;
line-height: 58px;
margin: 0 auto;
border: 2px solid #9389CE;
border-radius: 4px;		/* CSS3草案 */
-webkit-border-radius: 4px;	/* Safari,Google Chrome用 */
-moz-border-radius: 4px;	/* Firefox用 */
color:#fff;
font-size: 16px;
font-weight: 400;
background: url(../img/common/btn_bg01.png) no-repeat 260px 23px #9389CE;
text-align: center;
}
a.btn:hover{
background: url(../img/common/btn_bg01.png) no-repeat 260px 23px #9389CE;
transition: height 0.3s ease 0s, opacity 0.3s ease 0s, transform 0.3s ease 0s;
transform: translateY(1px);
}

/* top----------------------------------- */


.fv{
background: url(../img/top.png) no-repeat center top,url(../img/top02.png) no-repeat center top;
height: 900px;
width: 100%;
}

.cont01{
height: 457px;
width: 100%;
text-align: center;
}

.cont01 p{
text-align: center;
padding-top: 120px;
font-weight: 500;
}

h2{
font-size: 22px;
border-bottom: 3px solid #00979D;
color: #00979D;
text-align: center;
line-height: 50px;
padding: 40px 0 0px;
width: 100px;
margin: 0 auto 40px;
letter-spacing: 2px;
}

.cont02{
background: url(../img/cont02bg.png) no-repeat;
background-size: cover;
padding-bottom: 70px;
}

.cont02 ul{
width: 1000px;
margin: 0 auto;
}

.cont02 ul li{
display: inline-block;
width: 310px;
vertical-align: top;
}

.cont02 ul li:nth-child(2){
margin: 0 35px;
}

.cont02 ul li h3{
text-align: center;
margin: 10px auto 10px;
color: #00979D;
letter-spacing: 3px;
}

.cont02 ul li p{
font-size: 15px;
padding: 0 6px;
}

.cont03{
background: url(../img/cont03bg.png) no-repeat;
background-size: cover;
padding-bottom: 70px;
}

.cont04{
padding: 60px 0;
}

.cont04 .warp{
clear: both;
}

.cont04 .left{
width: 520px;
float: left;
padding-left: 10px;
}

.cont04 .right{
width: 410px;
float: right;
}

.cont04 .top{
border-left: 4px solid #00979D;
padding: 20px 20px;
margin-bottom: 10px;
}

.cont04 h4{
font-size: 28px;
}

.cont04 h4 span{
display: block;
font-size: 16px;
margin-top: 6px;
}

.cont04 h5{
color: #00979D;
margin-bottom: 10px;
padding-left: 20px;
}

.cont04 .btm{
background: #EEEEEE;
border: 1px solid #ccc;
padding:15px 20px;
font-size: 15px;
line-height: 1.6;
}

.fadein{
transition: .7s ease-in-out ;
}




