/* CSS Document */
body, html, main {
  /* important */
  height: 100%;
}

html {
  position: relative;
}

body {
  height: 100%;
  line-height: 1.7;
  color: #666;
  position: relative;
}

img {
  vertical-align: top;
}

a {
  -webkit-transition: color ease-in-out;
  -webkit-transition-delay: 0.1s;
  -moz-transition: color ease-in-out 0.1s;
  -o-transition: color ease-in-out 0.1s;
  transition: color ease-in-out 0.1s;
}

a:link {
  color: #bfa04d;
  text-decoration: none;
}

a:visited {
  color: #bfa04d;
  text-decoration: none;
}

a:hover {
  color: #decb95;
  text-decoration: none;
}

a:active {
  color: #decb95;
  text-decoration: none;
}

/*header*/
header {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  background: #FFF;
}

#Header {
  zoom: 1;
  width: 1200px;
  padding:3px 0px 0px 0px;
  margin: 0 auto;
}
#Header:before, #Header:after {
  display: block;
  height: 0;
  visibility: hidden;
  content: "\0020";
}
#Header:after {
  clear: both;
}
#Header li {
  float: left;
  margin-left:0px;
}
#Header li:first-child {
  margin-left: 0;
}
#Header a {
  height: 38px;
  display: block;
  border-top: 2px solid #FFF;
  padding-top: 10px;
}
#Header .on {
  opacity: 0.3;
  filter: alpha(opacity=30);
  -ms-filter: "alpha(opacity=30)";
}

/*TOP*/

.cd-bg-1 {
  position: relative;
}

.cd-fixed-bg {
  position: relative;
  min-height: 100%;
  background-size: cover;
  /*background-attachment: fixed;*/
  background-repeat: no-repeat;
  background-position: center center;
  z-index: 2;
}
.cd-fixed-bg.cd-bg-1 {
  background-image: url("../img/bg_index.jpg");
}

.cd-fixed-bg h1{
	width: 470px;
	margin: 0 auto;
	padding-top: 15%;
}

.cd-fixed-bg h1 img {
	width: 100%;
}

.cd-fixed-bg .topcopy{
	width: 945px;
	margin: 0 auto;
	padding-top: 7%;
}

.cd-fixed-bg .topcopy img {
	width: 100%
}

/*ABOUT*/

.cd-fixed-bg.cd-bg-2 {
  background-image: url("../img/bg_about.jpg");
}

.cd-fixed-bg h2 {
	width: 1188px;
	margin: 0px auto;

}

aboutcopybox {
width: 100%;}

.cd-fixed-bg .aboutcopy {
	margin: 0px auto;
	width: 470px;
	margin-top: 150px;
}

.cd-fixed-bg .aboutcopy img {
	width: 100%
}

.aboutinfo {
	width: 1200px;
	padding-top: 50px;
	overflow: hidden;
}

.aboutinfo h3 {
	width: 100%;
	border-bottom: 1px solid #000;
	padding-bottom: 23px;
	margin-bottom: 40px;
}

.infobox {
	width: 510px;
	float: left;
	margin: 0 180px 0 0;
	font-size: 18px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.infobox_r {
	width: 510px;
	float: left;
	margin: 0 0 0 0;
	font-size: 18px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.infobox h3 {
	width: 100%;
	border-bottom: 1px solid #000;
	padding-bottom: 23px;
	margin-bottom: 40px;
}

.infobox_r h3 {
	width: 100%;
	border-bottom: 1px solid #000;
	padding-bottom: 23px;
	margin-bottom: 40px;
}

.infobox table {
	width: 100%;
	margin-bottom: 35px;
}

.infobox table .time{
	padding-right: 25px;	
}

.infobox table .name{
	width: 198px;
	padding-right: 20px;
}

.infobox table .what {
	width: 87px;
	padding-right: 30px;
}

.infobox table .round {
	width: 65px;
}

.infobox_r dl {
	width: 510px;
	float: left;
	overflow: hidden;
	clear: both;
	display: inline;
	margin: 0 0 5px 0;
}

.infobox_r dl dt{
	width: 180px;
	float:left;
	margin-right: 15px;
}

.infobox_r dl dd{
	width: 310px;
	float: left;
}

#map_canvas{
	width: 100%;
	height: 500px;
}

/*SALON*/

.cd-scrolling-bg h2 {
	width: 1188px;
	margin: 0px auto;
}

.cd-scrolling-bg .saloncopy {
	margin: 70px auto 30px;
	width: 658px;
}


.salonbox {
	width: 83%;
	margin: 0 auto;
	padding: 30px 0;
	overflow: hidden;
	font-size: 18px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}


.saloninfobox {
	width: 66%;
	float: left;
}

.salonpic {
	float: left;
	width: 33%;
	margin-right: 1%;
}

.salonpic img{
	width: 100%;
	height: auto;
}

.salonlogo {
	width: 32%;
	margin-bottom: 10px;
}

.salonlogo img{
	width: 100%;
	height: auto;
}

.saloninfo {
	font-size: 14px;
	padding-left: 0.5em;
	margin: 10px 0 ;
}

.house{
	width: 100%;
	margin: 50px auto;
}

.house_top{
	width: 100%;
	margin: 0;
}
.house_in{
	width: 100%;
	background: repeat-y url(../img/house_bg.png);
	position: relative;
	padding: 30px 0;
}

.house_in::after{
	content: '';
	display: inline-block;
	width: 100%;
	height: 24px;
	background-image: url(../img/house_middle.png);
	background-size: contain;
	position: absolute;
	bottom: 0;
	left: 0;
}

.house_in_02, .house_in_03{
	width: 100%;
	background: repeat-y url(../img/house_bg.png);
	position: relative;
	margin-bottom: 24px;
	padding: 30px 0;
}
.house_in_02::after, .house_in_03::after{
	content: '';
	display: inline-block;
	width: 100%;
	height: 24px;
	background-image: url(../img/house_under.png);
	background-size: contain;
	position: absolute;
	bottom: 0;
	left: 0;
}

.youtube {
    position: relative;
    width: 64%;
    margin: 0 auto;
    padding-top: 36%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}

.saloncopy02 {
    margin: 0px auto;
    width: 944px;
    margin: 100px auto 50px;
}

.num_out{
	position: absolute;
	top: 25px;
	right: 89px;
}

.num_out .num{
	position: relative;
	width: 75px;
}

.num_out .num span {
    width: 75px;
    height: 75px;
    padding: .3125vw 0 0 .15625vw;
    position: absolute;
    top: 0;
    left: 0;
    font-size: 2.4rem;
    font-weight: bold;
    color: #58585b;
    border: 4px solid #58585b;
    background-color: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    letter-spacing: .05em;
    line-height: 1;
    border-radius: 100%;
}

.house_in_02 .salonbox::before{
	content: '';
    display: inline-block;
    width: 163px;
    height: 230px;
    background-image: url(../img/house_door.png);
    background-size: contain;
    position: absolute;
    bottom: 24px;
    right: 100px;
    opacity: 0.4;
}

.house_in_02 .salonbox::after{
	content: '';
    display: inline-block;
    width: 381px;
    height: 395px;
    background-image: url(../img/house_stair.png);
    background-size: contain;
    position: absolute;
    bottom: 24px;
    right: 310px;
    opacity: 0.4;
    z-index: -1;
}

/*PEOPLE*/

.peoplebox {
	width: 1200px;
	padding-top: 25px;
	position: relative;
}

.peoplecopy {
	position: absolute;
	top: 415px;
	left: 0;
	right: 0;
	bottom: 0;
	margin: auto;
	width: 267px;
	height: 42px;
	z-index: 4;
}

.peoplepic, .slideArea {
	width: 300px;
	height: 300px;
	margin: 0px;
	padding: 0px;
	float: left;
}

.slider {
	width: 300px;
	height: 300px;
	margin: 0px;
	padding: 0px;
	float: left;
}

/*VOICE*/

.cd-fixed-bg.cd-bg-3 {
  background-image: url(../img/voice_bg01.jpg);
  position: relative;
}
.cd-fixed-bg.cd-bg-4 {
  background-image: url(../img/voice_bg02.jpg);
  position: relative;
}
.cd-fixed-bg.cd-bg-5 {
  background-image: url(../img/voice_bg03.jpg);
  position: relative;
}

.voicemessage01 {
	background: url(../img/voice_message_bg01.png) repeat;
	font-size: 14px;
	color: #FFF;
	padding: 30px;
	float: right;
	margin-right: 5px;
	line-height: 2em;
	margin-top: 7%;
}

.voicemessage02 {
	background: url(../img/voice_message_bg02.png) repeat;
	font-size: 14px;
	color: #FFF;
	padding: 30px;
	float: right;
	margin-right: 5px;
	line-height: 2em;
	margin-top: 5%;
}

.voicemessage03 {
	background: url(../img/voice_message_bg02.png) repeat;
	font-size: 14px;
	color: #FFF;
	padding: 30px;
	float: right;
	margin-right: 5px;
	line-height: 2em;
	margin-top: 5%;
}

/*RECRUIT*/

#rlink{
      padding-bottom:50px;
}

.rlink{
       width:99%;
       border:1px solid #000;
       padding:15px 0 15px 0;
       text-align:center;
       font-size:2em;
       display:block;
       font-family: 'Open Sans', sans-serif;
       margin:0 auto;
}

#rlink a:link{
       color:#000;
}
#rlink a:visited{
       color:#000;
}
#rlink a:hover{
       color:#bfa04d;
}

.recruitcopy {
	margin: 0px auto;
	width: 616px;
	margin-top: 100px;
}

.recruitcopy02 {
	margin: 100px auto 180px;
	width: 500px;
}

.recruitcopy03 {
	margin: 130px auto;
	width: 754px;
	font-family: 'Open Sans', sans-serif;
	font-size:60px;
	line-height:1em;
	text-align:center;
	color:#000;
}

.newshopcopy01 {
	margin: 130px auto 40px;
	width: 100%;
	font-family: 'Open Sans', sans-serif;
	font-size:2.6rem;
	line-height:1.2;
	text-align:center;
	color:#000;
}
.newshopcopy01 span{
	display: block;
	font-size: 5.0rem;
}
.new_h2{
	text-align: center;
	font-size: 1.8rem;
	line-height: 1.5;
	margin-bottom: 30px;
}
.new_time{
	position: relative;
  display: inline-block;
  padding: 0 55px;
  font-size: 1.4rem;
}
.new_time:before, .new_time:after {
  content: '';
  position: absolute;
  top: 50%;
  display: inline-block;
  width: 45px;
  height: 1px;
  background-color: black;
}

.new_time:before {
  left:0;
}
.new_time:after {
  right: 0;
}

.new_info{
	width: 100%;
	padding: 45px 15px 15px 15px;
	text-align: left;
	border: 1px solid #666;
	position: relative;
	margin-bottom: 50px;
}
.new_info h3{
	position: absolute;
	top: -27px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    padding: 10px;
    background-color: #fff;
    font-size: 1.4rem;
}

.flex{
	margin: 0px auto;
  width: 100%;
  display: -webkit-box; 
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-direction:initial;
  -webkit-flex-direction:initial;
  flex-direction:initial;
  align-items: stretch;
  position: relative;
}

.flex_box33{
	width: 33%;
    padding: 0 0 20px 0;
    display: flex;
    flex-direction: column;
}
.flex_box33 h4{
	text-align: center;
	margin-bottom: 30px;
}

.flex_box33 dl{
	width: 75%;
    margin: 0 auto 5px;
	display: -webkit-box; 
  display: -moz-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -ms-flex-direction:initial;
  -webkit-flex-direction:initial;
  flex-direction:initial;
  align-items: stretch;
  position: relative;
}
.flex_box33 dl dt{
	width: 30%;
}
.flex_box33 dl dd{
	width: 69%;
}

.recruitinfo {
	width: 1200px;
	margin-bottom: 125px;
}

.infobox02 {
	width: 595px;
	float: left;
	margin: 0 85px 0 0;
	font-size: 14px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #000;
}

.recruitlead {
	width: 100%;
	margin:0 auto 30px;
}

.recruitpic {
	width: 520px;
	float: left;
	margin: 0;
	padding: 54px 0 0;
}

.recruitparagraph {
	width: 97%;
    background: url(../img/recruit_picon.png) no-repeat left 8px;
    padding-left: 3%;
	line-height: 2.5em;
}

.infobox02 h3 {
	width: 100%;
	border-bottom: 1px solid #000;
	padding-bottom: 23px;
	margin-bottom: 30px;
}

.recruitdl {
	width: 1025px;
	margin: 0 auto 30px;
}

.recruitdl dl {
	width: 100%;
	border-top: 1px solid #000;
	overflow: hidden;
	clear: both;
	margin: 0;
	font-size: 14px;
	color: #000;
	padding: 5px 0;
}

.recruitdl dl dt{
	width: 190px;
	float:left;
	margin-right: 90px;
	font-weight: bold;
	padding-left: 10px;
}

.recruitdl dl dd{
	width: 735px;
	float: left;
}

.recruittext {
	width: 1025px;
	margin: 0 auto;
	border: 1px dotted #000;
	color:#000;
}

.recruittext p {
	padding: 30px;
	line-height: 2.5em;
}

.recruittext dl {
	width: 93%;
	overflow: hidden;
	clear: both;
	margin: 0;
	color: #000;
	padding: 10px 0 10px 30px;
}

.recruittext dl dt{
	width: 20%;
	float: left;
	margin-right: 2%
}

.recruittext dl dd{
	width: 78%;
	float: left;
}

.contact h1 {
	width: 236px;
	margin-bottom: 2em;
}

.tel, .mail {
	font-size: 18px;
	padding-bottom: 1em;
	text-indent: 40px;
}

.tel {
	background: url(../img/tel.png) no-repeat left top;
}

.mail {
	background: url(../img/email.png) no-repeat left top;
}

h3.interview{
	position: relative;
    overflow: hidden;
    padding: .8rem .3rem .3rem 100px;
    border: 2px solid #000;
    box-sizing: border-box;
    margin: 54px auto 20px;
    font-size: 1.3rem;
}

h3.interview:before {
  position: absolute;
    top: -150%;
    left: -100px;
    width: 185px;
    height: 300%;
    content: '';
    -webkit-transform: rotate(
25deg);
    transform: rotate(
25deg);
    background: #000;
}
h3.interview span {
  font-size: 2rem;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    display: block;
    padding-top: 3px;
    padding-left: 16px;
    color: #fff;
}

h4.interview_q{
	position: relative;
  padding: 0.25em 0;
  font-size: 1rem;
  margin-bottom: 10px;
  font-weight: 600;
}

h4.interview_q:after {
  content: "";
  display: block;
  height: 2px;
  background: -webkit-linear-gradient(to right, rgb(0, 0, 0), transparent);
  background: linear-gradient(to right, rgb(0, 0, 0), transparent);
}
.interview_ans{
	font-size: 1rem;
	line-height: 1.5;
	margin-bottom: 15px;
}

.cd-fixed-bg.cd-bg-6 {
  background-image: url("../img/bg_6.jpg");
  position: relative;
}
.cd-fixed-bg.cd-bg-6 #Copyright {
  color: #ECECEC;
  position: absolute;
  left: 50%;
  bottom: 30px;
  margin-left: -74px;
}

.PhotoCopyright {
  position: fixed;
  right: 30px;
  bottom: 25px;
  z-index: 1000;
  color: #FFF;
  font-size: 11px;
}

#Logo {
  position: fixed;
  top: 50%;
  left: 50%;
  margin-top: -134px;
  margin-left: -159px;
  display: none;
  z-index: 10;
  width: 317px;
  height: 317px;
}

.cd-scrolling-bg {
  position: relative;
  z-index: 9;
}

.cd-container {
  width: 1200px;
  padding: 10px 0 100px;
  margin: 0 auto;
  zoom: 1;
}

.cd-container02 {
  width: 1200px;
  padding: 60px 0 100px;
  margin: 0 auto;
  zoom: 1;
}

.cd-containerabout {
  width: 100%;
  padding: 60px 0 100px;
  margin: 0 auto;
  zoom: 1;
}

.cd-container:before, .cd-container:after {
  display: block;
  height: 0;
  visibility: hidden;
  content: "\0020";
}
.cd-container:after {
  clear: both;
}

.cd-container02:before, .cd-container02:after {
  display: block;
  height: 0;
  visibility: hidden;
  content: "\0020";
}
.cd-container02:after {
  clear: both;
}

.cd-containerabout:before, .cd-container02:after {
  display: block;
  height: 0;
  visibility: hidden;
  content: "\0020";
}
.cd-containerabout:after {
  clear: both;
}

/*---------------------------------------------
	Salon
  ---------------------------------------------*/

.door {
    width: 30%;
    margin: 0 auto 60px;
}

.door_in{
    width: 100%;
  overflow: hidden;
  margin-bottom:20px;
}

.door_in p{
    margin-right:20px;
    float:left;
    text-align:center;
}

.door_in p:last-child{
   margin-right:0;
}

.door_icon01{padding:0;width:20px;}
.door_icon02{padding:7px 0;width:34px;}
.door_icon03{padding:6px 0;font-family: 'Open Sans', sans-serif;font-size:34px;line-height:1em;}

.door_icon03 a:link,.door_icon03 a:visited{color:#000;}
.door_icon03 a:hover{color:#737171;}

.door_in p img{vertical-align: text-bottom;}

.door_in p a img:hover{opacity:0.5;}

.door_comment {
    width: 36%;
    margin: 0 auto 35px;
    line-height: 2em;
}

.doorlink{
    position: relative;
    padding-left: 32px;
}
.doorlink:before{
        content: '';
    background-image: url(../img/salon_finger.png);
    background-size: contain;
    background-repeat: no-repeat;
    vertical-align: middle;
    position: absolute;
    left: 6px;
    top: 5px;
    width: 22px;
    height: 10px;
}
.door_footer {
    text-align: center;
}

/*---------------------------------------------
	Clearfix
  ---------------------------------------------*/

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

.clearfix {
	zoom: 1;
}


/*Genaral*/

.mb0{margin-bottom: 0!important;}
.mb5{margin-bottom: 5!important;}
.mb10{margin-bottom: 10px;}
.mb15{margin-bottom: 15px;}
.mb20{margin-bottom: 20px;}
.mb30{margin-bottom: 30px;}
.mb35{margin-bottom: 35px;}
.mb50{margin-bottom: 50px;}
.mb60{margin-bottom: 60px;}

.mt30{margin-top: 30px;}

.pt0{padding-top: 0px!important;}
.pt60{padding-top: 60px;}

.ls1 {letter-spacing: 1em;}
.ls2 {letter-spacing: 2em;}
.ls3 {letter-spacing: 3em;}

.tac {text-align: center;}
.tar {text-align: right;}
.tal {text-align: left;}

.indent{
	padding-left: 1em;
    text-indent: -1em;
    clear: both;
}


@media screen and (min-width: 320px) and (max-width: 1024px) {

html,body{height:100%;width:100%;min-width:100%;}
img {  max-width: 100%; height:auto;}

#Header {
  zoom: 1;
  width: 100%;
  padding:5px 0px 10px;
  margin: 0 auto;
}

#Header li {
  float: left;
  margin-left:0px;
  width: 14%;
}
#Header li:first-child {
  margin-left: 0;
}
#Header a {
  height: 10px;
  display: block;
  border-top: 2px solid #FFF;
  padding-top: 10px;
}

.cd-fixed-bg h1{
	width: 50%;
	margin: 0 auto;
	padding-top: 135px;
}

.cd-fixed-bg .topcopy{
	width: 90%;
	margin: 0 auto;
	padding-top: 60px;
}


.cd-fixed-bg h2 {
	width: 100%;
	margin: 0px auto;
	padding-top: 60px;
}

.cd-fixed-bg .aboutcopy {
	margin: 0px auto;
	width: 41%;
	margin-top: 50px;
}

.cd-container {
  width: 100%;
  padding: 0px;
  margin: 0 auto;
  zoom: 1;
}

.cd-container02 {
  width: 100%;
  padding: 0px;
  margin: 0 auto;
  zoom: 1;
}

.cd-containerabout {
  width: 100%;
  padding: 0px 0 0px;
  margin: 0 auto;
  zoom: 1;
}

.aboutinfo {
	width: 100%;
	padding-top: 10px;
}

.aboutinfo h3{
	width: 100%;
	border-bottom: 1px solid #000;
	padding-bottom: 10px;
	margin-bottom: 20px;
}

.aboutinfo h3 img{
	width: 15%;
}

.infobox {
	width: 90%;
	margin: 10px 5% 30px;
	font-size: 12px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.infobox_r {
	width: 90%;
	margin: 0px 5% 30px;
	font-size: 12px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

.infobox h3 {
	width: 100%;
	border-bottom: 1px solid #000;
	padding-bottom: 10px;
	margin-bottom: 20px;
}

.infobox_r h3 {
	width: 100%;
	border-bottom: 1px solid #000;
	padding-bottom: 10px;
	margin-bottom: 20px;
}

.infobox h3 img {
	width: 50%
}

.infobox_r h3 img {
	width: 50%
}

.infobox table {
	width: 100%;
	margin-bottom: 35px;
}

.infobox table .time{
	padding-right: 1em;
	width: 6%
}

.infobox table .name{
	width: 18%;
	padding-right: 1em;
}

.infobox table .what {
	width: 8%;
	padding-right: 1emx;
}

.infobox table .round {
	width: 6%;
}

.infobox_r dl {
	width: 100%;
	float: left;
	overflow: hidden;
	clear: both;
	display: inline;
	margin: 0 0 10px 0;
}

.infobox_r dl dt{
	width: 27%;
	float:left;
	margin-right: 2%;
}

.infobox_r dl dd{
	width: 71%;
	float: left;
}


.cd-scrolling-bg h2 {
	width: 100%;
	margin: 0px auto;
}

.cd-scrolling-bg .saloncopy {
	margin: 30px auto 15px;
	width: 54%;
}

.salonbox {
    padding: 0px;
}
.saloninfobox {
	width: 100%;
	padding-top: 15px;
}

.salonpic {
	width: 100%;
	margin: 0px auto;;
}

.salonlogo {
	float: left;
	width: 33%;
	margin-right: 10px;
}

.saloninfo {
	float: left;
	width: 63%;
	font-size: 10px;
	padding-left: 0px;
}

.house_in, .house_in_02, .house_in_03{
    width: 100%;
    background: repeat-y url(../img/house_bg.png);
    background-size: contain;
    position: relative;
    padding: 30px 0;
}

.house_in::after, .house_in_02::after, .house_in_03::after {
    height: 8px;
}

.house_in_02 .salonbox::before{
	content: '';
    display: inline-block;
    width: 50px;
    height: 71px;
    background-image: url(../img/house_door.png);
    background-size: contain;
    position: absolute;
    bottom: 7px;
    right: 30px;
    opacity: 0.4;
}

.house_in_02 .salonbox::after{
	content: '';
    display: inline-block;
    width: 120px;
    height: 124px;
    background-image: url(../img/house_stair.png);
    background-size: contain;
    position: absolute;
    bottom: 7px;
    right: 100px;
    opacity: 0.4;
    z-index: -1;
}

.youtube {
    position: relative;
    width: 100%;
    margin: 0 auto 30px;
    padding-top: 56.25%;
}

.num_out {
    position: absolute;
    top: 10px;
    right: 35px;
}

.num_out .num {
    position: relative;
    width: 50px;
}

.num_out .num span {
    width: 50px;
    height: 50px;
    padding: .3125vw 0 0 .15625vw;
    position: absolute;
    top: 0;
    left: 0;
    font-size: 1.7rem;
    font-weight: bold;
    color: #58585b;
    border: 4px solid #58585b;
    background-color: #fff;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    letter-spacing: .05em;
    line-height: 1;
    border-radius: 100%;
}

.saloncopy02 {
    margin: 0px auto;
    width: 96%;
    margin: 30px auto;
}

.salonlogo {
    float: none;
    width: 33%;
    margin-right: 0;
}

.saloninfo {
    float: none;
    width: 100%;
    font-size: 10px;
    padding-left: 0px;
}

.map{
	width: 90%;
	margin: 0 auto;
	margin-bottom: 20px;
}
#map_canvas{
	width: 100%;
	height: 300px;
}

/*PEOPLE*/

.peoplebox {
	width: 91%;
	padding-top: 25px;
	margin: 0 auto;
}

.peoplepic{
	width: 145px;
	height: 145px;
	margin: 0px;
	padding: 0px;
	float: left;
}

.slider {
	width: 145px;
	height: 145px;
	margin: 0px;
	padding: 0px;
	float: left;
}


/*VOICE*/

.cd-container02 {
  width: 100%;
  padding: 0px;
  margin: 0 auto;
  zoom: 1;
}

.cd-fixed-bg.cd-bg-4 {
  background-image: url(../img/voice_bg04.jpg);
  position: relative;
}
.cd-fixed-bg.cd-bg-5 {
  background-image: url(../img/voice_bg05.jpg);
  position: relative;
}

.voicemessage01 {
	background: url(../img/voice_message_bg02.png) repeat;
	font-size: 10px;
	color: #FFF;
	padding: 3em 0.5em;
	width: 97%;
	margin: 0 auto;
	line-height: 2em;
	float: none;
}

.voicemessage02 {
	background: url(../img/voice_message_bg02.png) repeat;
	font-size: 10px;
	color: #FFF;
	padding: 3em 0.5em;
	width: 97%;
	margin: 0 auto;
	line-height: 2em;
	float: none;
}

.voicemessage03 {
	background: url(../img/voice_message_bg02.png) repeat;
	font-size: 10px;
	color: #FFF;
	padding: 3em 0.5em;
	width: 97%;
	margin: 0 auto;
	line-height: 2em;
	float: none;
}

/*RECRUIT*/

.recruitcopy {
	margin: 50px auto 0px;
	width: 90%;
}

.recruitcopy02 {
	margin: 50px auto;
	width: 65%;
}

.recruitcopy03 {
	margin: 50px auto;
	width: 85%;
	font-size:24px;
}

.recruitinfo {
	width: 100%;
	margin-bottom: 3em;
}

.infobox02 {
	width: 95%;
	float: none;
	margin: 0 auto;
	font-size: 10px;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	color: #000;
}

.recruitlead {
	width: 100%;
	margin:0 auto 3em;
}

.recruitpic {
	width: 95%;
	float: none;
	margin: 0 auto;
	padding: 2em 0 0;
}

.recruitparagraph {
	width: 93%;
    background: url(../img/recruit_picon.png) no-repeat left 4%;
    padding-left: 7%;
	line-height: 2em;
}

.infobox02 h3 {
	width: 100%;
	border-bottom: 1px solid #000;
	padding-bottom: 2em;
	margin-bottom: 3em;
}

.mb50{margin-bottom: 2em;}

.recruitdl {
	width: 95%;
	margin: 0 auto;
}

.recruitdl dl {
	width: 100%;
	border-top: 1px solid #000;
	overflow: hidden;
	clear: both;
	margin: 0;
	font-size: 10px;
	color: #000;
	padding: 2emx 0;
}

.recruitdl dl dt{
	width: 34%;
	float:left;
	margin-right: 1em;
	font-weight: bold;
	padding-left: 0;
}

.recruitdl dl dd{
	width: 60%;
	float: left;
}

.recruittext {
	width: 95%;
	margin: 0 auto 20px;
	border: 1px dotted #000;
	color:#000;
}

.recruittext p {
	padding: 1em;
	line-height: 2em;
}

.recruittext dl {
	width: 91%;
	overflow: hidden;
	clear: both;
	margin: 0;
	color: #000;
	padding: 1em;
}

.recruittext dl dt{
	width: 100%;
	float:none;
	margin-right: 1em;
}

.recruittext dl dd{
	width: 100%;
	float: none;
}
h3.interview {
    position: relative;
    overflow: hidden;
    padding: .5rem .2rem .2rem 85px!important;
    border: 2px solid #000;
    box-sizing: border-box;
    margin: 30px auto 15px!important;
    font-size: 1rem;
}
h3.interview:before {
    position: absolute;
    top: -150%;
    left: -100px;
    width: 170px;
    height: 300%;
    content: '';
    -webkit-transform: rotate( 
25deg);
    transform: rotate( 
25deg);
    background: #000;
}
h3.interview span {
    font-size: 1.4rem;
}
/*SALON*/

.door {
    width: 65%;
    margin: 0 auto 60px;
}

.door_in p {
    margin-right: 6%;
}

.door_in p.door_icon01{padding:0;width:10%;}
.door_in p.door_icon02{padding: 6px 0;width:10%;line-height: 1em;}
.door_in p.door_icon03 {
    padding: 6px 0;
    font-family: 'Open Sans', sans-serif;
    font-size: 24px;
    line-height: 1em;
}

.door_comment {
    width: 85%;
    margin: 0 auto 50px;
    line-height: 1.5em;
}

.door_comment p{margin-bottom:15px;}

.door_footer {
    font-size: 10px;
}

/*NEW SHOP*/

.newshopcopy01 {
    margin: 60px auto 30px;
    width: 100%;
    font-family: 'Open Sans', sans-serif;
    font-size: 1.6rem;
}
.newshopcopy01 span {
    font-size: 3rem;
}

.new_h2 {
    text-align: center;
    font-size: 1.0rem;
    line-height: 1.5;
    margin-bottom: 30px;
}
.new_time {
    font-size: 1.0rem;
}

.new_info {
    width: 98%;
    padding: 45px 10px 10px 10px;
    text-align: left;
    border: 1px solid #666;
    position: relative;
    box-sizing: border-box;
    margin: 0 auto 30px;
}

.new_info h3 {
    position: absolute;
    top: -23px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    padding: 10px;
    background-color: #fff;
    font-size: 1.0rem;
    text-wrap: nowrap;
    white-space: nowrap;
}

.flex {
    margin: 0px auto;
    width: 100%;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    align-items: stretch;
    position: relative;
}

.flex_box33 {
    width: 100%;
    padding: 0 0 20px 0;
    margin-right: 1%;
    display: flex;
    flex-direction: column;
    margin-bottom: 30px;
}
.flex_box33 dl {
    width: 100%;
    margin: 0 auto 5px;
    display: -webkit-box;
    display: -moz-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-direction: initial;
    -webkit-flex-direction: initial;
    flex-direction: initial;
    align-items: stretch;
    position: relative;
}

}

