@charset "UTF-8";
/* CSS Document */
/* ++++++++ 共通 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* ----------------- リセット ----------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-style:normal;
	font-weight: normal;
	font-size: 100%;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

html{
    overflow-y: scroll;
}

blockquote, q {
	quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

input, textarea{
	margin: 0;
	padding: 0;
}

ol, ul{
    list-style:none;
}

table{
    border-collapse: collapse; 
    border-spacing:0;
}

caption, th{
    text-align: left;
}

a:focus {
	outline:none;
}
/* ----------------- /リセット ----------------------------------------------- */

/* ----------------- クラス定義 ----------------------------------------------- */
.clearfix:after {
	content: ""; 
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.clearfix {
	min-height: 1px;
}

* html .clearfix {
	height: 1px;
	/*¥*//*/
	height: auto;
	overflow: hidden;
	/**/
}
.floatleft{
	float:left;
}
.floatright{
	float:right;
}
.both{
	clear:both;
}
.ta_right{
	text-align: right;
}
.inline_block {  
	display: inline-block;  
	*display: inline;  
	*zoom: 1;  
}
.height8px{
	height:8px;
}
.height5px{
	height:5px;
}
.height10px{
	height:10px;
}
.height20px{
	height:20px;
}
.height30px{
	height:30px;
}
.height40px{
	height:40px;
}
.height50px{
	height:50px;
}
.height100px{
	height:100px;
}
.height150px{
	height:150px;
}
.height200px{
	height:200px;
}
.t_white{
	color:#FFF;
}
.disnone{
	display: none;
}
@media(max-width:981px){
	.max980_none{display:none;}
}
@media(min-width:981px){
	.min980_none{display:none;}
}
/* ----------------- /クラス定義 ----------------------------------------------- */


/* 
 ===============================================================================================
 共通																	 					common
 =============================================================================================== */
/* ヘッダー +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#logo a img{
	position: fixed;
	z-index: 1000;
	top: 12px;
	left: 20px;
	overflow: hidden;
	width: 50px;
	height: auto;
}
@media(min-width:1000px){
	#logo a img{
		width: 50px;
		top: 12px;
		left: 20px;
	}
}
@media(min-width:1300px){
	#logo a img{
		width: 90px;
		top: 20px;
		left: 30px;
	}
}
#bannerBox{
	width:100%;
	height: 100px;
	position: fixed;
  z-index: 200;
	top: 0px;
	background-color: rgba(255,255,255,0.8);
}
@media(max-width:1300px){
	#bannerBox{
		height: 60px;
		background-color: rgba(255,255,255,0.8);
	}
}
ul#gNavi{
	float: right;
	font-size: 24px;
	position: fixed;
  z-index: 104;
  top: 40px;
	right: 3%;
}
ul#gNavi li{
	margin-right: 0.5em;
	padding: 0em 0.5em;
	color: #000;
	text-decoration: none;
	float: left;
}
@media(max-width:1300px){
	ul#gNavi li{
		display: none;
	}
}
ul#gNavi li a{
	padding: 0 .3em;
  background-image: linear-gradient(rgba(0,0,0,0) 50%, rgba( 0,0,0,1) 50%);
  background-position: 0 0;
  background-size: auto 200%;
  transition: .3s;
}
ul#gNavi li a:hover{
	background-position: 0 100%;
  color: #fff;
}
.drawer-menu{
	font-size: 36px;
	font-weight: 100;
}
.drawer-menu li a{
	font-family: "ヒラギノ角ゴシック W0", "Hiragino Kaku Gothic W0","Hiragino Sans", "Hiragino Kaku Gothic ProN","ヒラギノ角ゴシック W3","Hiragino Kaku Gothic W3", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif,brandon-grotesque";
	line-height: 75px;
	font-weight: 100;
	letter-spacing: 0.2em;
}
.drawer-menu li a:hover{
	color: #ccc;
	transition: all 0.5s;
}
.drawer-menu_li_span {
	font-size: 20px;
	font-family: "ヒラギノ角ゴシック W0", "Hiragino Kaku Gothic W0","Hiragino Sans", "Hiragino Kaku Gothic ProN","ヒラギノ角ゴシック W3","Hiragino Kaku Gothic W3", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif,brandon-grotesque";
	font-weight: 100;
}
#hamMenu{}
@media(min-width:1300px){
	#hamMenu{
		display: none;
	}
}
@media(max-width:600px){
	.drawer-menu{
		font-size: 20px;
	}
.drawer-menu li a{
		line-height: 60px;
	}
}
/* /ヘッダー +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */


/* コンテンツ +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.ctBox_index{
	max-width: 1800px;
	margin-left: auto;
	margin-right: auto;
}
.ctBox{
	max-width: 1500px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 30px;
	padding-right: 30px;
}
.ctBox h1{
	padding-top: 150px;
	font-family: 'Abel', sans-serif , "brandon-grotesque";
	font-size: 48px;
	text-align: center;
	letter-spacing: 0.2em;
}
.ctBox_lmano{
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
}

@media(max-width:600px){
	.ctBox_index{
		padding-left: 0px;
		padding-right: 0px;
	}
}
/* /コンテンツ +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */


/* フッター +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.footerBox{
	height: auto;
}
.ft_salon{
	width: 100%;
	background-color: #eee;
}
.ft_salon_logo{
	max-width: 1500px;
	height:-webkit-calc(90vw * 0.96 / 6);
	height:-moz-calc(90vw * 0.96 / 6);
	height:calc(90vw * 0.96 / 6);
	margin-left: auto;
	margin-right: auto;
	padding-top: 50px;
	padding-bottom: 50px;
	padding-left: 5%;
	padding-right: 5%;
}
@media(min-width:1650px){
	.ft_salon_logo{
		height: 238px;
	}
}
.ft_salon_logo li{
	width: 32%;
	height: 100%;
	float: left;
	margin-right: 2%;
	transition-duration: 0.5s;
}
.ft_salon_logo li.ft_salon_logo_end{
	margin-right: 0%;
}
.ft_salon_logo li img{
	width: 100%;
	cursor: pointer;
}
.ft_salon_logo li:hover img{
	box-shadow: 10px 10px 10px rgba(100,100,100,0.5);
  transform: translateY(-10px);
  transition-duration: 0.3s;
}

.ft{
	text-align: center;
	background-color: rgba(0,0,0,1.00);
	padding: 0.5em 0em;
	color: #fff;
}

/* /フッター +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */



/* 
 ===============================================================================================
 index.html																	 	
 =============================================================================================== */
/* index +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

#ct h1{
	font-size: 72px;
	margin-bottom: 50px;
	text-align: center;
	font-family: "brandon-grotesque";
	font-weight: 300;	
	letter-spacing: 0.2em;
}
#message{
	margin-top: 20vh;
}
h2.h2Tp{
	font-size: 72px;
	margin-bottom: 80px;
	text-align: center;
	font-family: "brandon-grotesque";
	font-weight: 300;
	letter-spacing: 0.3em;
}
.tpCategory{
	width: 100%;
	padding-top: 150px;
	padding-bottom: 150px;
}
#collection,#news,#creative,#rectuit,#youtube,#mmm_project{
	
}
.news_wrap,.insta_wrap,.Media_wrap,.creativeImg_wrap,.youtubeImg_wrap,.mmmImg_wrap,.recruitImg_wrap{
	padding-left: 10%;
	padding-right: 10%;
}
.youtubeImg_wrap{
	height:-webkit-calc(100vw * 9 / 20);
	height:-moz-calc(100vw * 9 / 20);
	height:calc(100vw * 9 / 20);
	max-height: 810px;
}
@media(max-width:1000px){
	tpCategory{
		padding-top: 100px;
		padding-bottom: 100px;
	}
	.news_wrap,.insta_wrap,.Media_wrap,.creativeImg_wrap,.youtubeImg_wrap,.mmmImg_wrap,.recruitImg_wrap{
		padding-left: 5%;
		padding-right: 5%;
	}
}
@media(max-width:600px){
	.tpCategory{
		padding-top: 50px;
		padding-bottom: 50px;
	}
	h2.h2Tp{
	font-size: 36px;
	margin-bottom: 50px;
	letter-spacing: 0.1em;
	}
	.news_wrap,.insta_wrap,.Media_wrap,.creativeImg_wrap,.youtubeImg_wrap,.mmmImg_wrap,.recruitImg_wrap{
	padding-left: 1%;
	padding-right: 1%;
	}
	.news_wrap,.insta_wrap,.Media_wrap,.creativeImg_wrap,.youtubeImg_wrap,.mmmImg_wrap,.recruitImg_wrap{	
		padding-left: 1%;
		padding-right: 1%;
	}
}
/* /index共通 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* index単独 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#page00{
	width: 100%;
}

#slider,#skippr-slider{
	width:	100%;
	height: calc(110vh);
}
#hd_salonLogo_ct{
	width: 90%;
	max-width: 1500px;
	height: auto;
	background-color: #999;
	background-color:rgba(0,0,0,0.6);
	position: absolute;
	left: 0;
  right: 0;
  margin: auto;
	bottom: 50px;
	z-index: 100;
	padding-bottom: 4%;
}
.hd_salonLogo_title{
	padding-top:0%;
	font-family: zen-old-mincho, sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 40px;
	color: #fff;
	letter-spacing: 0.12em;
	text-align: center;
	line-height: 80px;
}
.hd_hanare{
	font-family:"Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-weight: 400;
}
.hd_park{
	font-family:"Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-weight: 400;
}

#hd_salonLogo_ul{
	width: 90%;
	height: auto;
	padding-left:5%;
	padding-right:5%;
}
#hd_salonLogo_ul li{
	width: 30%;
	margin-right: 5%;
	float: left;
}
#hd_salonLogo_ul li.hd_salonLogo_liEnd{
	margin-right: 0%;
}
#hd_salonLogo_ul li a{
	width: 100%;
	height: auto;
}
#hd_salonLogo_ul li a img{
	width: 100%;
	height: auto;
}
#hd_workLogo_ul{
	width: 90%;
	height: auto;
	padding-left:5%;
	padding-right:5%;
}
#hd_workLogo_ul li{
	float: left;
}

#hd_workLogo_liFirst{
	width: 64%;
	margin-left:18%;
	
}
#hd_workLogo_liEnd{
	width: 32%;
	padding-top: 1.2%;	
}

#hd_workLogo_ul li a{
	width: 100%;
	height: auto;
}
#hd_workLogo_ul li a img{
	width: 100%;
	height: auto;
}
#message{
	width: 100%;
	background-color: rgba(255,255,255,1.00);
	background-size: 100px auto;
	padding-top: 40px;
	padding-bottom: 40px;
}
#message_inner{
	width: 90%;
	max-width: 1000px;
	margin-left: auto;
	margin-right: auto;
	background-color: rgba(255,255,255,0.9);
	padding-top: 40px;
	padding-bottom: 20px;
}
#message p{
	font-size: 28px;
	line-height: 100px;
	text-align: center;
	margin-bottom: 20px;
}
.insta_link{
	float: right;
	padding: 0.5em;
	background-color: #eee;
	border: 1px solid #FFF; 
	transition: 1.0s ;
	font-size: 16px;
}
.insta_link:hover{
	background-color: #FAFAFA;
	border: 1px solid #000; 
	transition: 1.0s;
}

@media(max-width:1500px){
	#ct h1{
	font-size: 48px;
	}
	#message p{
		font-size: 24px;
		line-height: 72px;
	}
}
@media(max-width:980px){
	#ct h1{
	font-size: 36px;
	}
	#message p{
		font-size: 18px;
		line-height: 56px;
	}
}
@media(max-width:600px){
	#ct h1{
		font-size: 28px;
	}
	#message p{
		font-size: 15px;
		line-height: 36px;
	}
	.insta_link{
	
	font-size: 10px;
}
}




@media(max-width:980px){
	h2{
		font-size: 24px;
	}
}
@media(min-width:100px){
	#hd_salonLogo_ct{
		
		
	}
	.hd_salonLogo_title{
		padding-top:5%;
		line-height: 40px;
		font-size: 16px;
		letter-spacing: 0em;
	}
}

@media(min-width:800px){
	#hd_salonLogo_ct{
		
		
	}
	.hd_salonLogo_title{
		padding-top:4%;
		line-height: 50px;
		font-size: 25px;
		letter-spacing: 0.05em;
	}
}

@media(min-width:1500px){
	#hd_salonLogo_ct{
	
	
	}
	.hd_salonLogo_title{
		padding-top:3%;
		line-height: 60px;
		font-size: 30px;
	}
}

@media(min-width:2000px){
	#hd_salonLogo_ct{
	
	
	}
	.hd_salonLogo_title{
		padding-top:3%;
		line-height: 80px;
		font-size: 40px;
	}
}







/* /index単独 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */



/* 
 ===============================================================================================
 salon.html , mano.html , lmano.html , ojomano.html																	 	
 =============================================================================================== */
/* salon.html +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#ctSalon{}
#ctSalon h1{}
.ctSalon_shop{
	margin-top: 100px;
	margin-bottom: 200px;
}
.ctSalon_shop h2 a{
	font-size: 24px;
	font-family:"Helvetica Neue",Arial, "sans-serif";
	font-weight:600;
	letter-spacing: 0.1em;
	
}
.ctSalon_shop_img{
	width: 50%;
	float: left;
}
.ctSalon_shop_info{
	width: 40%;
	height: 421px;
	padding-left: 10%;
	float: left;
	display: flex;
  justify-content: center;
  align-items: center;
}
.ctSalon_shop_infoT{
	width: 100%;
	margin-top: 30px;
	font-size: 16px;
	margin-bottom: 30px;
}
.ctSalon_shop_infoT tr{
	width: 100%;
}
.ctSalon_shop_infoT th{
	width: 20%;
	padding-top:0.5em;
	padding-bottom:0.5em;
	font-family:Helvetica, Arial, "sans-serif";
	font-weight: 600;
	font-size: 18px;
}
.ctSalon_shop_infoT td{
	padding-top:0.5em;
	padding-bottom:0.5em;
}
.ctSalon_shop_infoM{
	width: 100%;
  margin: 0 auto;
  position: relative;
  padding-bottom: 20%;
  overflow: hidden;
  text-align: center;
	height: 0;
}
.ctSalon_shop_infoM iframe{
	position: absolute;
  top: 0;
  left: 0;
  width: 100% !important;
  height: 100% !important;
-webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);	
}
@media (max-width: 1500px){
	.ctSalon_shop_info{
		height:calc((100vw - 40px) * 15 / 52);
	}
}
@media (max-width: 1000px){
	.ctSalon_shop_infoT th{
			width: 25%;
			padding-top:0.2em;
			padding-bottom:0.2em;
	}
	.ctSalon_shop_infoT td{
			padding-top:0.2em;
			padding-bottom:0.2em;
	}
}
@media (max-width: 800px){
	.ctSalon_shop{
		margin-top: 50px;
		margin-bottom: 100px;
	}
	.ctSalon_shop_img{
		width: 100%;
		float:none;
	}
	.ctSalon_shop_info{
		width: 100%;
		height: 200px;
		margin-left: auto;
		margin-right: auto;
		padding-left: 0;
		padding-top: 0;
		float: none;
	}
	.ctSalon_shop_infoT th{
			width: 20%;
	}
	.ctSalon_shop_infoM{
	width: 100%;
  margin: 0 auto;
  position: relative;
  padding-bottom: 40%;
  overflow: hidden;
  text-align: center;
	height: 0;
}
}
/* /salon.html +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* common +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#salonTitle{
	width: 220px;
	padding-top: 150px;
	padding-bottom: 0px;
	margin-left: auto;
	margin-right: auto;
}
#salonTitle_ojo{
	max-width: 350px;
	padding-top: 150px;
	padding-bottom: 0px;
	margin-left: auto;
	margin-right: auto;
}
#salonTitle img,#salonTitle_ojo img{
	width: 100%;
	height: auto;
}
#salonTitle h1,#salonTitle_ojo h1{
	padding-top: 20px;
	font-family:"Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-size: 18px;
	text-align: center;
	letter-spacing: 0.5em;
}
#salonImgbox{
	width: 90%;
	height: auto;
	padding: 0 5%;
}
#salonImgbox img{
	width: 100%;
	height: auto;
}
#salonImgbox ul{
	height: auto;
	margin-top: 0.5%;
}
#salonImgbox ul li{
	width: 32.5%;
	height: auto;
	float: left;
	padding-right: 1.25%;
}
#salonImgbox ul li img{
	width: 100%;
	height: auto;
}
#salonImgbox ul li.salonImgbox_end{
	padding-right: 0%;
}
.salonImgbox_lmano{
	max-width: 1500px;
	margin-right: auto;
	margin-left: auto;
}
.salonItem{
	font-size: 64px;
	margin-bottom: 80px;
	text-align: center;
	font-family: "brandon-grotesque","sans-serif";
	font-weight: 300;	
	letter-spacing: 0.2em;
}
.salon_sectionBox{
	padding-top: 300px;
}
@media (max-width: 1000px) {
	.salon_sectionBox{
		padding-top: 150px;
	}
	.salonItem{
		font-size: 64px;
		margin-bottom: 40px;
	}
}
/* 予約 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.salonItem_reservation{
	font-size: 64px;
	margin-bottom: 40px;
	text-align: center;
	font-family: "brandon-grotesque","sans-serif";
	font-weight: 300;	
	letter-spacing: 0.2em;
}
.reservation_salon{
	font-size: 24px;
	margin-bottom: 40px;
	text-align: center;
	font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, "sans-serif";
	font-weight: 600;	
	letter-spacing: 0.2em;
}
.reservation{
	max-width: 100%;
	margin-left: auto;
	margin-right: auto;
}

.btn_reserveBox{}
.btn_reserveBox li{
	width: 35%;
	margin-left:9.5%;
	float: left;
}
.btn_reserve{
	position: relative;
	width: 100%;
	padding: 20px 10px;
	display: inline-block;
	text-align: center;
	letter-spacing: 0.1em;
	color: #000;
}
 
.btn_reserve:before,.btn_reserve:after{
	content: "";
	width: 105%;
	height: 2px;
	background-color: #000;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
}
 
.btn_reserve:before{
	top: 0px;
}
 
.btn_reserve:after{
	bottom: 0px;
}

.btn_reserve span:before,.btn_reserve span:after{
	content: "";
	width: 2px;
	height: 120%;
	background-color: #000;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}
.btn_reserve span:before{
	left: -2px;
}
.btn_reserve span:after{
	right: -2px;
}
.btn_reserve span{
	font-size: 20px;
}
.btn_reserve:hover{
	color: #fff;
	background-color: #666;
	transition: 1.0s ;
}
@media (max-width: 1000px) {
	.salonItem_reservation{
		font-size: 64px;
	}
	.btn_reserve span{
		font-size: 16px;
	}
}
@media (max-width: 600px) {
	.btn_reserveBox li{
	width: 76%;
	float: none;
	margin-bottom: 20px;
}
	.reservation_salon{
		margin-bottom: 20px;
}
	.btn_reserve:before,.btn_reserve:after{
		height: 1px;
	}
	.btn_reserve span:before,.btn_reserve span:after{
	width: 1px;
	}
}

/* /予約 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */


#salonInstaBox{
	width: 90%;
	height: auto;
	padding: 0px 5%;
}
#official_iframeBox{
	width: 100%;
	margin-top: 50px;
}
#official_iframe{
	width: 100%;
	height:760px;
}
@media (max-width: 1499px) {
	#official_iframe{
		height:calc(100vw * 1 / 2 + (1400px - 95vw) * 1 / 5);
	}
}

/* スタッフ +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
#staff{}
.staffBox_ul{
	width: 90%;
	height: auto;
	padding: 0px 5%;
}
.staffBox_ul li{
	width: 19.2%;
	height: auto;
	padding: 0 1% 50px 0;
	float: left;
}
.staffBox{
}
.staffBox a{
	width: 100%;
	height: auto;
}
.staffBox img{
	width: 100%;
	height: auto;
}
.staffBox h3{
	font-size: 14px;
}
.staffBox h4{
	font-size: 12px;
	color: darkgrey;
} 
.staffBox h5{
	font-size: 12px;
	color:dimgray;
} 
.digitalCard{
		display: block;
		font-size: 12px;
		line-height: 30px;
		text-decoration:underline;
		color: darkblue;
}
.staffBox_ul li.staff_over1000{
	padding-right: 0%;
}
.sankyu{
	background-color:rgba(250,250,250,1.00);
	padding: 20px;
}
.staffBox_ul p.sankyu_title{
	font-size: 14px;
}
.staffBox_ul p.sankyu_staff{
	font-size: 13px;
}
@media(max-width:1080px){
	.staffBox_ul li{
		width: 32.5%;
		padding-right: 1.25%;
	}
	.staffBox_ul li.staff_over1000{
		padding-right: 1.25%;
	}
	.staffBox_ul li.staff_under1000{
		padding-right: 0%;
	}
	.staffBox h3{
	font-size: 11px;
	}
	.staffBox h4{
	font-size: 8px;
	} 
	.staffBox h5{
	font-size: 8px;
	} 
	.digitalCard{
		font-size: 7px;
	}
}
.staff_under1000{}
/* /スタッフ +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* プライス +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.priceBox{
	width: 90%;
	height: auto;
	padding: 0px 5%;
}
.priceHalfBox{
	width: 48%;
	height: auto;
	float: left;
}
.priceHalfBox_left{
	padding-right: 4%;
}
.priceItemBox{
	padding-bottom: 80px;
}
.priceItemBox h3{
	font-size: 32px;
	margin-bottom: 5px;
}
.priceItemBox ul{
	width: 100%;
	height: 2.5em;
	border: 1px solid #ccc;
	margin-bottom: 5px;
}
.priceItemBox ul li.priceMenuName,.priceItemBox ul li.priceMenuFee,.priceItemBox ul li.priceMenuFee_end{
	height: 100%;
	float: left;
	display: flex;
  align-items: center;
}
.priceMenuName{
	width: 37%;
	padding-left: 3%;
	
}
.priceMenuName h4{
	font-size: 18px;
}
.priceItemBox ul:hover{
	background-color: #f0f0f0;
	transition: 0.2s ;
}
.priceMenuFee{
	width: 19%;
}
.priceMenuFee_end{
	width: 19%;
	padding-right: 3%;
}
.priceMenuFee p,.priceMenuFee_end p{
	width: 100%;
	text-align: right;
}

.priceBox_notes{
	font-size: 10px;
	color: #666;
	padding-left: 1%;
}
.priceItemCateBox{
	width: 98%;
	height: 1.5em;
	margin-bottom: 2px;
}
.priceItemCate{
	width: 40%;
	float: left;
	align-items: center;
}
.priceItemCate h3{
	font-size: 20px;
}
.priceItemCateFee p,.priceItemCate_end p{
	width: 100%;
	font-size: 12px;
	text-align: right;
	line-height: 40px;
	color: #999999;
}
.priceItemCateFee{
	width: 19%;
	float: left;
}
.priceItemCate_end{
	width: 19%;
	padding-right: 3%;
	float: left;
}
@media(max-width:1380px){
	.priceMenuName h4{
		font-size: 14px;
	}
	.priceMenuFee p,.priceMenuFee_end p{
		font-size: 14px;
	}
}
@media(max-width:1080px){
	.priceHalfBox_left{
		padding-right: 0%;
}	
	.priceHalfBox{
		width: 100%;
		float: none;
	}
	.priceItemBox{
	padding-bottom: 20px;
}
}
@media(max-width:600px){
	.priceItemBox h3{
		font-size: 20px;
	}
	.priceItemCate h3{
		font-size: 16px;
	}
	.priceMenuName h4{
		font-size: 14px;
	}
	.priceMenuFee p,.priceMenuFee_end p{
		font-size: 12px;
	}
	.priceItemCateFee p,.priceItemCate_end p{
		font-size: 10px;
	}
}
/* /プライス +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

/* アクセス +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
.salomAccessBox{
	width: 90%;
	height: auto;
	padding: 0px 5%;
}
table.shopinfo_table{
	width: 49%;
	border-collapse: separate;
	border-spacing: 0px 15px;
	font-size: 12px;
	margin-right: 2%;
	float: left;
}
table.shopinfo_table_right{
	margin-right: 0;
}
table.shopinfo_table th,
table.shopinfo_table td {
padding: 10px;
}

table.shopinfo_table th {
background: #222;
vertical-align: middle;
text-align: left;
width: 100px;
overflow: visible;
position: relative;
color: #fff;
font-weight: normal;
font-size: 15px;
}

table.shopinfo_table th:after {
left: 100%;
top: 50%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(136, 183, 213, 0);
border-left-color: #222;
border-width: 10px;
margin-top: -10px;
}
/* firefox */
@-moz-document url-prefix() {
table.shopinfo_table th::after {
float: right;
padding: 0;
left: 30px;
top: 10px;
content: " ";
height: 0;
width: 0;
position: relative;
pointer-events: none;
border: 10px solid transparent;
border-left: #222 10px solid;
margin-top: -10px;
}
}

table.shopinfo_table td {
background: #f8f8f8;
width: 360px;
padding-left: 20px;
}


#shopinfoMap{
	width: 100%;
	height: 100%;
	position: relative;
	padding: 50% 0 0;
	margin-top: 30px;
}

#shopinfoMap iframe{
	position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
}
#shopinfoMap_sp{
	display: none;
}

@media (max-width: 767px) {
	#shopinfo h3{
		font-size: 30px;
		margin-top: 30px;
	}
	table.shopinfo_table{
		width: 100%;
		margin: 0;
		margin-right: 0;
		float: none;
	}
	#shopinfoMap{
		display: none;
	}
	#shopinfoMap_sp{
		display: block;
		width: 100%;
		height: 100%;
		position: relative;
		padding: 100% 0 0;
		margin-top: 20px;
	}
	#shopinfoMap_sp iframe{
		position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%);
	}
	
}
/* /アクセス +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* /common +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */



/* 
 ===============================================================================================
staff.html																	 	
 =============================================================================================== */
/* common +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* /common +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */



/* 
 ===============================================================================================
 price.html																	 	
 =============================================================================================== */
/* common +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* /common +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */



/* 
 ===============================================================================================
 access.html																	 	
 =============================================================================================== */
/* common +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* /common +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */



/* 
 ===============================================================================================
 company.html																	 	
 =============================================================================================== */
/* common +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */

.junbichu_in{
	display: flex;
  justify-content: center;
  align-items: center;
}
.junbichu_in p{
	 font-size: 36px;
	padding-top: 200px;
	padding-bottom: 200px;
}


/* /common +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */



/* 
 ===============================================================================================
 onlineshop.html																	 	
 =============================================================================================== */
/* common +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* /common +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */


/* 
 ===============================================================================================
manopark.html																	 	
 =============================================================================================== */
.manoparkHD{
	position: relative;
	width: 100%;
	min-height: 100vh;
	background:url("../images/manopark/manoparkIHd.jpg") center center / cover no-repeat fixed;
}
ul.manopark_ct{
	width: 100vw;
	height: 32vh;
	position: absolute;
	top: 34%;
	margin: 0;
	padding: 0;	
}
li.parkClient{
	width: 15.75vw;
	height: 100%;
	left: 9.85vw;
	position: absolute;
	float: left;
}
li.parkClient a{
	width: 100%;
	height: 100%;
	display: block;
}
li.parkCreator{
	width: 6.25vw;
	height: 100%;
	position: absolute;
	float: left;
}
li.parkCreator_first{
	width: 9.75vw;
	height: 100%;
	left: 36vw;
}
li.parkCreator_2nd{
	height: 100%;
	left: 45.75vw;
}
li.parkCreator_3rd{
	height: 100%;
	left: 52vw;
}
li.parkCreator_4th{
	height: 100%;
	left: 58.25vw;
}
li.parkCreator_5th{
	height: 100%;
	left: 64.5vw;
}
li.parkCreator_6th{
	height: 100%;
	left: 70.75vw;
}
li.parkCreator_7th{
	height: 100%;
	left: 77vw;
}
li.parkCreator_end{
	height: 100%;
	left: 83.25vw;
}
.parkCreator_popup{
	position: relative; 
	cursor   : pointer;
}
.parkCreator_popup:hover .parkCreator_span{
	display: inline; 
}
.parkCreator_span{
	display: none;                        /* 要素を非表示 */
	position: absolute;                   /* 親要素を基準 */
	padding: 5px;                         /* テキストの前後の余白 */
	background-color: rgba(0, 0, 0, 0.75);  /* 背景色（透明度） */
	width:100%;                          /* 吹き出し全体の幅 */
	right : 22%;                           /* 表示位置 */
	top : 100%;                           /* 表示位置 */
	margin-top : 5vw;                    /* 表示位置 */
	animation: popupAnime 1s linear;
	cursor: pointer;
}
.parkCreator_span_2nd{
	right : 30%;
}
.parkCreator_span:after{
  border-bottom: 25px solid rgba(0, 0, 0, 0.75);  /* 吹き出し口の高さ・色 */
  border-left: 10px solid transparent;   /* 吹き出し口の幅１／２ */
  border-right: 10px solid transparent;  /* 吹き出し口の幅１／２ */
  top: -25px;                            /* 吹き出し口の位置調整 */
  left : 48%;                         /* 吹き出し口の横位置 */
  content: "";                       /* コンテンツの挿入 */
  position: absolute;                /* 親要素を基準 */
}
.parkCreator_span_2nd:after{
  left : 40%;                         /* 吹き出し口の横位置 */
	position: absolute; 
}
@keyframes popupAnime{
 100%{ color : black; background:rgba(0, 0, 0, 0.75) }
  50%{ color : black; background:rgba(0, 0, 0, 0.25) }
   0%{ color : white; background:white   }
}
h2.creatorName{
	color: white;
	font-size: 100%;                       /* 文字サイズ */
}
h3.jobName{
	color: #ccc;
	font-size: 80%;                       /* 文字サイズ */
}



.sample2oya {
  position: relative;                  /* 指定した分だけ相対的に移動 */
  cursor   : pointer;                  /* カーソルをポインターで表示 */
}
.sample2,.sample4 {
  display: none;                        /* 要素を非表示 */
}
 /* --- 吹き出し ------------------ */
.sample20,.sample40 {
  position: absolute;                   /* 親要素を基準 */
  display: inline;                      /* インライン要素として表示 */
  padding: 5px;                         /* テキストの前後の余白 */
  background-color: rgba(0, 0, 255, 0.75);  /* 背景色（透明度） */
  width:100%;                          /* 吹き出し全体の幅 */
	right : 22%;                           /* 表示位置 */
  top : 100%;                           /* 表示位置 */
  margin-top : 5vw;                   /* 表示位置 */
  animation: sample2Anime 1s linear;
}
.sample20:after,.sample40:after{
  border-bottom: 25px solid rgba(0, 0, 255, 0.75);  /* 吹き出し口の高さ・色 */
  border-left: 10px solid transparent;   /* 吹き出し口の幅１／２ */
  border-right: 10px solid transparent;  /* 吹き出し口の幅１／２ */
  top: -25px;                            /* 吹き出し口の位置調整 */
  left : 40%;                         /* 吹き出し口の横位置 */
  content: "";                       /* コンテンツの挿入 */
  position: absolute;                /* 親要素を基準 */
}
@keyframes sample2Anime{
 100%{ color : black; background:rgba(0, 0, 255, 0.75) }
  50%{ color : black; background:rgba(0, 0, 255, 0.25) }
   0%{ color : white; background:white   }
}
.chakuseki_btn a{
	color: white;
	padding: 5px; 
	font-size: 100%;                       /* 文字サイズ */
	text-align: center;
	text-decoration: underline;
}.chakuseki_btn a:hover{
	color:red;
}