@charset "utf-8";

/*
|-------------------------------------------------------------------------------
|   font family
|-------------------------------------------------------------------------------
*/

body {
	font-family: 'Noto Serif JP', sans-serif;
	line-height: 1.4;
	text-align: center;
	-webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/*
|-------------------------------------------------------------------------------
|   font color
|-------------------------------------------------------------------------------
*/

.ladys > a::after,
a.text-color-white,
.text-color-white,
.text-color-white a				{ color: #fff; }

a.text-color-41-201-230,
.text-color-41-201-230	{ color: rgb(41,201,230); }
body,
a,
.text-color-103-46-55		{ color: rgb(103,46,55); }
.text-color-109-109-109	{ color: rgb(109,109,109); }
.text-color-122-122-122	{ color: rgb(122,122,122); }
.text-color-126-82-90		{ color: rgb(126,82,90); }
.text-color-166-25-25		{ color: rgb(166,25,25); }
.text-color-166-83-83		{ color: rgb(166,83,83); }
.text-color-238-52-175	{ color: rgb(238,52,175); }
.text-color-245-161-153	{ color: rgb(245,161,153); }
.text-color-255-145-145	{ color: rgb(255,145,145); }
.text-color-255-247-153	{ color: rgb(255,247,153); }

/*
|-------------------------------------------------------------------------------
|   font size
|-------------------------------------------------------------------------------
*/

body	{ font-size: 16px; }
h1,
h2,
h3,
h4,
h5,
h6		{ font-size: 1em; }

.text-x0-3	{ font-size: .3em; }
.text-x0-4	{ font-size: .4em; }
.text-x0-5	{ font-size: .5em; }
.text-x0-7	{ font-size: .7em; }
.text-x0-75	{ font-size: .75em; }
.text-x0-8	{ font-size: .8em; }
.text-x0-85	{ font-size: .85em; }
.ladys > a::after,
.text-x0-9	{ font-size: .9em; }
.text-x1-1	{ font-size: 1.1em; }
.text-x1-15	{ font-size: 1.15em; }
.text-x1-2	{ font-size: 1.2em; }
.text-x1-25	{ font-size: 1.25em; }
.text-x1-3	{ font-size: 1.3em; }
.text-x1-4	{ font-size: 1.4em; }
.text-x1-5	{ font-size: 1.5em; }
.text-x1-6	{ font-size: 1.6em; }
.telephone a::before,
.text-x1-8	{ font-size: 1.8em; }
.text-x2		{ font-size: 2em; }
.text-x2-2	{ font-size: 2.2em; }
.text-x2-4	{ font-size: 2.4em; }
.text-x3		{ font-size: 3em; }
.text-x3-2	{ font-size: 3.2em; }
.text-x3-6	{ font-size: 3.6em; }
.text-x4-5	{ font-size: 4.5em; }
.text-x6		{ font-size: 6em; }

/*
|-------------------------------------------------------------------------------
|   font weight
|-------------------------------------------------------------------------------
*/

.text-400	{ font-weight: 400; }
body,
h1,
h2,
h3,
h4,
h5,
h6,
.text-500	{ font-weight: 500; }
.ladys > a::after,
.text-700	{ font-weight: 700; }
.text-800	{ font-weight: 800; }
.text-900	{ font-weight: 900; }

.text-style-italic	{ font-style: italic; }

/*
|-------------------------------------------------------------------------------
|   reset
|-------------------------------------------------------------------------------
*/

*			{ -webkit-box-sizing: border-box; box-sizing: border-box; }

html	{ -webkit-text-size-adjust: 100%; }

body {
	position: relative;
	margin: 0;
	padding: 0;
	overflow-x: hidden;
}

a	{ text-decoration: none; }

img	{ width: 100%; }

h1,
h2,
h3,
h4,
h5,
h6,
p { margin: 0; }

svg	{ fill: currentColor; }

span	{ vertical-align: 0%; }
table	{ border-collapse: collapse; width: 100%;}

ul, ol {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
|-------------------------------------------------------------------------------
|   custom class
|-------------------------------------------------------------------------------
*/

.pc-only,
.image-wrap.pc-only,
.prop a.pc-only,
#footer .link a.pc-only,
#footer .link + .link a.pc-only,
br.pc-only	{ display: none; }

.prop a.sp-only,
#footer .link a.sp-only,
#footer .link + .link a.sp-only,
.sp-only		{ display: block; }
br.sp-only	{ display: inline; }

a:focus:hover,
a:focus,
a				{ opacity: 1; }
a:hover	{ opacity: .8; }

.bg-color-white				{ background-color: #fff; }
.bg-color-51-199-227	{ background-color: rgb(51,199,227); }
.bg-color-190-167-226	{ background-color: rgb(190,167,226); }
.bg-color-246-162-153	{ background-color: rgb(246,162,153); }
.bg-color-247-247-247	{ background-color: rgb(247,247,247); }
.bg-color-251-194-187	{ background-color: rgb(251,194,187); }
.bg-color-252-250-248	{ background-color: rgb(252,250,248); }
.bg-color-255-145-145	{ background-color: rgb(255,145,145); }
.bg-color-255-102-120	{ background-color: rgb(255,102,120); }

.bg-color-ff-91-91	{ background-color: #ff9191; }

.border-2px								{ border: 2px solid; }
.border-3px							{ border: 3px solid; }
.border-bottom-1px				{ border-bottom: 1px solid; }
.border-color-250-196-195	{ border-color: rgb(250,196,195); }

.flex-box {
	margin: 0 auto;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-ms-flex-line-pack: center;
	    align-content: center;
}

.flex-box.flex-align-top {
	-webkit-box-align: start;
	    -ms-flex-align: start;
	        align-items: flex-start;
}

.flex-box.flex-space-between {
	-webkit-box-pack: justify;
	    -ms-flex-pack: justify;
	        justify-content: space-between;
}

.flex-box.flex-space-around {
	-ms-flex-pack: distribute;
	    justify-content: space-around;
}

hr.stared {
	border: 0;
	margin-left: -1em !important;
	margin-left: -1em !important;
	width: calc(100% + 2em);
	max-width: calc(100% + 2em) !important;
	height: .6em;
	background-image: url(../images/star.svg);
	background-repeat: repeat-x;
	background-position: left;
	background-size: auto 100%;
}

.line-height-0-5	{ line-height: .5; }
.line-height-1		{ line-height: 1; }
.line-height-1-1	{ line-height: 1.1; }
.line-height-1-2	{ line-height: 1.2; }

.image-wrap {
	position: relative;
	display: inline-table;
	width: 100%;
}

.image-wrap::before {
	content: '';
	position: relative;
	display: block;
	vertical-align: top;
	z-index: 2;
}

.image-wrap.image-ratio-1-1::before				{ padding-bottom: calc(100% / 1 * 1); }
.image-wrap.image-ratio-1-2::before				{ padding-bottom: calc(100% / 1 * 2); }
.image-wrap.image-ratio-3-2::before				{ padding-bottom: calc(100% / 3 * 2); }
.image-wrap.image-ratio-4-3::before				{ padding-bottom: calc(100% / 4 * 3); }
.image-wrap.image-ratio-9-11::before			{ padding-bottom: calc(100% / 9 * 11); }
.image-wrap.image-ratio-23-35::before			{ padding-bottom: calc(100% / 23 * 35); }
.image-wrap.image-ratio-493-430::before		{ padding-bottom: calc(100% / 493 * 430); }
.image-wrap.image-ratio-819-728::before		{ padding-bottom: calc(100% / 819 * 728); }
.image-wrap.image-ratio-2048-1365::before	{ padding-bottom: calc(100% / 2048 * 1365); }

.image-body {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-repeat: no-repeat;
	background-position: 50% 50%;
	background-size: cover;
	z-index: 1;
}

.bordered .image-wrap::before {
	border: 2px solid rgb(250,196,196);
	-webkit-box-shadow: inset 0 0 0 2px #fff;
	        box-shadow: inset 0 0 0 2px #fff;
}

.text-align-left    { text-align: left; }
.text-align-center  { text-align: center; }
.text-align-right   { text-align: right; }
.text-align-just    { text-align: justify; }

.palt	{ -webkit-font-feature-settings: "palt" on; font-feature-settings: "palt" on; }

section > .inner {
	margin: 0 auto;
	width: 100%;
	max-width: 37.5em;
	-webkit-box-sizing: content-box;
	        box-sizing: content-box;
}

.underline										{ text-decoration: underline; }
.underline-color-250-196-195	{ -webkit-text-decoration-color: rgb(250,196,195); text-decoration-color: rgb(250,196,195); }

[aria-stroke] {
	position: relative;
	z-index: 1;
}

[aria-stroke]::before {
	content: attr(aria-stroke);
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-text-stroke-width: calc(1em * 3 / 16);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	white-space: nowrap;
	z-index: -1;
}

.stroke-white[aria-stroke]::before				{ -webkit-text-stroke-color: #fff; }
.stroke-255-247-153[aria-stroke]::before	{ -webkit-text-stroke-color: rgb(255,247,153); }

svg.text {
	text-anchor: middle;
	width: 100%;
}

svg.text.height-1-1	{ height: 1.1em; }
svg.text.height-1-4	{ height: 1.4em; }

svg.text text[stroke] {
	stroke-width: .18em;
	stroke-linecap: round;
	stroke-linejoin: round;
}

@-webkit-keyframes rolling {
	0%		{ -webkit-transform: rotate(0deg); transform: rotate(0deg); }
	100%	{ -webkit-transform: rotate(359deg); transform: rotate(359deg); }
}

@keyframes rolling {
	0%		{ -webkit-transform: rotate(0deg); transform: rotate(0deg); }
	100%	{ -webkit-transform: rotate(359deg); transform: rotate(359deg); }
}

/*
|-------------------------------------------------------------------------------
|   transition
|-------------------------------------------------------------------------------
*/

a {
	-webkit-transition: .15s ease-out;
	transition: .15s ease-out;
}

.telephone,
ul.areas h3::after {
	-webkit-transition: .4s ease-out;
	transition: .4s ease-out;
}

.swiper-slide {
	-webkit-transition: opacity 1s ease-out;
	transition: opacity 1s ease-out;
}



/*
|-------------------------------------------------------------------------------
|   slide show
|-------------------------------------------------------------------------------
*/

.heart-banner {
	position: relative;
	margin-bottom: 1.4em;
	padding: 1.6em 0;
	background-image:
		url(../../img/bijiri/heart-banner-bg-a.svg), url(../../img/bijiri/heart-banner-bg-b.svg),
		-webkit-gradient(linear, left top, left bottom, color-stop(.8em, transparent), color-stop(.8em, #f7c8c6), color-stop(#f7c8c6), to(transparent));
	background-image:
		url(../../img/bijiri/heart-banner-bg-a.svg), url(../../img/bijiri/heart-banner-bg-b.svg),
		linear-gradient(to bottom, transparent .8em, #f7c8c6 .8em, #f7c8c6 calc(100% - .8em), transparent calc(100% - .8em));
	background-repeat: repeat-x;
	background-position: left top, left bottom;
	background-size: 1.6em;
	z-index: 2;
}

#slide-show h2 div {
	margin: .1em 0;
	padding: .6em 0;
}

#slide-show .loop-ba {
	padding-bottom: 1.2em;
	/* border-radius: 0 0 .5em .5em; */
	z-index: 1;
}

#slide-show .notice {
	position: relative;
	padding: 0 2em;
	z-index: 5;
	color: #000;
}

#slide-show .inner + .inner > div,
.steps-wrap {
	padding: .8em .96em 0;
}

#slide-show h3 {
	margin-bottom: .4em;
	white-space: nowrap;
}

#slide-show .image-group:nth-of-type(1) > div {
	margin-bottom: 2px;
	width: calc(100% / 3 - 4px / 3);
}

#slide-show p {
	margin: 1em auto;
}

.swiper-slide	{ padding: 1em .5em 0; }

.swiper-button-next,
.swiper-button-prev {
	margin: 0;
	width: 3.4em;
	height: 3.4em;
	background: none;
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next,
.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
	background-image: none;
}

.swiper-button-prev,
.swiper-container-rtl .swiper-button-next {
	left: calc(50% - 18.75em);
}

.swiper-button-next,
.swiper-container-rtl .swiper-button-prev {
	right: calc(50% - 18.75em);
}

.swiper-button-prev::before,
.swiper-container-rtl .swiper-button-next::before,
.swiper-button-next::before,
.swiper-container-rtl .swiper-button-prev::before,
.swiper-button-prev::after,
.swiper-container-rtl .swiper-button-next::after,
.swiper-button-next::after,
.swiper-container-rtl .swiper-button-prev::after {
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
	        transform: translate(-50%,-50%);
}

.swiper-button-prev::before,
.swiper-container-rtl .swiper-button-next::before,
.swiper-button-next::before,
.swiper-container-rtl .swiper-button-prev::before {
	width: 3.4em;
	height: 3.4em;
	background-color: rgb(135,109,76);
	opacity: .4;
	border-radius: 10em;
}

.swiper-button-prev::after,
.swiper-container-rtl .swiper-button-next::after,
.swiper-button-next::after,
.swiper-container-rtl .swiper-button-prev::after {
	top: calc(50% - .6em);
	left: 1.2em;
	width: 1em;
	height: 1em;
	border-width: 4px 4px 0 0;
	border-style: solid;
	border-color: #fff;
	-webkit-transform: rotate(-135deg);
	        transform: rotate(-135deg);
	-webkit-transform-origin: center;
	        transform-origin: center;
}

.swiper-button-next::after,
.swiper-container-rtl .swiper-button-prev::after {
	left: 1em;
}

.swiper-button-next::after,
.swiper-container-rtl .swiper-button-prev::after {
	-webkit-transform: rotate(45deg) ;
	        transform: rotate(45deg) ;
}

.swiper-button-prev:hover::before,
.swiper-container-rtl .swiper-button-next:hover::before,
.swiper-button-next:hover::before,
.swiper-container-rtl .swiper-button-prev:hover::before {
	opacity: .7;
}

.swiper-button-prev:active:hover::before,
.swiper-container-rtl .swiper-button-next:active:hover::before,
.swiper-button-next:active:hover::before,
.swiper-container-rtl .swiper-button-prev:active:hover::before {
	opacity: 1;
}

.swiper-container-horizontal > .swiper-pagination-bullets {
	bottom: 5em;
}

.swiper-pagination-bullet {
	margin: 0 .8em !important;
	width: 1em;
	height: 1em;
	background-color: rgb(192,175,158);
	opacity: 1;
}

.swiper-pagination-bullet-active {
	background-color: rgb(135,109,76);
}

/*
|-------------------------------------------------------------------------------
|   age groups
|-------------------------------------------------------------------------------
*/

#age-groups h2{ padding: .35em 0; }

.age-groups-image {
	margin: 0 1em;
	padding: 48em 3em 2em;
	background-image: url(../../img/bijiri/age-groups.png);
	background-repeat: no-repeat;
	background-position: 2em 3em;
	background-size: calc(100% - 4em) auto;
}

/*
|-------------------------------------------------------------------------------
|   devices
|-------------------------------------------------------------------------------
*/

#devices .inner > div {
	margin: 0 1em ;
	padding: 2em ;
}

/*
|-------------------------------------------------------------------------------
|   tel button
|-------------------------------------------------------------------------------
*/

.telephone {
	position: fixed;
	bottom: 0;
	left: 0;
	padding: .4em .6em;
	width: 100%;
	z-index: 10;
	border-top: 2px solid rgb(246,162,153);
	-webkit-transform: translate3d(0,100%,0);
	        transform: translate3d(0,100%,0);
	opacity: 0;
}

body.show-tel .telephone {
	-webkit-transform: translate3d(0,0,0);
	        transform: translate3d(0,0,0);
	opacity: 1;
}

.telephone > .inner {
	-ms-flex-wrap: nowrap;
	    flex-wrap: nowrap;
	max-width: calc(37.5em / 1.3);
}

.telephone a {
	position: relative;
	padding: .2em .2em .2em 2.5em;
	display: block;
	border-radius: .2em;
}

.telephone a::before {
	content: '☎';
	position: absolute;
	top: 10%;
	left: .2em;
}

/*
|-------------------------------------------------------------------------------
|   footer
|-------------------------------------------------------------------------------
*/

body.show-tel #footer {
	margin-bottom: calc(1em * (.8 + 1.4 * 3) * 1.3 / 1.25 );
}

#footer .above		{ padding: 1.4em 0; }
#footer .above h2	{ margin-bottom: .8em; }

ul.areas h3 {
	position: relative;
	cursor: pointer;
	padding: 0 1em;
	line-height: 3.5;
}

ul.areas h3::after {
	content: '';
	position: absolute;
	top: 50%;
	right: 1em;
	border-width: .75em .5em 0;
	border-style: solid;
	border-color: transparent;
	border-top-color: currentColor;
	-webkit-transform: translate3d(0,-30%,0);
	        transform: translate3d(0,-30%,0);
}

ul.areas h3.opened::after {
	-webkit-transform: translate3d(0,-50%,0) rotate(180deg);
	        transform: translate3d(0,-50%,0) rotate(180deg);
}

ul.areas > li + li {
	border-top: 2px solid #fff;
}

ul.areas h4,
ul.areas a,
#footer .link a,
.copyright {
	position: relative;
	padding: 0 1.2em;
	display: block;
	line-height: 3.5;
}

ul.areas h4													{ border-top: 2px solid; border-bottom: 2px solid; }
ul.areas a													{ padding-left: 2.2em; border-bottom: 2px dotted #ccc; }
ul.areas h4:nth-of-type(1)					{ border-top: 0; }
ul.areas li:nth-last-of-type(1) > a	{ border: 0; }

ul.areas .salon-list {
	display: none;
}

.ladys > a::after {
	content: 'レディース専門店';
	margin-left: .8em;
	padding: 0 .4em;
	display: inline-block;
	line-height: 1.6;
	background-color: rgb(255,145,145);
	border-radius: .2em;
}

#footer .statement p {
	padding: 13em 1em 0;
	background-repeat: no-repeat;
	background-position: center 2em;
	background-size: 35em auto;
}

#footer .statement p:nth-of-type(1) {
	background-image: url(../../img/bijiri/image_15.jpg);
}

#footer .statement p:nth-of-type(2) {
	padding-bottom: 2em;
	background-image: url(../../img/bijiri/image_16.jpg?0);
}

#footer .link { width: 100%; }

#footer .link + .link a	{ border-top: 2px solid rgb(246,162,153); }

/*
|-------------------------------------------------------------------------------
|   responsive
|-------------------------------------------------------------------------------
*/
body	{
	font-size: calc(1vw * 1600 / 600);
/* 	background: url(../../img/bijiri/lp/bodyBg.jpg) repeat; */
}
.image-body {		background-position: 65% 50%; }

.Campaign-wrap {
	padding: 1em;
}

/*
+-------------------------------------------------------------------------------
|   common
+-------------------------------------------------------------------------------
*/
.title1{
	padding: 9% 1em;
	background-color: #fff;
	background-image: url(../../img/bijiri/lp/title1Bg_top.png),url(../../img/bijiri/lp/title1Bg_bottom.png);
	background-position: center top 7%, center bottom 7%;
	background-repeat: no-repeat, no-repeat;
	background-size: 91.6% auto, 91.6% auto;
	text-align: center;
	color: #bd0000;
	line-height: 1.3;
	font-size: calc(1vw * 3500 / 600);
	font-weight: bold;
}
.title2{
	margin-bottom: 2em;
}
.title3{
	padding: 2px;
	margin-bottom: 1em;
}
.title3	>span{
	display: block;
	text-align: center;
	border-radius: 10px;
	background-color: #5a0c10;
	padding: 15px 0;
	color: #fff;
	font-size: calc(1vw * 3000 / 600);
	font-weight: bold;
	letter-spacing: 0.2em;
}
.title4{
	background: url(../../img/bijiri/lp/title4Bg.jpg) repeat-x left top/auto 100%;
	color: #fff;
	font-size: calc(1vw * 5300 / 600);
	line-height: 1.3;
	padding: 0.3em 0 0.5em;
}
.paddingInner1{
	padding-right: 2em;
	padding-left: 2em;
	box-sizing: border-box!important;
	-moz-box-sizing: border-box!important;
}
.paddingInner2{
	padding: 1.5em;
	box-sizing: border-box!important;
	-moz-box-sizing: border-box!important;
}
.btn-area{
	text-align: center;
}
.bg-pattern1_type1{
	background: url(../../img/bijiri/lp/bodyBg.jpg);
	padding: 1.3em;
	box-sizing: border-box!important;
	-moz-box-sizing: border-box!important;
}
.bg-pattern1_type2{
	background: url(../../img/bijiri/lp/bodyBg.jpg);
	padding: 1.3em 1.3em 0;
	box-sizing: border-box!important;
	-moz-box-sizing: border-box!important;
}
.bg-pattern1_type3{
	background: url(../../img/bijiri/lp/bodyBg.jpg);
	padding: 0 1.3em;
	box-sizing: border-box!important;
	-moz-box-sizing: border-box!important;
}
.phBox{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 10px;
}
.phBox-ph,.phBox-contents{
	flex: 0 0 47%;
}
.phBox-contents{
	text-align: left;
	font-size: 1.4em;
	font-weight: bold;
}
.rule-text{
	padding: 1em;
	text-align: left;
	font-size: 1.4em;
}
.rule-text em{
	font-weight: bold;
	font-style: normal;
}
.rule-box{
	margin-bottom: 1.5em;
}
.rule-box h4{
	font-size: 1.8em;
	font-weight: bold;
	margin-bottom: 0.5em;
}
.rule-box h4 small{
	font-size: 0.7em;
	display: block;
	line-height: 1.4;
}
.swiper-custom-button-next,
.swiper-custom-button-prev{
	position: absolute;
	width: 30px;
	height: 30px;
	top: 30%;
	margin-top: -18px;
	z-index: 5;
}
.swiper-custom-button-next-second,
.swiper-custom-button-prev-second{
	position: absolute;
	width: 30px;
	height: 30px;
	top: 50%;
	margin-top: -18px;
	z-index: 5;
}
.swiper-custom-button-next-second,
.swiper-custom-button-next{
	right: 0;
}
.swiper-custom-button-prev-second,
.swiper-custom-button-prev{
	left: 0;
}
/*
+-------------------------------------------------------------------------------
|   hero
+-------------------------------------------------------------------------------
*/
#hero{
	line-height: 1;
}
#hero img{
	width:100%;
	vertical-align: bottom;
}