@charset "utf-8";
:root {
	--main_color: #ff551e;
	--brown:#503700
}


/*=======================================
mv
=======================================*/
#container #gohan_top .mv {
	max-height: 740px;
	position: relative;
	max-width: 1366px;
	margin: 0 auto;
	z-index: 20;
}
#container #gohan_top .mv::before {
	background: url(../img/top/mv.jpg) no-repeat center center;
	background-size: cover;
	background-position: center;
}

#container #gohan_top .mv #contents_title{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 5%;
	top: 39%;
	left: 49%;
	border-top: none;
}

#container #gohan_top .mv #contents_title .mv_txt{
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	text-align: justify;
	color: #fff;
	letter-spacing: 0.2em;
	line-height: 3.0;
	font-weight: 800;
}
#container #gohan_top .mv #contents_title h2{
	max-width: 184px;
	margin: 0 0 9%;
}

@media only screen and (max-width: 768px){
	#container #gohan_top .mv {
		min-height: 589px;
	}

	#container #gohan_top .mv::before {
		background: url(../img/top/mv_sp.jpg) no-repeat center center;
		background-size: cover;
		background-position: center;
	}
	#container #gohan_top .mv #contents_title{
		top: 40%;
		left: 50%;
	}
}

/*=======================================
sub_nav
=======================================*/
ul.sub_nav{
	font-size: 23px;
	}
ul.sub_nav li a{
	height: 78px;
}

ul.sub_nav li a.is-active {
	background: #E05A1E;
}

ul.sub_nav li:nth-child(2) {
	border-right: 1px solid #fff;
	border-left: 1px solid #fff;
	}
	ul.sub_nav li:nth-child(3) {
		border-right: none;
		border-left: none;
		}

		ul.sub_nav li .dropdown__lists {
			top: 78px;
	}
	@media only screen and (max-width: 768px){
		ul.sub_nav li:not(.sub_top_btn) a{
			color: var(--brown);
			background: none;
		}
		ul.sub_nav li a.is-active {
			background: initial;
		}
		ul.sub_nav li:nth-child(2) {
			border-right: none;
			border-left: none;
			}
			ul.sub_nav li a {
				height: 64px;
		}
	}

/*=======================================
sp_txt
=======================================*/
		@media only screen and (max-width: 768px){
			#container #gohan_top .sp_txt{
				display: block;
				background: url(../img/top/img06_sp.jpg) no-repeat center center;
				background-size: cover;
				background-position: center;
				min-height: 520px;
			}

			#container #gohan_top .sp_txt .txt{
				font-size: 18px;
				color: var(--brown);
				line-height: 2;
				font-weight: 700;
				text-align: center;
				padding: 57px 0 73px;
			}
		}

/*=======================================
about
=======================================*/

		#container #gohan_top #about_sec .about_bg01{
			background: url(../img/top/img01.jpg) no-repeat center center;
			background-size: cover;
		position: relative;
		height: 62.59vw;
		max-height: 855px;
		min-height: 625px;
		}
		#container #gohan_top #about_sec .about_bg02{
			background: url(../img/top/img02.jpg) no-repeat center center;
			background-size: cover;
		position: relative;
		height: 91.59vw;
		max-height: 855px;
		min-height: 750px;
		}
		#container #gohan_top #about_sec .about_bg03{
			background: url(../img/top/img03.jpg) no-repeat center center;
			background-size: cover;
		position: relative;
		height: 107.59vw;
		max-height: 855px;
		min-height: 625px;
		}






		#container #gohan_top #about_sec .about_bg03 .border {
			content: '';
			position: absolute;
			bottom: calc(12.88vw + 30px);
			right: 0;
			width: 12.88vw;
			height: 1px;
			background-color: transparent;
		}
		#container #gohan_top #about_sec .about_bg03 .border .circle {
			position: absolute;
			width: 12.88vw;
			right: 10.9vw;
			bottom: 30px;
			display: block;
			z-index: 15;
		}

		@media screen and (min-width: 1366px) {
			#container #gohan_top #about_sec .about_bg03 .border .circle.is-show {
				right: calc((100vw - 1366px) / 2 + 5.5vw);
			}
			#container #gohan_top #about_sec .about_bg03 .border .circle {
				width: 176px;
				right: 5.6vw;
			}
			#container #gohan_top #about_sec .about_bg03 .border {
				width: 176px;
				bottom: calc(176px + 30px);
			}
		}

		@media screen and (max-width: 768px) {
			#container #gohan_top #about_sec .about_bg03 .border .circle {
				width: 100px;
				right: 6.65vw;
			}
			#container #gohan_top #about_sec .about_bg03 .border {
				width: 100px;
				bottom: 200px;
			}
			
		}









		#container #gohan_top #about_sec .item01{
			position: absolute;
			top: 46%;
			left: 37%;
			transform: translate(-50%, -50%);
		}
		#container #gohan_top #about_sec .item02{
			position: absolute;
			top: 53%;
			left: 66%;
			transform: translate(-50%, -50%);

		}
		#container #gohan_top #about_sec .item03{
			position: absolute;
			top: 50%;
			left: 43%;
			transform: translate(-50%, -50%);

		}
		#container #gohan_top #about_sec h3{
			font-size: 93px;
			font-weight: 700;
			letter-spacing: 0.05em;
			color: var(--main_color);
			margin: 0 0 29px;
			width: max-content;
		}
		#container #gohan_top #about_sec h3 span{
			font-size: 41px;
			font-weight: 800;
			padding-left: 0.5em;
		}
		#container #gohan_top #about_sec p.txt{
			color: var(--brown);
			font-size: 25px;
			font-weight: 600;
			letter-spacing: 0.08em;
			line-height: 1.77;
			margin-bottom: 60px;
			display: inline-block;

		}
		#container #gohan_top #about_sec .item01 ul.bunner_box,
		#container #gohan_top #about_sec .item03 ul.bunner_box{
			max-width: 577px; 
		}
		#container #gohan_top #about_sec .item02 ul.bunner_box{
			max-width: 604px; 
		}
		#container #gohan_top #about_sec ul.bunner_box li{
			position: relative;
			transition: opacity .3s ease;
			margin-bottom: 11px;
		}

		#container #gohan_top #about_sec ul.bunner_box li a{
			position:absolute;
			top:0;
			left:0;
			height:100%;
			width:100%;
	}
	#container #gohan_top #about_sec ul.bunner_box li:hover {
		opacity: 0.6;
	}
	#container #gohan_top #about_sec .item03 .right{
		width: 176px;
	}

	#container #gohan_top #about_sec .item03 .right img{
		width: 183px;
		height: 183px;
	}


	@media only screen and (max-width: 1000px){
		#container #gohan_top #about_sec .item01{
			left: 42%;
		}
		#container #gohan_top #about_sec .item02{
			left: 57%;
			top: 51%;
		}
		#container #gohan_top #about_sec .item03{
			left: 50%;
		}
	}

	@media only screen and (max-width: 768px){
					#container #gohan_top #about_sec .about_bg01{
						background: url(../img/top/img01_sp.jpg) no-repeat;
						background-size: cover;
						background-position: bottom center;
						min-height: 655px;
		}


		#container #gohan_top #about_sec .about_bg02{
			background: url(../img/top/img02_sp.jpg) no-repeat;
			background-size: cover;
			background-position: bottom center;
			min-height: 875px;

		}
		#container #gohan_top #about_sec .about_bg03{
			background: url(../img/top/img03_sp.jpg) no-repeat;
			background-size: cover;
			background-position: bottom center;
			min-height: 685px;
		}
		
		#container #gohan_top #about_sec .item01{
			top: 35%;
			left: 50%;
		}
		#container #gohan_top #about_sec .item02{
			top: 35%;
			left: 50%;
		}
		#container #gohan_top #about_sec .item03{
			top: 37%;
			left: 50%;
		}
		#container #gohan_top #about_sec h3{
			font-size: 40px;
			margin: 0 0 16.54px;
		} 
		#container #gohan_top #about_sec h3 span{
			font-size: 20px;
			padding-left: 7px;
		}
		#container #gohan_top #about_sec p.txt{
			font-size: 14px;
			margin-bottom: 23px;
			letter-spacing: 0.05em;
		}

		#container #gohan_top #about_sec .item01 ul.bunner_box,
		#container #gohan_top #about_sec .item03 ul.bunner_box{
			width: 338px; 
		}
		#container #gohan_top #about_sec .item02 ul.bunner_box{
			width: 338px; 
		}
		#container #gohan_top #about_sec ul.bunner_box li{
			position: relative;
			transition: opacity .3s ease;
			margin-bottom: 11px;
		}

		#container #gohan_top #about_sec ul.bunner_box li a{
			position:absolute;
			top:0;
			left:0;
			height:100%;
			width:100%;
	}
	#container #gohan_top #about_sec ul.bunner_box li:hover {
		opacity: 0.6;
	}
	#container #gohan_top #about_sec .item03 .right{
		width: 176px;
	}

	#container #gohan_top #about_sec .item03 .right img{
		width: 183px;
		height: 183px;
	}
	}


/*=======================================
pickup
=======================================*/
		#pickup h3{
			margin-top: 106px;
		}
@media only screen and (max-width: 768px){
	#pickup h3{
		margin-top: 35px;
	}
}


.sub_nav_sticky {
	max-width: 1366px;
	margin: 0 auto;
}



/*=======================================
column
=======================================*/

#container #gohan_top .column_cont{
	padding: 180px 0 100px;
    font-family: "Noto Serif JP", serif;
}
#container #gohan_top .column_mainttl{
	font-weight: 700;
    color: #503700;
	text-align: center;
	position: relative;
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	margin: 0 auto 80px;
	padding: 10px 0;
}
#container #gohan_top .column_mainttl::before,
#container #gohan_top .column_mainttl::after{
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	margin: auto;
	width: 80px;
	height: 80px;
}
#container #gohan_top .column_mainttl::before{
	background: url(../column/img/common/mokuji_bg01.png) no-repeat center center / 100%;
	left: -85px;
}
#container #gohan_top .column_mainttl::after{
	background: url(../column/img/common/mokuji_bg01.png) no-repeat center center / 100%;
	transform: scaleX(-1);
	-webkit-transform: scaleX(-1);
	-ms-transform: scaleX(-1);
	right: -85px;
}
#container #gohan_top .column_mainttl span{
    display: block;
}
#container #gohan_top .column_mainttl .f_jp{
	font-family: "Shippori Mincho B1", serif;
	letter-spacing: -0.02em;
    font-size: 45px;
}
#container #gohan_top .column_mainttl .ttlicon{
	position: absolute;
	top: -100px;
	left: 0;
}

/* swiper初期非表示 */
#container #gohan_top .column_swiper .swiper-container{ display: none;}
#container #gohan_top .column_swiper .swiper-container.swiper-initialized{ display: block;}

/* スライダー */
#container #gohan_top .column_swiper{
    overflow: visible;
    padding: 0 73px;
}
#container #gohan_top .column_swiper .swiper-container{
    overflow: hidden;
}

#container #gohan_top .column_item{
    border-radius: 20px;
    overflow: hidden;
    background-color: #FAFAF8;
    height: 100%;
    min-height: 411px;
    /* width: 290px; */
    /* height: 411px; */
    /* aspect-ratio: 290 / 411; */
}
#container #gohan_top .column_item--soon{
    background-color: #C4C4C4;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
#container #gohan_top .column_item-link{
    display: block;
}
#container #gohan_top .column_item-img{
    width: 100%;
    border-radius: 20px 20px 0 0;
    overflow: hidden;
    aspect-ratio: 290 / 180;
}
#container #gohan_top .column_item-img img{
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	   object-fit: cover;
	transition: transform 0.3s ease-in-out;
}
#container #gohan_top .column_item-txtarea{
    padding: 24px 30px;
}
#container #gohan_top .column_item-title{
    font-size: 20px;
    line-height: 1.45;
    letter-spacing: 0.05em;
    font-weight: 600;
    color: #503700;
}
#container #gohan_top .column_item-link:hover,
#container #gohan_top .column_item-link:focus{
	opacity: 1;
	text-decoration: none;
	color: var(--brown);
}
#container #gohan_top .column_item-link:hover .column_item-img img,
#container #gohan_top .column_item-link:focus .column_item-img img{
	transform: scale(1.1);
}
#container #gohan_top .column_item-link:hover .column_item-title,
#container #gohan_top .column_item-link:focus .column_item-title{
	color: var(--main_color);
}

/* ページャー */
#container #gohan_top .column_arwbox .swiper-button{
    width: 40px;
    height: 40px;
    margin-top: -20px;
}
#container #gohan_top .column_arwbox .swiper-button img{
    position: absolute;
    top: 0;
    left: 0;
}
#container #gohan_top .column_arwbox .swiper-button.swiper-button-next{
    transform: rotate(180deg);
	margin-left: auto;
}
#container #gohan_top .column_arwbox .swiper-button:after{
    display: none;
}
#container #gohan_top .column_arwbox .swiper-button:hover,
#container #gohan_top .column_arwbox .swiper-button:focus{
	opacity: 1;
}
#container #gohan_top .column_arwbox .swiper-button:hover .on,
#container #gohan_top .column_arwbox .swiper-button:focus .on{
	opacity: 0;
}

/* ページネーション */
#container #gohan_top .column_swiper-pagination{
    bottom: -60px;
}
#container #gohan_top .column_swiper-pagination .swiper-pagination-bullet{
    width: 10px;
    height: 10px;
    background-color: #A2A09B;
    opacity: 1;
    margin: 0 10px;
}
#container #gohan_top .column_swiper-pagination .swiper-pagination-bullet-active{
    background-color: #ff551e;
}

#container #gohan_top .column_item-soon{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px 0;
}
#container #gohan_top .column_item-soon span{
    font-size: 20px;
    font-weight: 600;
    letter-spacing: 0.05em;
    color: #fff;
}


@media only screen and (max-width: 768px){
    #container #gohan_top .column_cont{
        padding: 100px 0 130px;
    }
    #container #gohan_top .column_mainttl{
        margin-bottom: 32px;
    }
    #container #gohan_top .column_mainttl::before,
    #container #gohan_top .column_mainttl::after{
        width: 60px;
        height: 60px;
    }
    #container #gohan_top .column_mainttl::before{
        left: -50px;
    }
    #container #gohan_top .column_mainttl::after{
        right: -50px;
    }
    #container #gohan_top .column_mainttl .f_jp{
        font-size: 26px;
    }
    #container #gohan_top .column_mainttl .ttlicon{
		width: 242px;
		top: -60px;
	}

    /* スライダー */
    #container #gohan_top .column_swiper{
        width: 100vw;
        margin: 0 calc(50% - 50vw);
        padding: 0;
    }
    
    #container #gohan_top .column_item{
        min-height: 400px;
    }
    #container #gohan_top .column_item-img{
        aspect-ratio: 260 / 180;
    }
    #container #gohan_top .column_item-txtarea{
        padding: 16px 30px;
    }
    #container #gohan_top .column_item-title{
        font-size: 16px;
    }
    /* ページャー */
    #container #gohan_top .column_arwbox .swiper-button{
        width: 36px;
        height: 36px;
        top: auto;
        margin-top: 0;
        bottom: -65px;
        z-index: 11;
    }
    #container #gohan_top .column_arwbox .swiper-button.swiper-button-next{
        right: 25px;
    }
    #container #gohan_top .column_arwbox .swiper-button.swiper-button-prev{
        left: 25px;
    }
    /* ページネーション */
    #container #gohan_top .column_swiper-pagination .swiper-pagination-bullet{
        width: 8px;
        height: 8px;
        margin: 0 8px;
    }
    #container #gohan_top .column_item-soon{
        gap: 12px 0;
    }

}