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

/* 共通 
******************************************************* */
html,body{
height: 100%;
}
body{
margin:0;
padding:0;
-webkit-text-size-adjust: 100%;
font-family: 'Montserrat', "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
font-size: 12px;
line-height: 1.5;
position: relative;
}

ul,li,dl,dt,dd{margin:0px; padding:0px;}
li{list-style: none;}

img{border:0px;}

.clear {clear: both;}

.clearfix:after {
  content: ".";  /* 新しい要素を作る */
  display: block;  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}
.clearfix {
  min-height: 1px;
}
* html .clearfix {
  height: 1px;
  /*\*//*/
  height: auto;
  overflow: hidden;
  /**/
}

a{text-decoration: none;}
a:hover{text-decoration: underline;}

a:hover .hover{
opacity:0.8;
filter:alpha(opacity=80);
-ms-filter: "alpha( opacity=80 )";
}

h1,h2,h3,h4,h5,h6{
margin:0px;
padding:0px;
line-height:1.0;
font-weight: normal;
}


.pd5{padding-top:5px;}
.pd10{padding-top:10px;}
.pd15{padding-top:15px;}
.pd20{padding-top:20px;}
.pd30{padding-top:30px;}
.pd40{padding-top:40px;}

.center{text-align:center;}

.float_l{float:left;}
.float_r{float:right;}







/* ヘッダー
******************************************************* */
#header{
	width: 100%;
	height: 60px;
	background: url(../img/head_bg.png);
	overflow: hidden;
	position: fixed;
	top: 0;
	z-index: 99;
	}
	#header h1{float: left; padding: 13px 0 0 20px;}
	#header #social{float: right; overflow: hidden; padding: 21px 5px 0 0;}
	#header #social a{display: block; float: left; margin-right: 15px;}
	
#menu{
	width: 100%;
	height: 40px;
	line-height: 40px;
	background: url(../img/menu_bg.png);
	color: #555;
	position: absolute;
	z-index: 98;
	overflow: hidden;
	}
.sticky #menu {
	position:fixed;
	top:60px;
	bottom: auto;
	left:0;
}
	#menu ul{position: relative; left: 50%; float: left;}
	#menu ul li{float: left; position: relative; left: -50%;}
	#menu ul li a{color: #555; border-right: 1px solid #555; padding: 0 30px;}
	#menu ul li:last-child a{color: #555; border-right: none;}

/*スマフォ*/
@media screen and (max-width: 640px) {
	#menu ul li a{padding: 0 5px; font-size: 80%;}
}

/* 共通
******************************************************* */
.icon{text-align: center; padding: 80px 0 0; clear: both;}
.contents{width: 100%; max-width: 900px; margin: auto; z-index: 1;}
.contents h2{text-align: center; font-size: 17px; font-weight: normal; padding: 140px 0 50px;}
.contents p{margin: 0;}
#totop{position: fixed; bottom:60px; right:20px; z-index: 99; opacity: 0.3; display:none;}
#totop:hover{opacity: 1.0;}

/* コンテンツ 
******************************************************* */
#main{
	width: 100%;
	position: relative; 
	background-repeat:no-repeat;
	-moz-background-size:cover;
	background-size:cover;
	background-position: center;
	z-index: 0;
	}
	#main img#top_logo{position: absolute; top: 50%; left: 50%; margin: -125px 0 0 -120px;}

/*スマフォ*/
@media screen and (max-width: 640px) {
	#main img#top_logo{width: 100px; margin: -48px 0 0 -50px;}
}


#about{}
#about2{ margin-top: 50px;}

#about_slide{position: relative;}
#about_slide .prev,
#about_slide .next{position: absolute; top: 50%; margin-top: -25px; z-index: 50;}
#about_slide .prev{left:10px;}
#about_slide .next{right:10px;}
.rslides {
	  position: relative;
	  list-style: none;
	  overflow: hidden;
	  width: 100%;
	  max-height: 422px;
	  padding: 0;
	  margin: 0;
	  }
	
	.rslides li {
	  -webkit-backface-visibility: hidden;
	  position: absolute;
	  display: none;
	  width: 100%;
	  max-height: 422px;
	  left: 0;
	  top: 0;  
	  background-repeat:no-repeat;
	  -moz-background-size:cover;
	  background-size:cover;
	  background-position: center;
	  }
	
	.rslides li:first-child {
	  position: relative;
	  display: block;
	  float: left;
	  }
	
	.rslides img {
	  display: block;
	  height: auto;
	  float: left;
	  width: 100%;
	  border: 0;
	  }

#trimming{}
	#trimming p{margin-bottom: 30px;}
	/*
	#trimming #price{width: 100%; max-width: 900px; margin: auto;}
	#trimming #price img{width: 100%;}
	*/
	#trimming h3{background: #555; color: #fff; padding: 5px 10px; margin: auto;}
	
	#trimming #trimming_price{color: #555;}
		#trimming #trimming_price table{width: 100%; font-size: 12px !important;border-collapse:collapse; border-spacing:0;}
		#trimming #trimming_price table tr:nth-child(even) td{background: #efefef;}
		#trimming #trimming_price table th,
		#trimming #trimming_price table td{padding: 10px;}
		#trimming #trimming_price table th span{font-size: 8px !important; font-weight: normal;}
		#trimming #trimming_price table td{}
		#trimming #trimming_price table td.name{}
		#trimming #trimming_price table td.shampoo{width: 20%; text-align: center;}
		#trimming #trimming_price table td.trimming{width: 20%; text-align: center;}
		#trimming #trimming_price table td.bd{width: 1%; padding: auto 10px; background: url(../img/bd_h.jpg) repeat-y center !important;}
	#trimming #trimming_price p{margin-top: 25px;}
		
	#trimming #point_cut{width: 60%; float: left; color: #555;}
		#trimming #point_cut table{width: 100%; font-size: 12px !important;border-collapse:collapse; border-spacing:0;}
		#trimming #point_cut table tr:nth-child(even) td{background: #efefef;}
		#trimming #point_cut table td{padding: 10px;}
		#trimming #point_cut table td{}
		#trimming #point_cut table td.point{}
		#trimming #point_cut table td.price{width: 20%; text-align: center;}
		#trimming #point_cut table td.bd{width: 1%; padding: auto 10px; background: url(../img/bd_h.jpg) repeat-y center !important;}
	
	#trimming #caution{width: 38%; float: right; color: #555;}
		#trimming #caution li{list-style: disc; margin: 15px 0 0 2em;}


/*スマフォ*/
@media screen and (max-width: 640px) {
	#trimming #point_cut{width: 100%; float: none;}
	#trimming #caution{width: 100%; float: none;}
}
	

#gallery{overflow: hidden;}
	#gallery ul{overflow: hidden;}
	#gallery ul li{width: 23.5%; padding:0 2% 2% 0; float: left; text-align: center;}
	#gallery ul li:nth-child(4n){padding: 0;}
	#gallery ul li img{width: 100%;}
	
#staff{overflow: hidden;}
	#staff ul{overflow: hidden;}
	#staff ul li{width: 32%; padding: 0 2% 0 0; float: left;}
	#staff ul li:nth-child(3n){padding: 0;}
	#staff ul li img{width: 100%;}
	#staff ul li p{margin: 10px 0;}
	#staff ul li h3{font-size: 17px; font-weight: bold; color: #008AA0; margin-bottom: 10px;}
	#staff ul li h4{font-size: 15px;}

/*スマフォ*/
@media screen and (max-width: 640px) {
	#staff ul li{width: 100%; padding: 0 0 20px 0; float: none;}
	#staff ul li .ph{text-align: center;}
	#staff ul li .ph img{width: 50%;}
	#staff ul li h3,
	#staff ul li h4,
	#staff ul li p.job{text-align: center;}
}
	
#merchandise{overflow: hidden;}
	#merchandise p{margin-bottom: 30px;}
	#merchandise ul{overflow: hidden;}
	#merchandise ul li{width: 23.5%; padding:0 2% 2% 0; float: left; text-align: center;}
	#merchandise ul li:nth-child(4n){padding: 0;}
	#merchandise ul li img{width: 100%;}

#access{text-align: center; color: #555;}
	#access p{margin: 15px 0;}
	#access p span{font-size: 21px;}
	#access a{color: #555;}
	#access #menkyo{margin-top: 50px; font-size: 10px;}
	
/* フッター
******************************************************* */
#footer{
	text-align: center;
	background: #008AA0;
	color: #fff;
	line-height: 50px;
	margin-top: 120px;
	}