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

.swiper-container {
  max-width: 1400px;
  margin-right: auto;
  margin-left: auto;
  }
  .swiper-container img {
    width: 100%;
  }


.topBox01-01, .topBox01-02 {
  position: relative;
  }

.topBox01-img {
  width: 52%;
  position: absolute;
  }
  .topBox01-img img {
    width: 95%;
	float: left;
	margin-bottom: 15px;
	box-shadow: 15px 15px rgba(176,103,32,0.2);
    }

.topBox01-01 .topBox01-img  { left:  0;}
.topBox01-02  .topBox01-img { right: 0;}

.topBox01-txt {
  margin-top: 30px;
  width: 55.55%;
  background: url(../img/top/topBg01.png) repeat top left;
  z-index: 2;
  position: relative;
  padding: 5%;
  box-sizing: border-box;
  }
  .topBox01-txt p {
    color:   #000000;
    font-family: "ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝", "細明朝体", "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
    text-align: left;
    }

@media (max-width: 640px) {
.topBox01-img {
  width: 100%;
  position: relative;
  }
  .topBox01-img img {
  margin-bottom: 0px;
  box-shadow: none;
  width: 100%;
  }

.topBox01-txt {
  width: 100%;
  margin-top: 0;
  }

 .topBox01-txt p {

  }
}

  .topBox01-list {}
    .topBox01-list li {
      width: 30%;
      float: left;
      padding: 0 5% 0 0;
      }
    .topBox01-list li:last-child { padding: 0 0 0 0; }
    .topBox01-list li img { width: 100%; }

.topBox02 {
  background: url(../img/top/topBg02.jpg) repeat top left;
  }
  .topBox02-01 {
    background: url(../img/top/topBg03.jpg) no-repeat top right;
    padding: 50px 2.5% 20px 2.5%;
	width: 95%;
    }



  .topBox02-txt01 {
    color: #000000;
    font-family: "ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝", "細明朝体", "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
    text-align: left;
    font-size: 1.1em;
    line-height: 140%;
    }
  .topBox02-title01 {
    font-family: "ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝", "細明朝体", "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
    font-size: 2.6em;
    text-align: left;
    color: #000000;
    text-shadow: 2px 2px 2px rgba(255,255,255,1);
    padding-bottom: 50px;
    }


@media (max-width: 800px) {
  .topBox02-01 {
    background-size: 60%;
	padding: 20px 2.5% 20px 2.5%;
    }
  .topBox02-txt01 {
    width: 40%;
    padding-right: 60%;
	float: left;
    }
  .topBox02-title01 {
    font-size: 1.6em;
	width: 100%
    }
}



.topBox03-01 , .wakonBox03-01 {
  width: 46.29%;
  float: left;
  }

.topBox03-title01 {
  text-align: left;
  color: #000000;
  font-size: 1.6em;
  font-family: "ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝", "細明朝体", "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  }

.wakonBox03-title01 {
  text-align: left;
  color: #C08C4A;
  font-size: 1.6em;
  font-family: "ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝", "細明朝体", "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  }
  .topBox03-title01 span   { color: #825529; }
  .wakonBox03-title01 span { color: #C08C4A; }

.wakonBox03-title03 {
  text-align: left;
  color: #774C21;
  font-size: 1.6em;
  font-family: "ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝", "細明朝体", "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  }

.topBox03-title02, .wakonBox03-title02 {
  font-size: 1.4em;
  color: #825529;
  text-align: left;
  }
.wakonBox03-title02 {
  font-size: 1.4em;
  color: #C08C4A;
  text-align: left;
  }
  .wakonBox03-03 img {
    width: 48%;
  }

.topBox03 p {
  text-align: left;
  color: #000000;
  }
.wakonBox03 p {
  text-align: left;
  color: #FFFFFF;
  }

  .topBox03-02,
  .wakonBox03-02 {
    width: 50%;
	float: right;
	border-top: #774B22 8px solid;
    padding: 2.5%;
    box-sizing: border-box;
    }

  .topBox03-02 {
	background: rgba(0,0,0,0.1);
  }
  .wakonBox03-02 {
	background: rgba(255,255,255,0.8);
  }
  .wakonBox03-02 p {
    color: #000000;
  }


@media (max-width: 800px) {
.topBox03-01,
.wakonBox03-01 {
  width: 100%;
  }
.topBox03-02,
.wakonBox03-02 {
  width: 100%;
  }
}

.topBox04 {
  background: #000000 url(../img/top/topBg04.jpg) no-repeat top left;
  padding: 60px 0;
  }

.topBox05, .commonBox02 {
  background: url(../img/top/topBg06.jpg) no-repeat left top;
  background-size: contain;
  width: 100%;
  }
.topBox06, .commonBox03 {
  background: url(../img/top/topBg07.jpg) no-repeat left top;
  background-size: contain;
  width: 100%;
  }




  .topBox05-title , .topBox06-title , .commonBox02-title , .commonBox03-title {
    font-family: "ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝", "細明朝体", "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
	text-align: left;
    color: #000000;
	font-size: 1.4em;
    }
    .topBox05-title span  ,.topBox06-title span,
    .commonBox02-title span , .commonBox03-title span {
	   color: #825529;
	   }
  .topBox05-01 , .topBox06-01,
  .commonBox02-01 , .commonBox03-01 {
    width: 50%;
	background-size: 100%;
    padding: 3%;
    box-sizing: border-box;
    }
  .topBox05-01 , .topBox06-01       { background: #E6E6E6 url(../img/top/topBg05.jpg) no-repeat top right; }
  .commonBox02-01 , .commonBox03-01 { background: #FFFFFF; }
  .topBox05-01,
  .topBox06-01,
  .commonBox02-01,
  .commonBox03-01 {
    float: right;
    }

.topBox05 p , .topBox06 p ,
.commonBox02 p , .commonBox03 p {
  color: #000000;
  text-align: left;
  }

@media (max-width: 800px) {

.topBox04 {
  background-size: 60%;
  }

.topBox05, .topBox06,
.commonBox02 ,.commonBox03 {
  padding: 50% 0 0 0;
  }
  .topBox05-01 , .topBox06-01,
  .commonBox02-01 , .commonBox03-01 {
    width: 100%;
    }
}

.topBox07 {
  background: #000000 url(../img/top/topBg08.jpg) no-repeat center top;
  background-size: 100%;
  }
  .topBox07-01 {
  padding-top: 30%;
  padding-bottom: 10%;
  }

.topList01 {
  }
  .topList01 li {
    position: relative;
    float: left;
    width: 23%;
    margin-right: 2.6%;
    }
  .topList01 li:last-child {
    margin-right: 0;
    }
  .topList01 li a:hover img {
    opacity:0.7;
    filter:alpha(opacity=70);
    -ms-filter: "alpha( opacity=70 )";
   }
  .topList01 li a img.topList01-bg {
    width: 95%;
	margin-bottom: 5%;
    float: right;
  }
  .topList01 li a img.topList01-btn {
    position: absolute;
    width: 45%;
	left: 0px;
	bottom: 0px;
    opacity:0.9;
    filter:alpha(opacity=90);
    -ms-filter: "alpha( opacity=90 )";
  }

.topList02 {}
  .topList02 li {
    width: 32%;
    float: left;
    margin-right: 2%;
  }
  .topList02 li:last-child { margin-right: 0; }
  .topList02 li a img {
    width: 100%;
  }
  .topList02 li a:hover img {
    opacity:0.7;
    filter:alpha(opacity=70);
    -ms-filter: "alpha( opacity=70 )";
  }


.topTitle01 {
  color: #825529;
  font-family: "ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝", "細明朝体", "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";
  font-size: 1.4em;
  text-align: left;
  }
@media (max-width: 640px) {
.topTitle01 {
  text-align: center;
  }
  }


.caseList01 {}
  .caseList01 li {
    width: 31%;
    margin-right: 3.5%;
    margin-bottom: 3.5%;
    float: left;
    }
  .caseList01 li:nth-child(3n) {
    margin-right: 0;
    }
    .caseList01 li img { width: 100%; }
    .caseList01 li img:hover {
      opacity:0.7;
      filter:alpha(opacity=70);
      -ms-filter: "alpha( opacity=70 )";
      }

.planBox01 {}
  .planBox01 img {
    width: 36.66%;
    float: left;
    }
  .planBox01-01 {
    float: right;
	width: 58%;
    }
  .planBox01-Title01 {
    display: table;
    width: 100%;
    }
  .planBox01-Title01 span {
    display: table-cell;
    background: #A48364;
    padding: 5px 10px;
    vertical-align: middle;
    }
  .planBox01-Title01 em {
    display: table-cell;
	background: #82552A;
    text-align: left;
    padding: 5px 10px;
    }
  .planList01 li {
    width: 33.33%;
    text-align: left;
    float: left;
    font-size: 0.8em;
    }

@media (max-width: 640px) {

  .planBox01 img {
    width: 100%;
  }
  .planBox01-01 {
    width: 100%;
  }
}


.wakonBox01 {
  }
  .wakonBox01 img {
    width: 40%;
    float: left;
    }
  .wakonBox01-01 {
    float: right;
    width: 53%;
    }

.wakonBox02 {
  background: url(../img/wakon/wakonBg01.jpg) no-repeat top right;
  }
  .wakonBox02-01 {
    width: 60%;
    text-align: left;
    padding: 8% 0 10% 0;
  }
  .wakonBox02-01 p {
    background: #75512F;
	background-color: rgba(117,81,47,0.8);
    color: #FFFFFF;
    padding: 10px;
    font-size: 0.8em;
    text-align: left;
	display: inline-block;
    font-family: "ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝", "細明朝体", "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";

  }

@media (max-width: 800px) {
  .wakonBox02 {
    background-size: 60%;
    }
}

  .accessBox01 {}
    .accessBox01-01 {
      width: 45%;
      float: left;
      }
    .accessBox01-02 {
      width: 50%;
      float: right;
    }
    .accessBox01-02 img {
	  width: 100%;
    }

.accessTitle01 {
  background-color: rgba(117,81,47,0.8);
  color: #FFFFFF;
  text-align: left;
  padding: 3px 10px;
  }


.ggmap {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
  }

.ggmap iframe,
.ggmap object,
.ggmap embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  }



.fukuBox01 {
  position: relative;
  width: 100%;
  }

.fukuBox01-01 {
  width: 75%;
  }
  .fukuBox01-01 img {
    width: 100%;
  }

.fukuBox01-r02, .fukuBox01-l02 {
  z-index: 2;
  width: 44%;
  position: absolute;
  background: #FFFFFF;
  bottom: 0;
  padding: 3%;
  box-sizing: border-box;
  }
.fukuBox01-r02 { right: 0; }
.fukuBox01-l02 { left:  0; }

@media (max-width: 800px) {
    .fukuBox01-01 {
        width: 100%;
    }
    .fukuBox01-r02, .fukuBox01-l02 {
    width: 100%;
    position: static;
    bottom: auto;
        right: auto;
        font-kerning: auto;
    }
}

.fukuTitle01 {
  color: #000000;
  font-size: 1.2em;
  text-align: left;
  }
  .fukuBox01-r02 p , .fukuBox01-l02 p {
    color: #000000;
	text-align: left;
    font-size: 0.8em;
  }


.serviceList01 li {
  width: 31%;
  position: relative;
  margin: 0 3.5%  3.5% 0;
  overflow: hidden;
  float: left;
  }
  .serviceList01 li:nth-child(3n) {
    margin-right: 0;
  }

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

  .serviceList01 li img {
    width: 95%;
	float: right;
    padding-bottom: 5%;
    }
  .serviceList01 li p {
    width: 95%;
    position: absolute;
    bottom: 0;
    left: 0;
	background: rgba(130,85,41,0.9);
    }

.serviceBox01 {
  width: 100%;
  }
  .serviceBox01-01 {
    width: 25%;
    float: left;
  }
  .serviceBox01-01 img {
    width: 100%;
  }

  .serviceBox01-02 {
    width: 70%;
    float: right;
  }

.serviceTable01 {}
  .serviceTable01 th {
    width: 100px;
    padding: 0 0 10px 0;
  }
  .serviceTable01 td {
    text-align: left;
    padding: 0 0 10px 0;
  }

.costBox01 img {
  width: 100%;
  }


.contactBox01 {
  border: #9D7F4C 5px solid;
  background: #FFFFFF;
  }

#forms {
  max-width: 1200px;
  margin: 10% auto 10%;
  padding: 0 10%;
  box-sizing: border-box;

  }

#forms dl {
  overflow: hidden;

  }
  #forms dl dt {
    width: 29.16%;
    float: left;
    padding: 3% 0;
    box-sizing: border-box;
	vertical-align: top;
    }
  #forms dl dt p {
    padding: 10px 0;
	text-align: left;
	color: #000000;
  }
  #forms dl dt span {
    background: #B81B1B;
    color: #FFFFFF;
    text-align: center;
    padding: 0px 5px;
    float: right;
    font-size: 12px;
  }

  #forms dl dd {
    width: 70%;
	float: right;
    box-sizing: border-box;
	padding: 3%;
	text-align: left;
    color: #000000;
  }
  #forms dl dd input {
    padding: 10px;
    width: 100%;
    box-sizing: border-box;
    font-size: 16px;
    border: 1px solid #C9C8D0;
    background: #F1F1F2;
  }
  #forms dl dd select {
    padding: 10px;
    margin-bottom: 10px;
    border: 1px solid #C9C8D0;
    background: #F1F1F2;
    font-size: 16px;
    }
  #forms dl dd textarea {
    width: 100%;
    height: 230px;
    border: 1px solid #C9C8D0;
    background: #F1F1F2;
    font-size: 16px;
    box-sizing: border-box;

  }

.sendBtn {
  background: #5F0A0D url(../img/contact/contactIcon01.gif) no-repeat 95% 50%;
  padding: 15px 0;
  max-width: 300px;
  display: block;
  margin: 30px auto;
  color: #FFFFFF;
  text-align: center;
  }

@media screen and (max-width: 640px) {


  #forms dl dt {
    width: 100%;
    padding: 1% 3% 0;
    box-sizing: border-box;
    }
  #forms dl dt span {
    float: none;
	margin: 0 0 0 10px;
  }
  #forms dl dd {
    width: 100%;
	padding: 0 3% 3%;
    box-sizing: border-box;
  }
  #forms dl dd input {
    padding: 10px;
    width: 100%;
    box-sizing: border-box;

  }

}



#forms dl dd.radioBox label {
  cursor: pointer;
  padding: 10px;
  display: inline-block;
}

#forms dl dd.radioBox input {
  width: auto;
  text-align: 100%;
  margin: 0 5px 0 10px;
  padding: 0;

}


.contactBox02 {
  max-width: 900px;
  margin: 0 auto 10%;
  padding: 2.5%;
  box-sizing: border-box;
  border: 1px solid #E7E7E7;
  height: 300px;
  overflow: scroll;
  overflow-x: hidden;
  text-align: left;
  background: #FFFFFF;
  color: #010000;
  font-size: 0.8em;
  line-height: 160%;
  }


.caseTbl01 {
    width: 100%;
    margin: 0 auto 10%;
  }
.caseTbl01 th {
  text-align: center;
  padding: 2% 5%;
  width: 20%;
  vertical-align: middle;
    border-bottom: 1px solid #402C24;
    font-weight: bold;
font-family: "ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝", "細明朝体", "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";

}
.caseTbl01 td {
    vertical-align: middle;
    padding: 2% 5%;
    text-align: left;
    border-bottom: 1px solid #402C24;


}


.caseTtl01 {
  font-size: 1.6em;
  font-family: "ヒラギノ明朝 Pro W3","ＭＳ Ｐ明朝", "細明朝体", "ＭＳ Ｐゴシック", Osaka, "ヒラギノ角ゴ Pro W3";

}
