/*---------------------------------
css standard
--------------------------------*/

img {
  max-width: 100%;
  vertical-align: bottom;
}

table {
  width: 100%;
}

/*---------------------------------
css layout
--------------------------------*/
body{
  margin:0 auto;
}
* html body{
  overflow: hidden;
}

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

@media (min-width: 751px) {
  .visible-xs {
    display:none !important;
  }
}
@media screen and (max-width: 750px) {
  .hidden-xs {
    display: none !important;
  }
  .visible-xs {
    display:inherit !important;
  }
  .contents div {
    width: 100%;
    margin: 0 0 12px;
    float:none;
  }
}

/*---------------------------------
btn
--------------------------------*/

.btn form input { vertical-align: bottom;}
.btnArea { margin-bottom: 2rem; }
.btnArea .left { float: left; width: 50%; text-align: right; padding: 0 1rem;}
.btnArea .right { float: right; width: 50%;text-align: left; padding: 0 1rem;}


@media screen and (max-width: 750px) {
  .btn form input { width: 100%;}

  .btnArea { text-align: center; margin-bottom: 0;}
  .btnArea form input { width: 92%; margin-bottom: 1em;}
  .btnArea .left { float: none; width: inherit; text-align: inherit; padding: inherit;}
  .btnArea .right { float: none; width: inherit;text-align: inherit; padding: inherit;}
}
/*---------------------------------
section
--------------------------------*/

section, header { width: 1500px; margin: 0 auto;}

@media screen and (max-width: 750px) {
  section, header { width: 100%;}
}

/*---------------------------------
header
--------------------------------*/

header .hidden-xs { position: relative; width: 1500px; }
header .hidden-xs .btn { position: absolute; top:22px; right:184px;}



/*---------------------------------
reviews
--------------------------------*/
.reviews { background-color:#fcfbec; padding: 0 0 4rem; }

.inlineframe {
  background-color:#FFFFFF;
  width: 1200px;
  height: 540px;
  overflow:auto;
  overflow-y:scroll;
  overflow-x:hidden;
  border: none;
  text-align:left;
  padding: 1.8rem;
  line-height: 1.6rem;
  font-size: 1rem;
  margin: 0 auto;
}

.kuchi-name {
  color: #333;
  margin: 0 0 .6rem 0;
}
.kuchi-name span {
  font-size: .8rem;
}
.kuchi-star {
  color: #f5d758;
  margin: 0 0 .6rem 0;
}
.kuchi-star span {
  color: #333;
  font-weight: bold;
  margin: 0 0 0 0.5rem;
}
.inlineframe ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
.inlineframe li {
  list-style-type: none;
  background: #fcfbec;
  border-radius: 6px;
  padding: 1rem .6rem;
  margin: 0 0 1rem;
}
.inlineframe .kuchi-innr {
  background: #fff;
  border-radius: 3px;
  padding:1rem .8rem;
}

@media screen and (max-width: 750px) {
  .reviews { padding: 0 15px 30px 15px; }

  .inlineframe {
    background-color:#FFFFFF;
    width: 100%;
    height: 340px;
    overflow:auto;
    overflow-y:scroll;
    overflow-x:hidden;
    border: none;
    text-align:left;
    padding:.6rem;
    line-height: 1.6rem;
    font-size: 1rem;
  }
}




/*---------------------------------
qa
--------------------------------*/

#qa { background:url(../images/qa-bg.png) 0 0 repeat; }
#qa h2 { text-align: center; padding:50px 0 40px; }

/* accordion */

#qa .accordion-box {
  width:100%;
  text-align:left;
}

#qa .accordion-box .cnt {
  border-top:2px solid #fff;
  padding: 0 20px;
}

#qa .accordion-box h3 {
  width:100%;
  padding: 1.6rem 200px 1.6rem 250px;
  margin:0;
  font-size: 1rem;
  font-weight:bold;
  letter-spacing:1px;
  background:url(../images/qa-down.png) no-repeat;
  background-position:90% center;
  cursor:pointer;
  position:relative;
}
/* active */
#qa .accordion-box h3.active {
  background:url(../images/qa-up.png) no-repeat;
  background-position:90% center;
}
/* hovered */
#qa .accordion-box h3 .icn { position:absolute; left:13%; top:30%; }

#qa .accordion-box .accordion-block {
  display:block;
  width:100%;
  background:url(../images/qa-dot.png) left top repeat-x;
  font-size:.9rem;
  padding:1.6rem 200px 1.6rem 250px;
  position:relative;
}
#qa .accordion-box .accordion-block span {
  font-weight:bold;
}
#qa .accordion-box .accordion-block .icn { position:absolute; left:13%; top:30%; }


@media screen and (max-width: 750px) {
  #qa h2 { padding:1.2rem 2.4rem; }
  #qa .accordion-box .cnt { padding: 0; }
  #qa .accordion-box h3 .icn { left:5%; width: 4.5%;}
  #qa .accordion-box .accordion-block { padding: 1.2rem 1.2rem 1.2rem 3.6rem; }
  #qa .accordion-box .accordion-block .icn { left:5%; width: 4.5%; }
  #qa .accordion-box h3 { padding: 1.2rem 3.2rem 1.2rem 3.6rem; background-position:95% center; }

  #qa .accordion-box h3 {
    background-size: 4.5%;
  }
  /* active */
  #qa .accordion-box h3.active {
    background-position:95% center;
    background-size: 4.5%;
  }
}

/*---------------------------------
guide
--------------------------------*/

#guide h2 { background:url(../images/info-bg-sp.png) no-repeat; background-size: cover; text-align:center; padding:1.2rem 0; font-size: 1.2rem; font-weight:bold; margin-top: 2rem; margin-bottom: 1rem;}
#guide .leftBox { float:left; width:48%; text-align:left; }
#guide .rightBox { float:right; width:48%; text-align:left; }

#guide h3 { background:#f4f4f4; font-weight:bold; font-size:1rem; text-align:center; padding:8px 0 6px; margin:12px 0; }
#guide dl { padding-bottom:15px; }
#guide dt { font-weight:bold; color:#adcc00; font-size:1rem; padding-bottom:6px; }
#guide dd { font-size:.9rem; margin-bottom: .3rem;}
#guide dd.attn { font-size:.8rem; }
#guide p { font-size:.9rem; font-weight:bold; padding-bottom:15px; }

#guide a { text-decoration: underline;}
#guide a:hover,#guide a:active { text-decoration: none;}

@media screen and (max-width: 750px) {
  #guide h2 { background:url(../images/info-bg-sp.png) no-repeat; background-size: cover; margin-bottom: 0;}
  #guide h3 { padding:12px 0 10px; margin:2px 0; }
  #guide dl { padding:5px 15px 10px 15px; text-align:left; }
  #guide dt { font-weight:bold; color:#adcc00; font-size:1rem; padding-bottom:6px; }
  #guide p {  padding:5px 15px 10px 15px; }

  #guide .accordion-box h3 {
    background:url(../images/qa-down.png) no-repeat #f4f4f4;
    background-position:97% center;
    background-size: 4.5%;
    cursor:pointer;
    position:relative;
  }
  /* active */
  #guide .accordion-box h3.active {
    background:url(../images/qa-up.png) no-repeat #f4f4f4;
    background-position:97% center;
    background-size: 4.5%;
  }

}



/*---------------------------------
footer
--------------------------------*/

footer { padding:50px 0 0 0; text-align: center;}
footer ul { font-size:1rem; }
footer ul li { display:inline; border-right:1px solid #eee; padding:0 12px; }
footer ul li:last-child { border-right:none; }

footer p { font-size:0.8rem; color:#CCC; padding:30px 0; }

@media screen and (max-width: 750px) {
  footer { padding:0; }
  footer ul li { display:block; border-right:none; padding:0; }
  footer ul li a { display:block; border-bottom:1px solid #eee; padding:12px 0 10px; }
}



@media print{

}