@charset "UTF-8";

/* ===========================================================================
  base
============================================================================= */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video, a {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

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

nav ul,
nav ol {
	list-style: none;
}

table {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
}
th, td {
	vertical-align: middle;
	word-break: break-all;
	}

input,
select {
	vertical-align: middle;
	appearance: none;
}

*,*::before,*::after {
	box-sizing: border-box;
}

html {
	font-size: 62.5%;
	line-height: 1.68;
}

body {
	font-size: 1.4rem;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
	color: #000;
	word-wrap: break-word;
	overflow-wrap : break-word;
}

img {
	max-width: 100%;
	width: auto;
	height: auto;
	vertical-align: bottom;
}

/* win7 IE11対応 */
img[src$=".svg"] {
	width: 100%;
}

a {
	text-decoration: none;
}

select {
	outline: none;
}

select::-ms-expand {
	display: none;
}

input,
textarea {
	font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
	border-radius: 0;
	border: 0;
	outline: none;
}

[type="submit"],
[type="reset"],
[type="button"],
button {
	border: 0;
	cursor: pointer;
}

/* 印刷時は無効 */
@media print {
	html,
	body {
		display: block;
	}
	body {
		min-height: auto;
	}
	footer {
		margin-top: 0;
	}
}

body.is-fixed {
  position: fixed;
  width: 100%;
  height: 100vh;
	left: 0;
	top: 0;
	min-height: 100vh;
}

img {
	width: auto;
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}

input:focus,button:focus {
  outline: none;
}

/* ===========================================================================
  util
============================================================================= */
.pc {
	display: block!important;
}

.sp {
	display: none!important;
}

.ta-center {
	text-align: center!important;
}

.ta-right {
	text-align: right!important;
}

/* ===========================================================================
  headerSpMenuBtn
============================================================================= */
.headerSpMenuBtn {
	position: fixed;
	right: 4px;
	top: 24px;
	display: block;
	width: 90px;
	height: 58px;
	margin-left: auto;
	padding: 0;
	text-align: center;
	transition: background-color .4s;
	z-index: 10006;
}

.headerSpMenuBtn_lines {
	display: inline-block;
	position: relative;
	width: 62px;
	height: 40px;
	background: none;
}

.headerSpMenuBtn_line {
	position: absolute;
	left: 0;
	width: 100%;
	height: 3px;
	border-radius: 3px;
	background-color: #645F64;
	transition: -webkit-transform .4s;
	transition: transform .4s;
	transition: transform .4s, -webkit-transform .4s;
}

.headerSpMenuBtn_line:nth-of-type(1) {
	top: 0;
}

.headerSpMenuBtn_line:nth-of-type(2) {
	top: 19px;
}

.headerSpMenuBtn_line:nth-of-type(3) {
	bottom: 0;
}

.headerSpMenuBtn.is-active .headerSpMenuBtn_line:nth-of-type(1) {
	-webkit-transform: translateY(18px) rotate(-35deg);
	transform: translateY(19px) rotate(-35deg);
}

.headerSpMenuBtn.is-active .headerSpMenuBtn_line:nth-of-type(2) {
	opacity: 0;
}

.headerSpMenuBtn.is-active .headerSpMenuBtn_line:nth-of-type(3) {
	-webkit-transform: translateY(-18px) rotate(35deg);
	transform: translateY(-18px) rotate(35deg);
}

/* ===========================================================================
  headerBox
============================================================================= */
.headerBox_title {
  font-size: 2.1rem;
  color: #B499A8;
  margin-bottom: 12px;
}

.headerBox_title-02 {
  font-size: 2.1rem;
  color: #B499A8;
  margin-bottom: 12px;
  margin-top: 20px;
}

.headerBox {
  margin-top: 15px;
	flex-shrink: 0;
}

/* ===========================================================================
  headerNav
============================================================================= */
.headerNav {
	position:fixed;
  top:0;
  right:0;
  height: 100vh;
  background: #fff;
  padding: 20px 25px;
  -webkit-transform: translateX(100%);
  transform: translateX(100%);
  -webkit-transition:ease .3s;
  transition:ease .3s;
  z-index:9999;
  background-color: #fff;
	opacity: 0.95;
}

.headerNav.is-active {
	-webkit-transform:translateX(0);
  transform:translateX(0);
  overflow-y: auto;
}

.headerNav_inner {
  position: relative;
	padding: 0;
	width: 100%;
	margin: 0 auto;
}

/* ===========================================================================
  headerList
============================================================================= */
.headerList_text {
	padding: 13px 0;
	border-bottom: 1px solid #C7C7C7;
}

.headerList_text:last-child {
	border-bottom: none;
}
.headerList_link {
	font-size: 1.6rem;
	color: #645F64;
	padding-right: 50px;
	display: block;
	width: 100%;
	background: url(../img/arrow_01.svg) no-repeat right/13px;
}

.headerList_link:hover {
	opacity: 0.7;
}

/* ===========================================================================
  mainVisual
============================================================================= */
.mainVisual {
	position: relative;
	height: 850px;
	background-color: #EFEAE9;
}

.mainVisual::before {
	content: '';
	position: absolute;
	width: 73%;
	right: 0;
	height: 850px;
	background-color: #EFEAE9;
	background: url(../img/mv_01.jpg) no-repeat center/cover;
}

.mainVisual_inner {
	position: relative;
	height: 1050px;
	margin-bottom: 115px;
}

.mainVisual_inner::before {
	position: absolute;
	left: 0;
	bottom: 0;
	height: 318px;
	width: 20vw;
	background: url(../img/mv_03.jpg) no-repeat right/cover;
	content: '';
	z-index: 2;
}

.mainVisual::after {
	position: absolute;
	top: 10%;
	left: 7%;
	height: 585px;
	width: 497px;
	background: url(../img/mv_text.png) no-repeat center/cover;
	content: '';
	z-index: 3;
}

.mainVisualWrap {
	background: url(../img/mv_bg.png) no-repeat bottom/cover;
	padding-bottom: 134px;
}

/* ===========================================================================
  mainLogo
============================================================================= */
.mainLogo {
  position: absolute;
  top: 20px;
  left: 6%;
  z-index: 1;
}

/* ===========================================================================
  logoLink
============================================================================= */
.logoLink {
  display: inline-block;
}

.logoLink:hover {
  opacity: 0.7;
}

/* ===========================================================================
  modal
============================================================================= */
.modal {
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s;
	background-color: rgba(15, 10, 20, 0.7);
	height: 100%;
	width: 100%;
	z-index: 99999;
	position: fixed;
	top: 0;
	left: 0;
	display: flex;
	justify-content: center;
	overflow-y: auto;
	align-items: center;
}

.modal-02 {
	opacity: 0;
	visibility: hidden;
	transition: all 0.3s;
	background-color: #645F64;
	height: 100%;
	width: 100%;
	z-index: 99999;
	position: fixed;
	top: 0;
	left: 0;
	display: flex;
	justify-content: center;
	overflow-y: auto;
	align-items: center;
}

.modal.is-active {
	opacity: 1;
	visibility: visible;
}

.modal-02.is-active {
	opacity: 1;
	visibility: visible;
}

.modal_img {
	height: auto;
	background-color: #fff;
}

.modal_inner {
	position: relative;
	background-color: #fff;
	max-width: 1585px;
	width: 85%;
}

.modal_inner-02 {
	position: relative;
	max-width: 918px;
	width: 85%;
}

.modal_inner-02 > video {
	width: 100%;
	max-width: 918px;
	position: relative;
	-webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%);
	-webkit-transform: rotate(0.000001deg);
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	overflow: hidden;
}

.modal_btn {
	position: absolute;
	top: 30px;
	right: 30px;
	cursor: pointer;
}

.modal_btn-02 {
	position: absolute;
	top: -120px;
	right: 0;
	cursor: pointer;
}

/* ===========================================================================
  thumb
============================================================================= */
.thumb {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	cursor: pointer;
	background-size: cover;
	background-repeat: no-repeat;
}

.thumb.reielegance {
	background-image: url(../img/reielegance/thumbnail.png);
}

.thumb.aliage {
	background-image: url(../img/aliage/thumbnail.png);
}

.thumb.beautygene {
	background-image: url(../img/beautygene/thumbnail.png);
}

.thumb.cresyua {
	background-image: url(../img/cresyua/thumbnail.png);
}

.thumb.elleseine {
	background-image: url(../img/elleseine/thumbnail.png);
}

.thumb.fabrice {
	background-image: url(../img/fabrice/thumbnail.png);
}

.thumb.grandraffine {
	background-image: url(../img/grandraffine/thumbnail.png);
}

.thumb.handmadeguild {
	background-image: url(../img/handmadeguild/thumbnail.png);
}

.thumb.marycohr {
	background-image: url(../img/marycohr/thumbnail.png);
}

.thumb.nailstation {
	background-image: url(../img/nailstation/thumbnail.png);
}

.thumb.temomin {
	background-image: url(../img/temomin/thumbnail.png);
}

.thumb.badan {
	background-image: url(../img/badan/thumbnail.png);
}

/* ===========================================================================
  btn
============================================================================= */
.btn-01 {
	display: block;
	max-width: 1000px;
	width: 92%;
	height: 162px;
	margin: 0 auto 60px auto;
	background: url(../img/btn_01.png) no-repeat center/contain;
	cursor: pointer;
	transition: 0.2s;
}

.btn-01:hover {
	background: url(../img/btn_01-hover.png) no-repeat center/contain;
	opacity: 1.0;
}

/* ===========================================================================
  section
============================================================================= */
.section-01 {
	width: 100%;
	padding-bottom: 120px;
}

.section-02 {
	width: 100%;
	padding-bottom: 120px;
	background: url(../img/bg_wing.png) no-repeat center/cover;
}

.section-03 {
	height: 225px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.section-04 {
	width: 100%;
	padding-bottom: 125px;
}

.section_inner-01 {
	max-width: 1000px;
	width: 92%;
	margin: 0 auto;
}

.section_inner-02 {
	max-width: 92%;
	margin: 0 auto;
	background-color: #f2f3f5;
}

.menuTitle {
	margin-bottom: 30px;
	padding-bottom: 15px;
	font-weight: bold;
}

/* ===========================================================================
  shopArea
============================================================================= */
.shopArea {
	display: flex;
	flex-wrap: wrap;
}

.shopArea_item-col3 {
	width: calc((100% - 80px) / 3 - 0.01px);
	margin-right: 40px;
}

.shopArea_item-col3:nth-of-type(3n) {
	margin-right: 0;
}

.shopArea_item-col3:nth-of-type(n+4) {
	margin-top: 40px;
}

.shopArea_item-col3 > a {
	display: block;
}

.shopArea_item-col3 > a:hover {
	opacity: 0.7;
}

.shopArea_title {
	font-size: 2.4rem;
	color: #645F64;
	font-weight: bold;
	margin-top: 3px;
	line-height: 1.25;
}

.shopArea_subTitle {
	margin-top: 25px;
	font-size: 1.8rem;
	letter-spacing: -0.05em;
	color: #645F64;
}

/* ===========================================================================
  floorTitle
============================================================================= */
.floorTitle-01 {
	text-align: center;
	position: relative;
	top: -65px;
}

.floorTitle-02 {
	text-align: center;
	position: relative;
	top: -65px;
}

/* ===========================================================================
  linkArea
============================================================================= */
.linkArea {
	display: flex;
	justify-content: space-between;
	max-width: 1000px;
	margin: 0 auto;
	width: 92%;
}

.linkArea_item + .linkArea_item {
	margin-left: 85px;
}

.linkArea_item > a {
	display: block;
	cursor: pointer;
}

.linkArea_item > a:hover {
	opacity: 0.7;
}

/* ===========================================================================
  linkBtn
============================================================================= */
.linkBtn {
	width: 600px;
}

.linkBtn a {
	display: block;
	width: 100%;
	padding: 20px;
	font-size: 1.8rem;
	text-align: center;
	text-decoration: none;
	color: #16509f;
	border: 1px solid #16509f;
}

/* ===========================================================================
  shopText
============================================================================= */
.shopText-sub {
	font-size: 2.5rem;
	color: #645F64;
	line-height: 1.8;
}

.shopText {
  position: relative;
  font-size: 3.0rem;
  text-align: center;
  color: #645F64;
  margin-bottom: 15px;
  padding: 60px 0 20px;
}

/*
.shopText::before {
  position: absolute;
  height: 1px;
  width: 70px;
  background-color: #707070;
  margin: 0 auto;
  left: 0;
  right: 0;
  bottom: 0;
  content: '';
} */

/* ===========================================================================
  shopWrap
============================================================================= */
.shopWrap {
  background: url(../img/shopbg_01.png) no-repeat center/cover;
  padding-top: 200px;
}

.shopWrap_inner {
  max-width: 700px;
  width: 92%;
  margin: 0 auto;
}

/* ===========================================================================
  shopTitle
============================================================================= */
.shopTitle {
  font-size: 3.5rem;
  color: #645F64;
}

/* ===========================================================================
  shopSubTitle
============================================================================= */
.shopSubTitle {
  font-size: 2.0rem;
  color: #645F64;
}

/* ===========================================================================
  shopTextArea
============================================================================= */
.shopTextArea {
	padding-bottom: 95px;
}

/* ===========================================================================
  dl
============================================================================= */
.dl-style01 > dt,
.dl-style01 > dd {
	font-size: 2.0rem;
	color: #645F64;
	font-weight: normal;
}

.dl-style01 {
	display: flex;
	flex-wrap: wrap;
	margin-top: 15px;
}

.dl-style01 > dt {
	width: 5.3em;
}

.dl-style01 > dd {
	width: calc(100% - 5.3em);
}

/* ===========================================================================
  shopFloor
============================================================================= */
.shopFloor {
  display: flex;
	justify-content: center;
  margin: 0 0 50px;
}

/* ===========================================================================
  shopTitleArea
============================================================================= */
.shopTitleArea {
  margin-top: 50px;
}

/* ===========================================================================
  shopMenu
============================================================================= */
.shopMenu {
	margin: 125px 0 80px;
	display: flex;
	justify-content: center;
}

.shopMenu-02 {
	margin: 0  0 45px;
	text-align: center;
}

/* ===========================================================================
  menuBlock
============================================================================= */
.menuBlock + .menuBlock {
	margin-top: 95px;
}

.menuBlock_title {
	font-size: 3.0rem;
	padding-bottom: 5px;
	color: #645F64;
	border-bottom: 1px solid #645F64;
	margin-bottom: 52px;
}

.menuBlock_text {
	font-size: 2.5rem;
	color: #645F64;
	line-height: 1.7;
}

.menuBlock_text + .menuBlock_text {
	margin-top: 50px;
}

/* ===========================================================================
  galleryArea
============================================================================= */
.galleryArea {
	max-width: 1920px;
	width: 100%;
	display: flex;
	margin: 0 auto;
}
.galleryArea_item > img {
	width: 100%;
}

.galleryArea-col1 {
	max-width: 1200px;
	width: 92%;
	margin: 0 auto;
	text-align: center;
}

.galleryArea-col2 {
	max-width: 1200px;
	width: 92%;
	margin: 0 auto;
	display: flex;
	justify-content: center;
}

/* ===========================================================================
  returnLinkBox
============================================================================= */
.returnLinkBox {
	margin: 10px 0 0 0;
}

.returnLink {
	position: relative;
	font-size: 1.7rem;
	color: #645F64;
	padding: 13px 20px 13px 20px;
	background: none;
	border: 1px solid #645F64;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.returnLink:hover {
	opacity: 0.7;
}

.returnLink::after {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 10px;
	margin: auto 0;
	background: url(../img/arrow_01_sp.png) no-repeat center/contain;
	width: 13px;
	height: 7px;
	content: '';
}

/* ===========================================================================
  youtube
============================================================================= */
.youtube {
	position: relative;
	width: 100%;
	padding-top: 67.25%;
	-webkit-mask-image: -webkit-radial-gradient(circle, white 100%, black 100%); /*ios 7 border-radius-bug */
	-webkit-transform: rotate(0.000001deg); /*mac os 10.6 safari 5 border-radius-bug */
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	overflow: hidden;
}

.youtube > iframe {
	position: absolute;
	top: 0;
	right: 0;
	width: 100%;
	height: 100%;
}

/* ===========================================================================
  scroll
============================================================================= */
.scroll {
	position: relative;
	top: 15px;
	width: 50px;
	height: 239px;
	display: block;
	left: 23%;
}
.scroll > img{
	position: relative;
	top: 0;
	right: 0;
	display: block;
	margin-left: auto;
}
.scroll span {
	position: absolute;
	display: block;
	top: 0;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background-color: #645F64;
	margin-right: auto;
	-webkit-animation: sdb 2s infinite;
	animation: sdb 2s infinite;
	opacity: 0;
	box-sizing: border-box;
}
.scroll span:nth-of-type(1) {
	-webkit-animation-delay: 0s;
	animation-delay: 0s;
}
.scroll span:nth-of-type(2) {
	top: 34px;
	-webkit-animation-delay: .15s;
	animation-delay: .15s;
}
.scroll span:nth-of-type(3) {
	top: 68px;
	-webkit-animation-delay: .3s;
	animation-delay: .3s;
}
.scroll span:nth-of-type(4) {
	top: 102px;
	-webkit-animation-delay: .45s;
	animation-delay: .45s;
}
.scroll span:nth-of-type(5) {
	top: 136px;
	-webkit-animation-delay: 0.6s;
	animation-delay: 0.6s;
}
.scroll span:nth-of-type(6) {
	top: 170px;
	-webkit-animation-delay: 0.75s;
	animation-delay: 0.75s;
}
.scroll span:nth-of-type(7) {
	top: 204px;
	-webkit-animation-delay: 0.9s;
	animation-delay: 0.9s;
}

@-webkit-keyframes sdb {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes sdb {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}

/* ------------------------------------------------------
  * footer
 ------------------------------------------------------ */
.footer{
	background: #333333;
	color: #fff;
	padding: 60px 15px 15px;
	position: relative;
	letter-spacing: normal;
}
/* ----- footer_column ----- */
.footer_column{
	display: -webkit-flex;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
}

.footer_column > .col_item{
	width: 30%;
	margin-bottom: 20px;
}
.footer_column > .col_item .footer_link li{
	margin-bottom: 10px;
}
.footer_column > .col_item .footer_link li a{
	position: relative;
	display: inline-block;
	padding-left: 1.2em;
	color: #fff;
	text-decoration: none;
}
.footer_column > .col_item .footer_link li a:before{
	content: "";
	position: absolute;
	left: 0px;
	top: 50%;
	width: 8px;
	height: 8px;
	margin-top: -6px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.footer_column > .col_item .footer_link .footer_link_child{
	margin-top: 10px;
	padding-left: 1.5em;
}
/* ----- footerBody ----- */
.footerBody .footer-copyright{
	font-size: 14px;
	text-align: center;
}

/*-- Pagetop --*/
.pagetopBtn{
	position: fixed;
	display: none;
	right: 5%;
	bottom: 234px;
	width: 70px;
	height: 70px;
	background: #16509f;
	border-radius: 50%;
	z-index: 9998;
}
.pagetopBtn a{
	display: block;
	position: relative;
	height: 100%;
}
.pagetopBtn a:after{
	position: absolute;
	content: "";
	left: 50%;
	top: 50%;
	width: 14px;
	height: 14px;
	margin-top: -4px;
	margin-left: -7px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
	}
.inner-block {
	max-width: 1020px;
	margin: 0 auto;
}


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

	/* ===========================================================================
	  scroll
	============================================================================= */
	.scroll {
		left: 24%;
	}

}


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

	/* ===========================================================================
	  scroll
	============================================================================= */
	.scroll {
		left: 24%;
	}

	/* ===========================================================================
	  mainVisual
	============================================================================= */
	.mainVisual::before {
		width: 60%;
	}

}


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

	/* ===========================================================================
	  mainVisual
	============================================================================= */
	.mainVisual::before {
		width: 50%;
	}

	/* ===========================================================================
		scroll
	============================================================================= */
	.scroll {
		left: 26%;
  }

}


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

	/* ===========================================================================
		scroll
	============================================================================= */
  .scroll {
    left: 28%;
  }

}


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

	/* ===========================================================================
		linkArea
	============================================================================= */
	.linkArea_item + .linkArea_item {
		margin-left: 52px;
	}

	/* ===========================================================================
		shopArea
	============================================================================= */
	.shopArea_item-col3 {
		width: calc((100% - 60px) / 3 - 0.01px);
		margin-right: 30px;
	}

	.shopArea_subTitle {
		font-size: 1.4rem;
	}

	.shopArea_title {
		font-size: 2.2rem;
	}

	/* ===========================================================================
		mainVisual
	============================================================================= */
	.mainVisual_inner::before {
		width: 20%;
		background-position: right;
	}

	/* ===========================================================================
		headerList
	============================================================================= */
	.headerList + .headerList {
		margin-left: 20px;
	}

}


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

	/* ===========================================================================
		shopWrap
	============================================================================= */
	.shopWrap {
		background: url(../img/shopbg_01.png) no-repeat center/cover;
		padding-top: 150px;
	}

	/* ===========================================================================
		shopSubTitle
	============================================================================= */
	.shopSubTitle {
		font-size: 2.6rem;
	}

	/* ===========================================================================
		shopTitle
	============================================================================= */
	.shopTitle {
		font-size: 5.6rem;
	}

	/* ===========================================================================
		dl
	============================================================================= */
	.dl-style01 > dt, .dl-style01 > dd {
		font-size: 2.6rem;
	}

	.dl-style01 > dt, .dl-style01 > dd {
		font-size: 2.6rem;
	}

	/* ===========================================================================
		shopText
	============================================================================= */
	.shopText {
		font-size: 4.6rem;
	}

	.shopText-sub {
		font-size: 2.6rem;
	}

	/* ===========================================================================
		menuBlock
	============================================================================= */
	.menuBlock_title {
		font-size: 2.6rem;
	}

	.menuBlock_text {
		font-size: 2.1rem;
	}

	/* ===========================================================================
		shopTextArea
	============================================================================= */
	.shopTextArea {
		padding-bottom: 110px;
	}

	/* ===========================================================================
		shopMenu
	============================================================================= */
	.shopMenu {
		margin: 141px 0 60px;
	}

	/* ===========================================================================
		section
	============================================================================= */
	.section-04 {
		padding-bottom: 110px;
	}

}


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

	/* ===========================================================================
		mainVisual
	============================================================================= */
  .mainVisual::before {
      width: 48%;
  }

  .mainVisual_inner::before {
    width: 18%;
  }

}


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

	/* ===========================================================================
		util
	============================================================================= */
  .pc {
    display: none!important;
  }

  .sp {
    display: block!important;
  }

	/* ===========================================================================
		headerSpMenuBtn
	============================================================================= */
	.headerSpMenuBtn {
		right: 5%;
		top: 22px;
		display: block;
		width: 42px;
		height: 28px;
		margin-left: auto;
		padding: 0 0;
		color: #645F64;
		text-align: center;
		transition: background-color .4s;
		z-index: 10009;
	}

	.headerSpMenuBtn_lines {
		display: inline-block;
		position: relative;
		width: 40px;
		height: 28px;
		background: none;
	}

	.headerSpMenuBtn_line:nth-of-type(2) {
		top: 13px;
	}

	.headerSpMenuBtn.is-active .headerSpMenuBtn_line:nth-of-type(1) {
		-webkit-transform: translateY(8px) rotate(-35deg);
		transform: translateY(8px) rotate(-35deg);
	}

	.headerSpMenuBtn_line {
		height: 2px;
	}

	/* ===========================================================================
		headerBox
	============================================================================= */
	.headerBox {
		margin-top: 18px;
	}

	.headerBox_title {
		position: relative;
		font-size: 2.0rem;
	}

	.headerBox_title-02 {
		position: relative;
		font-size: 2.0rem;
		margin-top: 15px;
	}

	.headerBox_item:first-of-type {
		padding: 0 0 0 0;
		width: 100%;
	}

	.headerBox_item + .headerBox_item {
		border-left: none;
	}

	.headerBox_item {
		padding: 0;
		width: 100%;
	}

	.headerBox_item:last-of-type {
		padding: 0;
		width: 100%;
	}

	.headerBox_item:nth-of-type(2) {
		width: 100%;
	}

	/* ===========================================================================
		headerList
	============================================================================= */
	.headerList_link {
		font-size: 1.6rem;
		padding-right: 40px;
		width: 100%;
		background: url(../img/arrow_01_sp.svg) no-repeat right/13px;
	}

	.headerList {
		width: 100%;
	}

	.headerList_text {
		border-bottom: 1px solid #C7C7C7;
		padding: 12px 0 12px 0;
	}

	.headerList_text:last-of-type {
		border-bottom: none;
	}

	/* ===========================================================================
		headerNav
	============================================================================= */
	.headerNav {
		width: 100%;
		padding: 20px 25px 30px;
		overflow-scrolling: touch;
		overflow-y: auto;
		height: 100%;
	}

	/* ===========================================================================
		headerListWrap
	============================================================================= */
	.headerListWrap {
		display: flex;
	}

	/* ===========================================================================
		btn
	============================================================================= */
  .btn-01 {
      display: block;
      width: 92%;
      height: auto;
      margin: 0 auto 30px auto;
      background: none;
  }

  .btn-01 > img {
      margin: 0 auto;
      width: 100%;
  }

  .btn-01:hover {
      background: none;
  }

	/* ===========================================================================
		mainVisual
	============================================================================= */
  .mainVisual {
		height: 580px;
		background: none;
  }

  .mainVisual::after {
		content: none;
  }

  .mainVisual::before {
		content: '';
		position: absolute;
		width: 100%;
		right: 0;
		height: 352px;
		background-color: #EFEAE9;
		background: url(../img/mv_01_sp.jpg) no-repeat right/contain;
  }

  .mainVisual_inner::before {
		height: 150px;
		width: 110px;
		background: url(../img/mv_02.jpg) no-repeat center/cover;
		content: '';
		bottom: 10px;
  }

	/* ===========================================================================
		shopArea
	============================================================================= */
  .shopArea_item-col3 {
		width: calc((100% - 15px) / 2 - 0.01px);
		margin-right: 15px;
  }

  .shopArea_item-col3:nth-of-type(2n) {
		margin-right: 0!important;
  }

  .shopArea_item-col3:nth-of-type(3n) {
		margin-right: 15px;
  }

  .shopArea_item-col3:nth-of-type(n+3) {
		margin-top: 20px;
  }

  .shopArea_title {
		font-size: 1.5rem;
		margin-top: 7px;
  }

  .shopArea_subTitle {
		margin-top: 14px;
		font-size: 1.2rem;
		letter-spacing: 0;
  }

	/* ===========================================================================
		modal
	============================================================================= */
  .modal_inner {
		height: 100%;
		width: 92%;
		margin: 0 auto;
		background-color: transparent;
  }

	.modal_inner-02 {
		width: 92%;
	}

  .modal_img {
		max-width: 935px;
		height: auto;
		background-color: #fff;
		width: 100%;
  }

	.modal_img > img {
		max-width: 100%;
		height: auto;
  }

	.modal_btn-02 {
		position: absolute;
		top: -55px;
		right: 0;
		cursor: pointer;
	}

	/* ===========================================================================
		linkArea
	============================================================================= */
	.linkArea {
		display: block;
		text-align: center;
	}

	.linkArea_item + .linkArea_item {
		margin: 30px 0 0 0;
	}

	/* ===========================================================================
		floorTitle
	============================================================================= */
	.floorTitle-01 {
		width: 56px;
		margin: 0 auto;
		top: -29px;
	}

	.floorTitle-02 {
		width: 56px;
		margin: 0 auto;
		top: -29px;
	}

	/* ===========================================================================
		linkBtn
	============================================================================= */
	.linkBtn {
		width: 317px;
		max-width: 92%;
	}

	.linkBtn a {
		display: block;
		width: 100%;
		padding: 10px;
		font-size: 1.6rem;
		text-align: center;
		text-decoration: none;
		color: #16509f;
		border: 1px solid #16509f;
	}

	/* ===========================================================================
		section
	============================================================================= */
	.section-01 {
		padding-bottom: 61px;
	}
	.section-02 {
		padding-bottom: 76px;
		background: url(../img/bg_wing_sp_02.png) no-repeat center/cover;
	}
	.section-03 {
		height: 150px;
	}

	/* ===========================================================================
		mainVisualWrap
	============================================================================= */
	.mainVisualWrap {
		background: url(../img/bg_wing_sp.png) no-repeat bottom/cover;
		padding-bottom: 100px;
	}

	/* ===========================================================================
		mainVisual
	============================================================================= */
	.mainVisual_inner {
		height: 580px;
		margin-bottom: 118px;
	}

	.mainVisual::after {
		position: absolute;
		top: 77%;
		left: 65%;
		transform: translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
		height: 248px;
		width: 209px;
		background: url(../img/mv_text_sp.png) no-repeat center/contain;
		content: '';
		z-index: 1;
	}

	/* ===========================================================================
		scroll
	============================================================================= */
	.scroll {
		position: relative;
		top: 30px;
		width: 23px;
		height: 76px;
		display: block;
		left: 20%;
	}

	.scroll > img {
		width: 12px;
	}
	.scroll span {
		position: absolute;
		display: block;
		top: 0;
		width: 2px;
		height: 2px;
	}

	.scroll span:nth-of-type(1) {
		-webkit-animation-delay: 0s;
		animation-delay: 0s;
	}
	.scroll span:nth-of-type(2) {
		top: 10px;
		-webkit-animation-delay: .15s;
		animation-delay: .15s;
	}
	.scroll span:nth-of-type(3) {
		top: 20px;
		-webkit-animation-delay: .3s;
		animation-delay: .3s;
	}
	.scroll span:nth-of-type(4) {
		top: 30px;
		-webkit-animation-delay: .45s;
		animation-delay: .45s;
	}
	.scroll span:nth-of-type(5) {
		top: 40px;
		-webkit-animation-delay: 0.6s;
		animation-delay: 0.6s;
	}
	.scroll span:nth-of-type(6) {
		top: 50px;
		-webkit-animation-delay: 0.75s;
		animation-delay: 0.75s;
	}
	.scroll span:nth-of-type(7) {
		top: 60px;
		-webkit-animation-delay: 0.9s;
		animation-delay: 0.9s;
	}

	/* ===========================================================================
		linkArea
	============================================================================= */
	.linkArea_item > a {
		display: block;
	}

	.linkArea_item > a > img {
		width: 100%;
	}

	/* ===========================================================================
		shopFloor
	============================================================================= */
	.shopFloor {
		margin: 0 auto 11px;
		width: 56px;
		display: block;
	}

	/* ===========================================================================
		shopWrap
	============================================================================= */
	.shopWrap {
		background: url(../img/shopbg_01.png) no-repeat center/cover;
		padding-top: 58px;
	}

	/* ===========================================================================
		shopSubTitle
	============================================================================= */
	.shopSubTitle {
		font-size: 1.4rem;
	}

	/* ===========================================================================
		shopTitle
	============================================================================= */
	.shopTitle {
		font-size: 2.2rem;
	}

	/* ===========================================================================
		dl
	============================================================================= */
	.dl-style01 > dt,
	.dl-style01 > dd {
		font-size: 1.5rem;
	}

	/* ===========================================================================
		shopText
	============================================================================= */
	.shopText {
		font-size: 1.8rem;
		margin-bottom: 15px;
		padding: 36px 0 0;
	}

	.shopText::before {
		content: none;
	}

	.shopText-sub {
		font-size: 1.5rem;
	}

	/* ===========================================================================
		shopMenu
	============================================================================= */
	.shopMenu {
		margin: 54px auto 40px;
	}

	/* ===========================================================================
		menuBlock
	============================================================================= */
	.menuBlock_title {
		font-size: 1.8rem;
		padding-bottom: 5px;
		color: #645F64;
		border-bottom: 1px solid #645F64;
		margin-bottom: 30px;
	}

	.menuBlock_text {
		font-size: 1.5rem;
		color: #645F64;
		line-height: 1.7;
	}

	.menuBlock_text + .menuBlock_text {
		margin-top: 25px;
	}

	.menuBlock + .menuBlock {
		margin-top: 45px;
	}

	/* ===========================================================================
		shopMenu
	============================================================================= */
	.shopMenu-02 {
		display: none;
	}

	/* ===========================================================================
		section
	============================================================================= */
	.section-04 {
		padding-bottom: 60px;
	}

	/* ===========================================================================
		shopTextArea
	============================================================================= */
	.shopTextArea {
		padding-bottom: 53px;
	}

	/* ===========================================================================
		shopTitleArea
	============================================================================= */
	.shopTitleArea {
		margin-top: 22px;
	}

	/* ===========================================================================
		modal
	============================================================================= */
	.modal_btn {
		top: 14px;
		right: 14px;
	}

	/* ===========================================================================
		youtube
	============================================================================= */
	.youtube {
		position: relative;
		width: 100%;
		padding-top: 67.25%;
		border-radius: 10px;
	}

	.youtube > iframe {
		position: absolute;
		top: 0;
		right: 0;
		width: 100%;
		height: 100%;
	}

	/* ===========================================================================
		returnLink
	============================================================================= */
	.returnLinkBox {
		margin: 10px 0 0 0;
	}

	.returnLink {
		position: relative;
		font-size: 1.7rem;
		color: #645F64;
		padding: 15px 20px 15px 20px;
		background: none;
		border: 1px solid #645F64;
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.returnLink::after {
		position: absolute;
		top: 0;
		bottom: 0;
		right: 10px;
		margin: auto 0;
		background: url(../img/arrow_01_sp.png) no-repeat center/contain;
		width: 13px;
		height: 7px;
		content: '';
	}

	/* ===========================================================================
		galleryArea
	============================================================================= */
	.galleryArea {
		max-width: 1920px;
		width: 100%;
		display: flex;
		margin: 0 auto;
		flex-wrap: wrap;
	}

	.galleryArea_item:nth-of-type(1) {
		width: 100%;
	}

	.galleryArea_item:nth-of-type(1) > img {
		width: 100%;
	}

	.galleryArea_item:nth-of-type(2) {
		width: calc((100% - 3px) / 2);
		margin: 3px 3px 0 0;
	}

	.galleryArea_item:nth-of-type(3) {
		width: calc((100% - 3px) / 2);
		margin: 3px 0 0 0;
	}

	.galleryArea_item > img {
		width: 100%;
	}

	.galleryArea_item-col2 {
		width: 100%;
	}

	.galleryArea_item-col2 > img {
		width: 100%;
	}

	.galleryArea-col2 {
		display: block;
		width: 100%;
	}

	.galleryArea_item-col2 + .galleryArea_item-col2 {
		margin-top: 3px;
	}

	/* ===========================================================================
		logoLink
	============================================================================= */
	.logoLink {
		width: 166px;
	}

	/* ------------------------------------------------------
	 * footer
	------------------------------------------------------ */

	.footer_column {
		display: block;
	}

	.footer{
		background: #333333;
		color: #fff;
		padding: 30px 15px;
		position: relative;
		letter-spacing: normal;
	}
	/* ----- footer_column ----- */
	.footer_column > .col_item{
	  margin-bottom: 20px;
	  width: 100%;
	}
	.footer_column > .col_item .footer_link li{
	  margin-bottom: 10px;
	}
	.footer_column > .col_item .footer_link li a{
	  position: relative;
	  display: inline-block;
	  padding-left: 1.5em;
	  color: #fff;
	  text-decoration: none;
	}
	.footer_column > .col_item .footer_link li a:before{
	  content: "";
	  position: absolute;
	  left: 0px;
	  top: 50%;
	  width: 6px;
	  height: 6px;
	  margin-top: -3px;
	  border-top: 1px solid #fff;
	  border-right: 1px solid #fff;
	  -webkit-transform: rotate(45deg);
	          transform: rotate(45deg);
	}
	.footer_column > .col_item .footer_link .footer_link_child{
	  margin-top: 10px;
	  padding-left: 1.5em;
	}
	/* ----- footerBody ----- */
	.footerBody .footer-copyright{
	  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic",  Verdana, "Droid Sans" , sans-serif !important;
	  font-size: 11px;
	  font-size: 1.1rem;
	  text-align: center;
	}
	/*-- Pagetop --*/
	.pagetopBtn{
	  position: fixed;
	  display: none;
	  right: 5%;
	  bottom: 10%;
	  width: 40px;
	  height: 40px;
	  background: #16509f;
	  border: 2px solid #fff;
	  border-radius: 50%;
	  z-index: 9997;
	}
	.pagetopBtn a{
	  position: relative;
	  display: inline;
	}
	.pagetopBtn a:after{
	  position: absolute;
	  content: "";
	  left: 50%;
	  top: 50%;
	  width: 8px;
	  height: 8px;
	  margin-top: 16px;
	  margin-left: 14px;
	  border-top: 2px solid #fff;
	  border-right: 2px solid #fff;
	  -webkit-transform: rotate(-45deg);
	          transform: rotate(-45deg);
	}

}


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

	/* ===========================================================================
		mainVisual
	============================================================================= */

	.mainVisual_inner::before {
		height: 130px;
		width: 90px;
		background: url(../img/mv_02.jpg) no-repeat center/cover;
		content: '';
	}

}