@charset "UTF-8";

/*CSS INFOMATION=======================

PC CSS

File name : pc.css
   
====================================*/

@media screen and (min-width: 768px) {
a {
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}
a {
	margin: 0;
	padding: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
	color: #fff !important;
	text-decoration: none;
	border-style: none;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
a:active, a:hover {
	text-decoration: none;
	filter: alpha(opacity=50);
	-moz-opacity: 0.5;
	opacity: 0.5;
	-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
}
	
a[href^="tel:"] {
    pointer-events: none;
}	
	
.spBox {
	display: none;
}
	
	#menuButton{
		display: none;
	}	
	
	
#wrapper {
	width: 100%;
	position: relative;
	z-index: 120;
}
#container {
	line-height: 1.8;
}
.swiper-slide {
	height:100%;
	width:100%;
}
	
.topslide01{
		background: url(../img/top/photo01_pc.jpg)top center no-repeat;
		background-size:cover;
	}	

.topslide02{
		background: url(../img/top/photo02_pc.jpg)top center no-repeat;
		background-size:cover;
	}	

.topslide03{
		background: url(../img/top/photo03_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.topslide04{
		background: url(../img/top/photo04_pc.jpg)top center no-repeat;
		background-size:cover;
	}	

.topslide05{
		background: url(../img/top/photo05_pc.jpg)top center no-repeat;
		background-size:cover;
	}	

.topslide06{
		background: url(../img/top/photo06_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
	
	
	
	
.slide01{
		background: url(../img/photo01_pc.jpg)top center no-repeat;
		background-size:cover;
	}	

.slide02{
		background: url(../img/photo02_pc.jpg)top center no-repeat;
		background-size:cover;
	}	

.slide03{
		background: url(../img/photo03_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide04{
		background: url(../img/photo04_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
.slide05{
		background: url(../img/atelier/photo05_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide06{
		background: url(../img/atelier/photo06_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide07{
		background: url(../img/atelier/photo07_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide08{
		background: url(../img/atelier/photo08_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide09{
		background: url(../img/atelier/photo09_pc.jpg)top center no-repeat;
		background-size:cover;
	}		
	
	
	
.slide01-salon{
		background: url(../img/salon/photo01_pc.jpg)top center no-repeat;
		background-size:cover;
	}	

.slide02-salon{
		background: url(../img/salon/photo02_pc.jpg)top center no-repeat;
		background-size:cover;
	}	

.slide03-salon{
		background: url(../img/salon/photo03_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide04-salon{
		background: url(../img/salon/photo04_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide05-salon{
		background: url(../img/salon/photo05_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide06-salon{
		background: url(../img/salon/photo06_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
	
.slide07-salon{
		background: url(../img/salon/photo07_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
.slide08-salon{
		background: url(../img/salon/photo08_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
	
.slide09-salon{
		background: url(../img/salon/photo09_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
	
.slide10-salon{
		background: url(../img/salon/photo10_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
	
	
	

.slide01-cafe{
		background: url(../img/cafe/photo01_pc.jpg)top center no-repeat;
		background-size:cover;
	}

.slide02-cafe{
		background: url(../img/cafe/photo02_pc.jpg)top center no-repeat;
		background-size:cover;
	}

.slide03-cafe{
		background: url(../img/cafe/photo03_pc.jpg)top center no-repeat;
		background-size:cover;
	}

.slide04-cafe{
		background: url(../img/cafe/photo04_pc.jpg)top center no-repeat;
		background-size:cover;
	}

.slide05-cafe{
		background: url(../img/cafe/photo05_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
.slide06-cafe{
		background: url(../img/cafe/photo06_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
.slide07-cafe{
		background: url(../img/cafe/photo07_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
.slide08-cafe{
		background: url(../img/cafe/photo08_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
	
	
	
.slide01-cafe-shinagawa{
		background: url(../img/cafe/photo01_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
.slide01-cafe-kawasaki{
		background: url(../img/cafe/photo02_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
.slide01-cafe-enakyou{
		background: url(../img/cafe/photo10_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
.slide01-cafe-ginza{
		background: url(../img/cafe/photo07_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide01-cafe-osaka{
		background: url(../img/cafe/photo11_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
.slide01-cafe-togo{
		background: url(../img/cafe/photo12_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
	
	
header {
	position: relative;
	z-index: 20;
}
h2 {
	text-align: center;
	font-size: 28px;
	margin: 50px 0 30px;
	letter-spacing: 0.1em;
	font-weight: 400;
	
}
h3 {
	text-align: center;
	font-size: 18px;
	font-weight: bold;
	padding: 0 0 30px;
	line-height: 2.3;
	letter-spacing: 0.1em;
}
.en {
	font-family: 'EB Garamond', serif;
}
	
	
	
p {
	text-align: center;
	font-size: 16px;
	margin: 0 0 30px;
}
#scroll {
	text-align: center;
	margin: 0 0 0 -25px;
	position: fixed;
	bottom: 20px;
	z-index: 999;
	left: 50%;
	color: #fff;
}
.copy {
	font-size: 10px;
	clear: both;
	padding: 20px 0 0;
	position: absolute;
	right: 0;
	bottom: 30px;
	text-align: right;
}
.pageTop {
	text-align: center;
	padding: 0 0 30px;
	position: relative;
	z-index: 30;
}
.pageTop a {
	color: #fff;
	text-decoration: none;
	font-size: 13px;
	font-family: Arial, Helvetica, "sans-serif";
}
.pageTop a:hover img {
	filter: alpha(opacity=50);
	-moz-opacity: 0.5;
	opacity: 0.5;
}
.fade_off {
	opacity: 0;
	-webkit-transition: all 2s;
	-moz-transition: all 2s;
	-o-transition: all 2s;
	-ms-transition: all 2s;
	transition: all 2s;
}
.fade_on {
	opacity: 1;
}
	
img[src$=".svg"] {
	width: 100%;
	height: auto;
}	
	
/*

header
-----------------------------------*/
header {
	position: fixed;
	width: 100%;
	text-align: center;
	padding: 30px 0;
	
}
	
	header .header-inner{
		margin: 0 auto;
	width:1080px;
		position: relative;
	}
	
	

	header .logo{
		position: absolute;
		left: 0;
		padding: 0px 0 0;
		top: -4px;
		width: 180px;
	}
	
	
	header nav {
		position: absolute;
		right: 0;
		padding: 9px 0 0;
	}
	
	header nav li{
		float: left;
		list-style: none;
		margin:0 15px;
		font-size: 13px;
		font-weight: 400;
		letter-spacing: 0.15em;
	}
	
	
	header nav li.current a{
		padding: 0 0 5px;
		border-bottom: 3px solid #fff;
	}
	
	header nav li.nonav{
		pointer-events: none;
		text-decoration: none;
	    filter: alpha(opacity=50);
	    -moz-opacity: 0.5;
	    opacity: 0.5;
	}
	
	
	header nav li a i{
		font-size: 18px !important;
		margin: 3px 0 0;
		font-weight: 400;
	}
	
	header nav li a{
		display: block;
	}
	
	.icon-insta{
		width: 20px;
		display: block;
		position: relative;
	}
	
	_:-ms-lang(x)::-ms-backdrop, .icon-insta img{
	  position: absolute;
	  top: -1px;
		}
 		
	  /* IE10 */
}
	
	
	#atelier header .header-inner{
		margin: 0 auto;
	width: 1130px;
		position: relative;
	}
	
	#salon header .header-inner{
		margin: 0 auto;
	width: 1130px;
		position: relative;
	}
	
	#cafe header .header-inner{
		margin: 0 auto;
	width:1060px;
		position: relative;
	}
	
	
/*

section
-----------------------------------*/
#bg {
	position: relative;
}
.bgblack {
	width: 100%;
	height: 100vh;
	background: rgba(0,0,0,0.5);
	position: fixed;
	top: 0;
	z-index: 10;
	display: none;
}
	
.bgblack02 {
	width: 100%;
	height: 100vh;
	background: rgba(0,0,0,0.5);
	position: fixed;
	top: 0;
	z-index: 10;
	
}	
	
.bgwhite {
	width: 100%;
	height: 100vh;
	background: rgba(255,255,255,0.6);
	position: fixed;
	top: 0;
	z-index: 10;
}	
	
#home {
	position: relative;
	z-index: 10;
}
	
	
h1 {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -203px 0 0 -100px;
	z-index: 10;
	width: 180px;
}
	
	
	
#top h1 {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -230px 0 0 -100px;
	z-index: 10;
	width: 180px;
}
	
	
#atelier h1 {
	width: 230px !important;
	}
	
#salon h1, #cafe h1 {
	width: 200px !important;
	}	
	
@media screen and (min-width: 1480px) {
	
	
	}
	
#atelier h1 {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -203px 0 0 -115px;
	z-index: 10;
}	
	
#open {
	position: absolute;
	top: 50px;
	right: 50px;
	z-index: 2;
}
	
	
	
	
/*

NEWS
-----------------------------------*/		
	
#news {
	position: relative;
	z-index: 10;
	padding: 100px 0;
}
#news h2 {
	text-align: center;
	font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
	font-weight: bold;
	letter-spacing: 0.2em;
	line-height: 1.3 !important;
}
	
#news h2 span{
	display: block;
	font-size: 12px;
	font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
	}
	
	
#news .innerBox {
	width: 850px;
	margin: 0 auto;
	overflow: hidden;
	padding: 80px 0;
	position: relative;
	z-index: 10;
	color: #fff;
}
#news ul li{
	font-size: 16px;
	text-align: left;
	border-bottom: 1px solid #aaa;
	padding: 30px 0;
	font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
}
	
#news ul li:first-child{
	border-top: 1px solid #aaa;
	}
	
#news ul li span{
	display: block;
	font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
	}
	

	
	
/*

NEWS second
-----------------------------------*/		
	
	
#news-second {
	position: relative;
	z-index: 10;
	padding: 100px 0;
}
#news-second h2 {
	text-align: center;
	font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
	font-weight: bold;
	letter-spacing: 0.2em;
	line-height: 1.3 !important;
}
	
#news-second h2 span{
	display: block;
	font-size: 12px;
	font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
	}
	
	
#news-second h3{
	font-size: 24px !important;
	text-align: left;
	padding: 0 0 30px;
	line-height: 1.8;
	}	
	#news-second .day{
		margin: 50px 0 5px;
		font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
		font-weight: bold;
		letter-spacing: 0.2em;
	}	
	
#news-second .innerBox {
	width: 850px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0 0 80px;
	position: relative;
	z-index: 10;
}
	
#news-second .innerBoxB {
	width: 1000px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0 0 0;
	position: relative;
	z-index: 10;
	text-align: left;
}
	
#news-second .innerBoxB p{
	text-align: left;
	}
	
#news-second ul{
	margin: 100px 0 0;
	}
	
#news-second ul li{
	font-size: 16px;
	text-align: left;
	border-bottom: 1px solid #000;
	padding: 30px 0;
	font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
}
	
#news-second ul li:first-child{
	border-top: 1px solid #000;
	}
	
#news-second ul li span{
	display: block;
	font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
	}
	
	#news-second ul li a{
		color: #000 !important;
	}	
	

	#news-top .about-logo{
		width: 180px;
		margin: 0 auto;
		padding: 0 10px 0 0;
	}	
	

#news-second .innerBoxC h4{
		border-bottom: 1px solid #000;
	margin: 0 0 30px;
	padding: 20px 0 10px;
	font-size: 20px;
	}


#news-second .innerBoxC a{
	color: #000 !important;
	text-decoration: underline !important;
}



/*

ABOUT
-----------------------------------*/		
	
#about {
	position: relative;
	z-index: 10;
	padding: 100px 0;
}
#about h2 {
	text-align: center;
}
#about .innerBox {
	width: 650px;
	margin: 0 auto;
	overflow: hidden;
	padding: 80px 0;
	position: relative;
	z-index: 10;
	color: #fff;
}
#about .innerBox p {
	font-size: 17px;
	line-height: 2.0;
	text-align: left;
}
	
	
	
	
/*

SHOP
-----------------------------------*/		
	
#shop {
	position: relative;
	z-index: 10;
	padding: 100px 0 200px;
}
#shop h2 {
	text-align: center;
}
#shop .innerBox {
	width: 650px;
	margin: 0 auto;
	overflow: hidden;
	padding: 80px 0;
	position: relative;
	z-index: 10;
	color: #fff;
}
#shop .innerBox p {
	font-size: 17px;
	line-height: 2.0;
	
}
	#shop .innerBox .shopArea{
		overflow: hidden;
		margin: 0 0 0 0;
		padding: 0 40px;
	}
	
	#shop .innerBox .shopArea h3{
		
		padding: 0 0 0px !important;
		font-size: 20px;
	}
	
	#shop .innerBox .shopArea .shop-left{
		margin: 0 0 50px;
		
	}	
	
	#shop .innerBox .shopArea .shop-right{
		margin: 0 0 50px;
	}	
	
	

	
/*

ABOUT
-----------------------------------*/		
	
#contact {
	position: relative;
	z-index: 10;
	padding: 100px 0;
	
}
#contact h2 {
	text-align: center;
	font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
	font-weight: bold;
	letter-spacing: 0.2em;
	color: #3e3a39;
	line-height: 1.3 !important;
}
	
#contact h4 {
	text-align: left;
	padding:30px 0 10px;
	color: #3e3a39;
	font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
	font-weight: 500;
	}

#contact h4 span{
	color: #D50306;
	}
	
#contact h2 span{
	display: block;
	font-size: 12px;
	font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
	}
#contact .innerBox {
	width: 715px;
	margin: 0 auto;
	overflow: hidden;
	padding: 80px 0;
	position: relative;
	z-index: 10;
	color: #fff;
}
#contact .innerBox p {
	font-size: 17px;
	line-height: 2.0;
	text-align: left;
}
	
	#contact input{
		width: 100%;
		padding: 15px;
		border: none;
	}
	
	#contact select{
		width: 100%;
		padding: 15px;
		border: none;
	}
	
	#contact textarea{
		width: 100%;
		padding: 15px;
		height: 200px;
		border: none;
	}

	#contact #btn-contact{
		width: 100%;
		border: none;
		background: #595757;
		padding: 15px;
		color: #fff;
		font-weight: bold;
		font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
		cursor: pointer;
		margin: 10px 0 0;
	}
	
	
	#contact #thxMessage p{
		text-align: center;
		color: #3e3a39;
		font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
	}
	
	
/*

MENU
-----------------------------------*/	
#menu {
	position: relative;
	z-index: 10;
	padding: 100px 0;
	
}
	
	#menu .bg-white{
		background: rgba(255,255,255,0.8);
		overflow: hidden;
		padding: 50px 0 80px;
	}	
	
#menu h2 {
	text-align: center;
	font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
	font-weight: bold;
	letter-spacing: 0.2em;
}
	
#menu h2 span{
	display: block;
	font-size: 12px;
	font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
	}	
	
	
#menu .innerBox {
	
	max-width: 1280px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0 0 80px;
	position: relative;
	z-index: 10;
}
	
	#menu .innerBox .menu-box{
		float: left;
		width: 23%;
		margin: 0 1%;
		position: relative;
	}
	
	#menu .innerBox .menu-box .menu-txt{
		text-align: center;
		position: absolute;
		top: 50%;
		width: 100%;
		color: #fff;
		font-family:YuGothic, 'Yu Gothic', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'メイリオ', Meiryo, 'ＭＳ ゴシック', sans-serif;
		font-weight: bold;
		letter-spacing: 0.15em;
		font-size: 18px;
	}
	
	#menu .innerBox .menu-box .txt-tea{
		position: absolute;
		top: 37%;
	}
	
	
	
	
	
	
#menu .innerBox p {
	font-size: 16px;
	margin: 0 0 50px;
	line-height: 2.0;
	text-align:center;
}
	
	
	
	
/*

LOCATION
-----------------------------------*/	
	
#access {
	position: relative;
	z-index: 10;
	padding: 100px 0;
}
#access h2 {
	font-size: 26px !important;
	text-align: left;
	letter-spacing: 0em;
	margin: 50px 0 15px !important;
}
	
#access h2 span{
	font-size: 20px;
	}
	
	
#access .innerBox {
	width: 450px;
	margin: 0 auto;
	overflow: hidden;
	padding: 80px 0;
	position: relative;
	z-index: 10;
	color: #fff;
}
#access .innerBox p {
	font-size: 20px;
	line-height: 2.0;
	text-align: left;
	margin: 0 0 5px !important;
}
#access .innerBox p span {
	font-family: 'EB Garamond', serif;
	font-size: 32px !important;
	letter-spacing: 0.1em;
}
#access .innerBox .txt01 {
	font-size: 18px !important;
	line-height: 1.6 !important;
}
	
.tel-txt{
		font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif !important;
		font-size: 16px !important;
	}


#cafe #access .innerBox h2{
	text-align: center;
	padding: 0 0 20px;
}

#cafe #access .innerBox {
	width: 600px;
	margin: 0 auto;
	overflow: hidden;
	padding: 80px 0;
	position: relative;
	z-index: 10;
	color: #fff;
}
	
	
#access .innerBoxB {
	width: 550px;
	margin: 0 auto;
	overflow: hidden;
	padding: 80px 0;
	position: relative;
	z-index: 10;
	color: #fff;
}
	
#access .innerBoxB p{
	text-align: left;
	}

	#access .innerBoxB .storelist li a{
		display: block;
		background: url("../img/next.png") center right no-repeat;
		background-size: 15px auto;
	}
	
	
	#access .innerBoxB .storelist li{
		border-bottom: 1px solid #aaa;
		padding: 0 0 30px;
	}
	
	#access .innerBoxB .storelist li a h2{
		font-size: 20px !important;
	}
	
	#access .innerBoxB .storelist li a h2 span{
		font-size: 16px;
		padding: 0 0 0 10px;
	}
	
	
/*

ATELIER-ABOUT
-----------------------------------*/		
	
#atelier-about {
	position: relative;
	z-index: 10;
	padding: 0 0 100px;
}
#atelier-about h2 {
	text-align: center;
}
#atelier-about .innerBox {
	width: 700px;
	margin: 0 auto;
	overflow: hidden;
	padding: 80px 0;
	position: relative;
	z-index: 10;
}
#atelier-about .innerBox p {
	font-size: 17px;
	line-height: 2.0;
	text-align: left;
}
	
#atelier-about .innerBox p span{
	font-size: 12px;
	}

#atelier-about .innerBox a {
	color: #000 !important;
	text-decoration: underline;
	}
	
	#atelier-about .innerBox .partner p{
		text-align: center !important;
		
	}
	
	#atelier-about .innerBox .partner p span{
		display: block;
	}
	
	#atelier-about .innerBox .partner p a{
		text-decoration: none;
	}
	
	
#atelier #access .innerBox {
	width: 360px;
	margin: 0 auto;
	overflow: hidden;
	padding: 80px 0;
	position: relative;
	z-index: 10;
	color: #fff;
}
	
		
	
/*

btn
-----------------------------------*/

.btnA a {
	border: 2px solid #fff;
	color: #fff;
	padding: 20px;
	display: block;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	width: 196px;
	margin: 0 auto 20px;
	font-family: Arial, Helvetica, "sans-serif";
	letter-spacing: 0.1em;
}
.btnB a {
	background: rgba(255,255,255,0.7);
	color: #000 !important;
	padding: 20px;
	display: block;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	width: 200px;
	margin: 10px auto 20px;
	font-family: Arial, Helvetica, "sans-serif";
	letter-spacing: 0.1em;
}
	
.btnB02 a {
	background: rgba(255,255,255,0.7);
	color: #000 !important;
	padding: 20px;
	display: block;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	width: 200px;
	margin: 10px auto 20px;
	font-family: HelveticaNeue, Helvetica Neue, Helvetica, ヒラギノ角ゴ ProN W3, Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, Osaka, "MS UI Gothic", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	letter-spacing: 0.1em;
}	
	
.btnC a{
	background: rgba(0,0,0,0.3);
	color: #333;
	padding: 13px 0;
	display: block;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	width: 270px;
	font-size: 16px;
	margin: 10px 14px 20px;
	border: 1px solid #fff;
	font-weight: 100;
	letter-spacing: 0.1em;
	float: left;
	font-weight: 400;
}
	
.btnD a{
	background: rgba(255,255,255,0.7);
	color: #000 !important;
	padding: 13px 0;
	display: block;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	width: 150px;
	font-size: 14px;
	margin: 40px auto 20px;
	font-family: Arial, Helvetica, "sans-serif";
	letter-spacing: 0.1em;
}
	
	
.btnE a{
	color: #fff !important;
	padding: 13px 0;
	display: block;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	width: 150px;
	font-size: 14px;
	margin: 40px auto 20px;
	font-family: Arial, Helvetica, "sans-serif";
	letter-spacing: 0.1em;
	border:1px solid #fff;
}	

	
.btnF a{
	color: #000 !important;
	padding: 13px 0;
	display: block;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	width: 150px;
	font-size: 14px;
	margin: 40px auto 20px;
	font-family: Arial, Helvetica, "sans-serif";
	letter-spacing: 0.1em;
	border: 1px solid #000;
}	
	
	
	
	
	
	.main-btnarea{
		position: absolute;
		width: 900px;
		margin: 180px 0 0 -450px;
		left: 50%;
		top: 50%;
		display: none;
	}	
	
	
	@media screen and (min-width: 1480px) {
	.main-btnarea{
		position: absolute;
		width: 900px;
		margin: 220px 0 0 -450px;
		left: 50%;
		top: 50%;
		display: none;
	}	
	
	}
	
	
	
	
	.btnArea{
		padding: 60px 0 0;
	}	
	
	
.fuwatAnime {
	-webkit-animation-fill-mode: both;
	-ms-animation-fill-mode: both;
	animation-fill-mode: both;
	-webkit-animation-duration: 1.5s;
	-ms-animation-duration: 1.5s;
	animation-duration: 1.5s;
	-webkit-animation-name: fuwatAnime;
	-ms-animation-name: fuwatAnime;
	animation-name: fuwatAnime;
	visibility: visible !important;
}
@-webkit-keyframes fuwatAnime {
 0% {
opacity: 0;
-webkit-transform: translateY(-20px);
}
 100% {
opacity: 1;
-webkit-transform: translateY(0);
}
}
@keyframes fuwatAnime {
 0% {
opacity: 0;
-webkit-transform: translateY(-20px);
-ms-transform: translateY(-20px);
transform: translateY(-20px);
}
 100% {
opacity: 1;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
}


@media all and (min-width: 768px) and (max-width: 811px) {
	
.spBox {
	display:inline-block;
}
	
	.pcBox{
		display: none;
	}	
	
	
	
.slide01{
		background: url(../img/photo01_sp.jpg)top center no-repeat;
		background-size:cover;
	}	

.slide02{
		background: url(../img/photo02_sp.jpg)top center no-repeat;
		background-size:cover;
	}	

.slide03{
		background: url(../img/photo03_sp.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide04{
		background: url(../img/photo04_sp.jpg)top center no-repeat;
		background-size:cover;
	}	
	

.slide05{
		background: url(../img/atelier/photo05_sp.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide06{
		background: url(../img/atelier/photo06_sp.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide07{
		background: url(../img/atelier/photo07_sp.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide08{
		background: url(../img/atelier/photo08_sp.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide09{
		background: url(../img/atelier/photo09_sp.jpg)top center no-repeat;
		background-size:cover;
	}		
	
	
	
.slide01-salon{
		background: url(../img/salon/photo01_sp.jpg)top center no-repeat;
		background-size:cover;
	}	

.slide02-salon{
		background: url(../img/salon/photo02_sp.jpg)top center no-repeat;
		background-size:cover;
	}	

.slide03-salon{
		background: url(../img/salon/photo03_sp.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide04-salon{
		background: url(../img/salon/photo04_sp.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide05-salon{
		background: url(../img/salon/photo05_sp.jpg)top center no-repeat;
		background-size:cover;
	}
	
.slide06-salon{
		background: url(../img/salon/photo06_sp.jpg)top center no-repeat;
		background-size:cover;
	}
	
	
.slide07-salon{
		background: url(../img/salon/photo07_sp.jpg)top center no-repeat;
		background-size:cover;
	}
	
.slide08-salon{
		background: url(../img/salon/photo08_sp.jpg)top center no-repeat;
		background-size:cover;
	}
	
	
.slide09-salon{
		background: url(../img/salon/photo09_sp.jpg)top center no-repeat;
		background-size:cover;
	}
	
	
.slide10-salon{
		background: url(../img/salon/photo10_sp.jpg)top center no-repeat;
		background-size:cover;
	}
	
	
.slide11-salon{
		background: url(../img/salon/photo11_sp.jpg)top center no-repeat;
		background-size:cover;
	}
		
	
	
/*

ASIDE
------------------*/


#menuButton {
    display: block;
    width: 40px;
    height:40px;
    position:fixed;
    top: 12px;
    right: 15px;
    z-index:9999;
}
#menuButton span {
    display: block;
    background: #fff;
    width: 30px;
    height: 2px;
    position: absolute;
    left: 9px;
    transition: all 0.4s;
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
}
#menuButton span:first-child {
    top: 11px;
}
#menuButton span:nth-child(2) {
    margin-top: -1px;
    top: 50%;
}
#menuButton span:last-child {
    bottom: 11px;
}
#menuButton.active span:first-child {
    -webkit-transform: translateY(8px) rotate(45deg);
    -moz-transform: translateY(8px) rotate(45deg);
    -ms-transform: translateY(8px) rotate(45deg);
    transform: translateY(8px) rotate(45deg);
}
#menuButton.active span:nth-child(2) {
    opacity: 0;
}
#menuButton.active span:last-child {
    -webkit-transform: translateY(-8px) rotate(-45deg);
    -moz-transform: translateY(-8px) rotate(-45deg);
    -ms-transform: translateY(-8px) rotate(-45deg);
    transform: translateY(-8px) rotate(-45deg);
}	
	
	
	nav{
		background: rgba(255,255,255,0.9);
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100vh;
		display: none;
		-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
		z-index: 999;
		padding: 100px 0 0 !important;
	}
	
	nav li{
		list-style: none;
		color: #fff;
		float: none !important;
	}
	
	nav li a{
		color: #fff;
		text-decoration: none;
		letter-spacing: 0.1em;
		padding: 15px 0;
		display: block;
		background: #499936;
		margin: 0 auto 15px;
		width: 340px;
		font-size: 20px;
	}
	
	/*nav li:first-child a, nav li:nth-child(2) a{
		padding: 90px 0;
		height: 25%;
	}*/
	
	nav li:nth-child(9) a{
		background:none;
		color:#499936;
		padding: 0px 0 !important;
		text-align: center !important;
	}
	
	nav li:nth-child(9) a img{
		width: 30px;
		height: auto;
	}
	
	
	
	nav.active{
		display: block;
		-moz-transition: all 0.3s;
	-o-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;
	}
	
	header nav li.current a{
		color: #fff;
		text-decoration: none;
		letter-spacing: 0.1em;
		padding: 15px 0;
		display: block;
		background: #499936;
		margin: 0 auto 15px;
		width: 340px;
		font-size: 20px;
		border-bottom: none;
	}
	
	
	
	header {
		padding: 0;
	}
	
	header .header-inner{
		text-align: center !important;
		width: 100%;
		padding: 30px 0;
	}
	
	#atelier header .header-inner{
		text-align: center;
		width: 100%;
		padding: 30px 0;
	}
	
	#salon header .header-inner{
		text-align: center;
		width: 100%;
		padding: 30px 0;
	}
	
	#cafe header .header-inner{
		text-align: center;
		width: 100%;
		padding: 30px 0;
	}
	

	header .logo{
		position:fixed;
		left: 50%;
		width:180px;
		margin:20px 0 0 -100px;
		display: none;
	}
	
	
	
	
	
	#news .innerBox {
	width: 650px !important;
	margin: 0 auto;
	overflow: hidden;
	padding: 80px 0;
	position: relative;
	z-index: 10;
	color: #fff;
}
	
	#news-second img{
		width: 100%;
		height: auto;
	}
	
	#news-second .innerBox {
		width: 650px !important;
	}
	
	#news-second .innerBoxB{
		width: 100% !important;
	}
	
	
	
		#news-second .innerBoxC {
	width: 650px !important;
	margin: 0 auto;
	overflow: hidden;
	padding: 80px 0;
	position: relative;
	z-index: 10;
}
	
	
	
	
	#menu .innerBox {
	
	max-width: 650px;
	margin: 0 auto;
	overflow: hidden;
	padding: 0 0 80px;
	position: relative;
	z-index: 10;
}
	
	#menu .innerBox .menu-box{
		float: left;
		width: 46%;
		margin: 0 2% 4%;
		position: relative;
	}
	
	
	
	#about{
		padding: 180px 0 ;
	}
	
	
	
	.btnC a{
	background: rgba(0,0,0,0.3);
	color: #333;
	padding: 13px 0;
	display: block;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
	text-decoration: none;
	width: 200px;
	font-size: 14px;
	margin: 10px 14px 20px;
	border: 1px solid #fff;
	font-weight: 100;
	letter-spacing: 0.1em;
	float: left;
	font-weight: 400;
}
	
	
	.main-btnarea{
		position: absolute;
		width: 700px;
		margin: 180px 0 0 -350px;
		left: 50%;
		top: 50%;
		display: none;
	}
	
	
	
	#shop .innerBox .shopArea{
		overflow: hidden;
		margin: 0 0 0;
		padding: 0 40px;
	}
	
	
}


	
@media all and (min-width: 811px) and (max-width: 812px) {
	 
.slide01{
		background: url(../img/photo01_pc.jpg)top center no-repeat;
		background-size:cover;
	}	

.slide02{
		background: url(../img/photo02_pc.jpg)top center no-repeat;
		background-size:cover;
	}	

.slide03{
		background: url(../img/photo03_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide04{
		background: url(../img/photo04_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
	
.slide05{
		background: url(../img/atelier/photo05_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide06{
		background: url(../img/atelier/photo06_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide07{
		background: url(../img/atelier/photo07_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide08{
		background: url(../img/atelier/photo08_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide09{
		background: url(../img/atelier/photo09_pc.jpg)top center no-repeat;
		background-size:cover;
	}		
	
	
	
.slide01-salon{
		background: url(../img/salon/photo01_pc.jpg)top center no-repeat;
		background-size:cover;
	}	

.slide02-salon{
		background: url(../img/salon/photo02_pc.jpg)top center no-repeat;
		background-size:cover;
	}	

.slide03-salon{
		background: url(../img/salon/photo03_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide04-salon{
		background: url(../img/salon/photo04_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide05-salon{
		background: url(../img/salon/photo05_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
	
.slide06-salon{
		background: url(../img/salon/photo06_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
	
.slide07-salon{
		background: url(../img/salon/photo07_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
.slide08-salon{
		background: url(../img/salon/photo08_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
	
.slide09-salon{
		background: url(../img/salon/photo09_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
	
.slide10-salon{
		background: url(../img/salon/photo10_pc.jpg)top center no-repeat;
		background-size:cover;
	}
	
	
.slide11-salon{
		background: url(../img/salon/photo11_pc.jpg)top center no-repeat;
		background-size:cover;
	}	
		
	
	 
 header {
 text-align: center;
 top:50px;
 position:fixed;
 width: 100%;
 text-align: center;
 padding: 15px 0;
}
 header img {
 width: 180px;
 height: auto;
}
 h1 {
 position:absolute;
 top:50%;
 left:50%;
 margin: -122px 0 0 -70px;
 z-index: 10;
}
 h1 img {
 width: 140px;
 height:auto;
}
 #open {
 position: absolute;
 top: 20px;
 right: 20px;
 z-index: 2;
}
 #open img {
 width: 120px;
 height: auto;
}
 h2 {
 text-align:center;
 font-size:18px;
 margin:50px 0 30px;
 letter-spacing:0.1em;
 font-weight: 200;
}
 h3 {
 text-align:center;
 font-size:18px;
 font-weight:bold;
 padding:0 0 60px;
 line-height:2.3;
 letter-spacing:0.1em;
}
 #about {
 position:relative;
 z-index: 10;
 padding: 100px 0;
}
 #about h2 {
 text-align: left;
 margin: 0px 0 30px;
}
 #about .innerBox {
 width:300px;
 margin:0 auto;
 overflow:hidden;
 padding: 0px 0 40px;
 position:relative;
 z-index: 10;
 color: #fff;
}
 #about .innerBox p {
 font-size: 12px;
 line-height: 2.0;
 text-align: left;
}
 #menu {
 position:relative;
 z-index: 10;
 padding: 100px 0;
}
 #menu .innerBox {
 width:300px;
 margin:0 auto;
 overflow:hidden;
 padding: 40px 0;
 position:relative;
 z-index: 10;
 color: #fff;
}
 #menu .innerBox p {
 font-size: 12px;
 margin: 0 0 50px;
 line-height: 2.0;
 text-align: left;
}
 #access {
 position:relative;
 z-index: 10;
 padding: 100px 0;
}
 #access h2 {
 font-size: 15px !important;
 text-align: left;
 letter-spacing:0em;
 margin:50px 0 15px !important;
}
 #access .innerBox {
 width:200px;
 margin:0 auto;
 overflow:hidden;
 padding: 40px 0;
 position:relative;
 z-index: 10;
 color: #fff;
}
 #access .innerBox p {
 font-size: 12px;
 line-height: 2.0;
 text-align: left;
 margin: 0 0 5px !important;
}
 #access .innerBox p a {
 color: #fff;
 text-decoration: none;
}
 #access .innerBox p span {
 font-family: 'EB Garamond', serif;
 font-size: 20px !important;
 letter-spacing:0.1em;
}
 #access .innerBox .txt01 {
 font-size: 15px !important;
 line-height: 1.6 !important;
}
 .btnA a {
 border: 2px solid #fff;
 color:#fff;
 padding:13px 0;
 display:block;
 text-decoration:none;
 text-align:center;
 font-weight:bold;
 text-decoration: none;
 width:150px;
 margin:0 auto 15px;
 font-family: Arial, Helvetica, "sans-serif";
 letter-spacing:0.1em;
 font-size: 12px;
}
 .btnB a {
 background:rgba(255,255,255,0.7);
 color:#333;
 padding:13px 0;
 display:block;
 text-decoration:none;
 text-align:center;
 font-weight:bold;
 text-decoration: none;
 width:150px;
 margin:50px auto 20px;
 font-family: Arial, Helvetica, "sans-serif";
 letter-spacing:0.1em;
 font-size: 12px;
}
	
 .btnB02 a {
 background:rgba(255,255,255,0.7);
 color:#333;
 padding:13px 0;
 display:block;
 text-decoration:none;
 text-align:center;
 font-weight:bold;
 text-decoration: none;
 width:150px;
 margin:50px auto 20px;
 font-family: HelveticaNeue, Helvetica Neue, Helvetica, ヒラギノ角ゴ ProN W3, Hiragino Kaku Gothic ProN, "メイリオ", Meiryo, Osaka, "MS UI Gothic", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
 letter-spacing:0.1em;
 font-size: 12px;
}	
	
 .btn-cafe{
		 font-size: 11px !important;
	 }	
	

	
 #scroll {
 text-align:center;
 margin:0 0 0 -15px;
 position:fixed;
 bottom:20px;
 z-index:999;
 left:50%;
 color: #fff;
}
 #scroll img {
 width:30px;
 height: auto;
}
 .pageTop {
 text-align:center;
 padding:0 0 30px;
 position:relative;
 z-index: 30;
}
 .pageTop img {
 width: 30px;
 height: auto;
}
 .pageTop a {
 color: #fff;
 text-decoration: none;
 font-size: 11px;
 font-family: Arial, Helvetica, "sans-serif";
}
 .pageTop a:hover img {
 filter:alpha(opacity=50);
 -moz-opacity: 0.5;
 opacity: 0.5;
}
}