@charset 'UTF-8';

/* ■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■

	トップページ

■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■■ */



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

	レイアウト

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

/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	#wrapper {
	}

	main.outer_wrap {
		position: relative;
		max-width: none;
		/* max-width: 1920px; 固定幅レイアウト時 */
		width: 100%;
		min-height: 50vh;
		display: block;
		margin: 0 auto;
	}

	.inner_wrap {
		position: relative;
	}
}




/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	#wrapper {
	}

	main.outer_wrap {
		position: relative;
		width: 100%;
	}

	.inner_wrap {
		position: relative;
	}
}




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

	ヘッダー

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

/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	header {
		position: relative;
		height: 54.32vw;
	}
	header::after {
		position: absolute;
		content: "";
		display: block;
		background: url(../img/pine.png) center top / contain no-repeat;
		width: 8.177vw;
		height: 19.11vw;
		left: 14.8vw;
		bottom: -2vw;
		z-index: 1;
	}




	/* ホットペッパービューティー
	----------------------------------------------- */
	.fixed_reserve {
		position: fixed;
		right: 0;
		z-index: 9999;
	}
	.fixed_reserve a  {
		transition-property: all;
		transition-duration: 0.3s;
		transition-timing-function: ease-in-out;
		transition-delay: 0s;
	}
	.fixed_reserve a img {
		width: 22.135vw;
		height: auto;
	}
	.fixed_reserve a:hover {
		opacity: 1;
		filter: brightness(115%);
	}



	/* ロゴ
	----------------------------------------------- */
	.h_logo {
		position: absolute;
		background: url(../img/bg_green.jpg) left top / auto auto repeat;
		width: 18.75vw;
		height: 54.32vw;
		display: table;
		z-index: 1;
	}
	.h_logo_in {
		display: table-cell;
		text-align: center;
		vertical-align: middle;
	}
	.h_logo_in a {
		display: block;
	}
	.h_logo_in a img {
		width: 9.375vw;
		height: auto;
	}


	/* グローバルナビゲーション
	----------------------------------------------- */
	.navi_wrap {
		position: absolute;
		background: url(../img/bg_beige.jpg) left top / auto auto repeat;
		width: 100%;
		height: 6.666vw;
		left: 0;
		bottom: 0;
		z-index: 1;
	}

	.main_navi {
		position: relative;
		width: 100%;
		padding: 0 0 0 26%;
	}


	/* ナビ */
	.main_navi {
		width: 100%;
		height: 100%;
	}
	.main_navi > ul {
		width: 100%;
		height: 100%;
		overflow: hidden;
	}
	.main_navi > ul > li {
		float: left;
		display: table;
		height: 100%;
		margin: 0 4vw 0 0;
	}
	.main_navi > ul > li:nth-of-type(6) {
		margin: 0;
	}
	.main_navi > ul > li:last-of-type {
		float: right;
		margin: 0;
	}

	.main_navi > ul > li > a {
		display: table-cell;
		height: 100%;
		text-align: center;
		vertical-align: middle;
	}
	.main_navi > ul > li > a img {
		display: block;
		width: auto;
		height: 3.02vw;
	}
	.main_navi > ul > li:last-of-type > a {
		padding: 0 3.5vw;
		background: #8f3356;
		transition-property: all;
		transition-duration: 0.3s;
		transition-timing-function: ease-in-out;
		transition-delay: 0s;
	}
	.main_navi > ul > li:last-of-type > a:hover {
		opacity: 1;
		filter: brightness(115%);
	}



	/* IS
	----------------------------------------------- */
	.m-top {
		position: absolute;
		right: 0;
		width: 83.33vw;
		height: 49.73vw;
	}
	.m-top > div::before {
		position: absolute;
		top: 0;
		right: 0;
		content: "";
		display: block;
		background: url(../img/h_logo2.png) center top 50% / 13.333vw auto no-repeat;
		width: 97%;
		height: 96%;
		z-index: 3;
	}

	.ms-theme-precognition {
		padding-bottom: 0 !important;
	}

}




/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	header {
		position: relative;
	}




	/* ホットペッパービューティー
	----------------------------------------------- */
	.fixed_reserve {
		display: none;
	}



	/* ロゴ
	----------------------------------------------- */
	.h_logo {
		display: none;
	}

	.h_logo_sp {
		position: absolute;
		left: 50%;
		margin: 39vw 0 0 -20vw;
		z-index: 1;
		
	}
	.h_logo_sp img {
		width: 40vw;
		height: auto;
	}


	/* グローバルナビゲーション
	----------------------------------------------- */
	.navi_wrap {
		display: none;
	}


	/* IS
	----------------------------------------------- */
	.m-top {
		min-height: 60vw;
	}
	.ms-theme-precognition {
		padding-bottom: 0 !important;
	}
}








/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★

	ここからコンテンツ内容

★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */




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

	挨拶

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


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.row01 {
		position: relative;
		background: url(../img/bg_top_greeting.jpg) center top 4.27vw / 100% auto no-repeat;
		width: 100%;
		padding: 10.15625vw 14.42708333333333vw;
	}

	/* 見出し */
	.row01 h2 {
		position: relative;
		font-size: 1.771vw;
		font-weight: 400;
		letter-spacing: 0.15em;
		line-height: 2.1;
		margin: 0 0 2.5em 0;
	}
	.row01 h2 span {
		color: #95b74b;
	}
	.row01 h2::after {
		position: absolute;
		content: "";
		display: block;
		background: #95b74b;
		width: 6.09375vw;
		height: 0.26vw;
		left: 0px;
		bottom: -0.9vw;
	}

	/* テキスト */
	.row01 .text {
		position: relative;
		font-size: 1.042vw;
		line-height: 1.8;
		letter-spacing: 0.15em;
	}
	.row01 .text p {
		margin: 0 0 2em 0;
	}
	.row01 .text p:last-of-type {
		margin: 0 0 3em 0;
	}

	/* SP店内画像 */
	.img_sp {
		display: none;
	}

	/* リンクボタン */
	.bn_link {
		position: relative;
	}
	.bn_link a {
		transition-property: all;
		transition-duration: 0.3s;
		transition-timing-function: ease-in-out;
		transition-delay: 0s;
	}
	.bn_link a img {
		width: 21.875vw;
		height: auto;
	}
	.bn_link a:hover {
		opacity: 1;
		filter: brightness(110%);
	}

}



/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.row01 {
		position: relative;
		width: 100%;
		padding: 12vw 6vw;
	}

	/* 見出し */
	.row01_h2 {
		text-align: center;
	}
	.row01_h2 h2 {
		position: relative;
		display: inline-block;
		font-size: 6vw;
		font-weight: 400;
		letter-spacing: 0.15em;
		line-height: 2.1;
		margin: 0 0 2.5em 0;
		text-align: left;
	}
	.row01 h2 span {
		color: #95b74b;
	}
	.row01 h2::after {
		position: absolute;
		content: "";
		display: block;
		background: #95b74b;
		width: 20vw;
		height: 0.8vw;
		left: 0px;
		bottom: -2.7vw;
	}

	/* テキスト */
	.row01 .text {
		position: relative;
		line-height: 1.8;
		letter-spacing: 0.15em;
	}
	.row01 .text p {
		margin: 0 0 2em 0;
	}
	.row01 .text p:last-of-type {
		margin: 0 0 3em 0;
	}

	/* SP店内画像 */
	.img_sp {
		margin: 0 0 3em 0;
	}

	/* リンクボタン */
	.bn_link {
		position: relative;
		text-align: center;
	}
	.bn_link a {
		transition-property: all;
		transition-duration: 0.3s;
		transition-timing-function: ease-in-out;
		transition-delay: 0s;
	}
	.bn_link a img {
		width: 60vw;
		height: auto;
	}
	.bn_link a:hover {
		opacity: 1;
		filter: brightness(110%);
	}
}




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

	ヘッドスパ

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


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.row02 {
		position: relative;
		background: url(../img/bg_half.jpg) center top / auto 100% repeat-x;
		width: 100%;
		min-height: 47.65625vw;
		padding: 6.6145vw 0 6.6145vw 12.5vw;
	}

	/* 画像 */
	.row02 .img {
		position: absolute;
		top: 0;
		right: 12.5vw;
		z-index: 0;
	}
	.row02 .img img {
		width: 44.739vw;
		height: auto;
	}
	

	/* テキスト枠 */
	.row02 .text_wrap {
		position: relative;
		background: #f9f7f3;
		width: 33.854vw;
		padding: 2.4vw 3.54vw 4.2vw;
		margin: 2.083vw 0 0 0;
	}


	/* 見出し */
	.row02 h2 {
		position: relative;
		background: url(../img/icon_pine.png) center top / 2.969vw auto no-repeat;
		font-size: 1.563vw;
		font-weight: 400;
		letter-spacing: 0.1em;
		line-height: 1.6;
		padding: 4.2vw 0 0 0;
		margin: 0 0 0.9em 0;
		text-align: center;
	}

	/* テキスト */
	.row02 .text {
		position: relative;
		font-size: 1.042vw;
		line-height: 1.8;
		letter-spacing: 0.15em;
	}

	/* リンクボタン */
	.bn_link2 {
		position: absolute;
		left: 50%;
		bottom: -2.5vw;
		margin: 0 0 0 -10.9375vw;
	}
	.bn_link2 a {
		transition-property: all;
		transition-duration: 0.3s;
		transition-timing-function: ease-in-out;
		transition-delay: 0s;
	}
	.bn_link2 a img {
		width: 21.875vw;
		height: auto;
	}
	.bn_link2 a:hover {
		opacity: 1;
		filter: brightness(110%);
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.row02 {
		position: relative;
		background: url(../img/bg_half.jpg) center top / auto 100% repeat-x;
		width: 100%;
		padding: 12vw 4vw 20vw;
	}

	/* 画像 */
	.row02 .img {
	}
	.row02 .img img {
		width: 100%;
		height: auto;
	}
	

	/* テキスト枠 */
	.row02 .text_wrap {
		position: relative;
		background: #f9f7f3;
		width: 100%;
		padding: 6vw 6vw 12vw 6vw;
	}


	/* 見出し */
	.row02 h2 {
		position: relative;
		background: url(../img/icon_pine.png) center top / 9vw auto no-repeat;
		font-size: 6vw;
		font-weight: 400;
		letter-spacing: 0.1em;
		line-height: 1.6;
		padding: 12vw 0 0 0;
		margin: 0 0 0.9em 0;
		text-align: center;
	}

	/* テキスト */
	.row02 .text {
		position: relative;
		line-height: 1.8;
		letter-spacing: 0.15em;
	}

	/* リンクボタン */
	.bn_link2 {
		position: absolute;
		left: 50%;
		bottom: -6vw;
		margin: 0 0 0 -30vw;
	}
	.bn_link2 a {
		transition-property: all;
		transition-duration: 0.3s;
		transition-timing-function: ease-in-out;
		transition-delay: 0s;
	}
	.bn_link2 a img {
		width: 60vw;
		height: auto;
	}
	.bn_link2 a:hover {
		opacity: 1;
		filter: brightness(110%);
	}
}




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

	バナー

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


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.row03 {
		position: relative;
		background: url(../img/bg_half2.jpg) center top / cover no-repeat;
		width: 100%;
		min-height: 700px;
		padding: 99px 0;
	}

	/* 画像 */
	.row03 a {
		transition-property: all;
		transition-duration: 0.3s;
		transition-timing-function: ease-in-out;
		transition-delay: 0s;
	}
	.row03 a:hover {
		opacity: 1;
		filter: brightness(110%);
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.row03 {
		position: relative;
		background: url(../img/bg_half2.jpg) center top / cover no-repeat;
		width: 100%;
		padding: 12vw 8vw;
	}

	/* 画像 */
	.row03 a {
		transition-property: all;
		transition-duration: 0.3s;
		transition-timing-function: ease-in-out;
		transition-delay: 0s;
	}
	.row03 a:hover {
		opacity: 1;
		filter: brightness(110%);
	}
}




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

	News

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


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.row04 {
		position: relative;
		width: 100%;
		padding: 99px 0;
	}

	/* 見出し */
	.title_news {
		position: relative;
		background: url(../img/icon_pine.png) center top / 57px auto no-repeat;
		padding: 88px 0 0 0;
		margin: 0 0 40px 0;
		text-align: center;
	}
	.title_news img {
		width: 132px;
		height: auto;
	}



	/* ブログ
	----------------------------------------------- */
	.post_wrap {
		max-height: 260px;
	}
	.post_wrap dl {
		display: table;
		width: 100%;
		border-bottom: 1px solid #95b74b;
		padding: 0 0 16px 0;
		margin: 0 0 16px 0;
	}
	.post_wrap dt {
		display: table-cell;
		vertical-align: top;
		width: 11%;
		font-size: 16px;
	}
	.post_wrap dd {
		display: table-cell;
		vertical-align: top;
		width: 89%;
		font-size: 18px;
	}
	.post_wrap dd a {
		color: #3f220e;
	}


}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.row04 {
		position: relative;
		width: 100%;
		padding: 12vw 4vw;
	}

	/* 見出し */
	.title_news {
		position: relative;
		background: url(../img/icon_pine.png) center top / 9vw auto no-repeat;
		padding: 12vw 0 0 0;
		margin: 0 0 6vw 0;
		text-align: center;
	}
	.title_news img {
		width: 17vw;
		height: auto;
	}



	/* ブログ
	----------------------------------------------- */
	.post_wrap {
		max-height: 50vw;
	}
	.post_wrap dl {
		width: 100%;
		border-bottom: 1px solid #95b74b;
		padding: 0 0 3vw 0;
		margin: 0 0 3vw 0;
	}
	.post_wrap dt {
		font-size: 3.2vw;
	}
	.post_wrap dd {
		font-size: 3.5vw;
	}
	.post_wrap dd a {
		color: #3f220e;
	}
}




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

	Instagram

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


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.row05 {
		position: relative;
		background: url(../img/bg_beige2.jpg) center top / auto auto repeat;
		width: 100%;
		padding: 60px 0 105px;
	}


	/* Instaウィジェット */
	.insta_wrap iframe,
	.insta_wrap_sp iframe  {
		pointer-events: none;
	}
	.insta_wrap_sp {
		display: none;
	}


	/* リンクボタン */
	.bn_link3 {
		position: absolute;
		left: 50%;
		bottom: -148px;
		margin: 0 0 0 -205px;
		z-index: 1;
	}
	.bn_link3 a {
		transition-property: all;
		transition-duration: 0.3s;
		transition-timing-function: ease-in-out;
		transition-delay: 0s;
	}
	.bn_link3 a img {
		width: 410px;
		height: auto;
	}
	.bn_link3 a:hover {
		opacity: 1;
		filter: brightness(110%);
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.row05 {
		position: relative;
		background: url(../img/bg_beige2.jpg) center top / 250px auto repeat;
		width: 100%;
		padding: 12vw 4vw 16vw;
	}


	/* Instaウィジェット */
	.insta_wrap iframe,
	.insta_wrap_sp iframe  {
		pointer-events: none;
	}
	.insta_wrap {
		display: none;
	}


	/* リンクボタン */
	.bn_link3 {
		position: absolute;
		left: 50%;
		bottom: -22vw;
		margin: 0 0 0 -30vw;
	}
	.bn_link3 a {
		transition-property: all;
		transition-duration: 0.3s;
		transition-timing-function: ease-in-out;
		transition-delay: 0s;
	}
	.bn_link3 a img {
		width: 60vw;
		height: auto;
	}
	.bn_link3 a:hover {
		opacity: 1;
		filter: brightness(110%);
	}
}




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

	Shop VIew

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


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.row06 {
		position: relative;
		width: 100%;
		padding: 200px 0;
	}

	/* 見出し */
	.title_shopview {
		position: relative;
		background: url(../img/icon_pine.png) center top / 57px auto no-repeat;
		padding: 88px 0 0 0;
		margin: 0 0 56px 0;
		text-align: center;
	}
	.title_shopview img {
		width: 256px;
		height: auto;
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.row06 {
		position: relative;
		width: 100%;
		padding: 16vw 4vw 12vw;
	}

	/* 見出し */
	.title_shopview {
		position: relative;
		background: url(../img/icon_pine.png) center top / 9vw auto no-repeat;
		padding: 12vw 0 0 0;
		margin: 0 0 6vw 0;
		text-align: center;
	}
	.title_shopview img {
		width: 30vw;
		height: auto;
	}
}




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

	パララックス

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


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	#para_01 {
		width: 100%;
		height: 50vw;
		background: url(../img/para_01.jpg) center center / cover fixed no-repeat;
	}
	#para_02 {
		width: 100%;
		height: 50vw;
		background: url(../img/para_02.jpg) center center / cover fixed no-repeat;
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	#para_01 {
		width: 100%;
		height: 100vw;
		background: url(../img/para_01.jpg) center center / cover no-repeat;
	}
	#para_02 {
		width: 100%;
		height: 100vw;
		background: url(../img/para_02.jpg) center center / cover no-repeat;
	}
}