@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;
	}

	/* ロゴ
	----------------------------------------------- */
	.h_logo {
		position: relative
	}
	.h_logo a{
		position: absolute;
		top: -71vw;
		width: 39vw;
		left: 50%;
		margin-left: -19vw;
	}
	.h_logo a img{
		width: 100%;
	}
}





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

	メイン画像

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


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.main_top {
		position: relative;
		width: 85.7%;
		margin: 0 auto;
	}
	.main_top_in {
		position: relative;
	}
}


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





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

	ここからコンテンツ内容

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

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

	共通

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


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	/* アバウトボタン */
	ul.about_button{
		text-align: center;
		margin-top: 27px;
	}
	ul.about_button a{
		color: #282824;
		background: url(../img/about_button.jpg)no-repeat center top / 100% auto;
		width: 387px;
		height: 186px;
		display: inline-block;
		padding: 92px 0 0;
		font-size: 25px;
	}
	 /* 画像ボタン */
	ul.pc_img_button{
		text-align: center;
		padding-top: 58px;
		font-size:0;
	}
	ul.pc_img_button li{
		display: inline-block;
		margin: 0 23px;
	}
	ul.sp_img_button li{
		display: inline-block;
		width: 50px;
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
		/* アバウトボタン */
		ul.about_button{
			text-align: center;
			margin-top: 2vw;
		}
		ul.about_button a{
			color: #282824;
			background: url(../img/about_button.jpg)no-repeat center top / 100% auto;
			width: 80vw;
			height: 38vw;
			display: inline-block;
			padding: 19.1vw 0 0;
			font-size: 5vw;
		}
		 /* 画像ボタン */
		ul.sp_img_button{
			text-align: center;
			padding-top: 12vw;
			font-size:0;
		}
		ul.sp_img_button li{
			display: inline-block;
			width: 44%;
		}
		ul.sp_img_button li:first-of-type{
			margin-right: 4vw;
		}
		ul.sp_img_button li:last-of-type{
			margin-left: 4vw;
		}
		.elementor-element.elementor-element-8d9cbf6.elementor-hidden-desktop.elementor-hidden-tablet.elementor-widget.elementor-widget-html.animated.fadeIn {
			margin: -83vw auto 43vw;
		  }
}

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

	ABOUT ORI

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


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.row_01{
		padding-top: 156px;
	}
	/* 飾りのサイズ調整 */
	.row_01 img{
		width: 519px;
	}
	/* タイトル */
	.row_01 h2{
		font-size: 51px;
	}
	/* テキスト */
	.row01_text{
		text-align: center;
		padding: 45px 0 22px;
		line-height: 2.3;
	}
	.row01_text p + * {
		margin-top: 1.5em;
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.row_01{
		padding-top: 14.6vw;
	}
	/* 飾りのサイズ調整 */
	.row_01 img{
		width: 88.7vw;
	}
	/* タイトル */
	.row_01 h2{
		font-size: 10vw;
	}
	/* テキスト */
	.row01_text{
		padding: 7vw 9vw 5vw;
	}

}





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

	ORI hair salon

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


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.row_02{
		position: relative;
		background: url(../img/bg.jpg) no-repeat center top 310px / auto auto;
		background-size: contain;
		height: 717px;
		padding-top: 158px;
	}
	.row_02::before{/* 花飾り */
		position:absolute;
		content: "";
		background: URL(../img/bg_flowe_01.jpg)no-repeat center left / 100% auto;
		width: 481px;
		height: 502px;
		top: -197px;
		left: 50%;
		margin-left: -731px;
	}


	/* 画像固定設定 */
	.row02_in .f2 .elementor-image{
		position: relative;
		min-height: 516px;
	}
	.row02_in .f2 img{
		position: absolute;
		left: 50%;
		margin-left: -682px;
		width: 824px;
	} 

	.row02_in .f3 .elementor-image{
		position: relative;
		min-height: 516px;
	}
	.row02_in .f3 img{
		position: absolute;
		left: 50%;
		top: 273px;
		margin-left: -150px;
		width: 824px;
	}


	/* ２F　３F　の飾り */
	.row02_in .f2{
		position: relative;
	}
	.row02_in .f2::after{
		position: absolute;
		content: "";
		background: URL(../img/2f.png)no-repeat center left / 100% auto;
		width: 97px;
		height: 72px;
		top: 406px;
		left: 50%;
		margin-left: 25px;
	}
	.row02_in .f3{
		position: relative;
	}
	.row02_in .f3::after{
		position: absolute;
		content: "";
		background: URL(../img/3f.png)no-repeat center left / 100% auto;
		width: 97px;
		height: 72px;
		top: 301px;
		left: 50%;
		margin-left: 163px;
	}

	/* タイトル */
	.row02_text_box h3{
		font-size: 44px;
		font-weight: 500;
	}
	.row02_text_box h3 span{
		position: relative;
		font-size: 80px;
		font-weight: 500;
		margin-right: 50px;
	}
	.row02_text_box h3 span::after{
		position: absolute;
		content: "";
		background: URL(../img/scissors_icon.png)no-repeat center left / 100% auto;
		width: 85px;
		height: 42px;
		top: 44px;
		left: 245px;
		transform: rotateZ(-90deg);
	}
	/* テキスト */
	.row02_text_box-text{
		padding: 33px 44px 40px 0;
		line-height: 2.1;
		background: #fff;
		margin-top: 37px;
		text-align: justify;
		text-justify: inter-ideograph;
	}
	.row02_text_box-text p + * {
		margin-top: 1.5em;
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.row_02{
		position: relative;
		background: url(../img/sp_bg.jpg) no-repeat center top 50vw / contain;
		padding: 34.2vw 2vw 0;
	}
	.row_02::after{/* 花飾り */
		position: absolute;
		content: "";
		background: URL(../img/bg_flowe_01.jpg)no-repeat center left / 100% auto;
		width: 47vw;
		height: 47vw;
		top: 0;
		left: 50%;
		margin-left: -55vw;
		z-index: -1;
	}

	/* ２F　３F　の飾り */
	.row02_in .f2{
		position: relative;
	}
	.row02_in .f2::after{
		position: absolute;
		content: "";
		background: URL(../img/2f.png)no-repeat center left / 100% auto;
		width: 15vw;
		height: 12vw;
		top: 32vw;
		left: 50%;
		margin-left: 9vw;
	}
	.row02_in .f3{
		position: relative;
	}
	.row02_in .f3::after{
		position: absolute;
		content: "";
		background: URL(../img/3f.png)no-repeat center left / 100% auto;
		width: 15vw;
		height: 12vw;
		top: 22vw;
		left: 50%;
		margin-left: 30vw;
	}


	.row02_text_box{
		padding: 7vw 9vw;
	}
	/* タイトル */
	.row02_text_box h3{
		font-size: 7vw;
		font-weight: 500;
	}
	.row02_text_box h3 span{
		position: relative;
		font-size: 11vw;
		font-weight: 500;
		margin-right: 10vw;
	}
	.row02_text_box h3 span::after{
		position: absolute;
		content: "";
		background: URL(../img/scissors_icon.png)no-repeat center left / 100% auto;
		width: 15vw;
		height: 8vw;
		top: 4.3vw;
		left: 33.5vw;
		transform: rotateZ(-90deg);
	}
	/* テキスト */
	.row02_text_box-text{
		text-align: justify;
		text-justify: inter-ideograph;
		padding: 8vw 0 0;
	}
	.row02_text_box-text p + * {
		margin-top: 1.5em;
	}
}


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

	ORI CAFE

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


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.row_03{
		position: relative;
		background: url(../img/bg.jpg) no-repeat center top 310px / auto auto;
		background-size: contain;
		height: 773px;
		padding-top: 158px;
	}
	.row_03::after{/* 花飾り */
		position: absolute;
		content: "";
		background: URL(../img/bg_flowe_02.jpg)no-repeat center left / 100% auto;
		width: 504px;
		height: 463px;
		bottom: -503px;
		left: 50%;
		margin-left: 187px;
		z-index: -1;
	}
/* 画像固定設定 */
.row03_in .f1_02 .elementor-image{
	position: relative;
	min-height: 516px;
}
.row03_in .f1_02 img{
	position: absolute;
	left: 50%;
	margin-left: -682px;
	width: 824px;
} 

.row03_in .f1 .elementor-image{
	position: relative;
	min-height: 516px;
}
.row03_in .f1 img{
	position: absolute;
	top: 273px;
	left: 50%;
	margin-left: -150px;
	width: 824px;
}




	/* 1F　の飾り */
	.row03_in .f1{
		position: relative;
	}
	.row03_in .f1::after{
		position: absolute;
		content: "";
		background: URL(../img/1f.png)no-repeat center left / 100% auto;
		width: 79px;
		height: 67px;
		top: 306px;
		left: 50%;
		margin-left: 171px;
	}

	
	
	
	
	
.row03_in .f12 .elementor-image{
	position: relative;
	min-height: 516px;
}
.row03_in .f12 img{
	position: absolute;
	top: 273px;
	left: 50%;
	margin-left: -150px;
	width: 824px;
}

	.row03_in .f12{
		position: relative;
	}

	
	/* タイトル */
	.row03_text_box h2{
		font-size: 44px;
		font-weight: 500;
	}
	.row03_text_box h2 span{
		position: relative;
		font-size: 80px;
		font-weight: 500;
		margin-right: 50px;
	}	
	
	
		.row03_text_box h2 span::after{
		position: absolute;
		content: "";
		background: URL(../img/scissors_icon.png)no-repeat center left / 100% auto;
		width: 84px;
		height: 42px;
		top: 39px;
		left: 260px;
		transform: rotateZ(-90deg);
	}
	
	
	
	/* タイトル */
	.row03_text_box h3{
		font-size: 44px;
		font-weight: 500;
	}
	.row03_text_box h3 span{
		position: relative;
		font-size: 80px;
		font-weight: 500;
		margin-right: 50px;
	}
	.row03_text_box h3 span::after{
		position: absolute;
		content: "";
		background: URL(../img/scissors_icon.png)no-repeat center left / 100% auto;
		width: 84px;
		height: 42px;
		top: 39px;
		left: 247px;
		transform: rotateZ(-90deg);
	}
	/* テキスト */
	.row03_text_box-text{
		padding: 33px 44px 40px 0;
		line-height: 2.1;
		background: #fff;
		margin-top: 37px;
		text-align: justify;
		text-justify: inter-ideograph;
	}
	.row03_text_box-text p + * {
		margin-top: 1.5em;
	}
	
		/* タイトル */
	.row04_text_box h3{
		font-size: 44px;
		font-weight: 500;
	}
	.row04_text_box h3 span{
		position: relative;
		font-size: 80px;
		font-weight: 500;
		margin-right: 50px;
	}
	.row04_text_box h3 span::after{
		position: absolute;
		content: "";
		background: URL(../img/scissors_icon.png)no-repeat center left / 100% auto;
		width: 84px;
		height: 42px;
		top: 39px;
		left: 247px;
		transform: rotateZ(-90deg);
	}
	/* テキスト */
	.row04_text_box-text{
		padding: 33px 44px 40px 0;
		line-height: 2.1;
		background: #fff;
		margin-top: 37px;
		text-align: justify;
		text-justify: inter-ideograph;
	}
	.row04_text_box-text p + * {
		margin-top: 1.5em;
	}
	
	
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.row_03{
		position: relative;
		background: url(../img/sp_bg.jpg) no-repeat center top 64vw / contain;
		padding: 34.2vw 2vw 0;
	}
	.row_03::after{/* 花飾り */
		position: absolute;
		content: "";
		background: URL(../img/bg_flowe_01.jpg)no-repeat center left / 100% auto;
		width: 47vw;
		height: 47vw;
		top: 0;
		left: 50%;
		margin-left: -55vw;
		z-index: -1;
	}

	/* 1F　の飾り */
	.row03_in .f1{
		position: relative;
	}
	.row03_in .f1::after{
		position: absolute;
		content: "";
		background: URL(../img/1f.png)no-repeat center left / 90% auto;
		width: 10vw;
		height: 7vw;
		top:6vw;
		left: 25%;
		margin-left: 18vw;
	}
	
	
		/* 1F　の飾り */
	.row03_in .f12{
		position: relative;
	}
	
	

	.row03_text_box{
		padding: 7vw 9vw;
	}
	
	
		.row03_text_box h2{
		font-size: 7vw;
		font-weight: 500;
	}
	.row03_text_box h2 span{
		position: relative;
		font-size: 11vw;
		font-weight: 500;
		margin-right: 10vw;
	}
	.row03_text_box h2 span::after{
		position: absolute;
		content: "";
		background: URL(../img/scissors_icon.png)no-repeat center left / 100% auto;
		width: 15vw;
		height: 8vw;
		top: 4.3vw;
		left: 36vw;
		transform: rotateZ(-90deg);
	}
	
	
	
	/* タイトル */
	.row03_text_box h3{
		font-size: 7vw;
		font-weight: 500;
	}
	.row03_text_box h3 span{
		position: relative;
		font-size: 11vw;
		font-weight: 500;
		margin-right: 10vw;
	}
	.row03_text_box h3 span::after{
		position: absolute;
		content: "";
		background: URL(../img/scissors_icon.png)no-repeat center left / 100% auto;
		width: 15vw;
		height: 8vw;
		top: 4.3vw;
		left: 34vw;
		transform: rotateZ(-90deg);
	}
	/* テキスト */
	.row03_text_box-text{
		text-align: justify;
		text-justify: inter-ideograph;
		padding: 8vw 0 0;
	}
	.row03_text_box-text p + * {
		margin-top: 1.5em;
	}
}



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

	新着

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


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
	.row_04{
		padding-top: 161px;
	}
	.row_04 h2{
		font-size:44px;
	}

.news_box{
	background: url(../img/news_bg_left.jpg)no-repeat left top / 90px 511px, url(../img/news_bg_right.jpg)no-repeat right top / 106px 511px;
	margin-top: 21px;
}
	.row_04 .post_wrap{
		width: 708px;
		margin: 69px auto 45px;
	}
	.row_04 .post_wrap ul li{
		border-bottom: dotted 2px #9d8629;
		padding: 15px 30px 15px 30px;
	}
	/* カテゴリ */
	.row_04 .post_icon_box{
		color:#a2a294;
	}
	/* 日付 */
	.row_04 .post_date{
		color:#a2a294;
	}
	/* タイトル */
	.row_04 .post_title a{
		color: #282824;
		font-size: 19px;
		display: inline-block;
		padding-top: 7px;
		font-weight: 500;
	}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	.row_04{
		padding-top: 32vw;
	}
	.row_04 h2{
		font-size: 7vw;
	}
	.scrollbar {
		overflow: auto;
		height: 90vw !important;
	}	

	.news_box{
		position:relative;
		margin-top: 5vw;
	}
	.news_box::before{
		position: absolute;
		content: "";
		background: url(../img/news_bg_left.jpg)no-repeat center top / 100% auto;
		width: 15vw;
		height: 98vw;
		top: -68vw;
		left: 50%;
		transform: rotateZ(90deg);
		margin-left: -21vw;
	}
	.news_box::after{
		position: absolute;
		content: "";
		background: url(../img/news_bg_right.jpg)no-repeat center top / 100% auto;
		width: 18vw;
		height: 98vw;
		bottom: -63vw;
		left: 50%;
		transform: rotateZ(90deg);
		margin-left: -21vw;
	}
	.row_04 .post_wrap{
		padding: 3vw 3vw 3vw 7vw;
	}
	.row_04 .post_wrap ul li{
		border-bottom: dotted 2px #9d8629;
		padding: 3vw;
	}
	/* カテゴリ */
	.row_04 .post_icon_box{
		color:#a2a294;
	}
	/* 日付 */
	.row_04 .post_date{
		color:#818176;
	}
	/* タイトル */
	.row_04 .post_title a{
		color: #282824;
		font-size: 4.5vw;
		display: inline-block;
		font-weight: 500;
	}
}




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

	ノーマルボタン

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


/* PC設定
----------------------------------------------- */
@media (min-width: 768px) {
		ul.normal_button{
			text-align: center;
			padding-top: 111px;
			font-size:0;
		}
		ul.normal_button li{
			display: inline-block;
			font-size: 25px;
		}
		ul.normal_button li:first-of-type{
			margin-right: 63px;
		}
		ul.normal_button li:last-of-type{
			margin-left:63px;
		}
		ul.normal_button li a{
			position: relative;
			color: #282824;
			width: 383px;
			padding: 11px 0;
			display: inline-block;
			border: solid 1px #9d8629;
		}

		ul.normal_button li a::after{
			position: absolute;
			content: "";
			background: URL(../img/gold_arrow.png)no-repeat center left / 100% auto;
			width: 90px;
			height: 10px;
			top: 28.7px;
			right: 21px;
		}
}


/* SP設定
----------------------------------------------- */
@media (max-width: 767px) {
	ul.normal_button{
		text-align: center;
		padding-top: 36vw;
		font-size: 0;
	}
	ul.normal_button li{
		display: inline-block;
		font-size: 5vw;
	}
	ul.normal_button li:first-of-type{
		margin-bottom: 5vw;
	}
	ul.normal_button li a{
		position: relative;
		color: #282824;
		width: 74vw;
		padding: 3vw 0;
		display: inline-block;
		border: solid 1px #9d8629;
	}

	ul.normal_button li a::after{
		position: absolute;
		content: "";
		background: URL(../img/gold_arrow.png)no-repeat center left / 100% auto;
		width: 21vw;
		height: 3vw;
		top: 6.3vw;
		right: 3vw;
	}
}
