@charset "UTF-8";

@media screen and (max-width: 1024px) {/*PC・タブレット横対応*/
}
@media screen and (max-width: 768px) {/*タブレット縦対応*/
}
@media screen and (max-width: 480px) {
}




/*------------- _override ----------------*/
.header{
	position:relative;
}
#header{
	height: 110px;
}
#mainImage{
	margin: 96px auto 0;
	margin: 102px auto 0;
}
.contents{/*コンテンツ*/
	padding-top: 91px;
	padding-top: 101px;
}
@media screen and (max-width: 768px) {
.contents{/*コンテンツ*/
	padding-top: 91px;
}
}
.contents.salonIndex{/*コンテンツ:サロンTOPのみ*/
	padding-top: 0px;
}


@media screen and (max-width: 1024px) {
#header{
	display: none;
	height: 80px;
}
.contents.salonIndex{/*コンテンツ:サロンTOPのみ*/
	padding-top: 94px;
}
#logo{
	margin: 0px auto 0;
	padding-top: 20px;
}
.toggle {
	display: none;
}
#mainImage{
	margin: 0 auto 0;
}
}
@media screen and (max-width: 480px) {
#mainImage img{
	height: 400px;
	object-fit: cover;
}
}



/*----------------------------------------------------

　　サロンページ

-------------------------------------------------------*/

/*------------- salonheader ----------------*/
.salonHeader{
	position: absolute;
	justify-content: space-between;
	width: 100%;
	z-index:99;
	margin: 0;
	padding: 0;
	background-image: url(../images/salon/bg_header_sln.jpg);
	background-image: url(../images/common/bg_header_cmn.png);
	background-repeat: repeat;
	color: #000000;
}
.salonHeader.fixed{
	position: fixed;
	top: 0;
}
#salonHeader{
	position:relative;
	z-index:99;
    max-width:1356px;/*1366px*/
    margin:0 auto;
	padding: 0px;
}
.salonHeaderIn{
	position:relative;
	z-index:99;
	border: 1px solid #CCCCCC;
    margin: 5px;
	padding: 0;
}
.salonHeaderIn.brighton-hotel{background-color: #004263;}/*ブライトンホテル*/
.salonHeaderIn.aeon-shinurayasu{background-color: #0096A9;}/*イオン新浦安店*/
.salonHeaderIn.tsukiji{background-color: #00657E;}/*築地店*/
.salonHeaderIn.thefirst_ginza{background-color: #0D3246;}/*ザ ファースト 銀座店<*/
.salonHeaderIn.kitsilano-vancouver{background-color: #B2243C;}/*バンクーバー キツラノ店<*/
.salonHeaderIn.gran_hiroo{background-color: #064583;}/*グラン広尾店<*/
.salonHeaderIn.tamachi{background-color: #223B80;}/*田町店*/


@media screen and (max-width: 1024px) {
#salonHeader{
}
}

#salonHname{/*店名*/
	float: left;
	position: relative;
	z-index: 99;
	margin: 0;
	padding: 0;
	width:300px;
	width:280px;/*Instagramアイコン追加のため20px狭くする*/
}
	#salonHname h1{}
	#salonHname h1 a{
		display: block;
		position: relative;
		z-index: 99;
		margin: 0;
		padding: 30px 25px 30px 90px;
		padding: 36px 15px 31px 80px;/*Instagramアイコン追加のため20px狭くする*/
		font-size: 15px;
		background-repeat: no-repeat;
		background-size: 40px;
		background-position: 25px 25px;
		color: #FFFFFF;
	}
	#salonHname h1 a.tsukiji{
		padding: 36px 15px 31px 120px;/*築地店　は右の空白が大きすぎる*/
	}
	#salonHname h1 a.brighton-hotel{background-image: url(../images/salon/mark_h_brighton_wh.png);}/*ブライトンホテル*/
	#salonHname h1 a.aeon-shinurayasu{background-image: url(../images/salon/mark_h_aeon_wh.png);}/*イオン新浦安店*/
	#salonHname h1 a.tsukiji{background-image: url(../images/salon/mark_h_tsukiji_wh.png);}/*築地店*/
	#salonHname h1 a.thefirst_ginza{background-image: url(../images/salon/mark_h_thefirst_ginza_wh.png);}/*ザ ファースト 銀座店*/
	#salonHname h1 a.kitsilano-vancouver{background-image: url(../images/salon/mark_h_kitsilano-vancouver_wh.png);}/*バンクーバー キツラノ店*/
	#salonHname h1 a.gran_hiroo{background-image: url(../images/salon/mark_h_gran_hiroo_wh.png);}/*グラン広尾店*/
	#salonHname h1 a.tamachi{background-image: url(../images/salon/mark_h_tamachi_wh.png);}/*田町店*/
	#salonHname h1 a:hover{
		text-decoration: none;
		opacity: 1.0;
		/*opacity: 0.5;*/
	}
	#salonHname h1 a:hover.brighton-hotel{background-color: #00293E;}/*ブライトンホテル*/
	#salonHname h1 a:hover.aeon-shinurayasu{background-color: #008A99;}/*イオン新浦安店*/
	#salonHname h1 a:hover.tsukiji{background-color: #007A99;}/*築地店*/
	#salonHname h1 a:hover.thefirst_ginza{background-color: #134B6A;}/*ザ ファースト 銀座店*/
	#salonHname h1 a:hover.kitsilano-vancouver{background-color: #731727;}/*バンクーバー キツラノ店*/
	#salonHname h1 a:hover.gran_hiroo{background-color: #0754A0;}/*グラン広尾店*/
	#salonHname h1 a:hover.tamachi{background-color: #2E51AD;}/*田町店*/

@media screen and (max-width: 768px) {
#salonHname{/*店名*/
	float: none;
	margin: 0 auto;
	text-align: center;
}
	#salonHname h1 a, #salonHname h1 a.tsukiji{
		padding: 30px 0px 30px 0px;
	}
	#salonHname h1 a.brighton-hotel{background-image:none;}/*ブライトンホテル*/
	#salonHname h1 a:hover.brighton-hotel{background-color: transparent;}/*ブライトンホテル*/
	#salonHname h1 a.aeon-shinurayasu{background-image:none;}/*イオン新浦安店*/
	#salonHname h1 a:hover.aeon-shinurayasu{background-color: transparent;}/*イオン新浦安店*/
	#salonHname h1 a.tsukiji{background-image:none;}/*築地店*/
	#salonHname h1 a:hover.tsukiji{background-color: transparent;}/*築地店*/
	#salonHname h1 a.thefirst_ginza{background-image:none;}/*ザ ファースト 銀座店*/
	#salonHname h1 a:hover.thefirst_ginza{background-color: transparent;}/*ザ ファースト 銀座店*/
	#salonHname h1 a.kitsilano-vancouver{background-image:none;}/*バンクーバー キツラノ店*/
	#salonHname h1 a:hover.kitsilano-vancouver{background-color: transparent;}/*バンクーバー キツラノ店*/
	#salonHname h1 a.gran_hiroo{background-image:none;}/*グラン広尾店*/
	#salonHname h1 a:hover.gran_hiroo{background-color: transparent;}/*グラン広尾店*/
	#salonHname h1 a.tamachi{background-image:none;}/*田町店*/
	#salonHname h1 a:hover.tamachi{background-color: transparent;}/*田町店*/
}

#salonHmenu{/*メニュー*/
	float: left;
	position: relative;
	z-index: 99;
	margin: 0;
	padding: 0px 0 0;
	width: calc(100% - 300px);
	width: calc(100% - 280px);/*Instagramアイコン追加のため20px狭くする*/
}
@media screen and (max-width: 768px) {
#salonHmenu{display: none;}
}



/*サブメニュー非対応 - ?7月4日まで*/

	a.salonHmenu{
		float: left;
		display: block;
		position: relative;
		z-index: 99;
		width: 20%;
		width: calc(20% - 10px);
		width: 16.666%;
		margin: 0;
		padding: 20px 0;
		text-align: center;
		font-size: 17px;
		color: #FFFFFF;
	}

	a.salonHmenu.instagram{/*Instagramアイコン*/
		/*width: 50px;*/
		padding: 27px 0;
		padding: 22px 0;
	}
	a.salonHmenu.instagram img{/*Instagramアイコン*/
		margin: 0 auto;
		padding: 0;
		width: 30px;
		width: 40px;
	}
	a:hover.salonHmenu.instagram{/*Instagramアイコン*/
		background: none;
	}
	a:hover.salonHmenu{
		text-decoration: none;
		opacity: 1.0;
		/*color: #FFFFFF;
		background-image: url(../images/common/bg_header_cmn.png);
		background-repeat: repeat;*/
	}
	.HmenuFuri{
		font-size: 12px;
	}
	a:hover.salonHmenu.brighton-hotel{background-color: #00293E;}/*ブライトンホテル*/
	a:hover.salonHmenu.aeon-shinurayasu{background-color: #008A99;}/*イオン新浦安店*/
	a:hover.salonHmenu.tsukiji{background-color: #007A99;}/*築地店*/
	a:hover.salonHmenu.thefirst_ginza{background-color: #134B6A;}/*ザ ファースト 銀座店*/
	a:hover.salonHmenu.kitsilano-vancouver{background-color: #731727;}/*バンクーバー キツラノ店*/
	a:hover.salonHmenu.gran_hiroo{background-color: #0754A0;}/*グラン広尾店*/
	a:hover.salonHmenu.tamachi{background-color: #2E51AD;}/*田町店*/


@media screen and (max-width: 768px) {
#salonmobilemenu img.instagram{/*Instagramアイコン*/
	margin: 0 auto;
	padding: 0;
	width: 30px;
}
}


/*サブメニュー対応*/
.HmenuFuri{
	margin: 0;
	font-size: 12px;
}
#salonHmenu a{
}
#salonHmenu a:hover{
	opacity: 1.0;
	text-decoration: none;
}

#dropmenu {
  list-style-type: none;
  width: 100%;
  margin: 0px 0 0 0;
  padding: 0 0 0 0px;
}
#dropmenu li {
	float: left;
	display: block;
	position: relative;
	z-index: 99;
	width: 16.666%;
	margin: 0;
	padding: 0;
}
#dropmenu li.Instagram {float: right;}
#dropmenu li.nolink {
	display: block;
	color: #999999;
	margin: 0;
	padding: 20px 0;
	padding: 25px 0;
	text-align: center;
	font-size: 17px;
}
#dropmenu li a {
	display: block;
	color: #FFFFFF;
	margin: 0;
	padding: 20px 0;
	padding: 25px 0;
	text-align: center;
	font-size: 17px;
}
#dropmenu li a:hover {
}
#dropmenu li a:hover.brighton-hotel{background-color: #00293E;}/*ブライトンホテル*/
#dropmenu li a:hover.aeon-shinurayasu{background-color: #008A99;}/*イオン新浦安店*/
#dropmenu li a:hover.tsukiji{background-color: #007A99;}/*築地店*/
#dropmenu li a:hover.thefirst_ginza{background-color: #134B6A;}/*ザ ファースト 銀座店*/
#dropmenu li a:hover.kitsilano-vancouver{background-color: #731727;}/*バンクーバー キツラノ店*/
#dropmenu li a:hover.gran_hiroo{background-color: #0754A0;}/*グラン広尾店*/
#dropmenu li a:hover.tamachi{background-color: #2E51AD;}/*田町店*/
#dropmenu li a.instagram img{/*Instagramアイコン*/
	margin: 0 auto;
	padding: 0;
	width: 40px;
}
#dropmenu li a:hover.instagram img{/*Instagramアイコン*/
	opacity: 0.5;
}

#dropmenu li ul {
  list-style: none;
  position: absolute;
  z-index: 99;
  top: 100%;
  left: 0;
  width: 100%;
  margin: 0;
  padding: 0;
}
@media screen and (max-width: 1024px) {
#dropmenu li ul {
  width: 150%;
}
}
#dropmenu li ul.brighton-hotel {background-color: #004263;}/*ブライトンホテル*/
#dropmenu li ul.tsukiji {background-color: #00657E;}/*築地店*/
#dropmenu li ul.thefirst_ginza {background-color: #0D3246;}/*ザ ファースト 銀座店*/
#dropmenu li ul.gran_hiroo {background-color: #064583;}/*グラン広尾店*/
#dropmenu li ul li {
  overflow: hidden;
  width: 100%;
  height: 0;
  transition: .2s;
  padding: 0;
}
#dropmenu li ul li a {
  white-space: nowrap;
}
#dropmenu li ul li a:hover {}
#dropmenu li ul li a:hover.brighton-hotel {background-color: #00293E;}/*ブライトンホテル*/
#dropmenu li ul li a:hover.tsukiji {background-color: #007A99;}/*築地店*/
#dropmenu li ul li a:hover.thefirst_ginza {background-color: #134B6A;}/*ザ ファースト 銀座店*/
#dropmenu li ul li a:hover.gran_hiroo {background-color: #0754A0;}/*グラン広尾店*/

#dropmenu li:hover > ul > li {
  overflow: visible;
  height: 38px;
  height: 88px;
  height: 89px;
}









#homeLink{display: none;}
@media screen and (max-width: 1024px) {
#homeLink{display: block;}
}
a.homeLink2{/*ホームへのリンク*/
	display: block;
	position:absolute;
	top: 0;
	/*top:-180px;*/
	left: 0;
	z-index:199;
	letter-spacing:normal;
	width: 80px;
	height: 95px;
	background-image:url(../images/common/bg_header_cmn.png);
	background-repeat:repeat;
	cursor:pointer;
	transition: .5s;
	color: #FFFFFF;
	text-align: center;

	animation-name: fadein;
	animation-duration: 4s;
	animation-iteration-count: 1;
}
	a.homeLink2 img{
		margin: 20px auto 0;
		padding: 0;
		width: 40px;
	}
	a.homeLink2:hover{
		opacity: 1.0;
	}
	a.homeLink2.show{
		top:0;
	}

@keyframes fadein {
from {
    opacity: 0;
    transform: translateY(-180px);
}
to {
    opacity: 1;
    transform: translateY(0);
}
}



/*------------- ladysmenu ----------------*/
#ladysBtn{}
a:hover#ladysBtn{
	cursor: pointer;
}

#ladysMenu {
	position: absolute;
	display: none;
	top: 185px;
	left: 0px;
	right: 0px;
	z-index:199;
	width: calc(100% - 12px);
	margin: 0 auto;
	padding: 0px;
	letter-spacing:1px;
	border: 1px solid #CCCCCC;
	background-color: #FFFFFF;
}
@media screen and (max-width: 1024px) {
#ladysMenu {
	top: 175px;
}
}
@media screen and (max-width: 768px) {/*タブレット縦対応*/
}
#ladysMenu ul{
	margin: 0;
	padding: 0;
	list-style-type: none;
}
#ladysMenu li{
	float: left;
	width: 25%;
	margin: 0;
	padding: 0;
}

#ladysMenu li a {
	display: block;
	padding: 15px;
	text-decoration:none;
	text-align:center;
}
#ladysMenu li a:hover{
	opacity: 1.0;
	background-image: url(../images/common/bg_header_cmn.png);
	background-repeat: repeat;
	color: #FFFFFF;
}

#ladysMenuOverlay {
	display: none;
	position: fixed;
	top: 185px;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(255,255,255,0.8);
	z-index: 198;
	background-attachment:fixed;
	overflow:hidden;
}
@media screen and (max-width: 1024px) {
#ladysMenuOverlay {
	top: 175px;
}
}

/*------------- reserve / tel ----------------*/
#PCtelBT {/*モバイル以外表示※画面表示初期のみ*/
	position: fixed;
	height: 95px;
	right: 0px;
	top: 50%;
	top: 270px;
	top: 279px;
	z-index: 3;
	display: none;
	transform: translateY(-50%);
	-webkit- transform: translateY(-50%);
	display: block;
	width: 80px;
	height: 95px;
}
@media screen and (max-width: 1024px) {
#PCtelBT {
	top: 140px;
	top: 149px;
}
}
@media screen and (max-width: 480px) {
#PCtelBT {/*モバイル以外表示※画面表示初期のみ*/
	display: none;
}
}

#reserveBT, #telBT {
	position: fixed;
	height: 95px;
	right: 0px;
	top: 50%;
	z-index: 3;
	display: none;
	display: block;
	transform: translateY(-50%);
	-webkit- transform: translateY(-50%);
	width: 80px;
	z-index: 3;
}

#telBT {
	left: 0px;
}
.bgReserveBT, .bgTelBT{
}
.bgReserveBT a, .bgTelBT a {
	display: block;
	width: 80px;
	height: 95px;
	max-width: initial;
	cursor: pointer;
}
.bgReserveBT a img, .bgTelBT a img {
	width: 100%;
}
.bgReserveBT a:hover, .bgTelBT a:hover {
	opacity:0.8;
}
/*.bgReserveBT a img, .bgTelBT a img{width: 100%;}*/
@media screen and (min-width: 480px) {
#telBT {
	display: none !important;
}
}
@media screen and (max-width: 480px) {
#reserveBT, #telBT {
	top: auto;
	bottom: 0;
	transform: translateY(0%);
	-webkit- transform: translateY(0%);
}
}


/*------------- salon data ----------------*/
#aboutTxt{
	margin: 40px 0 0;
	padding: 0;
}
#aboutTxt p{
	margin: 0 0 0px;
	padding: 0;
	text-indent: 1em;
	line-height: 200%;
	letter-spacing: 2px;
}

#salonMovie{
	margin: 0 auto;
	padding: 0;
	max-width: 600px;
}

#logoImg{
	margin: 30px auto;
	padding: 0;
	width: 250px;
}

.logoImgTxt{
	margin: 0 auto;
	padding: 0;
	max-width: 850px;
	line-height: 200%;
}

#salonData{}
#salonData table{
	margin: 0;
	padding: 0;
	border-collapse: collapse;
	width: 100%;
}
#salonData th, #salonData td{
	margin: 0;
	padding: 20px 10px;
	border-bottom: 1px solid #CCCCCC;
	vertical-align: top;
	text-align: left;
	font-weight: normal;
	font-size: 13px;
	color: #000000;
}
#salonData th{
	font-size: 11px;
	border-bottom: 1px solid #666666;
	white-space: nowrap
}
@media screen and (max-width: 1024px) {
#salonData th, #salonData td{
	width: calc(100% - 20px);
	width: 100%;
	display: inline-block;
}
#salonData th{
	background-color: #F9F9F9;
	border-bottom: 0px;
}
#salonData td{
	border-bottom: 1px solid #666666;
}
}

.creditcard{}
.creditcard img{
	float: left;
	width: 50px;
	margin: 0 5px 0 0;
	padding: 0 0 5px;
}
.facility{}/*設備アイコン*/
.facility img{
	float: left;
	width: auto;
	margin: 0 5px 0 0;
	padding: 0 0 5px;
}
.facility img.icooff{
	opacity: 0.2;
}


.ggmap {
	position: relative;
	padding-bottom: 56.25%;/*16：9*/
	padding-bottom: 75%;/*4：3*/
	/*padding-bottom: 100%;*//*正方形*/
	padding-top: 30px;
	height: 0;
	overflow: hidden;
}
.ggmap iframe,
.ggmap object,
.ggmap embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-filter: grayscale(1);
	filter: grayscale(1);
}
@media screen and (max-width: 480px) {
.ggmap {
	padding-bottom: 100%;/*正方形*/
}
}

/*------------- user's voice ----------------*/
.voicecontainer{
	width: calc(100% - 20px);
	margin: 50px 10px 0;
	padding: 0;
}
.voiceitem{
	margin: 0 0 30px;
	padding: 25px;
	background-color: #FFFFFF;
	border: 1px solid #CCCCCC;
	border-radius: 9px;
	font-size: 13px;
}
p.voiceTitle{
	margin-bottom: 10px;
	color: #000000;
}
p.voice{
	line-height: 180%;
}


/*----------------------------------------------------

　　メニューページ

-------------------------------------------------------*/
.taxTxt{
	margin: 30px 5px 0;
	padding: 10px;
	border: 1px solid #CCCCCC;
	border-radius: 5px;
	background-color: #FFFFFF;
}

/*add css
　スマホの場合、メニューを幅いっぱいに表示する
 　gridの間隔が8pxなので左右は4pxとする
*/
.menuData{
}
@media screen and (max-width: 480px) {
.menuData{
	padding-left: 4px;
	padding-right: 4px;
}
}

.menuData a img{}
.menuData a:hover img{opacity: 0.5;}


/*フィルター menuStyle.css override*/
.filtersort{
	margin: 30px 0;
	padding: 0;
}
@media screen and (max-width: 480px) {
.filtersort{
	margin: 30px 0 0;
}
}

.filter-label{
	color: #000000;
	font-size: 12px;
	margin-bottom: 0px;
}
.btn-group .btn:last-child, .btn-group .btn:first-child {
    border-radius: 0;
}
.btn-group .btn:last-child {
	margin-right: 0px;
}
.btn {
    display: inline-block;
    padding: .75em .8em;
    text-align: center;
    border-radius: 3px;
    border: 1px solid #34495e;
    color: #34495e;
    font-size: 1rem;
    background-color: rgba(52,73,94,0);
    transition: .2s ease-out;
    cursor: pointer;
    -webkit-appearance: none;
	/*upd-fujimoto*/
    border: 0px;
	margin-right: 10px;
    padding: 5px;
	font-size: 13px;
	font-size: 15px;
	text-align: left;
	color: #AAAAAA;
}
.btn--primary {
	border-bottom: 1px solid #666666;
	min-width: 60px;
}
.btn--primary.active, .btn--primary:active {
    background-color: transparent;
}
.btn--primary.active:hover, .btn--primary:active:hover {
    background-color: transparent;
	background:none;
}
.btn--primary:focus.active {
    box-shadow: inset 0 0 0 0 rgba(0,0,0,.0), 0 0 0 0px rgba(52,152,219,.0);
}
.btn.active, .btn:active {
    box-shadow: inset 0 0 0 0 rgba(0,0,0,0);
    color: #004160;
	/*font-weight: bold;*/
    background-color: transparent;
}
.btn--primary:focus {
    box-shadow: 0 0 0 0 rgba(52,152,219,0);
}
.btn--primary:hover {
    background-color: transparent;
	background-image: url(../images/common/bg_header_cmn.png);
	background-repeat: repeat;
}

@media screen and (max-width: 480px) {
.filters-group {
    margin: 0 0 40px;
}
}


/*------------- グラデーション ----------------*/
/*表示しきれないテキストを半透明にする*/
.menuGradient{
	position: relative;
}
.menuGradient::after{
	position: absolute;
	bottom: 0;
	z-index: 2;
	content: '';
	width: calc(100% - 16px);
	height: 40px;
	background: linear-gradient(rgba(255,255,255,0) 0, rgba(255,255,255,.7) 20%, rgba(255,255,255,1) 80%);
}

/*メニュー名*/
.picture-item__details{
	padding-bottom: 10px;
}
.picture-item__details a{
	font-size: 15px;
	text-decoration: underline;
}
..picture-item__details a:hover{
	text-decoration: none;
	opacity: 0.5;
}
.menuprice{/*料金*/
	float: left;
	text-align:left;
	padding:0 0 0 1em;
}
.menutags{/*カテゴリ*/
	float: right;
	text-align:right;
	padding:0 1em 0 0;
	color: #666666;
	font-size: 10px;
}
@media screen and (max-width: 767px) {
.menuprice, .menutags {
    padding: 0 .625em;
}
}
p.picture-item__description{/*メニュー概要*/
	padding-top: 10px;
}
/*MENU_Sボックス高さ*/
.picture-item{
}



.linkMenu a{
	display: inline-block;
	margin: 30px 0 0px;
	padding: 0 0 0 10px;
	background-image: url(../images/common/arrow_bl7.png);
	background-repeat: no-repeat;
	background-size: 5px;
	background-position: 0 8px;
}




/*----------------------------------------------------

　　スタッフページ

-------------------------------------------------------*/
.staffListNM{
	float: left;
	margin: 0 10px 5px 0;
	padding: 0;
	text-decoration: underline;
}
.staffListKana{
	float: left;
	margin: 0;
	padding: 0;
	font-size: 11px;
	color: #666666;
}
.staffDesc{
	clear: both;
	margin: 0;
	padding: 0;
	font-size: 11px;
	color: #666666;
}