@charset "UTF-8";
/*==================================================
 COMMON CSS
==================================================*/




.drawer-open .drawer-navbar-header {
  position: fixed;
  }

.drawer-open header {
  position: static;
  }


.headInnerBox {
  margin: 0 auto;
  max-width: 1200px;
  }
  .headBox01L {
    float: left;
	position: absolute;
	z-index: 200;
    x_width: 14.28%;
  }
  .drawer-open .headBox01L { display: none; }

  .headBox01R {
   float: right;
   x_width: 91%;
  }

.hLogo {
  width: 150px;
  }
  .hLogo img {
    width: 100%;
  }

.hLogo a:hover img {
  opacity:0.7;
  filter:alpha(opacity=70);
  -ms-filter: "alpha( opacity=70 )";
  }

.sp_head {
  display: none;
  }

@media (max-width: 64em) {

  .headBox01L {
	margin: 0 0 0 10px;
  }

  .headBox01L .hLogo {
    width: 150px;
  }
  .headBox01L .hLogo img {
    width: 100%;
  }



}


@media (max-width: 640px) {
  .sp_head {
    display: block;
	float: right;
	position: relative;
	right: 50px;
  }

}


.hNavi {
  float: right;
  width: 100%;
  }
  .hNavi li {
     float: right;
	 x_width: 14.28%;
	 font-size: 0.8em;
     font-family: "ＭＳ Ｐ明朝", "細明朝体", "ヒラギノ明朝 Pro W3","ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
     }
  .hNavi li a {
    color: #FFFFFF;
    padding: 5px 10px;
	display: block;
    }
  .hNavi li a:hover {
    opacity:0.7;
    filter:alpha(opacity=70);
    -ms-filter: "alpha( opacity=70 )";
    }

.hNavi li a img {
  width: 25px;
  }
@media (max-width: 800px) {
  .hNavi li {
    font-size:1em;
  }
}

@media (max-width: 639px) {
  .hNavi li {
    width: 100%;
	display: block;
	float: left;
  }
  .hNavi li a {
    width: 100%;
    padding: 20px 0;
  }

}


.commonMImg01-service {
  background:url(../img/service/serviceMimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-service:before {
	padding-top: 16%;
    }
.commonMImg01-plan {
  background:url(../img/plan/planMimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-plan:before {
	padding-top: 16%;
    }

.commonMImg01-wakon {
  background:url(../img/wakon/wakonMimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-wakon:before {
	padding-top: 16%;
    }

.commonMImg01-kaiseki {
  background:url(../img/kaiseki/kaisekiMimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-kaiseki:before {
	padding-top: 16%;
    }

.commonMImg01-voice {
  background:url(../img/voice/voiceMimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-voice:before {
	padding-top: 16%;
    }

.commonMImg01-waso {
  background:url(../img/service/waso/wasoMimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-waso:before {
	padding-top: 16%;
    }


.commonMImg01-flower {
  background:url(../img/service/flower/flowerMimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-flower:before {
	padding-top: 16%;
    }

.commonMImg01-access {
  background:url(../img/access/accessMimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-access:before {
	padding-top: 16%;
    }

.commonMImg01-contact {
  background:url(../img/contact/contactMimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-contact:before {
	padding-top: 16%;
    }

.commonMImg01-photo {
  background:url(../img/service/photo/photoMimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-photo:before {
	padding-top: 16%;
    }

.commonMImg01-make {
  background:url(../img/service/make/makeMimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-make:before {
	padding-top: 16%;
    }

.commonMImg01-case01 {
  background:url(../img/case/case01/case01Mimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-case01:before {
	padding-top: 16%;
    }

.commonMImg01-case02 {
  background:url(../img/case/case02/case02Mimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-case02:before {
	padding-top: 16%;
    }

.commonMImg01-case03 {
  background:url(../img/case/case03/case03Mimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-case03:before {
	padding-top: 16%;
    }

.commonMImg01-case04 {
  background:url(../img/case/case04/case04Mimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-case04:before {
	padding-top: 16%;
    }

.commonMImg01-case05 {
  background:url(../img/case/case05/case05Mimg01.jpg) no-repeat bottom center;
  background-size: cover;
  position: relative;
  }
  .commonMImg01-case05:before {
	padding-top: 16%;
    }


.contMTitle01 {
  position: absolute;
   top:-5px;
   right:0px;
   bottom:0px;
   left:0px;
   margin:auto auto;
   width: 66px;
   z-index: 200;
  }
  .contMTitle01 img {
    width: 100%;
  }

@media (max-width: 64em) {
.contMTitle01 {
  width: 40px;
  }
}


.commonTitle01 {
  font-family: "ＭＳ Ｐ明朝", "細明朝体", "ヒラギノ明朝 Pro W3","ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  text-align: center;
  }

.commonTitle02 {
  color: #FFFFFF;
  text-align: left;
  font-size: 20px;
  }
@media (max-width: 40em) {
  .commonTitle02 {
    text-align: center;
	font-size: 16px;
  }
}

.commonTitle03 {
  font-family: "ＭＳ Ｐ明朝", "細明朝体", "ヒラギノ明朝 Pro W3","ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  text-align: left;
  }



.drawer-open .contMTitle01 {
  display: none;
  }

.contBox00 {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  padding-top: 100px;
  }

.contBox01 {
  max-width: 1200px;
  padding-top: 100px;
  padding-bottom: 150px;
  margin-right: auto;
  margin-left: auto;
  }
.contBox02 {
  margin-left: 5%;
  margin-right: 5%;
  }
  .contBox03 { margin-right: 5%; margin-left: 5%; }
.contBox04 {
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  }

@media (max-width: 64em) {
.contBox00 {
  padding-top: 10%;
  }

.contBox01 {
  padding-top: 10%;
  padding-bottom: 15%;
  }
.contBox03 {
  margin-right: 0; margin-left: 0;
 }

}

.footNaviBox01 {
  background: #000000;
  background-size: cover;
  padding-top: 120px;
  }
  .footNaviBox01-01 {
    max-width: 1200px;
	margin: 0 auto;
  }

@media (max-width: 64em) {
.footNaviBox01 {
  padding-top: 12%;
  }

}

  .footAdress {
    float: none;
	text-align: center;
	padding: 0 5%;
    }
  .footAdress img {
    margin: 0 0 5px 0;
  }


@media (max-width: 64em) {
  .footAdress img {
    width: 80px;
  }
}


address {
  color: #FFFFFF;
  padding-bottom: 60px;
  }

@media (max-width: 64em) {
address {
  padding-bottom: 30px;
  }
}


.footTelBox01 {
  padding: 40px 0;
  }
  .footTelBox01-01 {
    max-width: 360px;
	margin: 0 auto;
  }
  .footTelBox01-01 img {
    width: 60%;
    }


.footTelBox01-01 img.footBtn01 {
  width: 100%;
  }



.footNavi {
  text-align: center;
  clear: both;
  padding-bottom: 70px;
  }
  .footNavi li {
	width: 100%;
  }
  .footNavi li a {
    color: #FFFFFF;
    font-size: 14px;
    padding: 20px 20px;
	display: block;
    }

.copy {
  color: #FFFFFF;
  font-size: 12px;
  }


.btn01 {
  background: #685633 url(../img/common/icon01.gif) no-repeat 95% 50%;
  font-family: "ＭＳ Ｐ明朝", "細明朝体", "ヒラギノ明朝 Pro W3";
  width: 250px;
  display: block;
  text-align: center;
  margin: 0 auto;
  color: #FFFFFF;
  padding: 10px 0;
  }
  .btn01:hover {
    background: #433721 url(../img/common/icon01.gif) no-repeat 95% 50%;
  }

.msB15 { margin-bottom: 150px; }
.msB10 { margin-bottom: 100px; }
.msB5  { margin-bottom:  50px; }
.msB3  { margin-bottom:  30px; }
.msB2  { margin-bottom:  20px; }
@media screen and (max-width:800px){
.msB15 { margin-bottom: 15%; }
.msB10 { margin-bottom: 10%; }
.msB5 { margin-bottom:   5%; }
.msB3  { margin-bottom:  3%; }
.msB2  { margin-bottom:  2%; }

}


.commonMTitle01 {
  font-size: 2.0em;
  font-family: "ＭＳ Ｐ明朝", "細明朝体", "ヒラギノ明朝 Pro W3","ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  text-shadow: 1px 1px 3px #000;

  }
  .commonMTitle01 span {
    margin: 5% 0 0 0;
	display: block;
  }
@media screen and (max-width:640px){
  .commonMTitle01 span {
    margin: 3% 0 0 0;
  }
}


.youtubeBoxWrap {
  max-width: 560px;
  margin: 0 auto 10%;
  }

.youtubeBox {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtubeBox iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}


.caseMainImg01 {
  max-width: 560px;
  margin: 0 auto 10%;
  }
  .caseMainImg01 img {
    width: 100%;
  }

@media screen and (max-width:640px){
  .caseMainImg01 img {
    width: 80%;
  }

}





    .onlineBox {
      text-align: center;
      overflow: hidden;
      margin-bottom: 5%;
      margin-top: 5%;
      }
      .onlineBox img {
        width: 90%;
        max-width: 800px;
      }
      .onlineBox a:hover img {
        opacity: 0.7;
      }
