@charset "utf-8";

/*----------------------------------------------------------------------------
!pc
------------------------------------------------------------------------------*/
.sp{
	display: none;
}

.pc{
	display: block;
}

/*----------------------------------------------------------------------------
全体
------------------------------------------------------------------------------*/
html{
	font-size: 62.5%; /* 16*0.625=10px */
	background: #531613;
}

body{
	background: #7d0e0b;
	color: #000;
	line-height: 1.7;
}

a{
	text-decoration: underline;
	color: #5a6839;
}

a:hover{
	text-decoration: none;
}

/*
a img:hover{
	opacity:0.70;
	filter: alpha(opacity=70); //ie lt 8
	*zoom: 1;
}
*/

/*----------------------------------------------------------------------------
#container!pc
------------------------------------------------------------------------------*/
#header_inner,#gNavi_inner,#mainImage_inner,#contents{
	width: 980px;
	margin: 0 auto;
	font-size: 14px;
}

/*----------------------------------------------------------------------------
header!pc
------------------------------------------------------------------------------*/
header{
	background: #8d0c09 url("../images/header_bg.jpg") center top no-repeat;
	width: 100%;
	height: 100px;
}

#header_inner{
	position: relative;
}

header img.logo{
	position: absolute;
	left: 0;
	top: 20px;
	width: 243px;
	height: auto;
}

header p.intro{
	position: absolute;
	left: 275px;
	top: 42px;
	color: #fff;
	font-size: 12px;
}

header p.contact{
	position: absolute;
	right: 0;
	top: 14px;
}

/*----------------------------------------------------------------------------
nav!pc
------------------------------------------------------------------------------*/
nav#gNavi,nav#sp_gNavi{
	background: #531613;
	width: 100%;
	border-bottom: 5px solid #bc9a29;
}

nav#gNavi li{
	float: left;
}

/*----------------------------------------------------------------------------
#mainImage!pc
------------------------------------------------------------------------------*/
#mainImage{
	margin-bottom: 20px;
	padding-top: 10px;
}

body.top #mainImage{
	background: url("../images/mainImage_bg.jpg") left top repeat-x;
	height: 389px;
}

body.sub #mainImage{
	background: url("../images/mainImage_bg_sub.jpg") left top repeat-x;
	height: 269px;
}

body.sub #mainImage{
	position: relative;
}

#mainImage p{
	position: absolute;
	letter-spacing: 0.05em;
	left: 10%;
	top: 31%;
	font-size: 29px;
	text-shadow: 1px 1px 2px rgba(255,255,255,1),1px -1px 2px rgba(255,255,255,1),
	-1px 1px 2px rgba(255,255,255,1),-1px -1px 2px rgba(255,255,255,1),
	 1px 1px 2px rgba(255,255,255,1),1px -1px 2px rgba(255,255,255,1),
	-1px 1px 2px rgba(255,255,255,1),-1px -1px 2px rgba(255,255,255,1),
	1px 1px 2px rgba(255,255,255,1),1px -1px 2px rgba(255,255,255,1),
	-1px 1px 2px rgba(255,255,255,1),-1px -1px 2px rgba(255,255,255,1);
	text-align: center;
	line-height: 0.8em;
}

#mainImage p span{
	font-size: 16px;


}

/*----------------------------------------------------------------------------
#contents!pc
------------------------------------------------------------------------------*/
#contents{
	background: #fff;
}

#contents_inner{
	padding: 20px 20px 30px 20px;
}

/*----------------------------------------------------------------------------
#main!pc
------------------------------------------------------------------------------*/
#main{
	float: left;
	width: 690px;
}

#main .post{
	margin-bottom: 20px;
}

#main .post_inner{
	position: relative;
	background: #fff;
	border: 5px solid #f1efe3;
	border-radius: 8px;
	padding: 25px;
	margin-bottom: 20px;
}

#main .banner{
	margin-bottom: 25px;
}

#intro{
	margin-bottom: 5px;
}

/* こんな方におすすめ */
#reccomend{
	clear: both;
	background: url("../images/reccomend_bg.gif") left bottom no-repeat;
	background-size: cover;
	margin-bottom: 20px;
}

#reccomend img{
	width: 690px;
	height: auto;
}

#reccomend_inner{
	padding: 15px 20px;
}

#reccomend ul{
	background: #fff;
	border: 1px solid #dcd2c4;
	padding: 5px 20px 15px 20px;
}

#reccomend li{
	position: relative;
	background: url("../images/dot.gif") left bottom repeat-x;
	padding: 8px 0 8px 25px;
}

#reccomend li:before{
	content: "";
	position: absolute;
	background: url("../images/reccomend_icon.png") no-repeat;
	background-size: 20px 16px;
	width: 20px;
	height: 16px;
	left: 0;
	top: 50%;
	margin-top: -9px;
}

/* 特徴 */
#feature ul.list{
	margin: 10px 0 5px 0;
}

#feature ul.list li{
	float: left;
	margin-right: 9px;
	margin-bottom: 5px;
}

#feature ul.list li:nth-of-type(3n){
	margin-right: 0;
}

ul.moreInfo{
	margin-bottom: 20px;
	text-align: right;
}

ul.moreInfo li{
	display: inline-block;
}

/* ゴール */
img.goal{
	margin-top: 20px;
}

img.goal.campaign{
	margin-top: 90px;
}

/* サロン・スタッフ */
ul.qualification{
	margin-bottom: 20px;
	padding-top: 50px;
}

.salonPic{
	margin-bottom: 20px;
}

.salonPic img:nth-of-type(1){
	float: left;
	margin-right: 10px;
}

/* ギャラリー */
ul.gallery li{
	float: left;
	margin-right: 15px;
	margin-bottom: 15px;
}

ul.gallery li:nth-of-type(3n){
	margin-right: 0;
}

/*大見出し
----------------------------------------*/
#main h2,#side h3{
	position: relative;
	background: #531613;
	color: #fff;
	font-size: 15px;
	font-weight: normal;
	margin-bottom: 15px;
	letter-spacing: 0.05em;
	line-height: 1.6em;
	padding: 7px 10px 5px 35px;
	border: 1px solid #fff;
	box-shadow: 1px 1px 2px rgba(13,4,9,0.34);
}

#main h2:before,#side h3:before{
	content: "";
	position: absolute;
	background: url("../images/h2_icon.png") no-repeat;
	background-size: 21px 21px;
	width: 21px;
	height: 21px;
	left: 10px;
	top: 50%;
	margin-top: -9px;
}

/*中見出し
----------------------------------------*/


/*小見出し
----------------------------------------*/
#main h3{
	border-left: 5px solid #775b0f;
	line-height: 1.4em;
	color: #775b0f;
	padding-top: 2px;
	padding-left: 10px;
	font-size: 16px;
	margin-bottom: 15px;
}

/*文章
----------------------------------------*/
#main p{
	line-height: 1.7em;
	letter-spacing: 0.05em;
	text-align: justify;
}

/*写真
----------------------------------------*/
.fl{
	float: left;
	margin-right: 15px;
	margin-bottom: 15px;
}

.fr{
	float: right;
	margin-left: 20px;
	margin-bottom: 15px;
}

/*メニュー
----------------------------------------*/
table.menu{
	margin-bottom: 35px;
}

table.menu.last{
	margin-bottom: 0;
}

table.menu tr{
	border-top: 1px solid #d0d0d0;
	border-bottom: 1px solid #d0d0d0;
	background: #f8f8f8;
}

table.menu tr:nth-child(even){
	background: #fff;
}

table.menu th{
	text-align: left;
	padding: 10px;
	font-weight: bold;
}

table.menu td{
	text-align: right;
	padding: 12px;
}

table.menu span.comment{
	display: block;
	font-weight: normal;
	font-size: 12px;
	padding-top: 12px;
}

/*サロン情報
----------------------------------------*/
table.menu.info{
	margin-bottom: 20px;
}

table.menu.info th{
	width: 30%;
	vertical-align: middle;
}

table.menu.info td{
	text-align: left;
}

/*メールフォーム
----------------------------------------*/
input[type="text"],textarea{
	width: 100%;
	box-sizing: border-box;
}

table.menu.info td.submit{
	text-align: right;
}

/*テーブル
----------------------------------------*/
table{
	width: 100%;
	margin-bottom: 20px;
}

table.table{
	width: 100%;
	background: #b1b1b1;
	border-spacing: 1px;
	margin-bottom: 20px;
	border: 2px solid #7cb5da;
}

table.table th,table.table td{
	padding: 15px;
	min-width: 80px;
	border: 1px solid #7cb5da;
}

table.table th{
	background: #edf7fd;
	vertical-align: middle;
}

table.table td{
	background: #fff;
}

/*枠
----------------------------------------*/
#main .frame{
	background: -webkit-linear-gradient(top,#fafff0 0%,#fff 100%);
	background: linear-gradient(to bottom,#fafff0 0%,#fff 100%);
	border: 2px solid #b8cd8a;
	border-radius: 8px;
	padding: 15px;
	margin-bottom: 5px;
}

#main ul.frame{
	margin: 10px 0 15px;
}

#main ul.frame li{
	line-height: 1.8em;
}

/*カテゴリ
----------------------------------------*/
h2 a{
	color: #fff;
	text-decoration: none;
}

h2 a:hover{
	opacity: 0.8;
}

/*ページャー
----------------------------------------*/
ul.pager{
	overflow: hidden;
	zoom: 1;
	margin-bottom: 10px;
	text-align: right;
}

ul.pager li{
	display: inline-block;
	zoom: 1;
	margin-left: 5px;
}

ul.pager li a,ul.pager li span{
	padding: 5px 10px;
	border: 1px solid #a1a1a1;
	background: #fff;
	display: block;
}

ul.pager li span{
	background: #9e2616;
	border-color: #7e1c0e;
	color: #fff;
}

/*----------------------------------------------------------------------------
#side!pc
------------------------------------------------------------------------------*/
#side{
	float: right;
	width: 230px;
}

/*
ローカルナビ
------------------------------------------------------------------------------*/
.localNavi{
	margin-bottom: 20px;
}

.localNavi li{
	background: -webkit-linear-gradient(top,#fff 0%,#f9f3de 100%);
	background: linear-gradient(to bottom,#fff 0%,#f9f3de 100%);
	border: 1px solid #b49325;
	box-shadow: 0 0 0 1px rgba(255,255,255,1) inset;
	margin-bottom: 10px;
}

.localNavi li a{
	position: relative;
	text-decoration: none;
	color: #8a4e00;
	display: block;
	padding: 7px 18px 6px 15px;
}

.localNavi li a:before{
	content: "";
	position: absolute;
	background: url("../images/localNavi_arrow.png") no-repeat;
	background-size: 8px 9px;
	width: 8px;
	height: 9px;
	right: 10px;
	top: 50%;
	margin-top: -4px;
}

/* 外部サイト */
.localNavi.link{
	margin-bottom: 12px;
}

.localNavi.link li a{
	font-size: 13px;
}

/* アクセス */
#side #map{
	margin-bottom: 20px;
	text-align: right;
	font-size: 11px;
}

#side #map img{
	width: 230px;
	height: auto;
	margin-bottom: 2px;
}

/* バナー */
nav#banner{
	margin-bottom: 20px;
}

/*----------------------------------------------------------------------------
footer!pc
------------------------------------------------------------------------------*/
footer{
	background: #531613;
	border-top: 5px solid #bc9a29;
	padding-top: 40px;
	padding-bottom: 50px;
	color: #fff;
	text-align: center;
	font-size: 12px;
}

/*--------------------------------------
PageTop
----------------------------------------*/
p.pageTop{
	position: fixed;
	right: 20px;
	bottom: 20px;
}

/*---------------------------------------
clearfix
----------------------------------------*/
.cf:after{
	content: "";
	display: block;
	clear: both;
}

.cf{
	*zoom: 1;
}

/*---------------------------------------
その他
----------------------------------------*/
.o_h{
	overflow: hidden;
}

.floatClear{
	clear: both;
}

/*----------------------------------------------------------------------------
!sp
------------------------------------------------------------------------------*/
@media screen and (max-width: 768px){

.sp{
display: block;
}

.pc{
display: none;
}

/*----------------------------------------------------------------------------
全体
------------------------------------------------------------------------------*/
img{
	max-width: 100%;
	height: auto;
}

/*----------------------------------------------------------------------------
header!sp
------------------------------------------------------------------------------*/
header{
	height: auto;
	position: relative;
}

header img.logo{
	position: relative;
	left: 0;
	top: 0;
	width: 180px;
	height: auto;
	margin: 9px 0 11px 0;
}

/*電話ボタン
----------------------------------------*/
header ul.btn{
	position: absolute;
	top: 10px;
	right: 0;
}

header ul.btn li a{
		background: -webkit-linear-gradient(top,#fbf6e5 0%,#eee2b1 100%);
		background: linear-gradient(to bottom,#fbf6e5 0%,#eee2b1 100%);
		color: #531613;
		padding: 4px 7px;
		border-radius: 4px;
		font-size: 26px;
		text-decoration: none;
		border: 3px solid #faf5e2;
		box-shadow: 0 0 0 1px rgba(188,154,41,1) inset;
}

.sp_btn span{

}

/*----------------------------------------------------------------------------
#container!sp
------------------------------------------------------------------------------*/
#header_inner,#mainImage_inner,#contents{
	width: 96%;
	font-size: 14px;
}
/*----------------------------------------------------------------------------
#mainImage!sp
------------------------------------------------------------------------------*/
#mainImage{
	border-bottom: 5px solid #bc9a29;
	margin-bottom: 10px;
	padding-top: 8px;
}

body.top #mainImage,body.sub #mainImage{
	height: auto;
}

/*----------------------------------------------------------------------------
#sp_gNavi!sp
------------------------------------------------------------------------------*/
#sp_gNavi{
	padding: 0;
}

#sp_gNavi li.sp_menu{
	color: #fff;
	width: 96%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	padding: 10px 0;
	font-size: 14px;
	cursor: pointer;
}

#sp_gNavi li.sp_menu:before{
	content: "\f0c9";
	font-family: FontAwesome;
	margin-right: 5px;
}

#sp_gNavi ul ul{
	display: none;
	box-shadow: 0 0 1px rgba(0,0,0,0.5);
}

#sp_gNavi ul ul li:first-child a{
	border-top: 1px solid #531613; /* スマホでタップ時1pxの白ライン非表示対策 */
}

#sp_gNavi ul ul li a{
	background: #fff;
	position: relative;
	display: block;
	font-weight: normal;
	color: #000;
	text-align: left;
	font-size: 13px;
	padding: 13px 5px 10px 10px;
	text-decoration: none;
	border-bottom: 1px solid #dddddd;
	font-weight: normal;

}

#sp_gNavi ul ul li a:after{
	font-size: 5px;
	content: "\f054";
	font-family: FontAwesome;
	position: absolute;
	right: 0;
	margin-top: 2px;
	margin-right: 10px;
}


/*----------------------------------------------------------------------------
#contents!sp
------------------------------------------------------------------------------*/
#contents_inner{
	padding: 10px;
}



/*----------------------------------------------------------------------------
#main!sp
------------------------------------------------------------------------------*/
#main{
	float: none;
	width: auto;
}

#main .post{
	margin-bottom: 15px;
}

#main .post_inner{
	border-color: #efede0;
	padding: 15px 10px;
}

/* こんな方におすすめ */
#reccomend img{
	width: auto;
}

/* 特徴 */
#feature ul.list li{
	width: 48%;
}

#feature ul.list li img{
	width: 100%;
}

#feature ul.list li:nth-of-type(odd){
	margin-right: 2%;
}

#feature ul.list li:nth-of-type(2n){
	margin-right: 0;
}

/* ゴール */
img.goal{
	margin-top: 10px;
	margin-bottom: 10px;
}

img.goal.campaign{
	margin-top: 20px;
}

/* サロン・スタッフ */
ul.qualification{
	margin-bottom: 20px;
	padding-top: 10px;
}

.salonPic img:nth-of-type(1){
	float: none;
	margin-bottom: 10px;
}

/* ギャラリー */
ul.gallery li{
	float: none;
	margin-right: 0;
	text-align: center;
}


/*大見出し
----------------------------------------*/
#main h2{
	line-height: 1.4em;
	margin-bottom: 10px;
	padding: 7px 5px 5px 30px;
}

#main h2:before,#side h3:before{
	left: 7px;
}

/*中見出し
----------------------------------------*/



/*小見出し
----------------------------------------*/


/*文章
----------------------------------------*/
#main p{
	line-height: 1.6em;
}

/*写真
----------------------------------------*/
#main .fr,#main .fl{
	float: none;
	margin-bottom: 10px;
	display: block;
	margin-right: auto;
	margin-left: auto;
}

/*テーブル
----------------------------------------*/

/*----------------------------------------------------------------------------
#side!sp
------------------------------------------------------------------------------*/
#side{
	float: none;
	width: auto;
	margin-bottom: 15px;
}

#side nav li img{
	display: block;
	margin: 0 auto;
}

#side #map img{
	width: 100%;
}

/*
ローカルナビ
------------------------------------------------------------------------------*/


/*----------------------------------------------------------------------------
footer!sp
------------------------------------------------------------------------------*/
footer{
	padding-top: 25px;
	padding-bottom: 30px;
}

/*--------------------------------------
テーブル
----------------------------------------*/


}

/*--------------------------------------
文字サイズ
----------------------------------------*/
.f10{font-size: 10px; font-size: 1rem;}
.f12{font-size: 12px; font-size: 1.2rem;}
.f14{font-size: 14px; font-size: 1.4rem;}
.f16{font-size: 16px; font-size: 1.6rem;}
.f18{font-size: 18px; font-size: 1.8rem;}
.f20{font-size: 20px; font-size: 2rem;}
.f22{font-size: 22px; font-size: 2.2rem;}
.f24{font-size: 24px; font-size: 2.4rem;}
.f26{font-size: 26px; font-size: 2.6rem;}
.f28{font-size: 28px; font-size: 2.8rem;}
.f30{font-size: 30px; font-size: 3rem;}
.f32{font-size: 32px; font-size: 3.2rem;}
.f34{font-size: 34px; font-size: 3.4rem;}
.f36{font-size: 36px; font-size: 3.6rem;}
.f38{font-size: 38px; font-size: 3.8rem;}
.f40{font-size: 40px; font-size: 4rem;}
.f42{font-size: 42px; font-size: 4.2rem;}
.f44{font-size: 44px; font-size: 4.4rem;}
.f46{font-size: 46px; font-size: 4.6rem;}
.f48{font-size: 48px; font-size: 4.8rem;}
.f50{font-size: 50px; font-size: 5rem;}
.f52{font-size: 52px; font-size: 5.2rem;}
.f54{font-size: 54px; font-size: 5.4rem;}
.f56{font-size: 56px; font-size: 5.6rem;}

/*--------------------------------------
文字色
----------------------------------------*/
.black{color: #000;}
.red{color: #ff4f42;}
.orange{color: #ff721d;}
.green{color: #59771a;}
.blue{color: #1c92dc;}
.purple{color: #8d1dff;}
.white{color: #fff;}

/*--------------------------------------
文字太さ
----------------------------------------*/
.bold{font-weight: bold;}

/*--------------------------------------
文字揃え
----------------------------------------*/
.t_l{text-align: left;}
.t_r{text-align: right;}
.t_c{text-align: center;}

/*--------------------------------------
余白
----------------------------------------*/
.m_t0{margin-top: 0;}
.m_t5{margin-top: 5px;}
.m_t10{margin-top: 10px;}
.m_t15{margin-top: 15px;}
.m_t20{margin-top: 20px;}
.m_t25{margin-top: 25px;}
.m_t30{margin-top: 30px;}
.m_t35{margin-top: 35px;}
.m_t40{margin-top: 40px;}
.m_t45{margin-top: 45px;}
.m_t50{margin-top: 50px;}
.m_r0{margin-right: 0;}
.m_r5{margin-right: 5px;}
.m_r10{margin-right: 10px;}
.m_r15{margin-right: 15px;}
.m_r20{margin-right: 20px;}
.m_r25{margin-right: 25px;}
.m_r30{margin-right: 30px;}
.m_r35{margin-right: 35px;}
.m_r40{margin-right: 40px;}
.m_r45{margin-right: 45px;}
.m_r50{margin-right: 50px;}
.m_b0{margin-bottom: 0;}
.m_b5{margin-bottom: 5px;}
.m_b10{margin-bottom: 10px;}
.m_b15{margin-bottom: 15px;}
.m_b20{margin-bottom: 20px;}
.m_b25{margin-bottom: 25px;}
.m_b30{margin-bottom: 30px;}
.m_b35{margin-bottom: 35px;}
.m_b40{margin-bottom: 40px;}
.m_b45{margin-bottom: 45px;}
.m_b50{margin-bottom: 50px;}
.m_l0{margin-left: 0;}
.m_l5{margin-left: 5px;}
.m_l10{margin-left: 10px;}
.m_l15{margin-left: 15px;}
.m_l20{margin-left: 20px;}
.m_l25{margin-left: 25px;}
.m_l30{margin-left: 30px;}
.m_l35{margin-left: 35px;}
.m_l40{margin-left: 40px;}
.m_l45{margin-left: 45px;}
.m_l50{margin-left: 50px;}
.m_t-10{margin-top: -10px;}
.m_t-20{margin-top: -20px;}
.m_t-30{margin-top: -30px;}
.p_t0{padding-top: 0;}
.p_t5{padding-top: 5px;}
.p_t10{padding-top: 10px;}
.p_t15{padding-top: 15px;}
.p_t20{padding-top: 20px;}
.p_t25{padding-top: 25px;}
.p_t30{padding-top: 30px;}
.p_t35{padding-top: 35px;}
.p_t40{padding-top: 40px;}
.p_t45{padding-top: 45px;}
.p_t50{padding-top: 50px;}
.p_r0{padding-right: 0;}
.p_r5{padding-right: 5px;}
.p_r10{padding-right: 10px;}
.p_r15{padding-right: 15px;}
.p_r20{padding-right: 20px;}
.p_r25{padding-right: 25px;}
.p_r30{padding-right: 30px;}
.p_r35{padding-right: 35px;}
.p_r40{padding-right: 40px;}
.p_r45{padding-right: 45px;}
.p_r50{padding-right: 50px;}
.p_b0{padding-bottom: 0;}
.p_b5{padding-bottom: 5px;}
.p_b10{padding-bottom: 10px;}
.p_b15{padding-bottom: 15px;}
.p_b20{padding-bottom: 20px;}
.p_b25{padding-bottom: 25px;}
.p_b30{padding-bottom: 30px;}
.p_b35{padding-bottom: 35px;}
.p_b40{padding-bottom: 40px;}
.p_b45{padding-bottom: 45px;}
.p_b50{padding-bottom: 50px;}
.p_l0{padding-left: 0;}
.p_l5{padding-left: 5px;}
.p_l10{padding-left: 10px;}
.p_l15{padding-left: 15px;}
.p_l20{padding-left: 20px;}
.p_l25{padding-left: 25px;}
.p_l30{padding-left: 30px;}
.p_l35{padding-left: 35px;}
.p_l40{padding-left: 40px;}
.p_l45{padding-left: 45px;}
.p_l50{padding-left: 50px;}