@charset "utf-8";

@media (min-width: 1200px){
	.container {
	width: 1080px;
	margin: 0 auto;
	}
}

/*main_img*/
.main_img { 
	padding: 90px 0 0 0;
}
.carousel-indicators {
	display: none;
}
@media (max-width: 992px) {
	.main_img { 
		padding: 60px 0 0 0;
	}
}

/*all*/


.m_non {
}
.m02_non {
	display: block;
}
.m_on {
	display: none;
}
.s_on {
	display: none;
}
.s_non {
	display: block;
}

@media (max-width: 992px) {
	.m_non {
		display: none;
	}
	.m_on {
		display: block;
	}
}

@media (max-width: 860px) {
	.m02_non {
		display: none;
	}
}


@media screen and (max-width: 767px) {
	.s_on {
		display: block;
	}
	.s_non {
		display: none;
	}
}
/*all*/
img{
	vertical-align:top;
}

.bg_wht01 {
	background-color: #fff;
	padding: 100px 0;
}
.bg_wht01_02 {
	background-color: #fff;
	padding: 100px 0 0;
}
.bg_gry01 {
	background-color: #eeeee6;
	padding: 100px 0;
}

.bg_next {
	position: relative;
	width: 100%;
	height: 130px;
	background-color: #fff;
	text-align: center;
}
.index_next_line {
	position: absolute;
	top: 50px;
	left: 50%;
    margin-right: -50%; 
}

.onlineshop_btn {
    cursor: pointer;
    position: fixed;
    right: 50px;
    bottom: 50px;
    display: flex;
    width: 114px;
    height: 135px;
    border-radius: 50%;
    transition: .3s;
	z-index: 999;

  /*   デフォルトは非表示 */
    opacity: 0;
}

@media screen and (max-width: 860px) {
	.bg_next {
		position: relative;
		width: 100%;
		height: 100px;
		background-color: #fff;
		text-align: center;
	}
	.index_next_line {
		position: absolute;
		bottom: -30px;
		left: 50%;
		margin-right: -50%; 
	}
.index_next_line img {
	height: 70px;
	width:4px;
}

.onlineshop_btn {
    right: 20px;
    bottom: 20px;
    width: 70px;
    height: 83px;
}
}

/*index_nav*/
.index_nav {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.index_nav_in {
	width: 24.8%;
	margin: 0 0.1%;
}

@media screen and (max-width: 767px) {
	.index_nav {
		width: 98%;
		margin: 0 auto;
	}
	.index_nav_in {
		width: 49%;
		margin: 0.5%;
	}
}

/*index_about_olioli*/
.index_about_olioli {
	width: 100%;
	height: 1050px;
	padding: 100px 0;
    background: url(img/index/index_about_olioli_bg.jpg) no-repeat;
	background-position: bottom;
	background-size:100% auto;
}
.index_about_olioli_box {
	display: flex;
	flex-wrap: wrap;
}
.index_about_olioli_box_L01 {
  width: 70%;
}
.index_about_olioli_box_R01 {
  width: 28%;
  writing-mode: vertical-rl;
  text-orientation: upright;
}
.index_about_olioli_box_R01 p {

  }
.index_about_olioli_copy {
	display: none;
}

@media screen and (max-width: 992px) {
	.index_about_olioli {
		padding: 100px 0 300px;
	}
	.index_about_olioli_box {
	}
	.index_about_olioli_box_L01 {
	  width: 100%;
	}
	.index_about_olioli_box_R01 {
	  width: 100%;
	  display: none;
	}
	.index_about_olioli_ttl {
		text-align: center;
		margin: 0 0 60px 0;
	}
	.index_about_olioli_copy {
		margin: 0 0 40px 0;
		display: block;
		text-align: center;
	}
}

@media screen and (max-width: 767px) {
	.index_about_olioli {
		width: 100%;
		height: auto;
		padding: 100px 0 200px;
		background: url(img/index/index_about_olioli_bg.jpg) no-repeat;
		background-position: bottom;
		background-size:100% auto;
	}
	.index_about_olioli_box {
	}
	.index_about_olioli_box_L01 {
	  width: 100%;
	}
	.index_about_olioli_box_R01 {
	  width: 100%;
	  display: none;

	}
}

/*index_products*/
.products {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.products_in {
	width: 29%;
	margin: 0 2%;
	text-align: center;
	display: flex;
	flex-direction: column;
}

.swiper-wrapper a:hover {
	text-decoration: none;
}

.swiper-wrapper {
	text-align: center;
}

.slide-content img:hover {
	opacity: 1  ;
}
.shop_more {
	margin-top: auto;
}


/*index_insta*/
.insta_more {
	margin: 30px 0 0 0;
	text-align: right;
}
.insta_more a img:hover {
	opacity: 1  ;
}

/*feature*/
.index_feature {
	width: 100%;
	padding: 100px 0;
    background: url(img/index/index_feature_bg.jpg) no-repeat;
	background-position: bottom;
}
.index_feature_img {
	display: none;
}

@media screen and (max-width: 992px) {
	.index_feature {
		padding: 100px 0 10px;
		background: none;
	}
	.index_feature_img {
		margin: 0;
		display: block;
		text-align: right;
	}
}


/*index_material*/
.index_material {
	width: 100%;
	padding: 190px 0;
	background-position: bottom;
	background-size:100% auto;
}


/*index_recipe*/
.index_recipe {
	width: 100%;
	background-position: center;
	background-size:100% auto;
}
.index_recipe_box {
	padding: 190px 50px;
	background:rgba(255,255,255,0.7);
}


/*index_artisan*/
.index_artisan {
	width: 100%;
	padding: 190px 0;
	background-size:100% auto;
}


/*index_package*/
.index_package {
	width: 100%;
	padding: 190px 0;
    background: url(img/index/index_package_bg01.jpg) no-repeat;
	background-position: center;
	background-size:100% auto;
}

@media screen and (max-width: 1300px) {
	.index_material,.index_recipe_box,.index_artisan,.index_package {
		padding: 100px 0;
	}
}

@media screen and (max-width: 1030px) {
	.index_material,.index_recipe_box,.index_artisan,.index_package {
		padding: 60px 0;
	}
	.index_recipe_box {
		padding: 60px 50px;
	}
}
@media screen and (max-width: 860px) {
	.index_material,.index_recipe_box,.index_artisan,.index_package {
		padding: 60px 0 0;
	}
	.index_package {
		background: none;

	}
	.index_recipe_box {
		padding: 60px 0 0;
		background:none;
	}
}


/*index_staff*/
.index_staff {
	width: 90%;
	margin: 0 auto;
	padding: 0 0 100px 0;
}

.index_staff_box {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}

.index_staff_box_L {
	width: 30%;
	text-align: center;

}

.index_staff_box_R {
	width: 70%;
	padding: 0 0 0 50px; 
	text-align: left;
}
.index_staff_bottom_line{
	border-bottom: 1px solid #3e3a39;
}

@media screen and (max-width: 767px) {
	.index_staff {
		width: 100%;
	}
	.index_staff_box_L {
		width: 100%;
		margin: 0 0 50px 0;
		text-align: center;
	}

	.index_staff_box_L img {
		width: 70%;
	}
	
	.index_staff_box_R {
		width: 100%;
		padding: 0;  
	}
	.index_staff_name {
		text-align: center;
	}
}


/*index_collaboration*/
.index_collaboration {
	width: 90%;
	margin: 0 auto;
	background-color: #eeeee6;
}

.index_collaboration_box {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}

.index_collaboration_box_L {
	width: 55%;
	padding: 50px;

}

.index_collaboration_box_R {
	width: 45%; 
}

.index_collaboration a img:hover {
	opacity: 1  ;
}

@media screen and (max-width: 767px) {
	.index_collaboration {
		width: 100%;
	}
	.index_collaboration_box_L {
		width: 100%;
		padding: 50px 20px;
	
	}
	
	.index_collaboration_box_R {
		width: 100%; 
	}
}


/*index_yuzu*/
.index_yuzu_box {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	font-family: "Noto Serif JP", serif;
}

.index_yuzu_box_L01 {
	width: 35%;

}

.index_yuzu_box_R02 {
	width: 65%;
	padding: 0 0 0 50px;  
}

.index_yuzu_box_L01_02 {
	width: 65%;
	padding: 0 50px 0 0; 
	order: 1;
}

.index_yuzu_box_R02_02 {
	width: 35%; 
	order: 2;
}

@media screen and (max-width: 1080px) {
	.index_yuzu_box {
		margin: 0 0 50px 0;
	}
	.index_yuzu_box:last-child {
		margin: 0;
	}

}

@media screen and (max-width: 767px) {
	.index_yuzu_box {
		margin: 0 0 80px 0;
	}
	
	.index_yuzu_box_L01 {
		width: 100%;
		margin: 0 0 30px 0;
	}
	.index_yuzu_box_L01 img {
		width: 60%;
	}
	
	.index_yuzu_box_R02 {
		width: 100%;
		padding: 0;  
	}
	
	.index_yuzu_box_L01_02 {
		width: 100%;
		padding: 0; 
		order: 2;
	}
	
	.index_yuzu_box_R02_02 {
		width: 100%; 
		order: 1;
		margin: 0 0 30px 0;
	}
	.index_yuzu_box_R02_02 img {
		width: 60%;
	}
	
}

/*index_about_kawane*/
.index_about_kawane_bg {
	background-color: #eeeee6;
	padding: 100px 0 0;
}

.index_about_kawane_img {
	width: 100%;
	position: relative;
}
.index_about_kawane_img02 {
	width: 100%;
}
.index_brandsite_btn_sp {
	display: none;
}
.index_brandsite_btn {
	position: absolute;
	top: 45%;
	left: 10%;
}

@media screen and (max-width: 767px) {
	.index_brandsite_btn_sp {
		padding: 0 0 60px 0;
		display: block;
	}
	.index_brandsite_btn_sp img {
		width: 240px;
	}
}

/*footer*/
footer {
	padding: 80px 0;
}
#google-maps {
	position: relative;
	padding-bottom: 400px; 
	height: 0;
	overflow: hidden;
}
#google-maps iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100% !important;
	height: 100%  !important;
}
.footer_in {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}
.footer_logo {
	width: 10%;

}
.footer_add {
	width: 65%;
	padding: 0 40px;
	display: flex;
	flex-wrap: wrap;
}
.footer_add_L {
	width: 22%;
}
.footer_add_R {
	width: 78%;
}
.footer_link {
	width: 25%;
}

.copy {
	width: 100%;
	padding: 30px;
	background-color: #231815;
	color: #fff;
	font-size: 1.2rem;
	text-align: center;
}
.copy p {
	font-size: 1.4rem;
}

@media screen and (max-width: 767px) {
	.footer_in {
		text-align: center;
	}
	.footer_logo {
		width: 100%;
	
	}
	.footer_logo img {
		width: 40%;
		margin: 0 0 30px 0;
	}
	.footer_add {
		width: 100%;
		padding: 0;
		display: flex;
		flex-wrap: wrap;
	}
	.footer_add_L {
		width: 100%;
	}
	.footer_add_R {
		width: 100%;
	}
	.footer_link {
		width: 100%;
		margin: 20px 0 0 0;
	}
	.copy p {
		font-size: 1.2rem;
	}
}


/*cont_box*/
.cont_box {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
}

.cont_box_L01 {
	width: 60%;	
}
.cont_box_R01 {
	width: 40%;
	display: none;
}

.cont_box_L02 {
	width: 40%;
	display: none;
	order: 1;
}
.cont_box_R02 {
	width: 60%;
	order: 2;	
}

@media screen and (max-width: 860px) {
	.cont_box_L01 {
		width: 100%;
		margin: 0 0 30px 0;
	}
	.cont_box_R01 {
		width: 100%;
		display: block;
	}
	.cont_box_L02 {
		width: 100%;
		order: 2;
		display: block;
	}
	.cont_box_R02 {
		width: 100%;
		margin: 0 0 30px 0;
		order: 1;
	}
}

rt {
	color: #ffffff;
	font-weight: 900;
	font-size: 3.0rem;
}


/*font*/
.ttl_box {
	width: 100%;
	margin: 0 0 60px 0;
	text-align: center;
}
.ttl_box02 {
	width: 100%;
	margin: 0 0 30px 0;
	text-align: center;
}
.ttl_box h2 {
}
.ttl_01 {
	margin: 0 0 30px 0;
	font-size: 2.6rem;
	font-family: "Noto Serif JP", serif;
	letter-spacing: 5px;
}
.ttl_02 {
	margin: 0 0 30px 0;
	font-size: 2.0rem;
	font-family: "Noto Serif JP", serif;
	letter-spacing: 5px;
}
.ttl_02_02 {
	margin: 0 0 10px 0;
	font-size: 2.0rem;
	font-family: "Noto Serif JP", serif;
	letter-spacing: 5px;
}

.copy_01 {
	font-size: 3.0rem;
	font-family: "Hannari", serif;
}

.copy_02 {
	font-size: 2rem;
	font-family: "Noto Serif JP", serif;
}

.text_box {
	width: 100%;
	text-align: center;
}
.f_01 {
	font-size: 1.7rem;
	font-family: "Noto Serif JP", serif;
	letter-spacing:4.5px;
}

.f_02 {
	font-size: 1.5rem;
	font-family: "Noto Serif JP", serif;
	letter-spacing: 2.4px;
}
.f_02_02 {
	font-size: 1.5rem;
	font-family: "Noto Serif JP", serif;
}
.f_02_03 {
	font-size: 1.5rem;
	font-family: "Noto Serif JP", serif;
	letter-spacing: 2.4px;
}

.f_03{
	font-size: 1.2rem;
	font-family: "Noto Serif JP", serif;
	letter-spacing: 3.6px;
}

.f_04{
	font-size: 2rem;
	font-family: "Noto Serif JP", serif;
	letter-spacing: 4.5px;
}
.f_05{
	font-size: 1.2rem;
	letter-spacing: 4.5px;
}

.f_wht {
	color: #fff;
}
.f_wht02 {
	color: #fff;
}


.f_ylw {
	color: #e9dc07;
}
.btn01 {
	width: 100%;
	margin: 30px 0 0 0;
	text-align: center;
}
.tate_read {
	writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	margin: 0 auto -120px;
	z-index: 30;
}
.dots {
	background-image: radial-gradient(circle at center, #e9dc07, transparent 30%); /* 点の色とサイズ調整 */
	background-position: top right; /* 点の位置 */
	background-repeat: repeat-x; /* 横方向に繰り返し */
	background-size: 1.1em 0.3em; /* 点の間隔とサイズ調整 */
	padding-top: 0.2em; /* 縦方向の位置調整 */
}


@media screen and (max-width: 992px) {
	.copy_01 {
		font-size: 2.2rem;
	}
	.text_box_pd {
			padding-right: 20px;
			padding-left: 20px;
		}
	.text_box {
		text-align: left;
	}
	.f_01 {
		font-size: 1.5rem;
	}
}

@media screen and (max-width: 992px) {
	.copy_01 {
		font-size: 2.2rem;
	}
	.text_box {
		text-align: left;
	}
	.f_01 {
		font-size: 1.5rem;
	}
}

@media screen and (max-width: 860px) {
	.f_wht02 {
		color: #000;
	}
}

@media screen and (max-width: 767px) {
	.ttl_01 {
		font-size: 2.2rem;
	}
	.copy_02 {
		font-size: 1.6rem;
	}
	.f_03{
		font-size: 1.4rem;
	}
	.tate_read {
		-webkit-writing-mode:horizontal-tb;
		-ms-writing-mode:lr-tb;
		writing-mode:horizontal-tb;
		margin: 0;
		padding: 0 20px 50px;
		z-index: 30;
	}
	.dots {
		padding-top: 0.4em; /* 縦方向の位置調整 */
	}
}