@charset "utf-8";


/*header*/
.head_wrap {
	max-width: 1000px;
	width:95%;	
	margin-right: auto;
	margin-left: auto;
	position: relative;
}
h1#logo {
	max-width: 200px;
	width:30%;
	height: auto;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	padding-top:30px;
}
#logo span {
	display: block;

}

#headerBtn {
	position: absolute;
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;	
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	max-width: 276px;
	width:30%;
	top: 0;
	right: 0;
}


#linkbtn ul {
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;	
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;

	padding:20px 0;

	
}

#linkbtn ul li {

margin-left:10px;
font-weight:bold;
	
}

#linkbtn ul li.fb:before {
	margin-right: 6px;
	content: "";
	width: 25px;
	height: 25px;
	display: inline-block;
	background: url(../img/facebook.jpg) no-repeat;
	vertical-align: bottom;
}




#linkbtn ul li.insta:before {
	margin-right: 6px;
	content: "";
	width: 25px;
	height: 25px;
	display: inline-block;
	background: url(../img/insta.jpg) no-repeat;
	vertical-align: bottom;
}






#global-nav ul {
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;	
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	padding:20px 0;
	border-top: 1px solid #000000;
	font-weight:bold;
	
}

/*header下*/
#main_midashi {
	text-align: center;
    background: #2a2828;
    padding: 30px;
    margin: 0 0 20px 0;
}
#sub_midashi {
	text-align: center;
    background: #a2d2da;
    padding: 30px;
    margin: 0 0 20px 0;
}
#sub_midashi01 {
	text-align: center;
	padding: 30px;
	margin: 0 0 20px 0;
	background-color: #f7d6ac;
}
#sub_midashi02 {
	text-align: center;
	padding: 30px;
	margin: 0 0 20px 0;
	background-color: #D8D0CB;
}
#sub_midashi03 {
	text-align: center;
	padding: 30px;
	margin: 0 0 20px 0;
	background-color: #aaa5b1;
}
#sub_midashi04 {
	text-align: center;
	padding: 30px;
	margin: 0 0 20px 0;
	background-color: #ffa9a9;
}
/*各セクション*/
.info,.shop,.map,.concept,.menu,.haircatlog,.staff,.qa {
	max-width: 1000px;
	width:90%;
	height:auto;
	margin-right: auto;
	margin-left: auto;
	padding-top:50px;
}
h2.title {
	border-bottom: 1px solid #696464;
	padding: 10px 0;
	text-align: center;
	margin-bottom: 20px;
	font-size: 1.7rem;
}
.info ul li {

	display:inline;
}


/*readmore*/
.btnReadmore{
	text-align: center;
	margin-top: 20px;
	}
.btnReadmore a{
	color: #ffffff;
	background-color: #2a2828;
	width: 260px;
	display: block;
	text-decoration: none;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-top: 10px;
	padding-bottom: 10px;
	border-radius:0px;
	 
	}
.btnReadmore a:hover{
	background-color: #5a5a5a;
	transition:all .5s;
}

/*電話ボトムボタン*/
.btnTELbottom{
	text-align: center;
	margin-top: 20px;
	font-size:2.0rem;
	
	}
.btnTELbottom a{
	color: #ffffff;
	background-color: #caa759fa;
	max-width: 400px;
	width:90%;
	display: block;
	text-decoration: none;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-top: 10px;
	padding-bottom: 10px;
	 border-radius:0px;
	}

.btnTELbottom a:hover{
	background-color: #d4ad4fc4;
	transition:all .5s;
}
.tel_bottom:before {
  font-family: "Font Awesome 5 Free";
  content: '\f3cd';
  font-weight: 900;
  padding-right : 5px;/*文字との隙間*/
  color: #fff;/*アイコンの色*/
}



/*メインコンテナ*/	
main#con_wrap {
	padding-bottom: 30px;

	background-image: url(../img/servicebk.jpg);
	background-repeat: repeat;
}

/*店舗紹介*/
.shop .l_con {
	width: 35%;
	float:left;

}
.shop .r_con {
	width: 60%;
float:right;

}

.shop .r_con dl dt  {
	display: inline-block;
	width:27%;
	padding-right:10px;
}


.shop .r_con dl dd  {
	display: inline-block;
	
}
.shop .r_con dl {
	margin-bottom: 10px;
	border-bottom: 1px dotted #dfdfdf;
	padding:10px;
	
}

/*グーグルマップレスポンシブ*/
.ggmap {
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;

}
 
.ggmap iframe,
.ggmap object,
.ggmap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


/*コンセプト*/
.concept h3 {
	font-size: 1.8rem;
	padding-bottom:20px;
}
/*メニュ*/
.menu .inner {
    position: relative;
    overflow: hidden;

    padding: 30px 10px 10px 10px;
}

.menu .inner h3 {
    float: left;
    width: 43%;
	padding-left:40px;
}


.menu .inner h3 strong {
    display: block;
    margin: -5px 0 8px;
    font-size: 24px;
    letter-spacing: 0.12em;
    line-height: 1.4;
}

.menu .inner h3 em {
    display: block;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 0.15em;
}

.menu .inner dl {
    float: left;
    width: 57%;
}

/*
.menu .inner dl dt span {
	background-color: #FFF;
}
*/

.menu .inner dl dt {
    clear: both;
    float: left;
    padding-top: 1px;
    font-size: 1.5rem;
    font-weight: bold;
    letter-spacing: 0.15em;
}

.menu .inner dl dd {
    position: relative;
    padding: 0 0 10px 100px;
    text-align: right;
}


.font-sans {
    font-family: futura-pt, sans-serif;
    font-style: normal;
    font-weight: 500;
}
.menu .inner dl dd:after {
	display: block;
    content: '';
    position: absolute;
    top: 8px;
    right: 80px;
    background: -webkit-gradient(linear, left bottom, right bottom, color-stop(0.3, #134E78), color-stop(0.3, #FFFFFF), color-stop(1, #FFFFFF));
    background: linear-gradient(to left, #134E78 30%, #FFFFFF 30%, #FFFFFF 100%) left bottom;
    background-repeat: repeat-x;
    background-size: 6px 1px;
    width: 65%;
    height: 1px;
	z-index: 1;
    /*z-index: -1;*/
    opacity: 0.5;
}

.menu .inner dl p{
	display: inline-block;
    margin: -2px 0 10px;
    padding-left: 8px;
    line-height: 1;
	}
	/*
	.menu .inner dl .font-sans p span {
	background-color: #FFF;
	display:inline-block;
}
*/

/* 3列Boxlist*/
.list {
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-ms-flex-pack: distribute;
	justify-content: space-around;
	
	padding: 0px;
}

.list li {
	list-style: none;
	width: 30%;
	margin: 1px;
	padding: 0px;  
}

.list li.card {
	padding: 5px 5px 50px 5px;
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
  	-webkit-box-direction: normal;
  	-ms-flex-direction: column;
	flex-direction: column;
}
.list .card .thum img{
	max-width:230px;
	width: 100%;
}


.list li.card .thum {
	height: auto;
	/* min-height: 40px; */
	margin: 0px;
	text-align: center;
	padding-bottom:20px;
}


.list li.card .txt_mini {
  font-size: 1.4rem;
  font-weight:bold;
  text-align:center;
  padding-bottom:10px;
}
.list li.card .bottomTxt {
	margin-top: auto;
	min-height: 20px;
	font-family: "Meiryo", "Tahoma", "Verdana", "Arial", "sans-serif";
	text-align: center;
	margin-bottom: 0;
	width:90%;
	margin:0 auto;
		
}
.staffname {
	text-align: center;
	font-size: 1.4rem;
	margin-bottom:10px;
}

/* 3列BoxlistEND*/


/*ヘアカタログflex*/
.listA {
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	-ms-flex-pack: distribute;
	justify-content: space-around;
}
.listA li{
	width:30%;
	padding: 0 0 10px 0;
	}



/*フッター*/
footer {
	background-color: #2a2828;
	width: 100%;

}
#foot_inner {
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;
	max-width:1000px;
	width: 95%;
	margin: 0 auto;
	background-color: #2a2828;
	color:#FFF;
	padding-top: 20px;
}
.footerNav {
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;
	padding-left: 40px;
	width:65%;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
	font-size:1.2rem;
	
}
.footerNav ul {
	padding-right: 40px;
}
.footerLogo {
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #FFF;
	padding-right:50px;
	width:35%;
	
}
#copy {
	max-width: 1000px;
	width: 100%;
	text-align: center;
	color: #FFF;
	margin-top: 0;
	margin-right: auto;
	margin-bottom: 0;
	margin-left: auto;
	padding-top: 10px;
}
#copy p {
	padding-bottom: 20px;
	font-size:1.2rem;
}

footer a:link {
	color: #fff;
}

footer a:visited {
	color: #FFF;
}

footer a:hover {
	color: #666;
}.footerNav ul li {
	padding-bottom: 10px;
}
.page_title {
	color: #FFF;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 3.0rem;
}



/*conceptページ*/
.left_box40 {
	float: left;
	width: 40%;
	padding-right:40px;
}
.right_box60 {
	float: right;
	width: 60%;
}

.left_box60 {
	float: left;
	width: 60%;
	padding-right:40px;
}
.right_box40 {
	float: right;
	width: 40%;
}
.col2_inner {
	margin-bottom: 50px;
}

/*スタッフ紹介ページ*/
dl.dl_2col {
	display:-webkit-box;
  	display:-ms-flexbox;
	display: flex;
}
dl.dl_2col dt {
	width: 35%;
}
dl.dl_2col dd {
	width: 65%;
}


/*qaページ*/

dl.qa_2row {
    padding-bottom: 20px;
}

.qa_2row dt {
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #ACA2A5;
	padding: 5px;
}
.qa_2row dd {
	
	padding:5px;
}
.text_q{
	font-size: 1.6rem;
	font-family: Verdana, Geneva, sans-serif;
	color:#ef5911;
	font-weight: bold;
	}
	.text_a{
	font-size: 1.6rem;
	font-family: Verdana, Geneva, sans-serif;
	color: #0099CC;
	font-weight: bold;
	
	}