@charset "UTF-8";

/*-------------------------------------------
Contents
-------------------------------------------*/

header[role="banner"] > div {
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 1000;
}
header[role="banner"] #headerInner > #headerInnerBody > h1 {
	width: auto;
}
#mainImageWrap {
	position: relative;
	width: 100%;
	height: 400px;
}
#wrapInner {
	position: relative;

	border: none !important;

	box-shadow: none !important;
}
#mainImage {
	max-width: 1500px;

	width: 100%;

	height: auto;

	min-height: 670px;

	margin: 104px auto 0;

	background: url(/images/bg_main_img.png) center 0 no-repeat;

	text-align: center;


}
#mainImage img {
	max-width: 100%;
}
body {
	background: #fffcf6 url(/images/bg_fixed.jpg) top center no-repeat;
	background-attachment:fixed;
}
body div#wrap {
	background: none;
}
nav[role=navigation] {
	z-index: 100;
}
#wrap #wrapInner {
	max-width: 990px;
	width: 100%;
	margin: -90px auto 0;
	padding: 0;
	background: transparent !important;
	font-size: 0;
}
#wrap #wrapInner .box01Wrap,
#wrap #wrapInner .box02Wrap  {
	display: inline-block;
	position: relative;
	margin-bottom: 0.5em;
	padding: 5px;
	vertical-align: top;
	font-size: 14px;
	background: #fcf9f4;
}
#wrap #wrapInner .box01Wrap,
#wrap #wrapInner .box02Wrap {
	box-shadow:rgba(175, 131, 74, 0.4) 0px 0px 6px 3px;
	-webkit-box-shadow:rgba(175, 131, 74, 0.4) 0px 0px 6px 3px;
	-moz-box-shadow:rgba(175, 131, 74, 0.4) 0px 0px 6px 3px;
}
#wrap #wrapInner .box01Wrap {
	position: relative;
	width: 49.5%;
	margin-right: 1%;
}
#wrap #wrapInner .box01Wrap:before,
#wrap #wrapInner .box01Wrap:after,
#wrap #wrapInner .box02Wrap:before,
#wrap #wrapInner .box02Wrap:after,
#wrap #wrapInner .box01Wrap > *:before,
#wrap #wrapInner .box01Wrap > *:after,
#wrap #wrapInner .box02Wrap aside:before,
#wrap #wrapInner .box02Wrap aside:after {
	display: block;
	position: absolute;
	width: 16px;
	height: 16px;
}
#wrap #wrapInner .box01Wrap:before,
#wrap #wrapInner .box02Wrap:before {
	content: url(/common/images/bg_content_top_left.png);
	top: 3px;
	left: 3px;
}
#wrap #wrapInner .box01Wrap:after,
#wrap #wrapInner .box02Wrap:after {
	content: url(/common/images/bg_content_top_right.png);
	top: 3px;
	right: 3px;
}
#wrap #wrapInner .box01Wrap > *:before,
#wrap #wrapInner .box02Wrap aside:before {
	content: url(/common/images/bg_content_bottom_left.png);
	bottom: 3px;
	left: 3px;
}
#wrap #wrapInner .box01Wrap > *:after,
#wrap #wrapInner .box02Wrap aside:after {
	content: url(/common/images/bg_content_bottom_right.png);
	bottom: 3px;
	right: 3px;
}

#wrap #wrapInner .box02Wrap.last-child ,
#wrap #wrapInner .box01Wrap.even {
	margin-right: 0 !important;
}
#wrap #wrapInner .box02Wrap {
	width: 33%;
	margin-right: 0.5%;
}
#wrap #wrapInner .box01Wrap.boxType01 {
	width: 100%;
	margin-right: 0;
}
#wrap #wrapInner .box02Wrap > * ,
#wrap #wrapInner .box01Wrap > * {
	background: #fff;
	border: 1px solid #e8dcba;
}
#wrap #wrapInner .box01Wrap > aside,
#wrap #wrapInner .box02Wrap > aside {
	padding: 20px 24px;
}
#wrap #wrapInner .box01Wrap > section {
	padding: 2.083em 2.083em 0 2.083em;
}
#wrap #wrapInner .box01Wrap > section h2 {
	position: relative;
}
#wrap #wrapInner .box01Wrap > section h2 span {
	display: block;
	text-indent: -9999px;
	max-width: 346px;
	height: 3em;
}
#wrap #wrapInner .box01Wrap#content01 h2 span {
	background: url(/images/h2_title_01.gif) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap#content02 h2 span {
	background: url(/images/h2_title_02.gif) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap#content03 h2 span {
	background: url(/images/h2_title_03.gif) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap#content04 h2 span {
	background: url(/images/h2_title_04.gif) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap#content05 h2 span {
	background: url(/images/h2_title_05.gif) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap > section h2 a {
	position: absolute;
	top: 0;
	right: 0;
}
#wrap #wrapInner .box01Wrap#content01 .bnr01 {
	text-align: center;
	margin-bottom: 1em;
}
#wrap #wrapInner .box01Wrap#content02 ul,
#wrap #wrapInner .box01Wrap#content03 ul {
	font-size: 0;
}
#wrap #wrapInner .box01Wrap#content02 ul li,
#wrap #wrapInner .box01Wrap#content03 ul li {
	display: inline-block;
	width: 50%;
}
#wrap #wrapInner .box01Wrap ul li.full {
	width: 100% !important;
}
#wrap #wrapInner .box01Wrap#content02 ul li:first-child {
	max-width: 586px;
}
#wrap #wrapInner .box01Wrap#content03 ul li {
	max-width: 290px;
	border: 2px solid #c1a988;
}
#wrap #wrapInner .box01Wrap#content03 ul li:first-child {
	max-width: 580px;
}
#wrap #wrapInner .box01Wrap#content05 h3 {
	font-size: 1.4em;
}

#wrap #wrapInner .box01Wrap ul.salonArea {
	font-size: 0;
	width: 100%;
}
#wrap #wrapInner .box01Wrap ul.salonArea + h3 {
	margin-top: 1em;
}
#wrap #wrapInner .box01Wrap ul.salonArea li {
	display: inline-block;
	width: 14.1%;
}
#wrap #wrapInner .box01Wrap ul.salonArea li a {
	text-indent: -9999px;
	display: block;
	max-width: 126px;
	width: 100%;
	height: 96px;
}
#wrap #wrapInner .box01Wrap ul.salonArea li.areaHokkaidoTohoku a {
	background: url(/images/pic_area_hokkaido_tohoku.jpg) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap ul.salonArea li.areaHokkaidoTohoku a:hover {
	background: url(/images/pic_area_hokkaido_tohoku_on.jpg) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap ul.salonArea li.areaKanto a {
	background: url(/images/pic_area_kanto.jpg) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap ul.salonArea li.areaKanto a:hover {
	background: url(/images/pic_area_kanto_on.jpg) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap ul.salonArea li.areaChubu a {
	background: url(/images/pic_area_chubu.jpg) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap ul.salonArea li.areaChubu a:hover {
	background: url(/images/pic_area_chubu_on.jpg) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap ul.salonArea li.areaKinki a {
	background: url(/images/pic_area_kinki.jpg) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap ul.salonArea li.areaKinki a:hover {
	background: url(/images/pic_area_kinki_on.jpg) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap ul.salonArea li.areaChugoku a {
	background: url(/images/pic_area_chugoku_shikoku.jpg) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap ul.salonArea li.areaChugoku a:hover {
	background: url(/images/pic_area_chugoku_shikoku_on.jpg) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap ul.salonArea li.areaKyusyu a {
	background: url(/images/pic_area_kyushyu.jpg) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap ul.salonArea li.areaKyusyu a:hover {
	background: url(/images/pic_area_kyushyu_on.jpg) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap ul.salonArea li.areaOversea a  {
	background: url(/images/pic_area_oversea.jpg) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box01Wrap ul.salonArea li.areaOversea a:hover  {
	background: url(/images/pic_area_oversea_on.jpg) 0 0 no-repeat;
	background-size: 100%;
}
#wrap #wrapInner .box02Wrap aside > h2 {
	padding-left: 5px;
	margin-bottom: 1.917em;
}
#wrap #wrapInner .box01Wrap aside.fbArea #idFacebook_photo_top div iframe {
	width: 100% !important;
}
#wrap #wrapInner .box02Wrap aside .snsAsideInner {
	background: #fcf7dc;
	margin-top: 20px;
	padding: 30px 3% 15px 3%;
}
#wrap #wrapInner .box02Wrap aside .snsAsideInner > ul > li {
	text-align: center;
	margin-bottom: 15px;
}
#wrap #wrapInner .box02Wrap aside.fanArea div {
	text-align: center;
}
#wrap #wrapInner .box02Wrap aside.lineArea .qr {
	width: 100%;
	padding: 1em 0;
	margin-top: 1.667em;
	text-align: center;
	background: #fcf7dc;
}
#wrap #wrapInner .box02Wrap aside.InstagramArea .instaBtn {
	padding: 40px 0 55px;
	text-align: center;
}
@media screen and (max-width: 767px) {
	header[role="banner"] > div {
		position: static;
	}
	header[role="banner"] #headerInner > #headerInnerBody h1 {
		min-height: 0;
		background: url(/common/images/logo_smt.png) 0 center no-repeat ;
		background-size: 100%;
	}

	img {
		max-width: 100%;
	}
	#wrap #wrapInner {
		margin: 0;
	}
	body {
		background-image: none;
		background-color: #fff;
	}

	nav[role="navigation"] {
		display: block;
	}
	nav[role="navigation"] > ul {
		padding: 2% 1%;
		background: #efe4cf;
		font-size: 0;
		text-align: center;
	}
	nav[role="navigation"] > ul > li {
		display: inline-block;
		font-size: 12px;
	}
	nav[role="navigation"] > ul > li.nav01,
	nav[role="navigation"] > ul > li.nav02,
	nav[role="navigation"] > ul > li.nav03 {
		max-width: 202px;
		width: 31.5%;
		margin-bottom: 2%;
	}
	nav[role="navigation"] > ul > li.nav01,
	nav[role="navigation"] > ul > li.nav02 {
		margin-right: 2.5%;
	}
	nav[role="navigation"] > ul > li.nav04,
	nav[role="navigation"] > ul > li.nav05 {
		max-width: 307px;
		width: 49%;
	}
	nav[role="navigation"] > ul > li.nav04 {
		margin-right: 2%;
	}
	#mainImage {
		display: none;
		width: 100%;
		text-align: center;
	}
	#mainSmtImage {
		width: 100%;
		text-align: center;
	}
	body div#wrap {
		background: none;
	}
	#wrap #wrapInner .snsSmtArea,
	#wrap #wrapInner .box01Wrap .smtContent {
		display: block;
	}
	#wrap #wrapInner .box01Wrap:before ,
	#wrap #wrapInner .box01Wrap:after {
		width: 0;
		height: 0;
		background: none;
	}
	#wrap #wrapInner .box01Wrap {
		width: 100%;
		padding: 0;
		box-shadow: none;
		margin-right: 0;
		margin-bottom: 2.917em;
		background-color: #fff;
	}
	#wrap #wrapInner .box01Wrap > section {
		padding: 0 0 3em 0;
	}
	#wrap #wrapInner .box01Wrap > section:before,
	#wrap #wrapInner .box01Wrap > section:after {
		content: "";
	}
	#wrap #wrapInner .box01Wrap > section > h2 {
		position: relative;
		padding: 1em 0 0.5em;
		background: #e28f9f;
		margin: 0 0 3em 0 !important;
	}
	#wrap #wrapInner .box01Wrap:before,
	#wrap #wrapInner .box02Wrap:before,
	#wrap #wrapInner .box01Wrap:after,
	#wrap #wrapInner .box02Wrap:after {
		display: none;
	}
	#wrap #wrapInner .box01Wrap section:before,
	#wrap #wrapInner .box02Wrap aside:before,
	#wrap #wrapInner .box01Wrap section:after,
	#wrap #wrapInner .box02Wrap aside:after,
	#wrap #wrapInner .box01Wrap > section > h2:before,
	#wrap #wrapInner .box01Wrap > section > h2:after {
		content: "";
		position: absolute;
		display: block;
		width: 2em;
		height: 2em;
	}
	#wrap #wrapInner .box01Wrap > section > h2:before {
		bottom: -2.5em;
		left: 0.5em;
		display: block;
		background: url(/common/images/bg_content_top_left_smt.png);
		background-size: 100%;
	}
	#wrap #wrapInner .box01Wrap > section > h2:after {
		bottom: -2.5em;
		right: 0.5em;
		display: block;
		background: url(/common/images/bg_content_top_right_smt.png);
		background-size: 100%;
	}
	#wrap #wrapInner .box01Wrap section:before,
	#wrap #wrapInner .box02Wrap aside:before {
		bottom: 1em;
		left: 1em;
		background: url(/common/images/bg_content_bottom_left_smt.png);
		background-size: 100%;
	}
	#wrap #wrapInner .box01Wrap section:after,
	#wrap #wrapInner .box02Wrap aside:after {
		bottom: 1em;
		right: 1em;
		background: url(/common/images/bg_content_bottom_right_smt.png);
		background-size: 100%;
	}
	#wrap #wrapInner .box01Wrap > section > h2 a {
		position: absolute;
		top: 1.5em;
		right: 1em;
		color: #fff;
	}
	#wrap #wrapInner .box01Wrap > section h2 span {
		max-width: 300px;
	}
	#wrap #wrapInner .box01Wrap#content01 h2 span {
		background: url(/images/h2_title_01_smt.gif) 0 center no-repeat;
		background-size: 100%;
	}
	#wrap #wrapInner .box01Wrap#content02 h2 span {
		background: url(/images/h2_title_02_smt.gif) 0 center no-repeat;
		background-size: 100%;
	}
	#wrap #wrapInner .box01Wrap#content03 h2 span {
		background: url(/images/h2_title_03_smt.gif) 0 center no-repeat;
		background-size: 100%;
	}
	#wrap #wrapInner .box01Wrap#content04 h2 span {
		background: url(/images/h2_title_04_smt.gif) 0 center no-repeat;
		background-size: 100%;
	}
	#wrap #wrapInner .box01Wrap#content05 h2 span {
		background: url(/images/h2_title_05_smt.gif) 0 center no-repeat;
		background-size: 100%;
	}
	#wrap #wrapInner .snsSmtArea,
	#wrap #wrapInner .fanSmtArea {
		background: #fff;
		font-size: 14px;
	}
	#wrap #wrapInner .snsSmtArea > h2,
	#wrap #wrapInner .fanSmtArea > h2  {
		position: relative;
		padding: 1em 0 0.5em;
		background: #e28f9f;
		margin: 0;
		font-size: 14px;
	}
	#wrap #wrapInner .snsSmtArea > h2 span,
	#wrap #wrapInner .fanSmtArea > h2 span {
		display: block;
		text-indent: -9999px;
		max-width: 346px;
		height: 3em;
	}
	#wrap #wrapInner .snsSmtArea > h2 span {
		background: url(/images/h2_title_sns_smt.gif) 0 center no-repeat;
		background-size: 100%;
	}
	#wrap #wrapInner .fanSmtArea > h2 span {
		background: url(/images/h2_title_fansite_smt.gif) 0 center no-repeat;
		background-size: 100%;
	}
	#wrap #wrapInner .snsSmtArea ul,
	#wrap #wrapInner .fanSmtArea ul {
		margin: 1.5em 4%;
	}
	#wrap #wrapInner .snsSmtArea ul li,
	#wrap #wrapInner .fanSmtArea ul li {
		margin-bottom: 1em;
	}
	#wrap #wrapInner .box01Wrap ul.salonArea li {
		width: 100%;
		font-size: 12px;
	}
	#wrap #wrapInner .box01Wrap.smtFull > section {
		padding: 0;
	}
	#wrap #wrapInner .box01Wrap.smtFull > section > h2 {
		margin-bottom: 0em !important;
	}
	#wrap #wrapInner .box01Wrap.smtFull > section > h2:before,
	#wrap #wrapInner .box01Wrap.smtFull > section > h2:after,
	#wrap #wrapInner .box01Wrap.smtFull > section:before,
	#wrap #wrapInner .box01Wrap.smtFull > section:after {
		display: none;
	}
	#wrap #wrapInner .box01Wrap#content02 ul li,
	#wrap #wrapInner .box01Wrap#content03 ul li {
		width: 49.5%;
	}
	#wrap #wrapInner .box01Wrap#content03 ul li.full {
		width: 99% !important;
	}
	#wrap #wrapInner .box01Wrap#content05  h2 {
		padding-left: 1em;
	}
	#wrap #wrapInner .box01Wrap > section > * {
		margin: 0 4%
	}
	#wrap #wrapInner .box01Wrap.smtFull > section > * {
		margin: 0;
	}
	#wrap #wrapInner .box01Wrap  h3 {
		margin: 1em 2% !important;
	}
	#wrap #wrapInner .box01Wrap ul.salonArea li a {
		display: block;
		position: relative;
		width: 100%;
		max-width: none;
		height: 100%;
		min-height: 4em;
		padding: 2em 4em 2em 1em;
		text-indent: 0;
		background-image: none !important;
		font-size: 1.2em;
	}
	#wrap #wrapInner .box01Wrap ul.salonArea li a:after {
		content:"";
		display: block;
		position: absolute;
		top: 50%;
		right: 1em;
		width: 1.5em;
		min-height: 2.8em;
		margin-top: -1.4em;
		background: url(/common/images/ico_arrow_03.png) 0 0 no-repeat;
		background-size: 100%;
	}
	#wrap #wrapInner .box01Wrap ul.salonArea li:nth-child(odd) a {
		background: #fffbf3;
	}
	#wrap #wrapInner .box01Wrap ul.salonArea li:nth-child(even) a {
		background: #f9f2e2;
	}
	#wrap #wrapInner .box02Wrap {
		display: none;
	}
	#wrap #wrapInner .box02Wrap aside,
	#wrap #wrapInner .box01Wrap > section {
		border: none;
	}
	#wrap #wrapInner .box01Wrap#content05 h2 {
		margin: 1em 0;
	}
	#content01 section div * ,
	#content02 section,
	#content03 section,
	.snsSmtArea * {
		text-align: center;
	}
	footer[role="contentinfo"] .footerSmtLink h2 {
		position: relative;
		padding: 1em 0 0.5em;
		background: #e28f9f;
		margin: 0 !important;
	}
	footer[role="contentinfo"] .footerSmtLink h2 span {
		display: block;
		text-indent: -9999px;
		max-width: 346px;
		height: 3em;
		background: url(/images/h2_title_07_smt.gif) 0 center no-repeat;
		background-size: 100%;
	}

/*	.mm-opened #headerInnerBody {
	display: none !important;
}*/
	 #wrap{
	 	padding: 0;
	 }
	.youtube {
		position: relative;
		width: 100%;
		padding-top: 56%;
	}
	.youtube iframe {
		position: absolute;
		top: 0;
		right: 0;
		width: 100% !important;
		height: 100% !important;
	}
}

@media screen and (min-width: 768px) {
	nav[role="navigation"] {
		position: absolute;
		top: -140px;
		width: 100%;
		max-width: 990px;
		margin: 0 auto;
		border: none;
	}
	nav[role="navigation"]:before,
	nav[role="navigation"]:after {
		height: 0;
	}
	nav[role="navigation"] > ul {
		display: table;
		width: 100%;
		padding: 1.5% 4% 1% 3%;
		background: url(/images/bg_nav.png) 0 0 no-repeat;
		height: 200px;
		max-height: 115px;
		background-size: 100%;
	}
	nav[role="navigation"] > ul > li {
		display: table-cell;
		width: 20%;
		vertical-align: top;
	}
	nav[role="navigation"] > ul > li > a {
		display: block;
		height: 79px;
		max-height: 79px;
		text-indent: -9999px;
		background-size: 100%;
	}
	nav[role="navigation"] > ul > li.nav01 > a {
		background: url(/images/nav_01.png) center 0 no-repeat;
		background-size: 100%;
	}
	nav[role="navigation"] > ul > li.nav02 > a {
		background: url(/images/nav_02.png) center 0 no-repeat;
		background-size: 100%;
	}
	nav[role="navigation"] > ul > li.nav03 > a {
		background: url(/images/nav_03.png) center 0 no-repeat;
		background-size: 100%;
	}
	nav[role="navigation"] > ul > li.nav04 > a {
		background: url(/images/nav_04.png) center 0 no-repeat;
		background-size: 100%;
	}
	nav[role="navigation"] > ul > li.nav05 > a {
		background: url(/images/nav_05.png) center 0 no-repeat;
		background-size: 100%;
	}
	nav[role="navigation"] > ul > li.nav01 > a:hover {
		background: url(/images/nav_01_on.png) center 0 no-repeat;
		background-size: 100%;
	}
	nav[role="navigation"] > ul > li.nav02 > a:hover {
		background: url(/images/nav_02_on.png) center 0 no-repeat;
		background-size: 100%;
	}
	nav[role="navigation"] > ul > li.nav03 > a:hover {
		background: url(/images/nav_03_on.png) center 0 no-repeat;
		background-size: 100%;
	}
	nav[role="navigation"] > ul > li.nav04 > a:hover {
		background: url(/images/nav_04_on.png) center 0 no-repeat;
		background-size: 100%;
	}
	nav[role="navigation"] > ul > li.nav05 > a:hover {
		background: url(/images/nav_05_on.png) center 0 no-repeat;
		background-size: 100%;
	}
	#mainImage img{ max-width: 100%;}
}
