@charset "UTF-8";
@import url(https://fonts.googleapis.com/css?family=Roboto+Condensed:300,400,700);
/* CSS Document */



html,body{
	width:100%;
	height:100%;
}
body{
	color: #8fbdc6;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic",sans-serif;
	font-size:10pt;
	line-height:16pt;
	text-align:center;
	background-color:#F9F9F9;
	-webkit-text-size-adjust: 150%;
}
h1,h3,p.address,p.tel,ul#menu li a,.btn a{
text-indent: 100%;
white-space: nowrap;
background-repeat: no-repeat;
overflow: hidden;
display: block;
}
a,a:visited{
	color: #8fbdc6;
	position: relative;
	z-index: 999;
}
a:hover,a:active{
	color:#cfb58f;
}
.section{ margin: 0 auto 100px auto; }
#loader{
}
#frame{
width:95%;
height: 95%;
min-width: 1100px;
min-height: 600px;
background-color: transparent;
position: fixed;
left: 2.5%;
top:2.5%;
z-index: 3;
}
#frame .frame{
	position: absolute;
	background-color: #000;
}
#frame .frame.right{
width: 5px;
height: 100%;
right: 0px;
top:0px;
}
#frame .frame.left{
width: 5px;
height: 100%;
left: 0px;
top:0px;
}
.frame.top{
width: 95%;
min-width: 1100px;
height: 5px;
background-color: #000;
position: fixed;
left: 2.5%;
top:2.5%;
z-index: 9999;
}
.frame.bottom{
width: 95%;
min-width: 1100px;
height: 5px;
background-color: #000;
position: fixed;
left: 2.5%;
bottom:2.5%;
z-index: 9999;
}
nav{
width:95%;
min-width: 1100px;
margin: 0px;
border-top: solid 5px #000;
position: fixed;
left: 2.5%;
bottom:2.5%;
z-index: 7777;
}
nav ul#menu{
width:755px;
padding: 20px 0;
margin: 0 auto;
display: block;
}
nav ul#menu li{
display: block;
float: left;
margin-left: 40px;
}
nav ul#menu li:first-child{ margin-left: 0px; }
nav ul#menu li a{
	background-image: url(../images/menu_combo.png);
	height: 25px;
}
nav ul#menu li.mn1{ width:50px; }
nav ul#menu li.mn1 a{ background-position: 0px -25px; }
nav ul#menu li.mn1.active a{ background-position: 0px -50px; }
nav ul#menu li.mn1 a:hover{ background-position: 0px 0px; }
nav ul#menu li.mn2{ width:82px; }
nav ul#menu li.mn2 a{ background-position: -50px -25px; }
nav ul#menu li.mn2.active a{ background-position: -50px -50px; }
nav ul#menu li.mn2 a:hover{ background-position: -50px 0px; }
nav ul#menu li.mn3{ width:70px; }
nav ul#menu li.mn3 a{ background-position: -132px -25px; }
nav ul#menu li.mn3.active a{ background-position: -132px -50px; }
nav ul#menu li.mn3 a:hover{ background-position: -132px 0px; }
nav ul#menu li.mn4{ width:74px; }
nav ul#menu li.mn4 a{ background-position: -202px -25px; }
nav ul#menu li.mn4.active a{ background-position: -202px -50px; }
nav ul#menu li.mn4 a:hover{ background-position: -202px 0px; }
nav ul#menu li.mn5{ width:67px; }
nav ul#menu li.mn5 a{ background-position: -276px -25px; }
nav ul#menu li.mn5.active a{ background-position: -276px -50px; }
nav ul#menu li.mn5 a:hover{ background-position: -276px 0px; }
nav ul#menu li.mn6{ width:49px; }
nav ul#menu li.mn6 a{ background-position: -343px -25px; }
nav ul#menu li.mn6.active a{ background-position: -343px -50px; }
nav ul#menu li.mn6 a:hover{ background-position: -343px 0px; }
nav ul#menu li.mn7{ width:123px; }
nav ul#menu li.mn7 a{ background-position: -392px -25px; }
nav ul#menu li.mn7.active a{ background-position: -392px -50px; }
nav ul#menu li.mn7 a:hover{ background-position: -392px 0px; }
#logo{
	width:100px;
	position: fixed;
	right:5%;
	top:5%;
	z-index: 9999;
}
#symbol{
	width:15%;
	height: auto;
	position: fixed;
	left: 0px;
	top:0px;
	z-index: 1;
}
#symbol svg{ fill:#BCE2E8; }

#sec-home{
	width:100%;
	height: 100vh;
	margin: 0 auto;
	padding: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}
#sec-home .inner{
	width: 552px;
}
#sec-home .inner h1{
background-image: url(../images/logo_text.png);
width:400px;
height: 112px;
margin: 0 auto 100px auto;
}
#sec-home .inner p.address{
background-image: url(../images/text_address.png);
width:551px;
height: 46px;
margin: 0 auto 50px auto;
}
#sec-home .inner p.address br{ display: none; }
#sec-home .inner p.tel{
background-image: url(../images/text_tel.png);
width:223px;
height: 13px;
margin: 0 auto;
}
/* //hone */
.section#sec-news{
width:100%;
min-width: 1000px;
margin: 0 auto;
}
#sec-news .inner{
	padding: 200px;
	background-color: #FFF;
}
#sec-news .inner h3{
background-image: url(../images/title_news.png);
width:180px;
height: 37px;
margin: 0 auto 50px auto;
}
#sec-news .inner dl{
text-align: left;
padding: 25px 0;
margin: 0 auto;
max-width: 900px;
border-bottom: solid 1px #BCE2E8;
}
#sec-news .inner dl.first{ border-top: solid 1px #BCE2E8; }
#sec-news .inner dl dt{
font-size: 1.2em;
font-weight: 700;
font-family:'Roboto Condensed',sans-serif;
width:15%;
float: left;
}
#sec-news .inner dl dd{
width:80%;
float: right;
}
/* //news */
.section#sec-concept{
width:100%;
min-width: 1000px;
margin: 0 auto;
}
#sec-concept .inner{
	padding: 100px;
}
#sec-concept .inner .photo{
width:200px;
margin: 0 auto 100px auto;
}
#sec-concept .inner .photo img{
width:100%;
height: auto;
border-radius: 100px;
}
#sec-concept .inner h3{
background-image: url(../images/title_concept.png);
width:307px;
height: 37px;
margin: 0 auto 50px auto;
}
#sec-concept .inner p{
	text-align: left;
	padding: 0 100px;
	margin: 0 auto 10px auto;
}
#sec-concept .inner p:last-child{ margin: 0 auto; }

/* //concept */
.section#sec-stylist{
	min-width: 1100px;
	padding: 100px 0;
	margin: 0 auto;
}
#sec-stylist h3.title1{
background-image: url(../images/title_stylist.png);
width:265px;
height: 37px;
margin: 0 auto 50px auto;
}
#sec-stylist h3.title2{
background-image: url(../images/title_assistant.png);
width:368px;
height: 37px;
margin: 0 auto 50px auto;
}
#sec-stylist p.lead{
text-align: left;
max-width: 1000px;
padding: 0 200px;
margin: 0 auto 50px auto;
}
#sec-stylist .inner{
	width:1000px;
	margin: 0 auto 20px auto;
}
#sec-stylist .inner.buttons{
padding-bottom: 50px;
margin-bottom: 50px;
border-bottom: solid 1px #bbe2e8;
}

#sec-stylist .inner .person{
color: #000;
text-align: left;
width:180px;
margin-left: 25px;
float: left;
}
#sec-stylist .inner .person:first-child{ margin-left: 0px; }
.person dl{
display: block;
margin-bottom: 10px;
position: relative;
z-index: 5;
}
.person dl dt{
margin-bottom: 10px;
}
.person dl dt img{
width: 100%;
height: auto;
}
.person dl dd.name{
font-size: 1.2em;
line-height: 1.8em;
}
.person p{
font-size: 0.9em;
position: relative;
z-index: 5;
}
.person .btn a{
	background-image: url(../images/btn_reserve.png);
	height: 30px;
	border-radius: 5px;
}
.person .btn a:hover{ background-position: left bottom; }
/* //stylist */

.section#sec-styling{
width: 100%;
padding: 100px 0 0 0;
margin: 0 auto;
background-color: #FFF;
}
#sec-styling h3{
background-image: url(../images/title_styling.png);
width:277px;
height: 37px;
margin: 0 auto 20px auto;
}
#sec-styling h4{
font-family: 'Roboto Condensed', sans-serif;
font-weight: 700;
margin-bottom: 80px;
}

#sec-styling ul#myinsta{
width: 100%;
padding: 0px;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-items: stretch;
box-sizing: border-box;
position: relative;
z-index: 1;
}
ul#myinsta li{
width:20%;
}
ul#myinsta li a{
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
height: 20vw;
padding: 0px;
display: block;
}
ul#myinsta li a img{
display: none;
}
ul#myinsta li a:hover{ opacity: 0.8; }

/* //styling */
#sec-access{
width: 100%;
padding: 100px 0 0 0;
}
#sec-access h3{
background-image: url(../images/title_access.png);
width:254px;
height: 37px;
margin: 0 auto 100px auto;
}
#sec-access #gmap{
width:94%;
height: 600px;
margin: 0 auto 40px auto;
position: relative;
z-index: 555;
}
#sec-access #gmap iframe{
width:100%;
height: 100%;
}
#sec-access table{
	text-align: left;
	width:900px;
	margin: 0 auto;
	border-top:solid 1px #bbe2e8;
}
#sec-access table th{
font-family: 'Roboto Condensed', sans-serif;
font-size: 1.2em;
font-weight: 700;
width:200px;
padding: 20px 0;
border-bottom:solid 1px #bbe2e8;
}
#sec-access table td{
padding: 20px 0 20px 20px;
border-bottom:solid 1px #bbe2e8;
}
/* //access */
#sec-price{
width: 100%;
padding: 100px 0;
}
#sec-price h3{
background-image: url(../images/title_price.png);
width:186px;
height: 37px;
margin: 0 auto 100px auto;
}
#sec-price .inner{
	text-align: left;
	width:900px;
	margin: 0 auto;	
}
#sec-price .inner h5{
font-family: 'Roboto Condensed', sans-serif;
font-size: 1.4em;
font-weight: 700;
margin-bottom: 10px;
}
#sec-price .inner .price-left{
	width:430px;
	float: left;
}
#sec-price .inner .price-right{
	width:430px;
	float: right;
}
#sec-price .inner table{
	width:100%;
	border-top:solid 1px #bbe2e8;
}
#sec-price .inner table.mb{ margin-bottom: 40px; }

#sec-price .inner table th{
font-weight: bold;
width:200px;
padding: 10px 0;
border-bottom:solid 1px #bbe2e8;
}
#sec-price .inner table td{
padding: 10px 0 10px 20px;
border-bottom:solid 1px #bbe2e8;
}
#sec-price .inner ul{ color: #000; }
#sec-price .inner ul li{ margin-bottom: 10px; }
#sec-price .inner ul li:last-child{ margin-bottom: 0px; }
/* //price */

#photo1{
width:100%;
height: auto;
overflow: hidden;
}
#photo1 img{
width:100%;
height: auto;
position: relative;
}

footer{}
#footer{
	color: #000;
	padding: 100px 0 200px 0;
	background-color: #bbe2e8;
}

/* margin */
.nm{ margin:0px !important; }

/* clearfix */
.package:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}
.package { zoom: 100%; }
.package { display: inline-table; }
/* Hides from IE-mac ￥*/
* html .package { height: 1%; }
.package { display: block; }
/* End hide from IE-mac */

/* hide */
.hide{ display:none; }


/* ---------------------------------------------------------------------------------------------------------------------
---------------------------------------------------- Media Queries Smartphone --------------------------------------- */

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

html{ font-size: 75%; }
body {
	font-size: 1rem;
	line-height: 1.6rem;
}

}