/* Base Color */

.bg_light {
	background: #fff;
	color: #333;
}

.bg_dark {
background: #fff;
}

/* Main */

#mc {
	width: 960px;
	padding: 50px 0;
	text-align: center;
}

#mc p {
  font-family: 'Noto Serif JP';
	margin: 40px 0;
	color: #333;
	font-size: 16px;
	line-height: 50px;
	letter-spacing: 0.1em;
}

/* Shop Info */


.logo_center {
  width: 100%;
  padding: 0;
  text-align: center;
}

.shop_info {
  width: 480px;
  margin: 0 auto 50px;
}

#col_01 {
  font-family: 'Noto Sans JP';
	float: left;
	width: 960px;
	padding: 0 0 20px;
	text-align: center;
}

#col_01 h3 {
	font-size: 15px;
	font-weight: bold;
	padding: 0;
	margin: 0;
}

#col_01 p {
	font-size: 13px;
	margin: 5px 0 30px;
}

#col_01 .cap {
	font-size: 11px;
  line-height: 20px;
	margin: 0;
}

#col_01 .cap_map {
	font-size: 12px;
  line-height: 20px;
  padding: 20px 0;
	margin: 0;
}

#col_01 .tel {
	font-family: 'PT Sans Narrow', sans-serif;
	font-size: 50px;
 line-height: 60px;
}

.tel a {
  color: #fff !important;
  text-decoration: none;
}

/* Staff */

#col_staff {
  font-family: 'Noto Sans JP';
	width: 940px;
  padding: 60px 0 40px 20px;
  overflow: auto;
}

.stb {
	float: left;
	width: 180px;
	height: 330px;
	margin: 0 0 0 40px;
  font-size: 13px;
  color: #333;
  text-align: center;
}

.stb .pos {
	margin: 10px 0 0 0;
	font-size: 10px;
}

.iwp {
  width: 180px;
  height: 250px;
  overflow: hidden;
}

.iwp img {
  display: block;
  transition-duration: 0.3s;
}

.iwp img:hover {
  transform: scale(1.05);
  transition-duration: 0.3s;
}


/* Salon Inside Image */
.salonImg {
  width: 960px;
  padding: 50px 0;
  text-align: center;
}


/* Menu */

#col_menu {
  font-family: 'Noto Sans JP';
	width: 960px;
  padding: 0 0 80px;
  overflow: auto;
}

.notes {
  width: 370px;
  padding: 12px;
  color: #d0b09a;
  font-size: 11px;
  font-weight: 400;
  line-height: 18px;
  background: #FFF;
  border-radius: 4px;
}

.menu_hb {
  width: 390px;
  float: left;
  margin: 0 0 0 60px;
}

.menu_hb h3 {
  display: block;
  font-family: 'PT Sans Narrow', sans-serif;
	font-size: 30px;
  font-weight: 200;
  margin: 80px 0 30px;
}

.menu_hb table {
  width: 100%;
  color: #FFF;
  text-align: left;
  font-size: 13px;
  margin-bottom: 30px;
}

.menu_hb table tr {
  padding: 100px 0;
}

.menu_hb table td {
  font-size: 14px;
	font-weight: bold;
  padding-bottom: 5px;
}

.menu_hb table td p {
  font-size: 11px;
	font-weight: 400;
}

.menu_hb table .menu_caption {
	font-size: 11px;
  font-weight: normal;
}

.menu_hb table .price {
  font-size: 13px;
  text-align: right;
}

.reqTime {
	font-weight: 600;
    color: #d0b09a;
    font-size: 10px;
    padding: 3px 10px 3px;
    margin-left: 8px;
    background: #FFF;
    border-radius: 30px;
}

/* footer */
#col_footer {
	width: 960px;
  padding: 40px 0;
  text-align: center;
  overflow: auto;
}

/* BUTTON 1 */

.btn-1 {
	color: #FFF;
	background-color: #333;
	border: 2px solid #333;
	display: inline-block;
	width: 200px;
	height:60px;
	text-decoration: none;
	text-align: center;
	font-size: 16px;
	line-height: 60px;
	font-weight: bold;
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.btn-1:after{
	background : #FFF;
	width: 100%;
	height: 0;
	content:"";
	position: absolute;
	top: 50%;
	left: 50%;
	opacity: 0;
	transform: translateX(-50%) translateY(-50%) rotate(45deg);
	transition: .2s;
	z-index: -1;
}

.btn-1:hover{
	color: #333;
}

.btn-1:hover:after{
	height: 280%;
	opacity: 1;
}

.btn-1:active:after{
	height: 340%;
	opacity: 1;
}


.btn-lola {
	margin: 30px 0;
	color: #333 !important;
	background-color: #333;
	border: 2px solid #333;
	display: inline-block;
	width: 200px;
	height:60px;
	text-decoration: none;
	text-align: center;
	font-size: 16px;
	line-height: 60px;
	font-weight: 600;
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.btn-lola:after{
	background : #FFF;
	width: 100%;
	content:"";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%) rotate(45deg);
	transition: .2s;
	z-index: -1;
	height: 290%;
	opacity: 1;
}

.btn-lola:hover{
	color: #FFF !important;
}

.btn-lola:hover:after{
	height: 0;
	opacity: -1;
}

.btn-lola:active:after{
	height: 340%;
	opacity: 1;
}


.btn-laf {
	margin: 30px 0;
	color: #fff !important;
	background-color: #fff;
	border: 2px solid #fff;
	display: inline-block;
	width: 200px;
	height:60px;
	text-decoration: none;
	text-align: center;
	font-size: 16px;
	line-height: 60px;
	font-weight: bold;
	position: relative;
	overflow: hidden;
	z-index: 1;
}

.btn-laf:after{
	background : #d0b09a;
	width: 100%;
	content:"";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateX(-50%) translateY(-50%) rotate(45deg);
	transition: .2s;
	z-index: -1;
	height: 290%;
	opacity: 1;
}

.btn-laf:hover{
	color: #d0b09a !important;
}

.btn-laf:hover:after{
	height: 0;
	opacity: -1;
}

.btn-laf:active:after{
	height: 340%;
	opacity: 1;
}