/*=============================================================*/
/*=====================　allページ　フォント========================*/


html{
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	color: #4F4C4B;
    letter-spacing: 0px;
    line-height: 24px;	
}
/*top　h2 タイトル*/
body.top section.sect .titleArea h2 span.en,
/*各ページ　h1 タイトル*/
body.lower #pageTitleArea h1 span,
/*sub*/
#sub .subBox .titleArea p span.en,
/*sub style カテゴリ*/
#sub-style .subBox .titleArea p span.en,
/*stylist*/
body.stylist #main .stylistBox .visualInfo .blogArea .titleArea h3 span.en,
body.stylist #main .stylistBox .visualInfo .calendar .titleArea h3 span.en,
body.stylist .sect02 h2,
body.stylist #main .stylistBox .txtInfo h2 span,
/*coupon*/
body.coupon #main section.sect01 .titleArea h3 span.en,
/*style　タイトル*/
body.style #main .sect02 .titleArea h3 span.en,
/*access & top_shop 店名*/
body.top .shopdate p.salonName,
/*top_gallery*/
body.top #main section.top_gallery ul.wrapper li h3,
/*top read more & stylist style 詳細　more  &  担当スタイル txt*/
body.stylist #main .sect02 .titleArea h3 span.en,
/*style lengh & gallery_menu*/
.length .titleArea p span.en,
.gallery_menu .titleArea p span.en,
body.gallery #main .gallery_title{
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    letter-spacing: 2px;
	text-transform: uppercase;
	color: #4F4C4B;
}





/*sub*/
#sub .subBox .titleArea p span.en{
	font-weight: normal;
	font-size: 20px;
}

/*top read more & stylist style 詳細　more  &  担当スタイル txt*/
body.stylist #main .sect02 .titleArea h3 span.en{
    font-size: 14px;
}






/* ---------selif end----- */

/*top_allshop*/
body.top #main section.top_allshop ul.wrapper li a.txt h3,
/*top 文字装飾*/
div#footerLogo p.salonName,
footer #footerInner #footerPolicy ul li a,
footer #footerInner #footerPolicy p{
    font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;	
}

/*日本語　英語　混在　明朝*/
body.top section.sect a.top_more,
body.top .top_news ul.wrapper li a.txt h3,
body.top #main section.top_blog ul.wrapper li a.txt h3,
body.top #main section.top_recruit ul.wrapper li a.txt h3,
#sub .subBox .wrapper article a.linkToArticle p.title,
body.news #main .sect .titleArea h3,
body.blog #main .sect .titleArea h3,
body.stylist #main .stylistBox .txtInfo p.staff_catch,
body.stylist #main .stylistBox .visualInfo .blogArea .wrapper article a.linkToArticle p.title,
body.style #main .sect02 ul.wrapper li a.txt h3,
body.style #main .styleBox .txtInfo h3,
body.media #main .sect02 ul.wrapper li a.txt h3,
.media-right,
body.company #main .sect h2,
body.recruit #main .sect h2,
body.concept #main .sect h2,
body.sitemap #main .shopdate ul a,
body.faq #main .sect .titleArea h3 span.jp,
body.coupon #main .result .couponArea .couponContent .txt h5,
body.style #main .couponArea .couponContent .txt h5,
body.stylist #main .couponArea .couponContent .txt h5,
body.coupon #main .result .couponArea .couponContent .txt a,
body.style #main .couponArea .couponContent .txt a,
body.stylist #main .couponArea .couponContent .txt a{
		font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	color: #4F4C4B;
}

/*日本語*/
body.top section.sect .titleArea h2 span.jp,
/*style カテゴリ*/
#sub-style .subBox .titleArea p span.jp,
/*style 小タイトル*/
body.style #main .sect02 .titleArea h3 span.jp,
/*access 小タイトル*/
body.access #main .shopdate h3 span.jp{
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	margin-left: 0;
}

/*グローバルメニュー*/
.Nav > ul > li a,
/*予約ボタン*/
.Nav ul.pcBtn li.reserve a,
/*style　スタイル名*/
body.style #main .styleBox .txtInfo h2,
/*coupon　ボタン*/
body.coupon #main section.sect01 .btn button,
/*お問合せページ*/
body.contact #main .btn input{
		font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;	
}

/*日本語　ゴシック*/
.top_h1 .logoArea h1 span.h1_span03,
.top_h1 .logoArea p,
header #headerInner ul.pcBtn li.reserve a span,
/*top*/
body.top section.sect.top_hairstyle ul.wrapper li .hair_number::before,
.top_topics .wrapper li p,
/*menu*/
body.menu #main .sect .table > tbody > tr > td:first-child > .serviceSubTxt,
/*style*/
.length ul a,
.gallery_menu ul a,
/*stylist*/
body.stylist #main .sect02 ul.wrapper_stylist li a.txt p,
.staff_name p,
body.stylist #main .stylistBox .txtInfo .career dl dd,
body.stylist #main .stylistBox .visualInfo .blogArea .wrapper article a.linkToArticle p.cont,
body.stylist #main .stylistBox .visualInfo .blogArea .wrapper article ul li.author a,
body.stylist #main .stylistBox .visualInfo .blogArea .wrapper article ul li.date a,
/*style stylist coupon*/
body.coupon #main .result .couponArea .couponContent .img p,
body.style #main .couponArea .couponContent .img p,
body.stylist #main .couponArea .couponContent .img p,
body.coupon #main .result .couponArea .couponContent .txt p.couponDetail,
body.style #main .couponArea .couponContent .txt p.couponDetail,
body.stylist #main .couponArea .couponContent .txt p.couponDetail,
body.coupon #main .result .couponArea h4,
body.style #main .couponArea p.coupon_target,
body.stylist #main .couponArea h4,
/*coupon　絞り込み*/
body.coupon #main section.sect01 .filterArea dl dd ul li,
/*news blog media 詳細ページ*/
body.news_details #main .articleTxt p,
body.blog_details #main .articleTxt p,
body.media_details #main .articleTxt p,
body.news_details #main .articleTxt,
body.blog_details #main .articleTxt,
body.media_details #main .articleTxt,
/*news blog　一覧*/
.txt_box .txt p.p_body,
.txt_box .txt p.blog_tag,
.txt_box .txt p.blog_staff{
	font-family: "游ゴシック",YuGothic,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",sans-serif;	
}


@media only screen and (max-width: 1024px){
	body.stylist #main .sect02 .titleArea h3 span.jp,
	body.stylist #main .stylistBox .visualInfo .blogArea .titleArea h3 span.jp,
	body.style #main .sect02 .titleArea h3 span.jp,
	body.top #main section.sect .titleArea h2 span.jp,
	#sub .subBox .titleArea p span.jp{
		font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
		letter-spacing: .04em;
	    margin-left: 0;
	}
}
@media only screen and (max-width: 425px){
}

/*=============================================================*/
/*=====================　allページ　========================*/
*{
	word-wrap: break-word;	
}

body{
	color: #4F4C4B;
}
#containerInner{
	overflow: hidden;
}

img{
	width: 100%;
}
body.news #main .articleTxt img,
body.blog #main .articleTxt img{
	margin: 0 auto!important;
	width: auto;
}
body.news #main .articleTxt p img,
body.blog #main .articleTxt p img{
	width: auto;
}
body.news #main .articleTxt p a img,
body.blog #main .articleTxt p a img{
	width: auto;
}

@media only screen and (max-width: 768px){
	body{

	}	
}
/*================== content mein area ======================================*/
a{
	color: #4F4C4B;
	display: block;
}
a:hover{
	opacity: 1;
}
a.img,a.img img{
	opacity: 1;	
	-webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}

a.img{
    display: block;
	opacity: 1;
	overflow: hidden;
	line-height: 0;

}
a.img:hover{
    display: block;
	opacity: 1;
}
/*
     -webkit-filter: brightness(100%);
     -moz-filter: brightness(100%);
     -o-filter: brightness(100%);
     -ms-filter: brightness(100%);
     filter: brightness(100%);

*/
a.img img{
	transform: scale(1.0);
}

a.img:hover img{
    display: block;
     -webkit-filter: brightness(40%) grayscale(200%);
     -moz-filter: brightness(40%) grayscale(200%);
     -o-filter: brightness(40%) grayscale(200%);
     -ms-filter: brightness(40%) grayscale(200%);
     filter: brightness(40%) grayscale(200%);
	transform: scale(1.1);

}
/* バグ回避対策　下記記述を加える */
@media only screen and (max-width: 1024px){
	a.img:hover img{
		filter: none;
	}
}

/* 下記記述すると画像表示バグが起こる　*/
/* safari　の㍶ではバグは起こらない。iPhoneやiPadのみ起こるバグ
https://iwb.jp/safari-css-filter-images-apply-bug/
 */
/*
a.img img{
     -webkit-filter: brightness(1.0);
     -moz-filter: brightness(1.0);
     -o-filter: brightness(1.0);
     -ms-filter: brightness(1.0);
     filter: brightness(1.0);
	transform: scale(1.0);
}
*/

/* all アニメーション　*/
.Nav .scroll-animation,
#mainVisual,
.anime00-A .scroll-animation,
.anime00-B .scroll-animation,
#content .scroll-animation,
.breadcrumb_box .scroll-animation{
	opacity: 0;
	animation-duration: 1s;
	animation-delay:0.8s;
	animation-timing-function:ease-in-out;
	animation-fill-mode:forwards;
}
.anime00-A .scroll-animation,
body.top #content .scroll-animation{
	animation-delay:0s;
}

.Nav  .is-animated{
	animation-name: logo_up;
}

.top_h1 .logoArea{
    animation-duration: 1s;
    animation-delay: 0.8s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    transform: translate(0px,-20px);
    animation-name: logo_up;	
}

@keyframes logo_up{
0%{
	transform: translate(0px,-20px);
	opacity: 0;
	}
90%{
	transform: translateY(0px);
	}
100%{
	transform: translateY(0px);
	opacity: 1;
	}
}
#mainVisual{
	animation-name:is-animated00;	
}
@keyframes is-animated00{
0%{
	opacity: 0;
	}
100%{
	opacity: 1;
	}
}
.anime00-A .is-animated{
	animation-name:is-animated00-A;	
}
@keyframes is-animated00-A{
0%{
	transform: translate(0px,20px);
	opacity: 0;
	}
90%{
	transform: translateY(0px);
	}
100%{
	transform: translateY(0px);
	opacity: 1;
	}
}
.anime00-B .is-animated{
	animation-name:is-animated00-B;	
}
@keyframes is-animated00-B{
0%{
	transform: translate(0px,20px);
	opacity: 0;
	}
90%{
	transform: translateY(0px);
	}
100%{
	transform: translateY(0px);
	opacity: 1;
	}
}
#content .is-animated{
	animation-name:is-animated_content;	
}
@keyframes is-animated_content{
0%{
	transform: translate(0px,20px);
	opacity: 0;
	}
90%{
	transform: translateY(0px);
	}
100%{
	transform: translateY(0px);
	opacity: 1;
	}
}
.breadcrumb_box .is-animated{
	animation-name:is-animated_content;	
}
@keyframes is-animated_content{
0%{
	transform: translate(0px,20px);
	opacity: 0;
	}
90%{
	transform: translateY(0px);
	}
100%{
	transform: translateY(0px);
	opacity: 1;
	}
}

/*==================================================================*/
/*=====================　各ページ　header　========================*/
header{
	border-top:none;
    position: relative;
    width: 100%;
    height: 0px;
    z-index: 50;
    top: 0;
}
header #headerInner{
    width: 100%;
	padding: 0;
	max-width: 1920px;
}
header #headerInner .logoArea{
	position: relative;
    left: 0;
    top: 0;
	margin: 0px 0 0 10px;
}
header #headerInner .logoArea a.logo{
	width: 170px;
}
@media only screen and (max-width: 1024px){
	header{
	    height: 52px;
		position: fixed;
	}
	header #headerInner ul.spReserve{
	    margin: 0 auto;
	    width: 100%;
    	padding: 5px 0 15px;
	    position: fixed;
		bottom: 0;
		background: rgba(255, 255, 255, 0.8);
	}
	header #headerInner ul.spReserve li{
		width: 50%;
	}
	header #headerInner ul.spReserve li:nth-child(2){
	    border-left: solid 1px #ccc;
	}
	header #headerInner ul.spReserve li a{
		border: none;
	    padding: 0;
		color: #4F4C4B;
		font-size: 14px;
	}
	header #headerInner ul.spReserve li a span,
	header #headerInner ul.spReserve li a img{
		display: inline-block;
	}
	header #headerInner ul.spReserve li a img{
		margin: 0 10px 5px 0;
		height: 20px;
		width: 20px;
	}
	header #headerInner ul.spReserve li a span{
		padding: 2px;	
	}
	header #headerInner .logoArea a.logo{
    	margin-left: 0;	
	}	
}

/*---- sns ボタン start ----*/
.snsBtn_top{
    width: 30px;
    height: 100vh;
    position: absolute;
    right: 10px;
    overflow: hidden;
}
.snsBtn_top_inner{
	position: absolute;
    top: 50%;
    right: 0;
	z-index: 150;
	margin: -100px -25px 0 0;
}

.snsBtn_top_p{
	transform: rotate(90deg);
    color: #fff;
    font-size: 14px;
    text-transform: uppercase;
    font-weight: bold;
    height: 22px;
	position: relative;
    padding: 0px 14px 0 16px;
}
.snsBtn_top_p::before{
	content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 10px;
    height: 4px;
    border-bottom: solid 1px;
    transform: rotate(-60deg);
    margin: -3px 0 0 0;
}
.snsBtn_top_p::after{
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    width: 10px;
    height: 4px;
    border-bottom: solid 1px;
    transform: rotate(-60deg);
    margin: -3px 0 0 0;
}
.snsBtn_top ul{
	width: 20px;
	margin: 40px auto 0;
}

.snsBtn_top li{
    width: 20px;
    margin-bottom: 9px;
    text-align: center;
}


@media only screen and (min-width: 1025px){
	header #headerInner{
	    min-height: inherit;
	}	
}
@media only screen and (max-width: 1024px){
	.snsBtn_top{
		right: 0;
		width: auto;
		overflow: unset;
		height: auto;
	}
	.snsBtn_top_inner{
		top: 0;
		z-index: 150;
		right: 0;
		margin: 12px 90px 0 0;
		display: flex;
		width: 140px;
	}
	.snsBtn_top_p{
	    transform: rotate(0deg);
	}
	.snsBtn_top ul{
	    width: 100%;
		display: flex;
		justify-content: space-between;
		margin: 0 0 0 10px;
	}
	.snsBtn_top li{
		margin-right: 5px;
	}
}
@media only screen and (max-width: 425px){
	.snsBtn_top_inner{
		margin-right: 60px;
	}
}
/*---- sns ボタン end ----*/


/*---- nav ボタン start ----*/
.Nav{
    top: 0;
    z-index: 100;
	position: relative;
	margin: 0;
	width: 100%;
	padding: 10px 0 0;
	box-sizing: border-box;
}
.Nav::before{
	content: "";
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	height: 100px;
    background: rgba(255, 255, 255, 0.5);
    animation-duration: 0.8s;
    animation-delay: 1s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    transform: translate(0px,-30px);
    animation-name: bg_down;
}
@keyframes bg_down{
0%{
	transform: translate(0px,-30px);
	opacity: 0;
	}
90%{
	transform: translateY(0px);
	}
100%{
	transform: translateY(0px);
	opacity: 1;
	}
}
.Nav > ul{
	text-align: right;
    width: calc(100% - 200px);
    max-width: 100%;
	margin: 0px 20px 0 auto ;
}
.Nav ul.pcBtn{
	margin: 0 ;
}

.Nav > ul > li{
	padding: 5px 0;
}
.Nav > ul > li a{
    padding: 0;
	margin-left: 23px;
	font-size: 12px;
	background: none;
    color: #4F4C4B;
	letter-spacing: 1.2px;
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}

.Nav > ul > li:last-child a{
	padding-right: 0;
}

.Nav > ul > li a span{
	font-size: 12px;
    letter-spacing: -0.4px;
	text-align: center;
    margin-top: 4px;
	display: none;
}
.Nav > ul > li a:hover{
    color: #4F4C4B;
    opacity: 1;
    text-decoration: line-through;
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}
.Nav > ul > li a img,
.footer_nav img,
.main_page_link img{
    width: 10px;
    margin: 0 4px 4px 0;
}
.Nav .logoArea{
	position: absolute;
    top: 0;
    left: 0px;

	opacity: 0;
    background: #fff;
    padding: 30px 30px 20px;
    margin: 0;
    width: 180px;
    box-sizing: border-box;
}

.Nav .logoArea a.logo{
	display: block;
	margin-bottom: 10px;
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}
.Nav .logoArea a.logo:hover img{
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
    transform: scale(0.95);
}
body.top .Nav .is-logoArea{
	display: block;
}
.Nav ul.pcBtn li.reserve a{
	display: flex;
    align-items: center;
    padding: 0px;
    text-decoration: none;
    font-size: 16px;
	background: none;
    color: #4F4C4B;
    box-sizing: border-box;
    height: auto;
    width: 103px;
    margin: 0 auto;
	text-align: center;
	overflow: hidden;
	text-transform: uppercase;
}
.Nav ul.pcBtn li.reserve a:hover{
	color: #4F4C4B;
	opacity: 1;
}
.Nav ul.pcBtn li.reserve a:hover::before{
	transform: translateX(-115%) skewX(60deg);   
}
.Nav ul.pcBtn li.reserve a img{
	width: 20px;
	margin-right: 10px;
    margin-bottom: 5px;
}

@media only screen and (max-width: 1024px){
	.Nav{
		top: 0;
		width: 100%;
		left: 0;
		position: fixed;
		z-index: 1000;
		display: flex;
		align-items: center;
		padding: 0;
		box-sizing: border-box;
	}
	.Nav::before{
	    display: none;
	}
	.Nav .navbtn{
	    right: 0;
		top: 0;
		z-index: 1000;
		margin: 0;
		padding: 10px;
		background: rgba(255, 255, 255, 0.5);
	}
	.Nav .navbtn a,
	.Nav .navbtn a.close{
	    background: none;
	    width: 40px;
    	height: 40px;
	}
	.Nav .navbtn a span::after,
	.Nav .navbtn a.close span::after,
	.Nav .navbtn a::before,
	.Nav .navbtn a.close::before,
	.Nav .navbtn a::after,
	.Nav .navbtn a.close::after{
		background: #4F4C4B;
	    width: 30px;
    	left: 5px;
	}
	.Nav .navbtn a.close::before,
	.Nav .navbtn a.close::after{
	    width: 22px;
    	left: 13px;
	}
	.Nav > ul{
		z-index: 100;
		position: relative;
		text-align: center;
		width: 50%;
		height: 100vh;
		padding: 50px 0 0;
		margin: 0 auto;
		background: rgba(238, 238, 238, 0.95);
	}
	.Nav > ul.nav_space{
		display: none!important;
	}
	.Nav > ul > li{
		width: 100%;
		border-bottom: none;
		margin: 0;
	}
	.Nav > ul > li a{
	    padding: 0;
		margin: 0;
	}
	.Nav ul.pcBtn{
		margin: 0 auto;
	}
	.Nav ul.pcBtn li.reserve a::before{
		height: 80px;
		width: 500px;
	}
	.Nav ul.spReserve{
		display: none;
		padding: 0;
	}
	.Nav .logoArea{
	    padding: 20px 20px 16px;
		width: 150px;
	}
}

@media only screen and (max-width: 640px){
	.Nav .logoArea{
		width: 100px;
		padding: 10px 16px 5px;
	}
	.Nav .logoArea a.logo{
		margin-bottom: 3px;
	}
	.Nav ul.pcBtn li.reserve a{
	    font-size: 14px;
	}
	.Nav ul.pcBtn li.reserve a img{
		width: 16px;
    	margin-right: 5px;
	}
}

/*---- nav ボタン end ----*/

/*-------------クローンナビ装飾------------------------------------------------*/
.clone-nav,
body.top .clone-nav {
    position: fixed;
    top: 0;
    left: 0;
    z-index:1000;
    width: 100%;
    transition: .3s;
    transform: translateY(-550%);
	background: rgba(255, 255, 255, 1);
	max-width: 100%;
	padding-top: 5px;
	padding-bottom: 0;

}
.is-show,body.top .is-show {
    transform: translateY(0);
}
nav#footerNav.is-show ,body.top nav#footerNav.is-show{
    transform: translateY(-440%)
}
@media only screen and (max-width: 1024px){
	.clone-nav,.clone-nav ul, body.top .clone-nav ul{
		display: none;
	}
}

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

/*=============================================================*/
/*=====================　footer　========================*/
footer{
	padding: 0;
    padding: 10px 0 0;
    background: rgba(245, 245, 245, 0.3);
}
div#footerInner{
    padding: 20px 0 0;
    background: rgba(245, 245, 245, 0.7);
}
footer #footerInner #footerContent{
    width: 100%;
    margin: 0 auto;
    padding: 60px 0;
    background: #efefef;
	flex-direction: column;
}
div#footerInfo{
    display: flex;
    margin: 0px auto 10px;
    width: 90%;
    max-width: 1000px;
    align-items: center;
}
.footer_shop{
    display: flex;
    align-items: center;
    width: 100%;
    margin: 0 10% 0 0;
    border-top: solid 1px #fff;
    border-bottom: solid 1px #fff;
    padding: 10px 0;
    position: relative;
}
.footer_shop .ggmap{
	width: 30%;
    padding-bottom: 160px;
    min-width: 200px;
}
.ggmap{
    filter: grayscale(100%);
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}
.ggmap:hover{
    filter: grayscale(0%);
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}
.footer_shop_data{
    font-size: 13px;
    box-sizing: border-box;
    width: 100%;
    padding: 20px 20px 20px;
    line-height: 22px;
    position: relative;
}
.footer_tel{
	display: flex;
	font-size: 20px;
	font-weight: bold;
}
.footer_shop_data .footer_tel img{
	width: 20px;
    margin-right: 10px;
    margin-bottom: 5px;
}
a.footer_tel,
a.footer_tel span.top_more_arrow{
	width: 170px;
}
a.footer_info,
a.footer_info span.top_more_arrow{
	width: 95px;
    margin: 0 0 0 auto;
}
.footer_shop_data a.top_more:hover span{
	color: #4F4C4B;
}
a.top_more.footer_info{
    position: absolute;
    right: 0;
    margin: 0 0px 0 0;
}
.footer_shop_data table{
    margin: 0 0 10px;
}
.footer_shop_data tr{
    align-items: flex-start;
    display: flex;
}
.footer_shop_data td:first-child{
    width: 90px;
	min-width: 90px;
}
.footer_shop_data td:last-child{
	width: 100%;
}


/*------ footer nav start -------*/
.footer_nav{
    margin: 0 auto;
    max-width: 1000px;
    width: 90%;
}
.footer_nav ul{
	display: flex;
    justify-content: space-between;
    margin: 0 auto;
    width: 100%;
    max-width: 600px;
}
.footer_nav ul a{
	font-size: 12px;
	-webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}
.footer_nav a:hover{
    text-decoration: line-through;
	-webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;	
}
.footer_logo{
	width: 140px;
	margin: 0 auto;
	min-width: 140px;
}
.footer_logo a{
    margin: 0 auto;
    width: 100%;
    height: auto;
    text-align: center;
}
.footer_logo p.salonName{
    margin-bottom: 20px;
	font-size: 13px;
}
footer #footerInner #footerPolicy{
	background: none;
	padding: 0;
}
footer #footerInner #footerPolicy p{
    float: none;
    text-align: center;
	    color: #4F4C4B;
}
@media only screen and (max-width: 1024px){
	footer #footerInner{
	    padding-bottom: 50px;
	}
	div#footerInfo{
	    flex-direction: column-reverse;
	}
	footer #footerInner #footerContent #footerInfo{
		margin: 0 auto 10px;
	}
	.footer_shop{
	    margin: 0 auto;
	}
}
@media only screen and (max-width: 640px){
	footer #footerInner #footerContent{
		padding: 30px 0;
	}
	.footer_shop{
	    flex-direction: column;	
	}
	.footer_shop_data{
	    padding: 20px 0;
	}
	.footer_shop .ggmap{
		width: 100%;
	    padding-bottom: 100px;
	}
	.footer_nav ul{
	    flex-wrap: wrap;
	}
	.footer_nav ul li{
	     margin-right: 23px;
	}
}


/*=============================================================*/
/*=====================　各ページ　content　========================*/
body.lower #content{
	width: 80%;
    max-width: 1200px;
	margin: 30px auto 60px;
}
body.lower #content #main{
	width: 100%;
	padding: 0%;
	height: 100%;
}
body.lower.onecolumn #content #main{
	width: 100%;
	padding: 0%;
	margin: 0;
	height: auto;
}
#main{
	width: 100%;
	padding: 0%;
	height: auto;
}
@media only screen and (max-width: 1024px){
	body.lower #content{
		width: 90%;
		padding: 0;
		margin: 30px auto;
	}
	#content{
		padding: 0;
	}
	body.lower #content #main{
	    margin-bottom: 60px;
	}
}
@media only screen and (max-width: 768px){
}
@media only screen and (max-width: 425px){
}
    
/*=============================================================*/
/*=====================　各ページタイトル　========================*/
body.lower #pageTitleArea{
	margin: 0px auto 0px;
	height: auto;
    padding: 0;
	position: relative;	
	background:url(/img/upload/2020/03/peghair_pageTitleArea_bg01.jpg)center center;
	background-size: cover;
	overflow: hidden;
}
body.lower #pageTitleArea h1{
    text-align: center;
	position: relative;
	padding: 0px 0;
	font-size: 16px;
    max-width: 400px;
    margin: 120px auto 80px;
	width: 80%;
	color: #fff;
}
body.lower #pageTitleArea h1::before{
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    margin: -88px 0 0 -465px;
    background: url(/img/upload/2020/02/peghair_pageTitleArea_bg02.png)center center;
    background-size: cover;
    max-height: 700px;
    width: 930px;
    height: 574px;
    opacity: 0.6;
}
body.lower #pageTitleArea h1 span{
    font-size: 26px;
	margin-bottom: 0px;
    display: block;
    font-weight: bold;
    color: #fff;
}
body.lower #pageTitleArea p{
    margin: -3% 0 1px 10%;
    font-size: 16px;
}
@media only screen and (max-width: 1024px){
	body.lower #pageTitleArea{
		height: auto;
		margin: 0 auto;
		padding-top: 0;
		width: 100%;
	    min-height: auto;
	}
	body.lower #pageTitleArea h1{
		font-size: 14px;
	    padding: 0px 0;
    	margin: 100px auto 60px;
	}
	body.lower #pageTitleArea h1::before{
	    width: 600px;
		height: 370px;
		margin: -80px 0 0 -300px;
	}
}
@media only screen and (max-width: 640px){
	body.lower #pageTitleArea h1 span{
	    font-size: 20px;
	}
}
@media only screen and (max-width: 425px){	
}

/*=============================================================*/
/*=====================　各ページ　サブエリア　========================*/
#sub{
    width: 30%;
    padding: 0%;
    margin: 0 0 0 3%;
    color: #fff;
}


#sub .subBox{
    padding: 40px 20px 20px;
	border-top: double 3px #eee;
    border-left: solid 1px #eee;
	margin: 0 auto 30px;
}

#sub .subBox .titleArea{
	border: none;
    width: 100%;
    margin: 0 auto 6px;    
	border-bottom: solid 2px #fff;
}
#sub .subBox a,
#sub .subBox .titleArea a,
#sub .subBox ul li a,
#sub .subBox ul li.subyear{
	color: #4F4C4B;
    text-decoration: none;
    float: none;
    padding: 0;
	position: relative;
	margin: 0;
	width: fit-content;
}
#sub .subBox a:hover,
#sub .subBox ul li a:hover,
#sub .subBox ul li.subyear:hover{
	opacity: 1;
	color: #006688;
}
#sub .subBox ul li.subyear,
#sub .subBox ul li.subyear:hover{
	-webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}
#sub .subBox ul li.subyear::before{
    border-bottom: solid 1px #4F4C4B;
    border-right: solid 1px #4F4C4B;
    top: 4px;
	width: 8px;
	height: 8px;
	-webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}
#sub .subBox ul li.subyear:hover::before{
    border-bottom: solid 1px #006688;
    border-right: solid 1px #006688;
	-webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}
#sub .subBox a span{
	text-transform: uppercase;
}
#sub .subBox .titleArea a span{
    background: none;
    padding-right: 0;
    text-decoration: none;
}
#sub .subBox a::before,
#sub .subBox ul li a::before{
	content:"";
	width: 0%;
	height: 1px;
	position: absolute;
	bottom: 0;
	left: 0;
	background: #4F4C4B;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}
#sub .subBox a:hover::before,
#sub .subBox ul li a:hover::before{
	width: 100%;
	background: #006688;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}
#sub .subBox .titleArea p{
	float: none;
    color: #4F4C4B;
}
#sub .subBox .titleArea p span.jp{
	margin: 4px 0 10px;
    display: none;

}

#sub #subStaff ul li a, 
#sub #subCategory ul li a,
#sub #subFaq ul li a,
#sub #subNewscate ul li a,
#sub #subMedicate ul li a,
#sub #subBlogcate ul li a,
.subyear{
	color: #4F4C4B;
    margin: 0 0 10px;
    padding: 0 0 3px;
    position: relative;
}
#sub #subStaff ul li a:hover, 
#sub #subCategory ul li a:hover,
#sub #subFaq ul li a:hover,
#sub #subNewscate ul li a:hover,
#sub #subMedicate ul li a:hover,
#sub #subBlogcate ul li a:hover,
.subyear:hover,
#sub .subBox a:hover{
	color: #006688;
}

/* #sub category */



/*  #subStyle  */
#sub #subStyle ul.wrapper{
	display: flex;
	justify-content: space-between;
}
#sub #subStyle ul.wrapper li{
	width: 50%;
    margin: 0;
}
#sub #subStyle ul.wrapper li a.img{
	margin: 0;
	display: block;
}
#sub #subStyle ul.wrapper li a.txt{
	display: none;
}

/* #sub blog & news */
#sub .subBox .wrapper article ul li.date{
	padding: 0;
}
#sub .subBox .wrapper article ul li a{
    text-decoration: unset;
    padding-bottom: 3px;
}
#sub .subBox .wrapper{
	margin: 0 auto;
}
#sub .subBox .wrapper article{
    margin-top: 20px;
}

#sub .subBox .wrapper article p.category{
	padding: 0px 5px;
    width: 100%;
    box-sizing: border-box;
    margin: 5px auto;
    background: #f5f5f5;
    color: #4F4C4B;
    text-align: left;
}
#sub .subBox .article_box{
	width: 100%;
}
#sub .subBox .article_box::before{
	display: none;
}
#sub .subBox .article_box_inner{
	padding: 5px;
    font-size: 13px;
    line-height: 1.5;
}
#sub .subBox .article_box_inner p.cont
#sub .subBox .article_box_inner p.staff{
	margin-bottom: 0;
}

#sub .subBox .article_box_inner .more{
    display: block;
    padding-top: 10px;
    font-size: 1.1rem;
    text-decoration: none;
    text-align: left;
    width: fit-content;
	color: #4F4C4B!important;
	position: relative;
}
#sub .subBox .article_box:hover div.more{
	color: #006688!important;
}
#sub .subBox .article_box_inner .more::before{
    content: "";
    width: 0%;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    background: #4F4C4B;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}
#sub .subBox .article_box:hover div.more::before{
    width: 100%;
    background: #006688;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}

/*sub blog*/
#sub #BlogSearch{
	padding: 0;
    border: none;
}
dl.search2 dd button{
	cursor: pointer;
    background-color: #888;
    border: 1px solid #888;
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}
dl.search2 dd button:hover{
    background-color: #006688;
    border: 1px solid #006688;
	-webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}



@media only screen and (max-width: 1024px){
	#sub{
		width: 100%;
		margin: 20px auto;
	}
	#sub .subBox,
	#sub #subNews{
    	margin-bottom: 20px;
	}
	#sub .subBox .wrapper{

	}
	#sub .subBox .titleArea{
		padding: 0;
		margin: 0 auto 10px 0;
	}
	#sub #subStaff ul li a,
	#sub #subCategory ul li a,
	#sub #subMedicate ul li a,
	#sub #subBlogcate ul li a,
	#sub #subNewscate ul li a,
	#sub #subFaq ul li a{
		border-bottom: none;
	}
	#sub #subStyle ul.wrapper{
	    display: flex;
    	justify-content: space-between;
	}
	#sub #subStyle ul.wrapper li{
		width: 25%;
	}
	#sub #subStyle ul.wrapper li,
	#subNewscate ul.wrapper li{
		margin: 0;
	}
	#sub .subBox .titleArea p{
		padding: 0;
	}
	#sub .subBox .titleArea p span.jp{
		font-size: 12px;
	}
}
@media only screen and (max-width: 640px){
	#sub .subBox{
		padding: 20px 10px 10px;
	}
}

/*=============================================================*/
/*=====================　sidebar ブログコンテンツ下　========================*/
#sidebar{
	width: 80%;
    max-width: 1200px;
    margin: 10px auto 100px;
}

#sidebar .subBox{
    width: 100%;
    display: inline-block;
    vertical-align: top;
    margin: 0;
}
#sidebar .subBox .titleArea{
	border: none;
    width: 70%;
}
#sidebar .subBox .titleArea p{
    font-weight: bold;
}
#sidebar .subBox .titleArea p span.jp{
	display: none;
}
#sidebar .subBox .titleArea p span.en{
	font-size: 2.4rem;
}
#sidebar #subBlogcate ul li{
	width: 20%;
	display: inline-block;
}
#sidebar #subBlogcate ul li a{
	display: block;
    margin: 0 auto 10px;
    padding: 5px 0;
	color: #4F4C4B;
    font-size: 1.4rem;
}

@media only screen and (max-width: 768px){
	#sidebar #subBlogcate ul li{
		width: 33%;		
	}

}
/*=============================================================*/
/*=====================　スタイリスト詳細　========================*/
body.stylist #content{
	
}
body.stylist_details #content #main,
body.style_details #content #main{

}
body.stylist #main .stylistBox{
    flex-direction: column;
	margin: 0 auto 60px;
}
body.stylist #main .stylistBox:first-child{
    background: #f5f5f5;
}
.staff_name{
    background: rgba(255, 255, 255, 0.6);
    position: relative;
    margin: 0;
    box-sizing: border-box;
    width: 40%;
    padding: 10px;
}
.staff_name h2{
	font-size: 26px;
    text-transform: uppercase;
    margin: 0;
	position: relative;
    line-height: 29px;
    margin-bottom: 20px;
}
.staff_name h2 span{
    font-size: 14px;
}
.staff_name p{
	font-size: 14px;
    margin: 0;
	
}
body.stylist #main .stylistBox .visualInfo{
	width: 100%;
    display: flex;
}
body.stylist #main .stylistBox .photo{
    width: 90%;
    overflow: hidden;
    margin: 0 0 0 auto;
    display: flex;
    align-items: center;
}
body.stylist #main .stylistBox .photo img{
    width: 60%;
    margin: 0;
}
body.stylist #main .stylistBox .staff_calendar_blog{
	width: 100%;
	display: flex;
}
.staff_calendar_blog .calendar{
	width: 400px;
}
.staff_calendar_blog .blogArea{
	border-left: solid 1px #eee;
	padding: 0 0 0 20px;
	margin: 0 0 0 20px;
	width: 100%;
	box-sizing: border-box;
}
.staff_calendar_blog .blogArea article{
	display: flex;
	margin-bottom: 10px;
}
.staff_calendar_blog .blogArea article:last-child{
	margin-bottom: 0;
}
.staff_calendar_blog .blogArea ul{
	display: flex;
	flex-flow: column;
    margin: 0;
}
.staff_calendar_blog .blogArea ul li{
	margin-bottom: 2px;
}
.staff_calendar_blog .blogArea ul li a.img{
	display: block;
	width: 100px;
}
.staff_calendar_blog .blogArea a.linkToArticle{
    display: block;
    width: 100%;
    margin-left: 3%;
    padding: 10px;
    box-sizing: border-box;
}
body.stylist #main .stylistBox .visualInfo .blogArea .wrapper article a.linkToArticle p.cont{
	font-size: 12px;
	line-height: 22px;
}

/*-------- カレンダー　start ----------*/
body.stylist #main .stylistBox .visualInfo .calendar .calendarInner{
	border: solid 1px #aaa;
}
body.stylist #main .stylistBox .visualInfo .calendar .calendarInner .month{
    background-color: #aaa;
    padding: 10px 20px 5px;
    height: 20px;
    color: #fff;
    text-align: center;
    display: -webkit-flex;
    display: flex;
    -webkit-justify-content: space-between;
    justify-content: space-between;
}
body.stylist #main .stylistBox .visualInfo .calendar .calendarInner.active{
    display: block;
}
body.stylist #main .stylistBox .visualInfo .calendar .calendarInner .month a{
    display: block;
    font-size: 0.8rem;
    color: #fff;
}
body.stylist #main .stylistBox .visualInfo .calendar .calendarInner .month span{
	font-size: 14px;
}

/*-------- カレンダー　end ----------*/

body.stylist #main .stylistBox .txtInfo{
	width: 100%;
	color: #666;
	position: relative;
}
body.stylist #main .stylistBox .txtInfo h2{
    font-size: 20px;
	color: #4F4C4B;
	line-height: 22px;
	margin: 0 0 10px;
	font-weight: bold;
	padding-bottom: 5px;
}

body.stylist #main .stylistBox .txtInfo h2 span{
	margin-left: 0;
	font-size: 15px;
}
body.stylist #main .stylistBox .txtInfo p.job{
    font-size: 14px;
	color: #888;
    margin-bottom: 4px;
    width: auto;
}

body.stylist #main .stylistBox .staff_name ul.sns{
    display: flex;
	margin: 0;
}
body.stylist #main .stylistBox .staff_name ul.sns li{
	width: 20px;
    margin-left: 3px;
}
body.stylist #main .stylistBox .txtInfo p{
	
}
.txtInfo_left{
	display: flex;
    margin: 20px 0 20px 20px;
}
.staff_catch_comment{
    width: 40%;
    margin: -60px auto 0px 20px;
}
.staff_catch_comment_inner{
    box-sizing: border-box;
    margin-bottom: 20px;
    background: rgba(255, 255, 255, 0.8);
    padding: 20px;
    position: relative;
}
p.staff_catch{
	font-size: 16px;
    width: 100%;
    padding: 10px 0 10px;
    line-height: 24px;
    margin-bottom: 10px;
    box-sizing: border-box;
    color: #4F4C4B;
    font-weight: bold;
    border-bottom: dotted 1px #d7d7d7;
}
p.staff_comment{
	font-size: 14px;
    color: #888;
    line-height: 24px;
    margin: 0;
}
body.stylist #main .stylistBox .txtInfo .career{
	color: #4F4C4B;
	margin-bottom: 0;
    width: 60%;
}
body.stylist #main .stylistBox .txtInfo .career dl{
    width: 100%;
    display: flex;
    align-items: flex-start;
    margin-bottom: 20px;
}
body.style #main .styleBox .txtInfo .box dl{
	border: none;
	width: 100%;
	display: flex;
    padding: 0 10px;
    box-sizing: border-box;
}
body.stylist #main .stylistBox .txtInfo .career dl dt{
    font-size: 14px;
    min-width: 140px;
	width: 140px;
	position: relative;
}
body.stylist #main .stylistBox .txtInfo .career dl dd{
    overflow: unset;
    width: fit-content;
    display: block;
    margin: 0;
    color: #888;
    font-size: 14px;
    line-height: 24px;
    box-sizing: border-box;
	width: 100%;
}
.staffs_movie_inner{
    width: 100%;
    height: 0;
    position: relative;
    padding-bottom: 56.25%;
}
.staffs_movie_inner iframe{
    position: absolute;
    width: 100% !important;
    height: 100% !important;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}
body.stylist #main .stylistBox .visualInfo .blogArea .titleArea a{
	text-decoration: none;
}
body.stylist #main .stylistBox .txtInfo .blogArea .titleArea a span{
	background: none;
}
body.stylist #main .stylistBox .visualInfo .blogArea .wrapper article ul li.author a,
body.stylist #main .stylistBox .visualInfo .blogArea .wrapper article ul li.date a{
	text-decoration: none;
	font-size: 12px;
	margin: 0;
    line-height: 15px;
}
body.stylist .sect02{
    margin: 0 0 60px;
    position: relative;
	
}
body.stylist .sect02:last-child{
	margin-bottom: 0;
}
body.stylist_details #main .sect02{
    border: none;
    padding: 0;
	
}
body.stylist #main .sect02 .titleArea a{
	text-decoration: none;
}

body.stylist #main .stylistBox .visualInfo .blogArea .titleArea h3,
body.stylist #main .stylistBox .visualInfo .calendar .titleArea h3,
body.stylist #main .sect02 .titleArea h3,
body.style #main .sect02 .titleArea h3{
    float: left;
    margin: 0;
    padding: 0 0 4px ;
    color: #4F4C4B;
    font-weight: normal;
    line-height: 22px;
}

body.stylist #main .sect02 .titleArea h3 span.en,
body.stylist #main .stylistBox .visualInfo .blogArea .titleArea h3 span.en,
body.stylist #main .stylistBox .visualInfo .calendar .titleArea h3 span.en,
body.style #main .sect02 .titleArea h3 span.en{
    font-size: 24px;
	font-weight: normal;
}
body.stylist #main .stylistBox .visualInfo .blogArea .titleArea h3,
body.stylist #main .stylistBox .visualInfo .calendar .titleArea h3,
body.stylist #main .stylistBox .visualInfo .blogArea .titleArea a,
body.stylist #main .stylistBox .visualInfo .blogArea .wrapper article a.linkToArticle p.title,
body.stylist #main .sect02 .titleArea h3{
	color: #4F4C4B;	
}
body.stylist #main .stylistBox .visualInfo .blogArea .wrapper article ul li.date a,
body.stylist #main .stylistBox .visualInfo .blogArea .wrapper article ul li.author a,
body.stylist #main .stylistBox .visualInfo .blogArea .wrapper article a.linkToArticle p.cont{
	color: #888;
}
body.stylist #main .stylistBox .visualInfo .blogArea .wrapper article a.linkToArticle p.title{
	font-size: 14px;
	font-weight: bold;
	margin: 10px 0;
}
body.stylist #main .sect02 .titleArea{
	border-bottom: none;
}



/*stylist style  taitle*/
body.stylist #main .stylistBox .visualInfo .blogArea .titleArea,
body.stylist #main .stylistBox .visualInfo .calendar .titleArea,
body.stylist #main .sect02 .titleArea,
body.style #main .sect02 .titleArea{    
    clear: both;
    margin: 0px auto 20px;
	border: none;
}
body.stylist #main .stylistBox .visualInfo .blogArea .titleArea h3 span.jp,
body.stylist #main .stylistBox .visualInfo .calendar .titleArea h3 span.jp,
body.stylist #main .sect02 .titleArea h3 span.jp,
body.style #main .sect02 .titleArea h3 span.jp{
	color: #4F4C4B;
    display: block;
    margin: 0;
    font-size: 12px;
}

/*stylist style  more*/

@media only screen and (max-width: 1024px){
	body.stylist #main .stylistBox .txtInfo p.staff_catch{
		width: 100%;
		top: 0%;
		left: 0%;
		text-align: center;
	}
	body.stylist #main .stylistBox .visualInfo{
		display: flex;
		width: 100%;
	}
	body.stylist #main .stylistBox .visualInfo .photo,
	.staff_calendar_blog{
		display: flex;
	    flex-direction: column;
		width: 50%;
	}
	body.stylist #main .stylistBox .visualInfo .calendar{
		width: 400px;
	}

	.staff_calendar_blog .blogArea{
		width: 100%;
    	box-sizing: border-box;
		
	}
	body.stylist #main .stylistBox .visualInfo .calendar .calendarInner{
		border: 1px solid #eee;
	}
	body.stylist #main .stylistBox .txtInfo h2{
		margin: 20px 0 10px;	
	}
	body.stylist #main .stylistBox .staff_name ul.sns li{

	    padding-left: 2px;
	}
	body.stylist #main .stylistBox .visualInfo .blogArea .titleArea,
	body.stylist #main .stylistBox .visualInfo .calendar .titleArea,
	body.stylist #main .sect02 .titleArea,
	body.style #main .sect02 .titleArea{
	    padding-bottom: 4px;
	}
	body.stylist #main .stylistBox .txtInfo h2 span{
	    font-size: 14px;
	}
	body.stylist #main .stylistBox .visualInfo .blogArea .titleArea h3,
	body.stylist #main .stylistBox .visualInfo .calendar .titleArea h3,
	body.stylist #main .sect02 .titleArea h3{
		margin: 0;
		padding: 0;
		color: #4F4C4B;
		font-weight: normal;
		letter-spacing: 0.1em;
		font-size: 22px;
	}
}
@media only screen and (max-width: 640px){
	body.stylist #main .stylistBox .visualInfo{
		display: block;
	}
	body.stylist #main .stylistBox .photo img{
		width: 100%;
	}
	body.stylist #main .stylistBox .photo,
	body.stylist #main .stylistBox .visualInfo .staff_calendar_blog{
		width: 100%;
		display: block;
	    margin: 0 auto;
	    max-width: 100%;
	}
	.staff_name{
	    margin: 0 auto -14px 0;
	}
	.staff_name h2{
	    font-size: 24px;
	    line-height: 24px;
	    margin-bottom: 10px;
	}
	.staff_name p{
		font-size: 12px;
	}
	.txtInfo_left{
	    flex-direction: column-reverse;
		margin: 20px;
	}
	.staff_catch_comment{
		width: 100%;
	}
	.staff_catch_comment_inner{
		margin: -60px auto 20px;
	}
	body.stylist #main .stylistBox .txtInfo .career{
	    width: 100%;
	    margin: 0 auto 60px;
	}
	body.stylist #main .stylistBox .visualInfo .calendar{
		width: 100%;
	    margin: 0 auto 20px;
	}
	.staff_calendar_blog .blogArea{
		margin: 0 auto;
	    padding: 0;
    	border: none;
	}
}

@media only screen and (max-width: 425px){
	body.stylist_details #content #main{
		margin-top:0;
	}
	body.stylist #main .stylistBox .txtInfo h2{
	    font-size: 24px;
	}

	body.stylist #main .sect02 .titleArea h3 span.en,
	body.stylist #main .stylistBox .visualInfo .blogArea .titleArea h3 span.en,
	body.stylist #main .stylistBox .visualInfo .calendar .titleArea h3 span.en,
	body.style #main .sect02 .titleArea h3 span.en{
		font-size: 26px;
	}
	body.stylist #main .sect02 .titleArea h3 span.jp,
	body.stylist #main .stylistBox .visualInfo .blogArea .titleArea h3 span.jp,
	body.stylist #main .stylistBox .visualInfo .calendar .titleArea h3 span.jp,
	body.style #main .sect02 .titleArea h3 span.jp{
    	font-size: 12px;
	    line-height: 17px;
		font-weight: normal;
	    margin: 5px 0 0 5px;
	}
	body.stylist #main .stylistBox .txtInfo .career dl{
	    flex-direction: column;
	    margin: 0 auto 20px;
	}
	body.stylist #main .stylistBox .txtInfo .career dl:last-child{
		margin-bottom: 0;
	}
}



/*=============================================================*/
/*=====================　staff　一覧　========================*/
.wrapper_stylist{
	margin: 0 auto;
    overflow: unset;
}
body.stylist .sect02{
	position: relative;
}
body.stylist .sect02 h2{
    margin: 0 0 10px 0px;
    font-size: 24px;
    font-weight: normal;
    z-index: 100;
    padding: 0;
}
body.stylist .sect02 p.staff_h2_p{
	font-size: 12px;
}
ul.wrapper_stylist li{
    margin: 0;
    position: relative;
    width: 24.25%;
    margin-right: 1%;
    box-sizing: border-box;
}

ul.wrapper_stylist li:nth-child(3n){

}
ul.wrapper_stylist li:nth-child(4n){
	margin-right: 0;
}
ul.wrapper_stylist li a{
	opacity: 1;
}
body.stylist #main .sect02 ul.wrapper_stylist li a.img{
	width: 100%;
	position: relative;
	overflow: hidden;
}
body.stylist #main .sect02 ul.wrapper_stylist li a.img:hover{

}
body.stylist #main .sect02 ul.wrapper_stylist li a.img img{
	width: 100%;
    margin-bottom: 0px!important;


}
body.stylist #main .sect02 ul.wrapper_stylist li a.img img:hover{

}
body.stylist #main .sect02 ul.wrapper_stylist li a.txt{
    position: relative;
    display: block;
    z-index: 10;
    box-sizing: border-box;
	text-align: left;
    width: 100%;
    padding: 10px 0;
}


body.stylist #main .sect02 ul.wrapper_stylist li .kana{
	position: absolute;
    transform: rotate(90deg);
    color: #4F4C4B;
    font-size: 20px;
    width: 100%;
    left: 16px;
    top: 0;
    margin-top: 50%;
    margin-left: calc(-50% - 7px);
}

body.stylist #main .sect02 ul.wrapper_stylist li a.txt h3{
	margin: 0 0;
    font-size: 18px;
    color: #4F4C4B;
}
body.stylist #main .sect02 ul.wrapper_stylist li a.txt p{
    color: #4F4C4B;
    margin-bottom: 0;
	font-size: 11px;
}
@media only screen and (max-width: 1024px){
	ul.wrapper_stylist li:nth-child(3n){
	    margin-right: 1%;
    	margin-bottom: 20px;
	}

}
@media only screen and (max-width: 768px){


}
@media only screen and (max-width: 640px){
	ul.wrapper_stylist li{
		width: 49.5%;
	    margin-bottom: 10px;
	}

	ul.wrapper_stylist li:nth-child(2n){
		margin-right: 0;
	}
	body.stylist .sect02 h2{
		font-size: 20px;
	}

}
@media only screen and (max-width: 425px){
	body.stylist #main .sect02 ul.wrapper_stylist li a.txt h3{
		font-size: 14px;
	}
	body.stylist #main .sect02 ul.wrapper_stylist li a.txt p{
		font-size: 10px;
	}
	body.stylist #main .sect02 ul.wrapper_stylist li a.txt{
		width: 98%;
	}
	body.stylist #main .sect02 ul.wrapper_stylist li .kana{
		font-size: 18px;
	}
}


/*=============================================================*/


/*=====================　style　一覧　========================*/


body.style .sect02{
    position: relative;
	top: 0;
	padding: 0;
}
body.style #main .sect02 ul.wrapper{
    margin: 0;
    display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
}
body.style #main .sect02 ul.wrapper li{
	margin: 0 2% 2% 0;
	width: 23.5%;
	height: auto;
	position: relative;
    padding: 0px;
    box-sizing: border-box;
}
body.style #main .sect02 ul.wrapper li:nth-child(4n){
	margin: 0 0 2%;
}
body.style #main .sect02 ul.wrapper li a.img{
	margin: 0 0 2%;
}
body.style #main .sect02 ul.wrapper li a.img:hover{
}
body.style #main .sect02 ul.wrapper li a.txt{
    position: relative;
    display: block;
    box-sizing: border-box;
    padding: 10px;
    background: rgba(255, 255, 255, 0.6);
    margin-top: -25px;
}
body.style #main .sect02 ul.wrapper li a.txt:hover{
	opacity: 1;
}
body.style #main .sect02 ul.wrapperli a.txt p.txt_staff{
    position: relative;
	margin-bottom: 20px;
}
body.style #main .sect02 ul.wrapper li a.txt p.txt_staff::before{
    content: "";
    position: absolute;
    bottom: -3px;
    left: -10px;
    width: calc(100% + 20px);
    height: 1px;
    background: #eee;
}
body.style #main .sect02 ul.wrapper li a.txt p.txt_staff span{
    border-bottom: solid;
    padding-bottom: 3px;
    position: relative;
}
body.style #main .sect02 ul.wrapper li a.txt h3{
    letter-spacing: -0.5px;
    font-size: 14px;
    line-height: 24px;
	font-weight: bold;   
    margin: 0 0 10px;
}

body.style #main .sect02 ul.wrapper li a.txt p,
body.style #main .sect02 ul.wrapper li a.staff{
	font-size: 12px;
    margin-bottom: 14px;
    line-height: 19px;
	color: #4F4C4B;
	position: relative;
}
body.style #main .sect02 ul.wrapper li a.staff{
	padding: 0 0 0 10px;
	display: block;
}
body.style #main .sect02 ul.wrapper li a.staff img{
    width: 40px;
    border-radius: 50%;
}
body.style #main .sect02 ul.wrapper li a.txt .hairimg{
    display: block;
	position: absolute;
	top:0;
    left: 0;
	width: 100%;
	padding: 5px 0;
    background: rgba(121, 82, 42, 0.6);
    color: #fff;
    font-size: 14px;
    text-align: center;
    margin-top: -29px;
}
body.style #main .sect02 ul.wrapper li a.txt .hairimg p{
	margin-bottom: 0;
}
@media only screen and (max-width: 1024px){
	body.style #main .sect02 ul.wrapper li,
	body.style #main .sect02 ul.wrapper li:nth-child(3n+2){
		margin: 0 2% 2% 0;	
	}
	body.style #main .sect02 ul.wrapper li:nth-child(4n){
		margin-right: 0;
	}
}
@media only screen and (max-width: 640px){
	body.style #main .sect02 ul.wrapper li,
	body.style #main .sect02 ul.wrapper li:nth-child(3n+2),
	body.style #main .sect02 ul.wrapper li:nth-child(4n){
	    width: 48%;
		margin: 0 4% 2% 0;	
	}
	body.style #main .sect02 ul.wrapper li:nth-child(2n){
		margin-right: 0;
	}
	body.style #main .sect02 ul.wrapper li a.txt h3{
	    font-size: 12px;
    	line-height: 19px;
	}
}


/* length menu */
.length,
.gallery_menu{
    box-sizing: border-box;
    margin: 0 0 30px;
    display: flex;
    padding: 0px;
    align-items: center;	
}
.length .titleArea,
.gallery_menu .titleArea{
	position: relative;
    width: 150px;
	min-width: 150px;
    margin: 0;
}

.length .titleArea p,
.gallery_menu .titleArea p{
	margin: 0;
}
.length .titleArea p span.en,
.gallery_menu .titleArea p span.en{
	font-size: 18px;
	display: block;
}
.length .titleArea p span.jp,
.gallery_menu .titleArea p span.jp{
	font-size: 12px;
	display: none;
}
.length ul,
.gallery_menu ul{
	width: 100%;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-content: center;
}
.length ul li,
.gallery_menu ul li{
    margin: 0 5px 5px 0;
}
.length ul a,
.gallery_menu ul a{
	font-size: 14px;
    display: block;
    color: #4F4C4B;
	position: relative;
    margin-left: 20px;
}
.length ul a:hover,
.gallery_menu ul a:hover{
	color: #006688;
	opacity: 1;
}
.length ul a::before,
.gallery_menu ul a::before{
	content: "";
    width: 0%;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    background: #4F4C4B;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}
.length ul a:hover::before,
.gallery_menu ul a:hover::before{
	width: 100%;
    background: #006688;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}
@media only screen and (max-width: 768px){
	.length ul a,
	.gallery_menu ul a{
		font-size: 12px;	
	}
}
@media only screen and (max-width: 640px){
	.length,
	.gallery_menu {
		flex-direction: column;
	    align-items: flex-start;
	}
	.length .titleArea,
	.gallery_menu .titleArea{
		margin: 0 0 10px;
	}
}
/*=============================================================*/
/*=====================　スタイル詳細　========================*/
/*
スタイル詳細ページの一番上を下記に書き換え（style_detailsを追加）

{object.header bodyclass="style lower style_details"}

*/
body.style_details .sect02{
	margin-top: 60px;
}
body.style_details .styleBox{
    display: flex;
    flex-direction: row;
    background: #f5f5f5;
	margin-bottom: 60px;
}
body.style_details #main .styleBox .visualInfo{
    width: 100%;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
}
body.style_details #main .styleBox .visualInfo .photo{
	width: 100%;
    margin: 0 0 0 auto;
	max-width: 600px;
}
body.style_details #main .styleBox .txtInfo{
    width: 300px;
    min-width: 300px;	
}
body.style_details #main .styleBox .txtInfo .hair_comment{
    padding: 0px;
    box-sizing: border-box;
    margin-bottom: 30px;
    width: 130%;
    position: relative;
    left: -30%;
    margin-top: 50px;
}
.hair_name{
    margin: 0 0 -51px;
	position: relative;
	z-index: 1;
}
body.style_details #main .hair_name h3{
    font-size: 22px;
    line-height: 30px;
    box-sizing: border-box;
    font-weight: bold;
    color: #4F4C4B;
    width: auto;
    position: relative;
    padding: 14px;
    background: rgba(255, 255, 255, 0.6);
}

.hair_comment p.comment{
	color: #888;
	font-size: 13px;
	line-height: 22px;
	margin: 0;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 20px;
    padding: 20px;
    box-sizing: border-box;
	position: relative;
	z-index: 1;
}
.hair_comment p.comment::before{
    content: "";
    width: 0px;
    height: 0px;
    position: absolute;
    bottom: 0;
    right: 0;
    margin-right: 70px;
    margin-bottom: -20px;
    border-right: 6px solid transparent;
    border-bottom: 26.6025px solid #fff;
    border-left: 6px solid transparent;
    transform: rotate(140deg);
}
.hair_comment .hair_staff{
	   text-align: right;
}
.hair_comment .hair_staff a.img{
	display: inline-block;
	width: 80px;
    margin: 10px 0 0;
}
.hair_comment .hair_staff p{
	display: inline-block;
    vertical-align: bottom;
    color: #888;
    margin: 4px;
	padding: 0 0 2px;
    border-bottom: solid 1px #eee;
}
.hair_comment .hair_staff a.img img{
	width: 100%;
}
body.style_details #main .styleBox .txtInfo{
    padding: 20px;
    box-sizing: border-box;
}
body.style_details #main .styleBox .txtInfo ul.sns{
	margin: 0 0 4px auto;
}
body.style_details #main .styleBox .txtInfo ul.sns li{
	width: auto;
    display: inline-block;
    vertical-align: top;
    margin-right: 5px;
}
body.style_details #main .styleBox .txtInfo ul.sns li:last-child{
	margin-right: 0;
}
body.style_details #main .styleBox .txtInfo ul.sns li a{
    line-height: 0;
	width: 20px;
}
body.style_details #main .styleBox .txtInfo ul.sns li img{
	width: 20px;
    height: 20px;
    line-height: 0;
}
.pinterestBtn span{
	background: url(/img/upload/2020/03/social_icons_pinterest.png)!important;
    background-size: 100%!important;
    width: 20px!important;
    height: 20px!important;
}
body.style_details #main .styleBox .txtInfo .box{
    margin: 0 0 30px;
}

body.style_details #main .styleBox .txtInfo .box p.styleTitle{
    font-weight: bold;
    text-align: left;
    margin-bottom: 12px;
    font-size: 14px;
    border: none;
    background: #eee;
    padding: 5px 10px;
    box-sizing: border-box;	
}
body.style_details #main .styleBox .txtInfo .box ul{
	text-align: center;
	margin-bottom: 0;
	display: flex;
    justify-content: space-between;
	width: 100%;
}
.typeOn{
    background-color: #006688;
}

body.style_details #main .commentArea{
    width: 50%;
    padding: 0;
	background: none;
	margin: 0;
}


body.style_details #main .commentArea a{
	font-size: 16px;
	color: #fff;
    font-weight: bold;
    padding: 6px 0;
	background: #888;
    width: 100%;
    max-width: 1200px;
    text-align: center;
	display: block;
}

body.style_details #main .commentArea a:hover{
	color: #fff;
	background: #aaa;
	font-size: 16px;
	opacity: 1;
}

body.style_details #main .commentArea .txt{
    width: 100%;
    padding: 30px;
    box-sizing: border-box;
    margin: -42px 0 0;
    background: rgba(255, 255, 255, 0.6);
}
body.style_details #main .commentArea .txt h5{
    font-size: 18px;
    margin: 0 0 10px;
    letter-spacing: 4px;
}
body.style_details #main .commentArea .txt p{
	color: #888;
    font-size: 13px;
    line-height: 22px;
}
.thumb{
    width: 48%;
    margin: 2px 0 20px 2%;
}
body.style_details #main .styleBox .visualInfo .thumb ul li{
    width: 33.0%;
	position: relative;
    overflow: hidden;
}
body.style_details #main .styleBox .visualInfo .thumb ul li::before{
    content: "click";
    padding: 0px 30px 13px;
    background: rgba(109, 109, 109, 0.6);
    box-sizing: border-box;
    position: absolute;
    bottom: 0;
    right: 0;
    width: 110px;
    color: #fff;
    transform: rotate(-45deg);
    margin: 0 -43px -8px auto;
    font-size: 10px;
    letter-spacing: 1px;
    text-align: center;
    text-transform: capitalize;
}

body.style_details #main .styleBox .visualInfo .thumb ul li img:hover{
	opacity: 1;
}
body.style_details #main .styleBox .txtInfo .box dl dt{
	width: 90px;
    font-size: 14px;
    min-width: 90px;
}
body.style_details #main .styleBox .txtInfo .box dl dd{
    width: 100%;
	font-size: 14px;
}
body.style_details #main .couponArea{
	clear: both;
}
body.style #main .styleBox .txtInfo .box ul li{
	margin-right: 1px;
	margin-bottom: 5px;
	font-size:12px;
	padding: 4px 0;
    width: 100%;
}
@media only screen and (max-width: 1024px) and (min-width: 641px){
	.hair_comment p.comment::before{
	    margin-right: -10px;
    	margin-bottom: 10px;
	    transform: rotate(70deg);
	}
	.hair_comment .hair_staff{
		margin-left: 5%;
		display: flex;
	    flex-flow: column-reverse;
		width: 80px;
		min-width: 80px;
	}
	.hair_comment a.img{	
	}
	.hair_comment .hair_staff p{
		display: block;
		text-align: center;
		margin: 10px auto 0;
	}	
}

@media only screen and (max-width: 1024px){
	body.style_details #main .styleBox .visualInfo{
	    margin: 0 auto;
	}
	body.style_details #main .styleBox .txtInfo{
		min-width: 100%;
		width: 100%;
		display: block;
	}
	body.style_details #main .styleBox .txtInfo .hair_comment{
	    width: 100%;
	    margin: 0 auto;
		left: 0;
	}
	body.style_details #main .styleBox .txtInfo ul.sns{
	    margin: 10px 0;
    	height: 27px;
	}
	body.style_details #main .styleBox .txtInfo .box_all{
	    display: flex;
		justify-content: space-between;
		padding: 0;
	}
	body.style_details #main .styleBox .txtInfo .box{
		width: 49%;
		margin: 0;
	}
	body.style_details #main .styleBox .txtInfo .box .recommend ul.clearfix{
		margin-bottom: 0;
	}

	body.style_details #main .styleBox .txtInfo .box dl dt:first-of-type,
	body.style_details #main .styleBox .txtInfo .box dl dd{
	    font-size: 14px;
	    margin: 0 0 0 auto;
	}
	body.style_details #main .styleBox .txtInfo .box dl dt:first-of-type{
		width: 29%;		
	}
	.hair_comment_p{
		display: flex;
	}
	body.style_details #content #main section.sect.styleBox{
    	margin: 0 auto 60px;
	    flex-direction: column;
	}
	body.style_details #main .styleBox{
		table-layout:fixed;
	}
	body.style_details #main .styleBox .txtInfo h3{
		width: 100%;
		top:0;
		left: 0;
		position: relative;
	    margin: 30px 0 10px;
    	padding: 0;
		box-sizing: border-box;
	    font-size: 22px;
	}
	body.style_details #main .commentArea .img{
		width: 45%;
		display: inline-block;
	}
	body.style_details #main .commentArea .img a{
		text-decoration: none;
	}
	body.style_details #main .commentArea .img img{
		width: 100%;
		float: none;
	}
}
@media only screen and (max-width: 768px){
}
@media only screen and (max-width: 640px){
	.hair_comment_p{
		flex-direction:column;
	}
	body.style_details #main .commentArea .txt{
	    margin: -32px 0 0px 0;
	    width: 100%;
	    padding: 20px;
	}
	body.style_details #main .commentArea{
		width: 100%;
	}
	.thumb{
		width: 100%;
		margin: 10px auto 0;
	}
	body.style_details #main .commentArea .txt h5{
	    font-size: 16px;
	}
	body.style_details #main .styleBox .txtInfo .box_all{
	    flex-wrap: wrap;
	}
	body.style_details #main .styleBox .txtInfo .box{
	    width: 100%;
    	margin: 0 auto 10px;
	}
	body.style_details #main .styleBox .txtInfo .box:last-child{
		margin-bottom: 0;
	}
	body.style_details #main .hair_name h3{
		font-size: 18px;
		padding: 10px;
	}
	.hair_name{
	    margin: 0 0 -42px;
	}
}
@media only screen and (max-width: 425px){
	body.style_details #main .styleBox .txtInfo h3{
		font-size: 18px;
	}
}



/*スタッフ担当ヘアスタイル　stylist詳細 style詳細　ここから*/
body.stylist #main .sect02 ul.wrapper,
body.style_details #main .sect02 ul.wrapper{
	width: 100%;
	display: flex;
    justify-content: space-between;
}
body.stylist #main .sect02 ul.wrapper li,
body.style_details #main .sect02 ul.wrapper li,
body.stylist #main .sect03 ul.wrapper li:nth-child(3n+2),
body.style_details #main .sect02 ul.wrapper li:nth-child(3n+2){
    margin: 0;
	width: 23.0%;
    float: none;
	position: relative;
    box-sizing: border-box;
}
body.stylist #main .sect02 ul.wrapper li:nth-child(4n),
body.style_details #main .sect02 ul.wrapper li:nth-child(4n){
    margin-right: 0;
}
body.stylist #main .sect03 ul.wrapper li a.img,
body.style_details #main .sect02 ul.wrapper li a.img{
    margin: 0;
}
body.stylist #main .sect02 ul.wrapper li a.txt,
body.style_details #main .sect02 ul.wrapper li a.txt{
	position: relative;
    display: block;
    box-sizing: border-box;
    padding: 10px;
    background: rgba(255, 255, 255, 0.6);
    margin-top: -20px;
}
body.stylist #main .sect02 ul.wrapper li a.txt h4,
body.style_details #main .sect02 ul.wrapper li a.txt h4{
    color: #4F4C4B;
    letter-spacing: -0.5px;
    font-size: 14px;
    line-height: 22px;
    font-weight: bold;
    margin: 0 0 10px;
}
body.stylist #main .sect02 ul.wrapper li a.txt p.txt_length,
body.style_details #main .sect02 ul.wrapper li a.txt p.txt_length{
    position: relative;
    margin-bottom: 20px;
}
body.stylist #main .sect02 ul.wrapper li a.txt p.txt_length::before,
body.style_details #main .sect02 ul.wrapper li a.txt p.txt_length::before{
    content: "";
    position: absolute;
    bottom: -3px;
    left: -10px;
    width: calc(100% + 20px);
    height: 1px;
    background: #eee;
}
body.stylist #main .sect02 ul.wrapper li a.txt p.txt_length span,
body.style_details #main .sect02 ul.wrapper li a.txt p.txt_length span{
	border-bottom: solid;
    padding-bottom: 3px;
    position: relative;
}
@media only screen and (max-width: 1024px){
	body.stylist #main .sect02 ul.wrapper li a.txt h4,
	body.style_details #main .sect02 ul.wrapper li a.txt h4{
		font-size: 14px;
	}	
}
@media only screen and (max-width: 768px){
	body.stylist #main .sect02 ul.wrapper li a.txt h4,
	body.style_details #main .sect02 ul.wrapper li a.txt h4{
		font-size: 12px;
	}
}
@media only screen and (max-width: 640px){
	.hair_comment .img{
		box-sizing: border-box;
		margin-left: 2%;
		min-width: 80px;
	}
	body.stylist #main .sect02 ul.wrapper,
	body.style_details #main .sect02 ul.wrapper{
	    flex-wrap: wrap;
	}
	body.stylist #main .sect02 ul.wrapper li,
	body.style_details #main .sect02 ul.wrapper li,
	body.stylist #main .sect03 ul.wrapper li:nth-child(3n+2),
	body.style_details #main .sect02 ul.wrapper li:nth-child(3n+2){
	    width: 48%;
    	margin-bottom: 2%;
	}
}
@media only screen and (max-width: 425px){
	
}
/*スタッフ担当ヘアスタイル　stylist詳細 style詳細　ここまで*/







/*=============================================================*/
/*=====================　coupon　========================*/

/*★の前後に　<div class="coupon_show"></div>　を記入

<div class="coupon_show">
　<p><span>提示条件:</span>{coupon.show.name}</p>★
・
・
・
　<p><span>利用条件:</span>{coupon.use}</p>★
</div>

*/

.coupon form{
background: none;
    padding: 0px;
    max-width: 1200px;
    margin: 0px auto 30px;
    width: 100%;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
}
body.coupon #main section.sect01{
    display: flex;
    align-items: center;
}
body.coupon #main section.sect01 .titleArea{
    border: none;
    padding: 0;
    margin: 0;
    width: 140px;
    min-width: 140px;
}
body.coupon #main section.sect01 .titleArea h3{
    clear: both;
    float: none;
	padding: 0;
}
body.coupon #main section.sect01 .titleArea h3 span.en{
    font-size: 18px;
}
body.coupon #main section.sect01 .titleArea h3 span.jp{
	display: none;
}
body.coupon #main section.sect01 .filterArea{
	margin: 0 auto;
    padding: 0;
    background: none;
}
body.coupon #main section.sect01 .filterArea dl{
    width: 100%;
	margin: 0 auto 10px;
	display: flex;
	padding: 0px;
	box-sizing: border-box;
    align-items: center;
}
body.coupon #main section.sect01 .filterArea dl:last-child{
	margin-bottom: 0;
}
body.coupon #main section.sect01 .filterArea dl dd{
	padding: 0;
    margin: 0 ;
    width: 100%;
	border-radius: 10px;
    font-size: 14px;
	line-height: 28px;
}
body.coupon #main section.sect01 .filterArea dl dd ul{
	margin-bottom: 0;
}
body.coupon #main section.sect01 .filterArea dl dd ul li{
    margin-right: 40px;
	color: #666;
}
body.coupon #main section.sect01 .filterArea dl dt{
    width: 100px;
	box-sizing: border-box;
	padding: 0;
	margin: 0;
    color: #666;
    font-size: 12px;
    font-weight: normal;
    text-transform: uppercase;
}
body.coupon #main section.sect01 .btn{

}
body.coupon #main section.sect01 .btn button{
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
    padding: 6px 0;
    box-sizing: border-box;
    color: #4F4C4B;
    margin: 0;
    font-size: 14px;
    text-align: center;
	text-transform: uppercase;
    cursor: pointer;
    width: 120px;
    border: solid 1px #888;
    background: none;
    font-weight: bold;
}
body.coupon #main section.sect01 .btn button:hover{
	color: #fff;
	background: #4F4C4B;
    opacity: 1;
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}
body.coupon #main .result{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
body.coupon #main .result .couponArea,
body.style #main .couponArea,
body.stylist #main .couponArea{
    color: #4F4C4B;
    border: none;
    box-sizing: border-box;
    background: none;
    border-top: double #eee;
    border-left: solid 1px #eee;
	margin: 0 0 30px;
	display: block;
	padding: 0;
}
body.coupon #main .result .couponArea{
    width: 49%;
}

body.coupon #main .result .couponArea h4,
body.style #main .couponArea p.coupon_target,
body.stylist #main .couponArea h4{
    width: 100%;
    padding: 0 20px;
    margin: 0;
    font-size: 12px;
    background: #f5f5f5;
    color: #4F4C4B;
    box-sizing: border-box;
    font-weight: bold;
    margin-top: 10px;
	text-align: left;
}
body.coupon #main .result .couponArea .couponContent,
body.style #main .couponArea .couponContent,
body.stylist #main .couponArea .couponContent{
	display: flex;
	box-sizing: border-box;
}
body.coupon #main .result .couponArea .couponContent{
    padding: 20px 20px 43px;
    width: 100%;
}
body.style #main .couponArea .couponContent,
body.stylist #main .couponArea .couponContent{
    padding: 20px;
    width: 100%;
}
body.coupon #main .result .couponArea .couponContent .txt,
body.style #main .couponArea .couponContent .txt,
body.stylist #main .couponArea .couponContent .txt{
    width: 100%;
    margin-left: 2%;
}
body.coupon #main .result .couponArea .couponContent .img,
body.style #main .couponArea .couponContent .img,
body.stylist #main .couponArea .couponContent .img{
	width: 27%;
    max-width: 400px;
    min-width: 140px;
}
body.coupon #main .result .couponArea .couponContent .img img,
body.style #main .couponArea .couponContent .img img,
body.stylist #main .couponArea .couponContent .img img{
	width: 100%;
    margin: 0 0 10px;
}
body.coupon #main .result .couponArea .couponContent .img p,
body.style #main .couponArea .couponContent .img p,
body.stylist #main .couponArea .couponContent .img p{
    line-height: 18px;
	margin: 0;
	color: #888;
}
body.coupon #main .result .couponArea .couponContent .txt p.price,
body.style #main .couponArea .couponContent .txt p.price,
body.stylist #main .couponArea .couponContent .txt p.price{
    font-size: 22px;
	margin-bottom: 0;
}
body.coupon #main .result .couponArea .couponContent .txt p.couponDetail,
body.style #main .couponArea .couponContent .txt p.couponDetail,
body.stylist #main .couponArea .couponContent .txt p.couponDetail{
	border-top: solid 1px #f3f3f3;
    padding-top: 8px;
	margin-bottom: 14px;
	color: #888;
    letter-spacing: 0.8px;
}
body.coupon #main .result .couponArea .couponContent .txt a,
body.style #main .couponArea .couponContent .txt a,
body.stylist #main .couponArea .couponContent .txt a{
    font-size: 13px;
    font-weight: bold;
    padding: 4px 0;
    background: none;
    border: solid 1px #888;
    color: #888;	
}
body.coupon #main .result .couponArea .couponContent .txt a:hover,
body.style #main .couponArea .couponContent .txt a:hover,
body.stylist #main .couponArea .couponContent .txt a:hover{
	color: #fff;
	background: #4F4C4B;
    opacity: 1;
}
body.coupon #main .result .couponArea .couponContent .txt ul,
body.style #main .couponArea .couponContent .txt ul,
body.stylist #main .couponArea .couponContent .txt ul{
    margin-bottom: 14px;
}
body.coupon #main .result .couponArea .couponContent .txt ul li,
body.style #main .couponArea .couponContent .txt ul li,
body.stylist #main .couponArea .couponContent .txt ul li{
    margin-bottom: 3px;
    margin-right: 3px;
    padding: 3px 6px;
    font-size: 12px;
	background: #006688;
}
body.coupon #main .result .couponArea .couponContent .txt h5,
body.style #main .couponArea .couponContent .txt h5,
body.stylist #main .couponArea .couponContent .txt h5{
    font-size: 16px;
    line-height: 23px;
    letter-spacing: 1px;
    margin-bottom: 20px;
}
body.coupon #main .result .couponArea .couponContent .txt .reserve{
    position: absolute;
    bottom: 10px;
    right: 5%;
    width: 200px;
}
body.style #main .couponArea .couponContent .txt .reserve,
body.stylist #main .couponArea .couponContent .txt .reserve{
	width: 200px;
    margin: 0 0 0 auto;
}
@media only screen and (max-width: 1024px){
	body.coupon #main section.sect01 .filterArea{
		width: 100%;
	}
	body.coupon #main section.sect01 .btn button{
	    width: 90px;
	}
	body.style #main .couponArea,
	body.stylist #main .couponArea{
	    box-shadow: unset;
	}
	body.coupon #main .result .couponArea .couponContent{
	    flex-wrap: wrap;
	}
	body.coupon #main .result .couponArea .couponContent .img{
		width: 100%;
	    margin-bottom: 20px;
	    display: flex;
		max-width: 100%;
		min-width: 100%;		
	}
	body.style #main .couponArea .couponContent .img,
	body.stylist #main .couponArea .couponContent .img{
		position: relative;
	}
	body.coupon #main .result .couponArea .couponContent .img img{
	    width: 100px;
		margin: 0;
	}
	body.style #main .couponArea .couponContent .img img,
	body.stylist #main .couponArea .couponContent .img img{
		display: block;
	}
	body.coupon #main .result .couponArea .couponContent .img .img_p{
		width: 100%;
		margin-left: 2%;
	}
	body.coupon #main .result .couponArea .couponContent .img p,
	body.style #main .couponArea .couponContent .img p,
	body.stylist #main .couponArea .couponContent .img p{
		font-size: 11px;
	}
	body.coupon #main .result .couponArea .couponContent .txt{
		width: 100%;
		margin: 0 auto;
	}
	body.coupon #main .result .couponArea .couponContent .txt h5,
	body.style #main .couponArea .couponContent .txt h5,
	body.stylist #main .couponArea .couponContent .txt h5{
		font-size: 15px;
    	margin: 0px auto 15px;
	    line-height: 26px;
    	letter-spacing: 0.2px;
	}
	body.coupon #main section.sect01 .filterArea dl dd ul li{
		margin-right: 40px;
	    font-size: 14px;
    	line-height: 20px;
	}
}


@media only screen and (max-width: 640px){
	body.coupon #main section.sect01{
		flex-direction: column;
	}
	body.coupon #main section.sect01 .filterArea{
		margin: 20px auto;	
	}
	body.coupon #main .result .couponArea{
		width: 98%;
    	display: block;
	}
	body.coupon #main .result .couponArea .couponContent{
	    padding: 20px;
		width: 100%;
		box-sizing: border-box;
	}
	body.style #main .couponArea .couponContent,
	body.stylist #main .couponArea .couponContent{
		flex-wrap: wrap;
	}
	body.style #main .couponArea .couponContent .img,
	body.stylist #main .couponArea .couponContent .img{
		width: 100%;
		max-width: 100%;
		min-width: 100%;
	    display: flex;
		margin-bottom: 20px;
	}
	body.coupon #main .result .couponArea .couponContent .img img{
		margin-bottom: 0px;
	    vertical-align: top;
	}
	body.style #main .couponArea .couponContent .img img,
	body.stylist #main .couponArea .couponContent .img img{
		width: 100px;
		min-width: 80px;
		margin: 0;
	}
	body.style #main .couponArea .couponContent .img .img_p,
	body.stylist #main .couponArea .couponContent .img .img_p{
		width: 100%;
	    margin-left: 2%;
	}
	body.style #main .couponArea .couponContent .txt,
	body.stylist #main .couponArea .couponContent .txt{
	    margin: 0;
		padding: 0;
	}
	.coupon_show{
		width: 80%;
	    display: inline-block;
		vertical-align: middle;
	}
	body.style #main .couponArea .couponContent .txt h5,
	body.stylist #main .couponArea .couponContent .txt h5{
		margin: 15px auto 15px;
	}
	.coupon form{
	    margin: 0px auto 30px;
	}
	body.coupon #main .result .couponArea .couponContent .txt .reserve{
		position: relative;
		bottom: 0;
		right: 0;
	    margin: 0 0 0 auto;
	}	
}
/*=============================================================*/

/*================ menu ============================*/
body.menu #main .sect{
	width: 100%;
	margin-bottom: 0;
    display: flex;
    flex-wrap: wrap;
}

body.menu .shop_menubox {
    margin: 0 0 60px 0;
    width: 49%;
}
body.menu .shop_menubox:nth-child(odd){
	margin-right: 2%;
}
body.menu #main .sect .titleArea {
    margin: 0 auto;
    border-bottom: none;
    background: #f5f5f5;
}

body.menu #main .sect .titleArea h3{
    width: auto;
    color: #4F4C4B;
    font-weight: normal;
	position: relative;
    padding: 14px 14px 10px;
    box-sizing: border-box;
    text-transform: uppercase;
}
body.menu #main .sect .titleArea h3 span.en{
    font-size: 18px;
}
body.menu #main .sect table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 0;
    padding: 0 10px;
    box-sizing: border-box;
}
.menu_annotation {
    font-size: 14px;
    line-height: 25px;
    padding: 20px;
	margin: 0 auto 20px;
    box-sizing: border-box;	
}
body.menu #main .sect .table tr{
    display: flex;
	margin-bottom: 50px;
	border-top:none;
}
body.menu #main .sect .table td{
    font-size: 14px;
	padding: 10px 0;
	font-weight: bold;
}
body.menu #main .sect .table > tbody > tr > td:first-child > .serviceSubTxt{
    font-weight: normal;
    margin-bottom: 0;
    line-height: 1.5;
    font-size: 13px!important;
    margin-top: 20px;
}
body.menu #main .sect .table > tbody > tr > td:last-child{
	text-align: right;
	width: 100px;
    min-width: 90px;
}
body.menu #main .sect .txtRight{
    font-size: 12px;
	padding-right: 10px;
    margin: -33px 10px 40px 0;
}
@media only screen and (max-width: 1024px){
	body.menu #main .sect .table > tbody > tr > td:first-child{
	    width: 100%;
	}
	body.menu #main .sect .table tr{
		margin-bottom: 30px;
	}
}
@media only screen and (max-width: 768px){
	body.menu .shop_menubox{
    	width: 100%;
		display: block;
    	margin: 0 0 30px 0;
	}
	body.menu .shop_menubox:nth-child(odd){
    	margin: 0 0 30px 0;
	}
	body.menu #main .sect .titleArea h4{
	    margin: -34px 0 0 10px;
	}
}

@media only screen and (max-width: 425px){
	body.menu #main .sect .titleArea h4 span.en{
		font-size: 22px;
	}
	body.menu #main .sect .titleArea h4{
		margin: -25px 0 0 10px;
	}

}

/*=====================================================*/
/*=====================　news list　========================*/
body.news #content {


}
body.news #content #main,
body.blog #content #main{
    margin: 0px;
}
.contentBox{
	width: 100%;
	padding:  0 0;
	display: flex;
	flex-wrap: wrap;
    justify-content: flex-start;
}
.contentPieces{
	position: relative;
    padding: 0;
    box-sizing: border-box;
    width: 32.0%;
    margin: 0 2% 2% 0;
}
.contentPieces:nth-child(3n){
	margin-right: 0;
}
.contentPieces a.category{
    font-size: 12px;
    padding: 0px 10px 1px;
    display: block;
    background: rgba(255, 255, 255, 0.6);
    margin: 0 0 -13px;
    position: relative;
    z-index: 10;
    color: #4F4C4B;
}
.contentPieces .img{
    width: 100%;
}
.contentPieces .img img{
	width: 100%;
    height: auto;
	margin: 0;
}
.txt_box{
    padding: 10px;
    display: block;
    margin: 0;
    color: #4F4C4B;
}
p.news_date,
p.blog_date{
	font-size: 14px;
    margin: 0 0 20px;
    position: relative;
}
p.news_date::before,
p.blog_date::before{
    content: "";
    position: absolute;
    bottom: -3px;
    left: -10px;
    width: calc(100% + 20px);
    height: 1px;
    background: #eee;
}
p.news_date span,
p.blog_date span{
	border-bottom: solid;
    padding-bottom: 3px;
    position: relative;
}
.txt_box h5{
    margin: 0 0 20px;
    font-weight: bold;
    font-size: 14px;
}
.txt_box .txt p.p_body{
	margin-bottom: 20px;
	font-size: 14px;
	color: #888;
}
.txt_box .more{
    text-decoration: none;
    font-size: 12px;
    text-align: left;
    width: fit-content;
    color: #4F4C4B!important;
	position: relative;
	margin: 20px 0 0;
}
.txt_box .more span{
    padding-right: 0;
    background: none;
    text-transform: uppercase;
}

.txt_box .more::before{
	content: "";
    width: 0%;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    background: #4F4C4B;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}
.txt_box:hover div.more::before{
	background: #006688;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
	width: 100%;
}
.txt_box .txt p{
	padding: 0 ;
	font-size: 12px;
    line-height: 22px;	
}
.txt_box .txt p.blog_tag,
.txt_box .txt p.blog_staff{
	color: #888;
}

.txt_box .txt p.blog_tag{
	margin-bottom: 0;
}



@media only screen and (max-width: 1024px){

}
@media only screen and (max-width: 768px){

}
@media only screen and (max-width: 640px){
	.contentPieces{
    	width: 100%;
	}
	.contentPieces a.category{
	    margin-bottom: 0;
    	padding: 0;
	}
	.contentPieces_wrapper{
	    display: flex;
	}
	.img_box{
	    width: 50%;
    	min-width: 100px;
	}
	.txt_box{
	    width: 100%;
		padding: 0 10px;
	    margin: 0 0 0 10px;
	}
	p.p_body{
		display: none;
	}
}
@media only screen and (max-width: 425px){

}

/*=============================================================*/
/*=====================　news　詳細　========================*/


body.news #main .sect,
body.blog #main .sect,
body.media_details #main .sect{
	width: 100%;
    box-sizing: border-box;
	position: relative;
}
body.news #main .sect .wrapper,
body.blog #main .sect .wrapper,
body.media_details #main .sect .wrapper{
    display: flex;
	
}
.news_data,
.blog_data,
.media_data{
	width: 100%;
	margin-left: 3%;
}
body.news #main .sect .img,
body.blog #main .sect .img,
body.media_details #main .sect .img{
	width: 300px;
	max-width: 300px;
    min-width: 300px;
}
body.news #main .sect .img img,
body.blog #main .sect .img img,
body.media_details #main .sect .img img{
	
}
body.news #main .sect .titleArea,
body.blog #main .sect .titleArea,
body.media_details #main .sect .titleArea{
    margin:40px 0 10px;    
    padding: 10px;
    background: #f5f5f5;
	box-sizing: border-box;
    border: none;
}
body.news #main .articleTxt p,
body.blog #main .articleTxt p,
body.media_details #main .articleTxt p,
body.news #main .articleTxt,
body.blog #main .articleTxt,
body.media_details #main .articleTxt{
    color: #4F4C4B;
	font-size: 15px;
}
body.news #main .articleTxt,
body.blog #main .articleTxt,
body.media_details #main .articleTxt{
    margin: 20px auto 40px;
    padding: 0 10px;
}
body.news #main .sect .titleArea h3,
body.blog #main .sect .titleArea h3,
body.media_details #main .sect .titleArea h3{
	font-weight: bold;
    padding: 0;
    margin: 0;
    font-size: 16px;
    color: #4F4C4B;
    float: none;	
}
body.news_details #main .sect .wrapper ul.clearfix li,
body.blog_details #main .sect .wrapper ul.clearfix li,
body.media_details #main .sect .wrapper ul.clearfix li{
    padding: 4px 12px;
    background: none;
    border: solid 1px #eee;
	color: #888;
	float: left;
}
.tag,
.tag a{
    font-size: 12px;
    color: #888;
    line-height: 22px;
}
.tag{
	padding: 0 12px;
}
body.blog #main .sect .wrapper li a{
	color: #888;
}


@media only screen and (max-width: 1024px){
	body.news #main .sect,
	body.blog #main .sect,
	body.media_details #main .sect{
		margin-bottom: 0px;
		padding: 0;
	}

}
@media only screen and (max-width: 640px){
body.news #main .sect .img,
body.blog #main .sect .img,
body.media_details #main .sect .img{
	width: 30%;
    min-width: 30%;
}
}

@media only screen and (max-width: 425px){
	body.news #main .sect .wrapper,
	body.blog #main .sect .wrapper,
	body.media_details #main .sect .wrapper{
    	flex-flow: column;
	}
	.news_data,
	.blog_data,
	.media_data{
		margin: 10px auto 0;
	}
	body.news #main .sect .img,
	body.blog #main .sect .img,
	body.media_details #main .sect .img{
		width: 100%;
		min-width: 100%;
	}

}

/*=============================================================*/
/*=====================　gallery　========================*/


body.gallery #content{
	flex-direction: row-reverse;
	display: block;
}
body.gallery #main .sect02 ul.wrapper{
	margin: 0 auto;
    display: flex;
    justify-content: flex-start;
}
body.gallery #main .sect02 ul.wrapper a:hover{
	opacity: 1;	
}
body.gallery #main .sect02 ul.wrapper li:nth-child(odd){
	margin: 0 2% 0% 0!important;	
}
body.gallery #main .sect02 ul.wrapper li{
	margin: 0 2% 0% 0!important;
	width: 32.0%!important;
    box-sizing: border-box;
    position: relative;
    line-height: 0;
}
body.gallery #main .sect02 ul.wrapper li:nth-child(3n){
    margin-right: 0!important;
}
body.gallery #main .sect02 ul.wrapper li:hover{
}

body.gallery #main .sect02 ul.wrapper li a.img{
    border: none;
	margin: 0;
	line-height: 0;
	width: 100%;
}

body.gallery #main .sect02 ul.wrapper a .colListItem_lineWrap{
	height: 74%;
}

/*gallery　li a class="txt" 追加*/

body.gallery #main .sect02 ul.wrapper li a.txt{
    text-align: left;
	width: 100%;
    margin: 5px auto 0;
}
body.gallery #main .sect02 ul.wrapper li a.txt p{
	color: #4F4C4B;
    line-height: 20px;
	font-size: 12px;
    margin: 0px auto;
}
@media only screen and (max-width: 1024px){
	body.gallery #content{
	}
	body.gallery #sub{
		width: 100%;
		float: none;
		clear: both;
	}
	body.gallery #content #main {
		width: 100%;
		margin: 0 0 0px;
		float: none;
		clear: both;
	}
}
@media only screen and (max-width: 640px){
	body.gallery #main .sect02 ul.wrapper li:nth-child(3n){
		margin-right: 2%!important;
	}
	body.gallery #main .sect02 ul.wrapper li{
		width: 49%!important;
	}
	body.gallery #main .sect02 ul.wrapper li:nth-child(2n){
		margin-right: 0!important;
	}
}

/*=============================================================*/
/*=====================　voice　========================*/
body.voice #content{

}
body.voice #content #main{
}

body.voice #main .voiceBox{
	width: 100%;
    padding: 20px;
    margin: 0 auto 30px;
    box-sizing: border-box;
    border-top: double #eee;
    border-left: solid 1px #eee;
}
body.voice #main .pickUp{
	border: solid 3px #006688;
}
.voiceBox_inner{
}
body.voice #main .voiceBox .review{
	width: 100%;
	margin: 0 auto;
}
.review_data{
	display: flex;
    background: #f5f5f5;
    padding: 10px;
    box-sizing: border-box;
    margin-bottom: 10px;
}
.review_data h3{
	margin-right: 20px;
}
.review_data p{
	margin: 0;
}

body.voice #main .voiceBox .review h3{
	border: none;
	font-size: 14px;
	padding: 0;
    margin: 0 10px 0 0;
}

body.voice #main .voiceBox .review .reviewInner{
    margin: 0 auto 10px;
    background: none;
    padding: 0 10px;
	box-sizing: border-box;
}
body.voice #main .voiceBox .review dl{
    margin: 0;
}
body.voice #main .voiceBox .review dl dd{
    color: #4F4C4B;
}
body.voice #main .voiceBox .voiceInner,
body.voice #main .voiceBox.pickUp .voiceInner{
    background: none;
    padding: 0 10px;
    margin: 0 auto;
}
body.voice #main .voiceBox .voiceInner p{
	margin: 0;
}
.voicemenu{
    display: flex;
    border: solid 1px #eee;
    padding: 10px;
    box-sizing: border-box;
    margin-bottom: 10px;
	align-items: center;
}
.voicemenu h4,
body.voice #main .voiceBox .reply h4{
	font-size: 14px;
	font-weight: normal;
}
.voicemenu h4{
    width: 110px;
	min-width: 110px;
    border-right: solid 1px #eee;
    margin-right: 10px;
    margin: 0 10px 0 0;	
}
body.voice #main .voiceBox .reply{
    padding: 0 10px;
	position: relative;
    margin: 0 auto;
}
body.voice #main .voiceBox .reply::before{
    content: "";
    position: absolute;
    top: 11px;
    left: 0;
    width: 100%;
    height: 1px;
    border-top: dashed 2px #eee;
}
body.voice #main .voiceBox .reply h4{
	width: 140px;
	text-align: center;
    background: #fff;
    margin: 0 auto 10px;
    position: relative;
}
@media only screen and (max-width: 640px){
	body.voice #main .voiceBox{
		padding: 10px;
	}
	body.voice #main .voiceBox .review dl{
	    width: 100%;
	}
	.voicemenu{
	    flex-direction: column;
	}
	.voicemenu h4{
	    width: 100%;
		border-right: none;
	    border-bottom: solid 1px #eee;
		margin: 0 0 10px;
		padding-bottom: 10px;
	}
}



/*=============================================================*/
/*=====================　faq　========================*/

body.faq #content{
    display: flex!important;
    flex-direction: row-reverse;
}
body.faq #content #main{
	padding: 20px;
    background: rgba(255, 255, 255, 0.8);
    box-sizing: border-box;
}
body.faq #sub{

}
body.faq #main .sect .titleArea{    border-bottom: solid 2px #eee;
    padding: 0;
	margin-bottom: 10px;
}
body.faq #main .sect .titleArea h3{
	margin: 0;
    margin-bottom: 6px;
}
body.faq #main .sect .titleArea h3 span.jp{
    font-size: 22px;
	font-weight: normal;
}
body.faq #main .styleBox{
	margin: 0 auto;
}
div.accordion ul{
	margin-bottom: 0;
}
div.accordion > ul > li > ul > li{
    padding: 20px 10px;
    color: #4F4C4B;
}
div.accordion > ul > li > a{
    background: #006688;
}
@media only screen and (max-width: 1024px){
	body.faq #content{
		display: block;
		flex-direction: column;
	    margin-top: 20px;
	}
	body.faq #content #main{
		width: 100%;
		margin-bottom: 0px;
		
	}
	body.faq #sub{
		width: 100%;
	}
	#sub #subFaq ul li a{
		border-bottom: none;
	}
	body.faq #main .sect .titleArea h3 span.jp{
		font-size: 22px;
	}
}
@media only screen and (max-width: 425px){
	body.faq #content #main{
		padding: 18px;		
	}
	body.faq #main .sect .titleArea h3 span.jp{
		font-size: 20px;
	}
	div.accordion > ul > li > a{
		font-size: 16px;
	}

}
/*=============================================================*/
/*=====================　access　========================*/
body.access #main section{
    margin: 0 auto;
    width: 100%;
	position: relative;
}
.shopBox{
    display: flex;
    margin: 0 auto 20px;
}
.shopImg{
    width: 400px;
    background: url(/img/upload/2020/03/peg_access.jpg)no-repeat center center;
    background-size: cover;
    min-width: 400px;
}
body.access .shopImg img{
    margin: 0 auto;
    width: 100%;
}
body.access #main .shopdate{
	width: 100%;
    box-sizing: border-box;
    margin: 20px 0 20px 2%;
}
body.access #main .shopdate p{
	color: #888;
    margin: 0 auto
}
body.access #main .shopdate p.shopname{
	font-size: 18px;
    font-weight: bold;
    margin-bottom: 10px;
    padding: 2px;
	color: #4F4C4B; 
}
body.access #main .shopdate a{
    color: #888;
    font-size: 14px;
}
body.access #main .shopdate table{
	margin: 20px auto 0;
	width: 100%;
	max-width: 800px;
}
body.access #main .shopdate tr{
	border-bottom: solid 1px #eee;
    display: flex;
}
body.access #main .shopdate tr:last-child{
	border-bottom: none;
}
body.access #main .shopdate td{
	padding: 10px 0;
}
body.access #main .shopdate td:first-child{
    background: none;
    width: 90px;
    min-width: 90px;
}
body.access #main .shopdate td:nth-child(2){
	background: none;
    width: 100%;
}
body.access #main .shopdate td.road{
	border-bottom: none;
}
body.access #main .shopdate td strong{
	font-weight: normal;
}


@media only screen and (max-width: 1024px){
	.shopImg{
    	min-width: auto;
	}

	body.access #main section .shopImg img{
		margin: 0 auto;
	}
}
@media only screen and (max-width: 640px){
	.shopBox{
	    flex-wrap: wrap;
	}
	.shopImg{
	    width: 100%;
    	height: 300px;
	}
	body.access #main .shopdate{
    	margin: 20px auto;
	}
	body.access #main .shopdate td,
	body.access #main .shopdate td:nth-child(2){
		padding: 5px 0;
	}
}

@media only screen and (max-width: 425px){
	body.access #main .shopdate p.shopname{
		font-size: 16px;
	}
}
/*=============================================================*/
/*=====================　topページ　========================*/
/* -------- top_h1 start ----------*/
.top_h1{
    z-index: 1;
    text-align: center;
    position: absolute;
    bottom: 0;
    left: 10%;
    max-width: 100%;
    width: 80%;
    margin: 0px auto 240px;
}
.top_h1 .logoArea{
	width: 290px;
    margin: 0;
    position: relative;
    top: 0;
    left: 0;
    opacity: 0;
	color: #fff;
    text-align: center;
}

.top_h1 .logoArea h1{
	color: #fff;
	margin: 0px;
    line-height: 40px;
    letter-spacing: 3px;
    font-size: 26px;
}
.top_h1 .logoArea h1 span.h1_span01{
    margin-left: -5px;
}
.top_h1 .logoArea h1 span.h1_span02{
    margin-left: -8px;
    letter-spacing: 1px;
    margin-right: 13px;
}
.top_h1 .logoArea h1 span.h1_span03{
	font-size: 13px;
    margin: 0 0 0 5px;
    letter-spacing: 1.4px;
	font-weight: normal;
}
.top_h1 .logoArea p{
    font-size: 13px;
    margin-top: -10px;
    text-align: left;
    margin-left: 16px;
}
.top_h1 .logoArea a.logo{
    box-sizing: border-box;
}
@media only screen and (max-width: 1024px){
	.top_h1{
		left: 7%;
    	margin: 0px auto 250px 0;
	}
}
@media screen and (max-width: 1024px) and (orientation: landscape){
   .top_h1{
	    margin: 0px auto 130px 0;
   }	
}
@media only screen and (max-width: 640px){
	.top_h1{
    	margin: -100px auto 0 0;
		left: 7%;
		top: 50%;
	}
}
@media only screen and (max-width: 425px){
	.top_h1{
	    margin: -100px 0 0 0;
		left: 0%;
	}
	.top_h1 .logoArea{
	    width: 255px;
	}
	.top_h1 .logoArea h1{
	    font-size: 20px;
    	line-height: 30px;
	}
	.top_h1 .logoArea h1 span.h1_span03{
	    font-size: 12px;
    	letter-spacing: 0;
	}
	.top_h1 .logoArea p{
		font-size: 13px;
		font-weight: normal;
		margin-left: 24px;
		margin-top: -5px;
	}
}
/* -------- top_h1 end ----------*/

body.top #content{
	width: 100%;
}
body.top #main{
	width: 100%;
	padding: 0;
	overflow: hidden;
}
body.top section.sect{
	margin: 0 auto 100px;
	padding: 0 ;
	position: relative;
}
body.top section.sect ul.wrapper li a.img{
	margin: 0;
}

body.top section.sect ul.wrapper li a.img:hover{
	opacity: 1;
}
body.top section.sect ul.wrapper li a.img img{
}
body.top section.sect ul.wrapper li a.img img:hover{
}
body.top section.sect .titleArea{
	width: 90%;
	margin: 0 auto 50px;
	max-width: 1200px;
	position: relative;
	border: none;

}
body.top section.sect .titleArea h2{
	float: none;
	text-align: center;
    padding: 0px 0 5px;
	font-weight: normal;
	color: #4F4C4B;
    margin: 0 auto;
    position: relative;
}

body.top section.sect .titleArea h2 span.en{
	font-size: 26px;
}
body.top section.sect .titleArea h2 span.jp{
    font-size: 14px;
    letter-spacing: .11em;
	display: block;
    margin: 0px 0 0;
    font-weight: bold;
}
body.top section.sect .wrapper{
	width: 90%;
    margin: 0 auto;
	max-width: 1200px;
}
body.top section.sect.sect02 ul.wrapper li{
    margin: 0 1% 20px;
    width: 31.3%;
	background: #fff;
}
body.top section.sect.sect02 ul.wrapper li:nth-child(5n){
	margin: 0 1% 20px;
}
body.top section.sect ul.wrapper li a.txt p{
	font-size: 14px;
}

/*=====================　more ボタン　========================*/

/* top more ボタン*/
.Nav ul.pcBtn li.reserve a.top_more,
body.top section.sect a.top_more,
body.top .top_news ul.wrapper li a.top_more,
a.top_more{
	display: block;
    color: #4F4C4B;
	padding: 0px 0 4px 0px;
    position: relative;
	transition: transform .4s cubic-bezier(.23,1,.32,1),background .4s ease;
    text-align: center;
}
body.top section.sect a.top_more{
	width: 110px;
	margin: 10px auto;
	font-size: 13px;
}
.Nav ul.pcBtn li.reserve a.top_more span.top_more_arrow,
body.top section.sect a.top_more span.top_more_arrow,
body.top .top_news ul.wrapper li a.top_more span.top_more_arrow,
a.top_more span.top_more_arrow{
    height: 1px;
    border-top: solid 1px #4F4C4B;
    transition: transform .4s cubic-bezier(.23,1,.32,1),background .4s ease;
    transform-origin: center left;
    position: absolute;
    bottom: 0;
    z-index: 2;
    right: 0;
    transform: scale(0.0);
	background: none;
    padding-right: 0;
    display: block;
}
.Nav ul.pcBtn li.reserve a.top_more,
.Nav ul.pcBtn li.reserve a.top_more span.top_more_arrow{
	width: 103px;
}
body.top .top_news ul.wrapper li a.top_more span.top_more_arrow{
    width: 95px;	
}
body.top .top_news ul.wrapper li a.top_more{
	margin: 0 0 0 20px;
	font-size: 13px;
	min-width: 95px;
}
body.top section.top_topics ul.wrapper li a.top_more,
body.top section.top_topics ul.wrapper li a.top_more span.top_more_arrow{
	width: 110px;
}
body.top section.top_hairstyle a.top_more,
body.top section.top_hairstyle a.top_more span.top_more_arrow,
body.top section.top_blog a.top_more,
body.top section.top_blog a.top_more span.top_more_arrow{
	width: 210px;
}

body.top section.top_access a.top_more,
body.top section.top_access a.top_more span.top_more_arrow{
	width: 100px;
}
body.top section.top_hairstyle a.top_more,
body.top section.top_blog a.top_more{
	margin-top: 60px;
	font-size: 15px;
}
.Nav ul.pcBtn li.reserve a.top_more:hover .top_more_arrow,
body.top section.sect a.top_more:hover .top_more_arrow,
body.top .top_news ul.wrapper li a.top_more:hover .top_more_arrow,
a.top_more:hover .top_more_arrow{
    transform: scale(1.0);
    border-top: solid 1px #006688;
}
body.top section.sect a.top_more:hover,
body.top .top_news ul.wrapper li a.top_more:hover,
a.top_more:hover{
	color: #006688;
	opacity: 1;
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
	background: none;
}
body.top section.sect a.top_more:hover span,
body.top .top_news ul.wrapper li a.top_more:hover span,
a.top_more:hover span{
	color: #006688;	
}
.Nav ul.pcBtn li.reserve a.top_more:hover span{
    color: #4F4C4B;
}
.Nav ul.pcBtn li.reserve a.top_more:hover::before,
body.top section.sect a.top_more:hover::before,
body.top .top_news ul.wrapper li a.top_more:hover::before,
a.top_more:hover::before{
	transform: translateX(0%) skewX(0deg);
}

@media only screen and (max-width: 1024px){
	body.top section.top_hairstyle a.top_more,
	body.top section.top_blog a.top_more{
		margin-top: 40px;
	}	
}

@media only screen and (max-width: 640px){
	.Nav ul.pcBtn li.reserve a.top_more,
	body.top section.sect a.top_more,
	body.top .top_news ul.wrapper li a.top_more{
		font-size: 12px;
	}
	.Nav ul.pcBtn li.reserve a.top_more,
	.Nav ul.pcBtn li.reserve a.top_more span.top_more_arrow{
		width: 80px;
		margin-left: -5px;
	}
	body.top section.top_hairstyle a.top_more,
	body.top section.top_blog a.top_more{
		margin-top: 30px;
	}	
}
/* top more ボタン　ここまで*/


/* stylist & style ボタン*/
body.stylist #main .stylistBox .visualInfo .blogArea .titleArea a,
body.stylist #main .sect02 .titleArea a,
body.style #main .sect02 .titleArea a{
    text-decoration: none;
    text-transform: uppercase;
    color: #4F4C4B;
    float: none;
    clear: both;
    padding: 0;
    text-align: center;
    position: relative;
    width: fit-content;
    margin: 0;
    font-size: 11px;
}
body.stylist #main .stylistBox .visualInfo .blogArea .titleArea a:hover,
body.stylist #main .sect02 .titleArea a:hover,
body.style #main .sect02 .titleArea a:hover{
    opacity: 1;
    color: #006688;
}
body.stylist #main .stylistBox .visualInfo .blogArea .titleArea a span,
body.stylist #main .sect02 .titleArea a span,
body.style #main .sect02 .titleArea a span{
	padding-right: 0;
    background: none;
    text-transform: uppercase;
}
body.stylist #main .stylistBox .visualInfo .blogArea .titleArea a::before,
body.stylist #main .sect02 .titleArea a::before,
body.style #main .sect02 .titleArea a::before{
    content: "";
    width: 0%;
    height: 1px;
    position: absolute;
    bottom: 0;
    left: 0;
    background: #4F4C4B;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}

body.stylist #main .stylistBox .visualInfo .blogArea .titleArea a:hover::before,
body.stylist #main .sect02 .titleArea a:hover::before,
body.style #main .sect02 .titleArea a:hover::before{
    width: 100%;
    background: #006688;
    -webkit-transition: all .4s ease;
    -moz-transition: all .4s ease;
    -ms-transition: all .4s ease;
    -o-transition: all .4s ease;
    transition: all .4s ease;
}
/* stylist & style more ボタン　ここまで*/

body.style #main .sect02 .titleArea a span{
	background: none;
	padding-right: 0;
}
@media only screen and (max-width: 1024px){
	body.stylist #main .stylistBox .visualInfo .blogArea .titleArea a,
	body.stylist #main .sect02 .titleArea a,
	body.style #main .sect02 .titleArea a{
	    margin-top: 10px;
	}
}


/* style more ボタン　ここまで*/

/*=============================================================*/


#mainVisual{
    margin: 0 auto ;
	width: 100%;
}
#mainVisual .swiper-wrapper{
	margin-bottom: 0;
    width: 100%;
    height: auto;
    margin: 0 0 0 auto;
	position: relative;
	
}

#mainVisual img{
    width: auto;
    max-width: inherit;
    text-align: center;
    height: calc(100vh - 100px);	
}
#mainVisual .swiper-wrapper .swiper-slide{

}
.swiper-slide{
	-webkit-flex-shrink: 0;
    -ms-flex: 0 0 auto;
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative;
}
.catch {
    position: absolute;
    top: 33%;
    left: 10%;
    z-index: 80;
	width: 150px;
}





body.top section.sect.sect01 ul.wrapper li{
	width: 25%;
    margin: 0;

}
body.top #main section.sect ul.wrapper li a.txt{
	margin-bottom: 10px;
	-webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}
body.top #main section.sect ul.wrapper li a.txt:hover{
	opacity: 1;
	-webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}
body.top #main section.sect ul.wrapper li a.txt h3{
	font-size: 1.3rem;
    line-height: 1.5;
    color: #4F4C4B;
}
body.top #main section.sect ul.wrapper li a.txt p{
	margin: 0;
}
body.top #main section.sect ul.wrapper li a.txt p.date{
	color: #888;
}

@media only screen and (min-width: 1920px){
	#mainVisual img{
		height: auto;
		width: 100%;
	}
}



@media only screen and (max-width: 1024px){
	#mainVisual{
		margin: 0px auto 0;
	}
	#mainVisual img{
		height: calc(100vh - 20px);
	}
	#mainVisual .swiper-wrapper{
		width: 100%;
	}
	body.top #main{
		padding: 0;
		width: 100%;
	}
	body.top #main section.sect{
		margin: 0 auto;
	    padding: 20px 0 ;
	}
	body.top #main section.sect .titleArea{
		border: none;
	    padding: 0;
		margin-bottom: 40px;
	}
	body.top #main section.sect .titleArea h2{
		padding: 0;
		margin: 0 auto;
	    color: #4F4C4B;
    	font-weight: normal;
	}
	body.top #main section.sect .titleArea h2 span.en{
		font-size: 26px;
	}
	body.top section.sect .titleArea h2::before,
	body.top section.sect .titleArea h2::after{
		font-weight: normal;
	}
	body.top #main section.sect.sect02 ul.wrapper li{
		margin: 0 0 20px;
	    width: 30%;
		background: #fff;
	}
	body.top #main section.sect.sect02 ul.wrapper li:nth-child(3n+2){
		margin: 0;
	}
	.catch {
		top: 10%;
		left: 5%;
		width: 100px;
	}	
	body.top #main section.sect ul.wrapper li a.img{
		margin: 0;
	}

	body.top #main section.sect .titleArea h2 span.jp{
    	font-size: 12px;
		margin-top: 6px;
	}
	body.top #main section.sect ul.wrapper li a.txt h3{
	    text-decoration: none;
    	line-height: 20px;
		margin: 10px 0;
		font-weight: bold;
    	font-size: 14px;
	}
}
@media only screen and (max-width: 640px){
	#mainVisual img{
		position: relative;
		left: -100%;
	}
	body.top #main section.sect .titleArea h2 span.en{
		font-size: 20px;
	}
}
@media only screen and (max-width: 425px){
	body.top #main section.sect ul.wrapper li a.txt h3{
		font-size: 14px;
	}
	body.top #main section.sect .titleArea a span{
	    font-size: 11px;
    	letter-spacing: 1px;	
	}
}

/* top_topics start */
.top_topics .wrapper{
	display: flex;
	justify-content: space-between;
}
.top_topics .wrapper li{
	width: 23%;
}
.top_topics .wrapper li a.img{
    position: relative;
	color: #4F4C4B;
}
.top_topics .wrapper li .txt{
	position: absolute;
	top: 5%;
	left: 5%;
	width: 90%;
	height: 90%;
    background: rgba(255, 255, 255, 0.7);
	display: flex;
    align-items: center;
    justify-content: center;
	text-align: center;
} 
.top_topics .wrapper li a.img:hover div.txt{
}
.top_topics .wrapper li .txt_inner{
	position: relative;
}
.top_topics .wrapper li:nth-child(1){

}
.top_topics .wrapper li:nth-child(2){

}
.top_topics .wrapper li:nth-child(3){

}
.top_topics .wrapper li:nth-child(4){

}
.top_topics .wrapper li p{
    position: relative;
    padding: 0 10px 10px 18px;
    box-sizing: border-box;
    width: 130px;
    margin: 20px auto 20px;
    font-size: 12px;
}
.top_topics .wrapper li p::before,
.top_topics .wrapper li p::after{
	content: "";
	position: absolute;
    top: 50%;
    left: 0;
    width: 16px;
    height: 4px;
    border-bottom: solid 1px;
    transform: rotate(-40deg);
	margin: -9px 0 0 0;
}
.top_topics .wrapper li p::after{
	left: auto;
	right: 0;
}
.top_topics .wrapper li h3{
	font-size: 26px;
	text-transform: uppercase;
    letter-spacing: 1px;
}
@media only screen and (max-width: 1024px){
	.top_topics .wrapper li h3{
		font-size: 18px;
	}
	.top_topics .wrapper li p{
		width: 100px;
		margin: 16px auto;
	}
}
@media only screen and (max-width: 640px){
	body.top section.sect .wrapper{
		flex-wrap: wrap;
	}
	.top_topics .wrapper li{
		width: 49%;
	}
}

/* top_topics end */


/* new hair style */

body.top section.top_hairstyle .wrapper{
	display: flex;
    justify-content: space-between;
}
body.top section.sect.top_hairstyle ul.wrapper li{
    position: relative;
    width: 23%;	
}
body.top section.sect.top_hairstyle ul.wrapper li a.img::before{
	content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 35px;
    background: rgba(255, 255, 255, 0.6);
	z-index: 1;
}
body.top section.sect.top_hairstyle ul.wrapper li .hair_number::before{
	content: "STYLE";
    position: absolute;
    top: 0;
    left: 0;
    font-size: 12px;
	margin: 0;
    color: #4F4C4B;
	font-family: "游ゴシック",YuGothic,"ヒラギノ角ゴ Pro","Hiragino Kaku Gothic Pro","メイリオ","Meiryo",sans-serif;
}

body.top section.sect.top_hairstyle ul.wrapper li:nth-child(1) p::before{
	content: "01";	
}
body.top section.sect.top_hairstyle ul.wrapper li:nth-child(2) p::before{
	content: "02";	
}
body.top section.sect.top_hairstyle ul.wrapper li:nth-child(3) p::before{
	content: "03";	
}
body.top section.sect.top_hairstyle ul.wrapper li:nth-child(4) p::before{
	content: "04";	
}
body.top section.sect.top_hairstyle ul.wrapper li p::before{
    position: absolute;
    top: 0;
    left: 0;
    font-family: 'Niconne', cursive;
    font-size: 47px;
    margin: -12px auto 0 0;
    color: #4F4C4B;
}

body.top #main section.sect.top_hairstyle ul.wrapper li a{
	display: block;
	position: relative;
}
body.top #main section.sect.top_hairstyle ul.wrapper li a:hover{
	opacity: 1;
}
body.top section.sect.top_hairstyle ul.wrapper li a.img{
    width: 100%;
}
body.top #main section.top_hairstyle ul.wrapper li p{
	position: relative;
	top:0;
	left: 0;
	right: auto;
	font-size: 14px;
	text-shadow: unset;
	font-weight: normal;
}

body.top #main section.sect.top_hairstyle ul.wrapper li a.txt{
    position: relative;
    z-index: 10;
    color: #4F4C4B;
    margin: -28px 0 0 20px;
    height: 50px;
}
body.top #main section.top_hairstyle ul.wrapper li a.txt h3{
    margin: 0 auto 10px;
    border-bottom: dotted 2px #888;
    padding: 10px 0;
    font-size: 16px;
    font-weight: bold;
}

body.top #main section.top_hairstyle ul.wrapper li a.txt h3,
body.top #main section.top_hairstyle ul.wrapper li a.txt p{
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}
body.top #main section.sect.top_hairstyle ul.wrapper li a:hover p,
body.top #main section.top_hairstyle ul.wrapper li a.txt:hover h3{
	color: #006688;
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}
body.top #main section.top_hairstyle ul.wrapper li a.txt p.style_image{
    text-align: center;
    font-size: 12px;
}
@media only screen and (max-width: 1024px){
	body.top section.sect.top_hairstyle ul.wrapper li p::before{
	    margin: -8px auto 0 0;
	}
}

@media only screen and (max-width: 640px){
	body.top #main section.top_hairstyle ul.wrapper li a.txt h3{
		font-size: 16px;
		line-height: 26px;
		font-weight: normal;
		letter-spacing: 0;
	}
	body.top section.top_hairstyle .wrapper{
		flex-wrap: wrap;
	}
	body.top section.sect.top_hairstyle ul.wrapper li{
		width: 49%;
	}
}
/* new hair style ここまで*/



/* top_blog を追加　ここから*/


body.top section.top_blog{

}
body.top section.top_blog .wrapper{
    display: flex;
    justify-content: space-between;
}
body.top section.top_blog ul.wrapper li{
    box-sizing: border-box;
    width: 23%;
}

body.top section.top_blog ul.wrapper li a.img{

}
body.top section.top_blog ul.wrapper li a.img img{

}
body.top #main section.sect.top_blog ul.wrapper li a.txt{
	padding: 10px;
    display: block;
    margin: 0;
    color: #4F4C4B;
}
body.top #main section.top_blog ul.wrapper li a.txt h3{
    font-size: 14px;
    margin-bottom: 6px;
}
body.top #main section.sect ul.wrapper li a.txt p.top_blog_category{
	margin: 0 0 20px;
	position: relative;
}
p.top_blog_category::before{
	content: "";
	position: absolute;
	bottom: -3px;
	left: -10px;
	width: calc(100% + 20px);
	height: 1px;
	background: #eee;
}
p.top_blog_category span{
    border-bottom: solid;
	padding-bottom: 3px;
    position: relative;
	font-size: 12px;
}

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

@media only screen and (max-width: 640px){
	body.top section.top_blog .wrapper{
	    flex-direction: column;
	}
	body.top section.top_blog ul.wrapper li{
	    display: flex;
		width: 100%;
		margin-bottom: 20px;
	}
	body.top #main section.top_blog ul.wrapper li a.img{
		width: 50%;
    	min-width: 100px;
	}
	body.top #main section.top_blog ul.wrapper li a.txt{
		width: 100%;
	}
}
@media only screen and (max-width: 425px){

}


/* top_blog を追加　ここまで*/
/* top_news  追加　ここから*/
.top_news{
    margin-top: -84px;
    z-index: 1;
	position: relative;
}
.top_news::before{
	content: "";
	width: 100%;
	position: absolute;
	height: 40px;
    background: rgba(255, 255, 255, 0.5);
	bottom: 0;
	left: 0;
    animation-duration: 0.8s;
    animation-delay: 1s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    transform: translate(0px,30px);
	animation-name: bg_up;
}
@keyframes bg_up{
0%{
	transform: translate(0px,30px);
	opacity: 0;
	}
90%{
	transform: translateY(0px);
	}
100%{
	transform: translateY(0px);
	opacity: 1;
	}
}
.top_news_inner{
    padding: 30px;
    background: #fff;
    width: 90%;
    margin: 0 auto;
    max-width: 1200px;
    box-sizing: border-box;
}
body.top .top_news ul.wrapper{

}
body.top .top_news ul.wrapper li{
	display: flex;
	align-items: center;
}
body.top .top_news ul.wrapper li a.txt{
	display: flex;
    align-items: center;
	width: 100%;
	margin: 0 auto;
    padding: 0;
    box-sizing: border-box;
    color: #4F4C4B;
}
.top_news  .top_more_arrow::after{
    content: "";
    right: 0;
    transition: .4s ease;
    top: -3.5px;
    display: block;
    position: absolute;
}
body.top .top_news ul.wrapper li a.top_more:hover .top_more_arrow::after{
    border-left: 5px solid #006688;
}
body.top .top_news ul.wrapper li a.txt:hover,
body.top .top_news ul.wrapper li a.txt:hover h3{
	opacity: 1;
	color: #006688;
    -webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}
body.top .top_news ul.wrapper li a.txt p.top_news_category{
	font-size: 16px;
	padding: 4px;
	box-sizing: border-box;
    width: 160px;
    margin: 0 20px 0 0;
    line-height: 20px;
	text-align: center;
	position: relative;
}
body.top .top_news ul.wrapper li a.txt p.top_news_category::before{
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 30px;
    height: 4px;
    border-bottom: solid 1px;
    transform: rotate(-40deg);
    margin: -4px 0 0 0;
}
body.top .top_news ul.wrapper li a.txt p.top_news_category::after{
	content: "";
    position: absolute;
    top: 50%;
    right: 0;
    width: 30px;
    height: 4px;
    border-bottom: solid 1px;
    transform: rotate(-40deg);
    margin: -4px 0 0 0;
}
body.top .top_news ul.wrapper li a.txt h3{
    width: 90%;
    border: none;
    margin: 0px auto 0 0;
    padding: 0px;
    font-size: 14px;
    font-weight: bold;
	line-height: 22px;
}
@media only screen and (max-width: 1024px){
	.top_news::before{
		animation-duration: 0.8s;
		animation-delay: 1s;
		animation-timing-function: ease-in-out;
		animation-fill-mode: forwards;
		transform: translate(0px,0px);
		animation-name: bg_up_sp;
	}
	@keyframes bg_sp{
	0%{
		transform: translate(0px,0px);
		opacity: 0;
		}
	90%{
		transform: translateY(0px);
		}
	100%{
		transform: translateY(0px);
		opacity: 1;
		}
	}
}

@media only screen and (max-width: 640px){
	.top_news{
	    margin-top: -40px;	
	}
	.top_news::before{
	    top: 20px;
	}
	body.top .top_news ul.wrapper li{
		flex-wrap: wrap;
	}
	body.top .top_news ul.wrapper li a.txt{
		flex-wrap: wrap;
	}
	body.top .top_news ul.wrapper li a.txt p.top_news_category{
	    margin: 0 auto;
		font-size: 15px;
	}
	body.top .top_news ul.wrapper li a.txt h3{
	    margin: 14px auto 0;
		width: 100%;
	    text-align: center;
	}
	body.top .top_news ul.wrapper li a.top_more{
	    margin: 20px 0 0 auto;
	    width: 88px;
	    margin: 20px auto 0;
	}
}
@media only screen and (max-width: 425px){
	.top_news_inner{
		padding: 20px;
	}
}

/* top_news を追加　ここまで*/
/* top_concept 追加　ここから*/
.top_concept_inner{
	position: relative;
    padding: 120px 0 76px;	
}
.top_concept_inner::before{
    content: "";
    position: absolute;
    top: 0;
    left: 50%;
    margin: 0 0 0 -465px;
    background: url(/img/upload/2020/02/peghair_top_concept.png)center center;
    background-size: cover;
    max-height: 700px;
    width: 930px;
    height: 574px;
	opacity: 0.1;
}
.top_concept li{
	text-align: center;
}
.top_concept h3{
	font-size: 20px;
}
.top_concept p{
    line-height: 34px;
	font-size: 14px;
}
@media only screen and (max-width: 1024px){
	body.top section.top_concept .wrapper{
		width: 96%;
	    border-bottom: solid 3px rgba(78, 75, 74, 0.1);
	    padding-bottom: 40px;
	}
	.top_concept_inner::before{
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		margin: 0;
		background: url(/img/upload/2020/03/peghair_top_concept01.png)center center;
		background-size: cover;
		max-height: 700px;
		width: 914px;
		height: 563px;
	}
	.top_concept_inner::after{
		content: "";
		position: absolute;
		top: 0;
		right: 0;
		margin: 0;
		background: url(/img/upload/2020/03/peghair_top_concept02.png)center center;
		background-size: cover;
		max-height: 700px;
		width: 914px;
		height: 563px;
		opacity: 0.1;
	}
	.top_concept h3{
		font-size: 16px;
	}
}
@media only screen and (max-width: 768px){
	.top_concept_inner::before,
	.top_concept_inner::after{
	    width: 780px;
    	height: 490px;
	}
	body.top section.top_concept .wrapper{
	    border-bottom: solid 2px rgba(78, 75, 74, 0.1);
	}
}
@media only screen and (max-width: 640px){
	.top_concept_inner{
		padding: 80px 0;
	}
	.top_concept_inner::before,
	.top_concept_inner::after{
		width: 724px;
		height: 453px;
	}
	.top_concept h3{
		font-size: 14px;
	}
	.top_concept p{
	    white-space: normal;
	    line-height: 25px;
		font-size: 13px;
		letter-spacing: -1px;
	}
	.top_concept li{
	    width: 80%;
    	margin: 0 auto;
	}
}
@media only screen and (max-width: 560px){
	.top_concept_inner::before,
	.top_concept_inner::after{
		width: 490px;
		height: 310px;
	}
}
@media only screen and (max-width: 460px){
	.top_concept_inner::before,
	.top_concept_inner::after{
		width: 400px;
		height: 270px;
	}
}
@media only screen and (max-width: 400px){
	.top_concept_inner::before,
	.top_concept_inner::after{
	    width: 350px;
	}
}
/* top_concept を追加　ここまで*/

/* top_access を追加　ここから*/

body.top #main section.top_access{
}
.top_access_inner{
	padding: 30px;
	width: 90%;
	max-width: 600px;
	margin: 0 auto;
    box-sizing: border-box;
    background: url(/img/upload/2019/07/lea_pageTitleArea_bg.jpg);
    background-size: 60px;
}
.top_access_innerbox{
	width: 100%;
	border: solid 4px #006688;
    padding: 40px 0;
    box-sizing: border-box;
    background: rgba(255, 255, 255, 0.9);
}

body.top #main section.top_access ul.wrapper li a.txt h3{
	font-size: 22px;
	font-weight: bold;
    margin-bottom: 20px;
	padding: 0 20px;
	line-height: 28px;
	text-align: center;
}
body.top #main section.top_access ul.wrapper li a.txt p{
	padding: 0 20px;
	text-align: center;
	font-size: 13px;
	line-height: 22px;
}
.top_access_photo{
    max-width: 1200px;
    margin: 40px auto 0;
	overflow: hidden;
}
body.top section.top_access .wrapper{
	width: 100%;
}
body.top section.top_access .swiper-container{
    margin: 0 auto;
    overflow: unset;
	max-width: 500px;
}
body.top section.top_access .wrapper table{
	margin: 0 auto;
    color: #4F4C4B;
}
body.top section.top_access .wrapper tr{
	display: flex;
	border-bottom: solid 1px #eee;
}
body.top section.top_access .wrapper tr:first-child{
	border-top: solid 1px #eee;
}
body.top section.top_access .wrapper td{
	padding: 10px;
	width: 100%;

	line-height: 22px;
    font-size: 13px;
}
body.top section.top_access .wrapper td:first-child{
	width: 30%;
	min-width: 60px;
}

@media only screen and (max-width: 1024px){
	body.top #main section.top_access{
		padding: 100px 0;
	}
	body.top #main section.top_access ul.wrapper li a.txt h3{
		font-size: 18px;
	    line-height: 24px;
	}
	.top_access_inner{
	    padding: 20px;
	}

}
@media only screen and (max-width: 768px){
	body.top #main section.top_access{
		padding: 80px 0;
	}
}

@media only screen and (max-width: 425px){
	body.top #main section.top_access{
		padding: 60px 0;
	}
	.top_access_inner{
	    padding: 10px;
	}

}


/* top_access を追加　ここまで*/


/* top_gallery を追加　ここから*/
body.top #main section.top_gallery{
    padding: 70px 0 140px;
}

body.top #main section.top_gallery ul.wrapper{
	display: flex;
	justify-content: space-between;
    flex-wrap: wrap;
}
body.top #main section.top_gallery ul.top_gallery_wrapper02{
	margin-top: 50px;
}
body.top #main section.top_gallery ul.wrapper li{
	width: 30%;
    padding: 10px 10px 20px 40px;
    box-shadow: 1px 1px 6px 0 rgba(0,0,0,.15);
    box-sizing: border-box;
    position: relative;
}
body.top #main section.top_gallery ul.wrapper li h3{
    position: absolute;
    margin: 0;
    left: -50%;
    top: 0;
    transform: rotate(90deg);
    width: 100%;
    margin-left: 25px;
    margin-top: 50%;
    font-size: 26px;
	font-weight: normal;
}
body.top #main section.top_gallery ul.wrapper li a.txt p{
	margin-top: 10px;
}
@media only screen and (max-width: 1024px){
	body.top #main section.top_gallery{
		padding: 40px 0 100px;
	}
	body.top #main section.top_gallery ul.wrapper li{
		padding: 6px 6px 20px 20px;
	}
	body.top #main section.top_gallery ul.wrapper li h3{
		margin-left: 14px;
		font-size: 20px;
	}
}
@media only screen and (max-width: 768px){
	body.top #main section.top_gallery{
		padding: 20px 0 80px;
	}	
}

@media only screen and (max-width: 640px){
	body.top #main section.top_gallery ul.wrapper li{
	    padding: 3px 3px 20px 20px;
	    width: 48%;
	}
	body.top #main section.top_gallery ul.wrapper li h3{
		margin-left: 12px;
		font-size: 18px;
	}
	body.top #main section.top_gallery ul.wrapper li:nth-child(3){
		display: none;
	}
	body.top #main section.top_gallery ul.wrapper li a.txt p{
	    margin-top: 10px;
		font-size: 11px;
		letter-spacing: 0;
	}

}
@media only screen and (max-width: 425px){
	body.top #main section.top_gallery{
		padding: 10px 0 60px;
	}	
}
/* top_gallery を追加　ここまで*/

/* top_topics　ここから*/
body.top #main section.sect.top_topics{
	padding: 0;
}


/* top_topics　ここまで*/

/* top_allshop を追加　ここから*/
body.top section.top_allshop{
    padding: 0;
}
.top_allshop_inner{
    width: 100%;
    margin: 0 auto;
    background: rgba(136, 204, 196, 0.5);
    padding: 100px 0;
    max-width: 1200px;
}

body.top section.top_allshop .wrapper{
    display: flex;
	flex-wrap: wrap;
}



body.top section.sect.top_allshop ul.wrapper li{
	width: 49.5%;
    margin: 0 1% 0 0;
	position: relative;
    line-height: 1.4;
	box-sizing: border-box;
	display: flex;
    border: solid 1px #eee;
    padding: 10px;
	background: #fff;
	
}
body.top section.top_allshop ul.wrapper li a.img{
	width: 40%;
}
body.top #main section.top_allshop ul.wrapper li a.txt{
	width: 60%;
    margin-left: 2%;
    margin-bottom: 0;
}

body.top #main section.top_allshop ul.wrapper li:nth-child(even){
	margin-right: 0;
}
body.top #main section.top_allshop ul.wrapper li a.txt h3{
    margin:  0 ;
	font-weight: bold;
	font-size: 17px;
    padding: 0px;
    border-bottom: solid 2px #eee;
}

.top_allshop_category{
    color: #888;
    padding: 0 0 4px;
	margin-top: 22px;    border-bottom: solid 2px #eee;
	
}
body.top #main section.top_allshop ul.wrapper li a.txt p.couponDetail{
	margin: 10px 0 0px;
    line-height: 24px;
}

body.top #main section.top_allshop ul.wrapper li a.txt p.date{
    position: absolute;
    top: 0px;
    left: 0;
    font-size: 14px;
    color: #888;
	padding: 0 10px 4px 0;
	background: #fff;
	margin: 0;
}

body.top section.top_allshop a.top_allshop_more:hover::before {
    transform: translate(-10px, 0px);
}
body.top #main section.top_allshop a.top_more{
	border: solid 1px #fff;
}
@media only screen and (max-width: 1024px){
	body.top #main section.top_allshop{
		padding: 0;
	}
	.top_allshop_inner{
	    padding: 100px 0;
	}
}


@media only screen and (max-width: 768px){
	.top_allshop_inner{
		padding: 80px 0;
	}
	body.top #main section.sect.top_allshop ul.wrapper li{
		width: 100%;
		margin: 0 auto 10px;
	}
	body.top #main section.sect.top_allshop ul.wrapper li:nth-child(even){
		margin: 0 auto 10px;
	}
	body.top #main section.sect.top_allshop ul.wrapper li:last-child{
		margin: 0 auto;
	}
}
@media only screen and (max-width: 425px){
	.top_allshop_inner{
		padding: 60px 0; 
	}
}


/* top_allshop を追加　ここまで*/

/*=============================================================*/
/*=====================　company　recruit concept ========================*/
body.company #main .sect,
body.recruit #main .sect,
body.concept #main .sect{
    width: 100%;
    margin: 0 auto;
    max-width: 1200px;
	padding: 0;
	box-sizing: border-box;
}
body.company #main .sect h2,
body.recruit #main .sect h2,
body.concept #main .sect h2{
    font-size: 18px;
    line-height: 38px;
    margin: 0px auto 30px;
    max-width: 800px;
    box-sizing: border-box;
    position: relative;
    border: solid 1px #eee;
    padding: 20px;
}
body.company #main .sect h2::before,
body.recruit #main .sect h2::before,
body.concept #main .sect h2::before{
	content: "";
    position: absolute;
    left: 0;
    width: 30px;
    height: 4px;
    border-bottom: solid 1px;
    transform: rotate(-40deg);
    margin: 2px 0 0 -11px;
    top: 0;
}
body.company #main .sect h2::after,
body.recruit #main .sect h2::after,
body.concept #main .sect h2::after{
	content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 30px;
    height: 4px;
    border-bottom: solid 1px;
    transform: rotate(-40deg);
    margin: 0 -7px 3px 0;
}
body.company #main .sect p,
body.recruit #main .sect p,
body.concept #main .sect p{
	font-size: 16px;
    margin: 0 auto;
    line-height: 1.9;
	color: #888;
    max-width: 800px;
}
body.concept .swiper-container,
body.recruit .swiper-container{
    margin: 0 auto;
    max-width: 800px;
    overflow: unset;
}
.subject_body{
    margin: 0 auto 10px;
    background: rgba(255, 255, 255, 0.8);
    padding: 30px;
}
body.recruit .subject_body{
	margin-top: 10px;

}

table.recruit,
table.company{
    margin-bottom: 0;
	max-width: 800px;
}

table.recruit > tbody > tr > td,
table.company > tbody > tr > td{
	padding: 10px 0;
}
table.recruit tr,
table.company tr{
	border-bottom: solid 1px #eee;
    display: flex;
}
table.recruit tr:last-child,
table.company tr:last-child{
	border-bottom: none;
}
table.recruit > tbody > tr > td:first-child,
table.company > tbody > tr > td:first-child{
	background: none;
    width: 90px;
	min-width: 90px;
}
table.recruit > tbody > tr > td:nth-child(2),
table.company > tbody > tr > td:nth-child(2){
	background: none;
    width: 100%;
}
@media only screen and (max-width: 1024px){
}
@media only screen and (max-width: 640px){
	body.concept .swiper-container,
	body.recruit .swiper-container{
		position:relative;
		top:0;
		width: 90%;
	}
	body.company #main .sect h2,
	body.recruit #main .sect h2,
	body.concept #main .sect h2{
		font-size: 15px;
		line-height: 30px;
		padding: 14px;
	}
	body.company #main .sect p,
	body.recruit #main .sect p,
	body.concept #main .sect p{
		font-size: 14px;
	}
	table.recruit > tbody > tr > td,
	table.company > tbody > tr > td{
		padding: 5px;
	}
	table.recruit,
	table.company{
		font-size: 13px;
	}
	table.recruit > tbody > tr > td:first-child,
	table.company > tbody > tr > td:first-child{
		width: 73px;
		min-width: 73px;
	}
	table.recruit > tbody > tr:not(:last-child) > td,
	table.company > tbody > tr:not(:last-child) > td{
		line-height: 20px;
	}
}

/*=============================================================*/
/*=====================　concept　========================*/
/*<h2>と<p>を<div>で囲む

           <div class="concept_box">
            <h2>{concept.subject}</h2>
            <p>
                {concept.body}
            </p>
           </div><!-- /.concept_box -->
*/
body.concept #content #main{
	position: relative;
}
body.concept #main .sect{
	background: none;
	padding: 0;
}

body.concept #main .sect h2{

}
body.concept #main .sect p{


}


@media only screen and (max-width: 1024px){


}


@media only screen and (max-width: 425px){


}

/*=============================================================*/

/*=====================　movie　========================*/

body.movie #content #main{

}
.youtube{
	margin-bottom: 10px;
}
.movie-cap{
	font-size: 16px;
    margin-bottom: 20px;
}

/*=============================================================*/
/*=====================　media　========================*/
/*
★部分もともと<p>を削除し下記★に変更

                [media num="16" page="{get.p}" pager="media"]
                <li>
                    <a class="img" href="{url(media/{media.id})}"><img src="{media.img_src(m)}" alt="{media.subject}"></a>
                    <a class="txt" href="{url(media/{media.id})}">
                        <h3>{media.subject}</h3>
                        <p><span class="media-right">{media.publisher}</span></p>★
                        
                    </a>
                </li>
                [/media]

*/
body.media #main .sect02 ul.wrapper{
    display: flex;
    flex-wrap: wrap;	
}

body.media #main .sect02 ul.wrapper li{
	position: relative;
	margin: 0 2% 20px 0;
    width: 32.0%;
    position: relative;
    box-shadow: 1px 1px 6px 0 rgba(0,0,0,.15);
    padding: 30px 10px 10px;
    box-sizing: border-box;
}

body.media #main .sect02 ul.wrapper li:nth-child(5n){
	margin: 0 2% 20px 0;
}
body.media #main .sect02 ul.wrapper li:nth-child(3n){
	margin-right: 0;
}
body.media #main .sect02 ul.wrapper li a.txt h3{
	padding-bottom: 4px;
    color: #4F4C4B;
    font-weight: bold;
    letter-spacing: 1px;
    font-size: 14px;
    margin: 0 0 10px;
	line-height: 22px;
}

body.media #main .sect02 ul.wrapper li a.img img{
	width: 100%;
    padding: 0;
    display: block;
    margin-bottom: 0px !important;
}
body.media #main .sect02 ul.wrapper li a.img img:hover{
    opacity: 1;
}
body.media #main .sect02 ul.wrapper li a.txt{
    width: 100%;
    z-index: 10;
    display: block;
    padding: 20px 0;
    box-sizing: border-box;
}
.media-right{
	color: #4F4C4B;
    position: absolute;
    top: 0;
    width: 100%;
    left: 0;
    text-align: center;
    margin: 10px 0;
}
body.media #main .sect02 ul.wrapper li a.txt p{
	color: #888;
	font-size: 12px;
    line-height: 22px;
    margin-bottom: 0px;
}
@media only screen and (max-width: 1024px){
	body.media #main .sect02 ul.wrapper li:nth-child(2n){
		margin: 0 2% 20px 0;
	}
	body.media #main .sect02 ul.wrapper li:nth-child(3n){
		margin: 0 0 20px 0;
	}
	
	body.media #main .sect02 ul.wrapper li a.img{
		margin: 0;
	}

}
@media only screen and (max-width: 768px){

}
@media only screen and (max-width: 425px){
	body.media #main .sect02 ul.wrapper li:nth-child(3n){
		margin: 0 2% 10px 0;
	}
	body.media #main .sect02 ul.wrapper li{
		width: 49%;
		margin: 0 2% 10px 0;
	}
	body.media #main .sect02 ul.wrapper li:nth-child(2n){
		margin: 0 0 10px 0;
	}
	body.media #main .sect02 ul.wrapper li a.txt{
		padding: 10px 0;
	}
	body.media #main .sect02 ul.wrapper li a.txt p{
		display: none;
	}
	.media-right{
		border: none;
	}
	body.media #main .sect02 ul.wrapper li a.txt h3{
		line-height: 20px;
    	font-size: 13px;
	}

}

/*=============================================================*/
/*=====================　submenu　========================*/



/*=============================================================*/
/*=====================　sitemap　========================*/
body.sitemap #main section{
	background: rgba(255, 255, 255, 0.7);
	margin: 0 auto;
    padding: 20px;
    border-radius: 20px;
}
.main_page_link li{
    border-bottom: solid 1px #eee;
    padding: 14px 0;
	color: #4F4C4B;
	position: relative;
}
.main_page_link li::before{
    top: 50%;
    position: absolute;
    margin-top: -12px;
}
body.sitemap #main .shopdate ul a{
	text-decoration: none;
	color: #4F4C4B;
	padding-left: 20px;
}


@media only screen and (max-width: 425px){
	.main_page_link li{
		font-size: 14px;
		padding: 8px 0;
	}	
}



/*=============================================================*/

/*=============================================================*/
/*=====================　privacy　========================*/
body.privacy section .shopdate .titleArea{
    border-bottom: solid 1px #4F4C4B;
}
body.privacy #main section{
	margin:20px auto;
}
body.privacy #main .shopdate h3{
    color: #4F4C4B;
    font-size: 22px;
    font-family: 'Arapey', serif;
    font-weight: normal;
	margin: 0;
    margin-bottom: 2px;
}
@media only screen and (max-width: 1024px){
	body.privacy #main section{
		margin: 10px auto;
	}
	body.privacy #main .shopdate h3{
		font-size: 20px;	
	}
}
@media only screen and (max-width: 425px){
	body.privacy #main .shopdate h3{
		font-size: 18px;	
	}
	body.privacy #main .shopdate ol li{
		font-size: 14px;
	}
}

/*=============================================================*/
/*================== お問合せ ====================================*/
body.contact #main .btn input{
	font-size: 14px;
	display: inline-block;
    width: 47%;
    margin:0 1%;
}

body.contact #main .contactInner{
	margin: 50px auto;
}

body.contact #main .confirm .btn{
	width: 100%;
    max-width: 600px;
    margin: 0 auto;
}
body.contact #main p.message{
	margin: 20px auto;
	border: double #616db9;
    padding: 10px;
	font-size: 20px;
}
body.contact #main .complete a.returnTop{
	border-radius: 30px;
	max-width: 300px;
}
body.contact #main .complete a.returnTop:hover{
	opacity: 1;
	background: #4F4C4B;
	color: #fff;
	
}
body.contact #main .input .contactInner dl dd input,
body.contact #main .input .contactInner dl dd textarea{
	box-shadow: none;
    border-radius: 0;
	-webkit-appearance:none;
}

@media only screen and (max-width: 1024px){
	body.contact #main p.message{
		margin: 20px auto;
	}
}
@media only screen and (max-width: 425px){
	body.contact #main .input .contactInner dl,
	body.contact #main .btn input,
	body.contact #main .confirm .contactInner dl,
	body.contact #main .input .contactInner dl dd input,
	body.contact #main .input .contactInner dl dd textarea{
		font-size: 16px;
	}
	body.contact #main .contactInner{
	    margin: 20px auto;
	}
	body.contact #main p.message{
		font-size: 18px;
	}
}
/*=====================　contact　ボタン========================*/


body.contact #main .input .btn input#btnConfirm{
	background: #006688;
}
body.contact #main .confirm .btn{
	margin: 0 auto;
}
body.contact #main .confirm .btn input#btnSend{
	background-color: #006688;	
}
body.contact #main .btn input{
	display: inline-block;
}
body.contact #main .input .btn input#btnConfirm,
body.contact #main .input .btn input#btnReset{
	cursor: pointer;
	-webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
}
body.contact #main .input .btn input#btnReset:hover,
body.contact #main .input .btn input#btnConfirm:hover{
	background: #4F4C4B;
	-webkit-transition: all .6s ease;
    -moz-transition: all .6s ease;
    -ms-transition: all .6s ease;
    -o-transition: all .6s ease;
    transition: all .6s ease;
	color: #fff;
}
@media only screen and (max-width: 1024px){
	body.contact #main .confirm .btn{
		width: 100%;
	}	
}

/*=============================================================*/



/*=============================================================*/
/*================== パンくずリスト ====================================*/
.breadcrumb_box_inner{
    padding: 40px 0 10px;
    position: relative;
    margin-top: -26px;	
}
.breadcrumb_box_inner::before{
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 76px;
	background: #F5F5F5;
	opacity: 0.6;
}

.breadcrumb {
  margin-left: 0;
  padding-left: 0;
  width: 80%;
	max-width: 1200px;
	margin: 0 auto ;
	position: relative;
}

.breadcrumb li{
	display:inline-block;/*横に並ぶように*/
	list-style: none;
	vertical-align: top;
	font-size: 13px;
}


.breadcrumb li:last-child:after{
  content: '';
	display: none;
}

.breadcrumb li a {
    display: inline-block;
    text-decoration: none;
    font-size: 13px;
    color: #4F4C4B;
    text-transform: uppercase;
}

.breadcrumb li a:hover {
    color: #006688;
	opacity: 1;
}

.breadcrumb li:first-child img{
    margin-top: -6px;
}

.breadcrumb li a img{
    width: 16px;
}
@media only screen and (max-width: 1024px){
	.breadcrumb{
		width: 90%;
		display: block;
	}
	.breadcrumb_box_inner{
	    padding: 20px 0px 10px;
		margin-top: -12px;
	}
	.breadcrumb_box_inner::before{
	    height: 50px;
	}
	.breadcrumb li a{
		font-size: 12px;
	}
}
@media only screen and (max-width: 425px){


}

/*==================================================================*/
/*================  a#goTop =============================================*/
a#goTop{
    position: fixed;
    height: 40px;
    width: 40px;
    right: 0;
    bottom: 0;
    cursor: pointer;
    transition: all ease .35s;
    margin: 0 10px 29px 0;
    background: rgba(220, 220, 220, 0.6);
    padding: 0;
}

a#goTop:hover{
	opacity: 1;
}

a#goTop::before{
    position: absolute;
    content: "";
    top: 55%;
    left: 50%;
    width: 8px;
    height: 8px;
    border-top: 2px solid #888;
    border-right: 2px solid #888;
    -webkit-transform: translate(-50%,-50%) rotate(-45deg);
    transform: translate(-50%,-50%) rotate(-45deg);
    z-index: 0;
}

@media only screen and (max-width: 1024px){
	a#goTop{
		margin-bottom: 60px;
	}
}
/*=============================================================*/

/*=============================================================*/
/*=====================　総合サイト　shoplist　ページ　========================*/


body.shoplist #main .sect02 .titleArea{
    border: none;
    margin: 0 auto 4px;
}
body.shoplist #main .sect02 .titleArea h2{
    color: #888;
    margin: 0;
    font-weight: normal;
    font-size: 14px;
}
body.shoplist #main .sect02 ul.wrapper{
    margin: 0 auto;
    display: flex;
}
body.shoplist #main .sect02 ul.wrapper li{
    display: flex;
	flex-wrap: wrap;
	width: 50%;
    margin-bottom: 20px;
    border: solid 1px #eee;
    padding: 20px;
    box-sizing: border-box;
	position: relative;
    align-content: flex-start;
}
body.shoplist #main .sect ul.wrapper li a.img{
    margin: 0;

}
.shoplist_txt{
    width: 100%;
}

body.shoplist #main .sect02 ul.wrapper li a.txt{
	display: block;
}

body.shoplist #main .sect02 ul.wrapper li a.txt h3{
	color: #4F4C4B;
    border-bottom: solid 2px #eee;
    margin: 20px auto 10px;
    font-size: 20px;
    padding-bottom: 6px;
}
body.shoplist #main .sect02 ul.wrapper li a.txt p{
	color: #4F4C4B;
}
body.shoplist #main .sect02 ul.wrapper li a.txt table{
	color: #4F4C4B;
	margin: 0 0 6px;
    font-size: 12px;
    line-height: 18px;
}
body.shoplist #main .sect02 ul.wrapper li a.txt table tr{
    display: flex;	
}

body.shoplist #main .sect02 ul.wrapper li a.txt table td{
    padding: 10px 10px 0;	
}
body.shoplist #main .sect02 ul.wrapper li a.txt table td:first-child{
    padding-left: 0;
	width: 50px;
}
a.shoplist_access{
    display: block;
    padding: 40px 0;
    text-align: center;
    margin: 0;
    background: #eee;
	color: #4F4C4B;
	font-size: 20px;
	background: rgba(136, 204, 196, 0.5);
    position: absolute;
    width: 100px;
    top: 0;
	right: 0;
    height: 100px;
	box-sizing: border-box;
	
}
a.shoplist_access:hover{
	background: #eee;
	opacity: 1;
}

@media only screen and (max-width: 1024px){
	body.shoplist #main .sect02 ul.wrapper li{
	    margin: 0px 2% 18px 0;
	}
	body.shoplist #main .sect02 ul.wrapper li a.img{
		margin: 0 auto;
	}
	body.shoplist #main .sect02 ul.wrapper li:nth-child(2n){
	    margin: 0px 0 18px 0;
	}
}

	
	
@media only screen and (max-width: 425px){
	body.shoplist #main .sect02 ul.wrapper li{
		display: block;
		padding: 10px;
	}
	.shoplist_txt{
		margin: 20px auto 0;
	}
	body.shoplist #main .sect02 ul.wrapper li a.img{
		width: 100%;
	}
}
/*=============================================================*/

/*=====================　concept　========================*/
/*=============================================================*/