@charset "utf-8";
/* ----------------------------------------
 mv
------------------------------------------- */
#mv{
  background: url("../images/index-images/mv.jpg") 50% 50% no-repeat;
  height: 660px;
}
#mv h1{
  width: 430px;
  padding: 150px 0 0 0;
}
/* ----------------------------------------
 salon
------------------------------------------- */
#salon .float-l{
  width: 50%;
}
#salon .float-r{
  width: 45%;
}
#salon h2{
  width: 50%;
}
#salon .box{
  overflow: hidden;
  margin-bottom: 30px;
}
#salon .cmn-btn01{
  text-align: center;
}
/* ----------------------------------------
 menu
------------------------------------------- */
#menu{
  background-color: #f5efef;
}
#menu .float-l{
  width: 35%;
}
#menu .float-r{
  width: 60%;
}
#menu p{
  margin-bottom: 50px;
}
#menu .cmn-btn01{
  text-align: right;
}
/* ----------------------------------------
 profile
------------------------------------------- */
#profile{
  background: url("../images/index-images/profile-bg.jpg") 50% 50% no-repeat;
}
#profile .float-l{
  width: 60%;
}
#profile p{
  margin-bottom: 50px;
}
#profile p strong{
  color: #96693b;
  font-weight: 700;
}
#profile .wrapper2{
  position: relative;
}
#profile .wrapper2 .name{
  position: absolute;
  top: 220px;
  right: 350px;
  width: 230px;
}
/* ----------------------------------------
 voice
------------------------------------------- */
#voice .box{
  border-bottom: 2px dotted #e9ddd1;
  padding-bottom: 30px;
  margin-bottom: 40px;
}
#voice table{
  width: 100%;
}
#voice table th{
  width: 20%;
  text-align: center;
  vertical-align: middle;
}
#voice table td{
  text-align: left;
  vertical-align: middle;
  padding-left: 5%;
}
#voice .comment{
  margin-bottom: 15px;
}
#voice .comment strong{
  color: #00a975;
  font-weight: 700;
}
#voice .name{
  color: #96693b;
  font-weight: 700;
}
/* =======================
  PC
======================== */
@media screen and (min-width: 1200px) {
}
/* =======================
  TABLET
======================== */
@media screen and (max-width:1199px) {
}
/* =======================
  SP
======================== */
@media screen and (max-width: 699px) {
/* ----------------------------------------
 mv
------------------------------------------- */
#mv{
  background: url("../images/index-images/mv.jpg") 50% 50% no-repeat;
  background-size: cover;
  height: 200px;
}
#mv h1{
  width: 150px;
  padding: 50px 0 0 0;
}
/* ----------------------------------------
 salon
------------------------------------------- */
#salon .float-l{
  float: none;
  width: 100%;
}
#salon .float-r{
  float: none;
  width: 80%;
  margin: 0 auto 20px auto;
}
#salon h2{
  width: 100%;
}
#salon .box{
  margin-bottom: 15px;
}
#salon .cmn-btn01{
  margin-top: 20px;
}
/* ----------------------------------------
 menu
------------------------------------------- */
#menu{
  background-color: #f5efef;
}
#menu .float-l{
  float: none;
  width: 50%;
  margin: 0 auto 20px auto;
}
#menu .float-r{
  float: none;
  width: 100%;
}
#menu p{
  margin-bottom: 20px;
}
#menu .cmn-btn01{
  text-align: center;
}
/* ----------------------------------------
 profile
------------------------------------------- */
#profile{
  background: url("../images/index-images/profile-bg.jpg") no-repeat;
  background-color: #e7ded5;
  background-position: 50% 100%;
  background-size: 150% auto;
  padding-bottom: 110px;
}
#profile .float-l{
  float: none;
  width: 100%;
}
#profile p{
  margin-bottom: 20px;
}
#profile .wrapper2{
  position: relative;
  overflow: visible;
}
#profile .wrapper2 .name{
  position: absolute;
  top: auto;
  bottom: -80px;
  right: 45%;
  width: 150px;
}
/* ----------------------------------------
 voice
------------------------------------------- */
#voice .box{
  border-bottom: 2px dotted #e9ddd1;
  padding-bottom: 10px;
  margin-bottom: 20px;
}
#voice table{
  width: 100%;
}
#voice table th{
  width: 20%;
  vertical-align: top;
}
#voice table td{
  text-align: left;
  vertical-align: middle;
  padding-left: 5%;
}
#voice .comment{
  margin-bottom: 10px;
}


}