@charset "UTF-8";
/* CSS Document */

#container #sec1{
}
#sec1{
width: calc(100% - 80px);
min-width:1200px;
margin: 0 auto;
box-sizing: border-box;
}
#sec1 .inner{
width: 100%;
position: relative;
}
#sec1 .inner .photo{
width: 50%;
position: absolute;
right: 0px;
top:0px;
}
#sec1 .inner .photo.fix{
width: calc(50% - 40px);
min-width: 560px;
position: fixed;
right: 40px;
top:50px;
z-index: -1;
}
#sec1 .inner .photo ul{
width: 100%;
}
#sec1 .inner .photo ul li{
width: 100%;
position: absolute;
left: 0px;
top:0px;
}
#sec1 .inner .photo ul li:nth-child(1){ z-index: 3; }
#sec1 .inner .photo ul li:nth-child(2){ z-index: 2; }
#sec1 .inner .photo ul li:nth-child(3){ z-index: 1; }

#sec1 .inner .text{
text-align: left;
width: 50%;
padding: 105px 0 0 0;
float: left;
}
#sec1 .inner .text .salon{
width: 100%;
padding: 30px;
box-sizing: border-box;
}
#sec1 .inner .text .salon .name{
margin-bottom: 45px;
}
#sec1 .inner .text .salon .name h3{ margin-bottom: 20px; }
#sec1 .inner .text .salon .name h3 span{ height: 100px; }

#sec1 .inner .text .salon#salon01 .name h3 span{ background-image: url(../images/body1.png); }
#sec1 .inner .text .salon#salon02 .name h3 span{ background-image: url(../images/body2.png); }
#sec1 .inner .text .salon#salon03 .name h3 span{ background-image: url(../images/body3.png); }


#sec1 .inner .text .salon .name h4{
font-weight: bold;
margin-bottom: 15px;
}
#sec1 .inner .text .salon .name h5{
font-size: 0.9em;
font-weight: bold;
}
#sec1 .inner .text .salon .name p span{ font-size: 0.7em; }

#sec1 .inner .text .salon dl{
border-top: solid 1px #636363;
margin-bottom: 30px;
position: relative;
}
#sec1 .inner .text .salon dl:last-child{ margin-bottom: 0px; }
#sec1 .inner .text .salon dl.access{ border: none; }

#sec1 .inner .text .salon dl dt{
font-weight: bold;
padding: 5px 220px 0 0;
margin-bottom: 15px;
}
#sec1 .inner .text .salon dl.about dt{ padding: 20px 0 0 0; }
#sec1 .inner .text .salon dl.about dt.np{ padding: 0px; }
#sec1 .inner .text .salon dl.access dt{ padding: 0px; }
#sec1 .inner .text .salon dl dt p{ margin-bottom: 20px; }
#sec1 .inner .text .salon dl dt p:last-child{ margin-bottom: 0px; }

#sec1 .inner .text .salon dl dd.price{
	text-indent: 100%;
	white-space: nowrap;
	width: 210px;
	height: 30px;
	background-color: #636363;
	background-repeat: no-repeat;
	background-position: center center;
	position: absolute;
	right:0px;
	top:0px;
	overflow: hidden;
}
#sec1 .inner .text .salon dl dd.price.price1{ background-image: url(../images/price_text1.png); }
#sec1 .inner .text .salon dl dd.price.price2{ background-image: url(../images/price_text2.png); }
#sec1 .inner .text .salon dl dd.price.price3{ background-image: url(../images/price_text3.png); }
#sec1 .inner .text .salon dl dd.price.price4{ background-image: url(../images/price_text4.png); }
#sec1 .inner .text .salon dl dd.price.price5{ background-image: url(../images/price_text5.png); }
#sec1 .inner .text .salon dl dd.price.price6{ background-image: url(../images/price_text6.png); }


#sec1 .inner .text .salon dl dd p{
font-size: 0.8em;
line-height: 1.8em;
margin-bottom: 15px;
}
#sec1 .inner .text .salon dl dd p:last-child{ margin-bottom: 0px; }
#sec1 .inner .text .salon dl dd p.sub{
color: #666;
font-size: 0.7em;
}
#sec1 .inner .text .salon dl dd p sup{ vertical-align: text-bottom; }
#sec1 .inner .text .salon dl.about dd{ margin-bottom: 20px; }
#sec1 .inner .text .salon dl.access dd{ margin-bottom: 20px; }

#sec1 .inner .text .salon ul.photoset{ width: 100%; }
#sec1 .inner .text .salon ul.photoset li{
	width: 50%;
	float: left;
}
#sec1 .inner .text .salon ul.photos{
width: 100%;
margin-bottom: 30px;
}




/* for SP-----------------------------------------------------
------------------------------------------------------------ */
@media only screen and (max-width: 736px) {


#container{ padding: 71px 0 0 0; }
#container #sec1{
}
#sec1{
width: 100%;
min-width:100%;
}
#sec1 .inner{
width: 100%;
position: relative;
}
#sec1 .inner .photo{
width: 100%;
position: relative;
}
#sec1 .inner .photo.fix{
width: 100%;
min-width: 100%;
position: relative;
left: 0px;
top:0px;
}
#sec1 .inner .photo ul{
width: 100%;
}
#sec1 .inner .photo ul li{
width: 100%;
position: relative;
left: 0px;
top:0px;
}

#sec1 .inner .text{
text-align: left;
width: 100%;
padding: 0px;
float: none;
}
#sec1 .inner .text .salon{
width: 100%;
padding: 15px;
box-sizing: border-box;
}
#sec1 .inner .text .salon .name{
margin-bottom: 20px;
}
#sec1 .inner .text .salon .name h3{ margin-bottom: 20px; }
#sec1 .inner .text .salon .name h3 span{
height: 50px;
background-size: contain;
}


#sec1 .inner .text .salon .name h4{
font-size: 1.3rem;
font-weight: bold;
margin-bottom: 0px;
}
#sec1 .inner .text .salon .name h5{
font-size: 0.9rem;
font-weight: bold;
}
#sec1 .inner .text .salon .name p span{ font-size: 0.7em; }

#sec1 .inner .text .salon dl{
border-top: solid 1px #636363;
margin-bottom: 15px;
position: relative;
}
#sec1 .inner .text .salon dl:last-child{ margin-bottom: 0px; }
#sec1 .inner .text .salon dl.access{ border: none; }

#sec1 .inner .text .salon dl dt{
font-size: 1.3rem;
line-height: 2.1rem;
font-weight: bold;
padding: 10px 0 0 0;
margin-bottom: 10px;
}
#sec1 .inner .text .salon dl dt p{ margin-bottom: 10px; }
#sec1 .inner .text .salon dl dt sup{
font-weight: normal;
vertical-align: text-bottom;
}
#sec1 .inner .text .salon dl.about dt{ padding: 20px 0 0 0; }
#sec1 .inner .text .salon dl.about dt.np{ padding: 0px; }
#sec1 .inner .text .salon dl.access dt{ padding: 0px; }




#sec1 .inner .text .salon dl dd p{
font-size: 1.2rem;
line-height: 2.2rem;
margin-bottom: 15px;
}
#sec1 .inner .text .salon dl dd p:last-child{ margin-bottom: 0px; }
#sec1 .inner .text .salon dl dd p.sub{
color: #666;
font-size: 0.9rem;
}
#sec1 .inner .text .salon dl dd p sup{ vertical-align: text-bottom; }
#sec1 .inner .text .salon dl.about dd{ margin-bottom: 10px; }
#sec1 .inner .text .salon dl.access dd{ margin-bottom: 10px; }
#sec1 .inner .text .salon .caution{
font-size: 0.8rem;
}
#sec1 .inner .text .salon ul.photos{
width: 100%;
margin-bottom: 15px;
}


}

@media all and (orientation: landscape) {

}