@charset "utf-8";

        @media screen and (max-width: 767px) {
        	.only-pc {
        		display: none;
        	}
        }

        @media print,
        screen and (min-width: 768px) {
        	.only-sp {
        		display: none;
        	}
        }

        header {
        	position: fixed;
        	top: 20px;
        	left: 20px;
        	z-index: 50;
        }

        @media screen and (max-width: 1210px) {
        	header {
        		position: absolute;
        		top: 10px;
        		left: 20px;
        	}
        }

        .lect_logo {
        	position: absolute;
        	text-align: left;
        	width: 150px;
        	z-index: 10;
        }

        @media screen and (max-width: 1210px) {
        	.lect_logo {
        		width: 100px;
        	}
        }


        .lect_logo a {
        	display: inline-block;
        	width: 100%;
        	height: 100%;
        }



        .breadcrumb {
        	position: fixed;
        	top: 0;
        	right: 20px;
        	display: flex;
        	flex-wrap: wrap;
        	list-style: none;
        	font-weight: 600;
        	color: #3C3634;
        	z-index: 60;
        }

        @media screen and (max-width: 1210px) {
        	.breadcrumb {
        		position: absolute;
        	}
        }

        .breadcrumb a {
        	color: #3C3634;
        	text-decoration: underline;
        	border-color: #3C3634;
        }

        .breadcrumb li:not(:last-of-type)::after {
        	content: "›";
        	margin: 0 0.6em;
        	/* 記号の左右の余白 */
        	color: #3C3634;
        	/* 記号の色 */
        }

        body {
        	position: relative;
        	font-family: "Noto Sans JP", sans-serif;
        	font-size: 14px;
        	font-size: clamp(14px, 1.3333333333vw, 16px);
        	/* 背景画像を縦方向にのみリピートする */
        	background-size: auto;
        	background-position: top center;
        }

        body img {
        	max-width: 100%;
        }

        a {
        	text-decoration: none;
        	transition: all 0.3s;
        	color: #000;
        }

        h1,
        h2,
        h3 {
        	margin: 0;
        	padding: 0;
        }

        p {
        	margin: 0;
        	line-height: 1.4;
        }

        html,
        body {
        	width: 100%;
        	margin: 0;
        	padding: 0;
        }

        ul {
        	list-style: none;
        	margin: 0;
        	padding: 0;
        }

        *,
        *::before,
        *::after {
        	box-sizing: border-box;
        }

        .gourmet_wrap {
        	background-color: #FFFEFA;
        	max-width: 767px;
        	margin: auto;
        	position: relative;
        	box-shadow: 0 3px 6px #00000020;
        	overflow-x: hidden;
        }

        @media screen and (max-width: 1040px) {
        	.gourmet_wrap {
        		width: 100%;
        		box-shadow: none;
        	}
        }

        .fv {
        	position: relative;
        	padding: 6% 0;
			background-image:url("../img/main-bk.jpg");
			background-repeat: no-repeat;
			background-position: top center;
			background-size: cover;
        	text-align: center;
        	overflow: hidden;
			padding-top: 140%;
        }

     

        .fv__ttl {
        	position: relative;
        	width: 100%;
        	margin: 0 auto;
        
        	z-index: 1;
        }



        .fv__mainttl {
        	
        	width:100%;
        	margin: 0 auto;
			position: absolute;
			bottom: 0%;
    left: 50%;
    transform: translateX(-50%);			
        }


        .fv__kikan {

			width: 28%;
			margin: 0 auto;
			position: absolute;
			top: 24%;
			right: 0%;
			

        }



        .fv__copy {

			width: 37%;
			margin: 0 auto;
			position: absolute;
			top: 37%;
			left: 2%;
			

        }


.grandprix{
	margin-top: 3em;
}
.grandprix_mv{
	width: 90%;
	margin: 0 auto;
}












        .con__ttl {
        	position: relative;
        	width: 54%;
        	margin: 0 auto 2%;
        	padding: 10px 0;
  
        }


.con__ttl_under{
        	position: relative;
        	width: 25%;
        	margin: 0 auto;
        	padding: 10px 0;
	margin-top: 1em;
}




        @media screen and (max-width: 767px) {
        	.con__ttl {
        		width: 65%;
        		max-width: 350px;
        	}
        }




        .con__ttl h3 {
        	font-size: 5em;
        	font-weight: 600;
        	font-style: normal;
        	letter-spacing: 6px;
        }

        @media screen and (max-width: 767px) {
        	.con__ttl h3 {
        		font-size: 2.4em;
        	}
        }



.nav-icon{
	position: relative;
}

.wasyoku,.youshoku,.sweets{
	position: absolute;
}


.wasyoku{
	width: 30%;
    left: -6%;
    bottom: -82%;
}

.youshoku{
	width: 30%;
    left: -6%;
    bottom: -82%;
}

.sweets{
	width: 17%;
    left: 0%;
    bottom: -91%;
}


@media screen and (max-width: 640px){
	.wasyoku {
    width: 30%;
    left: -6%;
    bottom: -60%;
}
	
	.sweets {
    width: 17%;
    left: 0%;
    bottom: -63%;
}
	
	.youshoku {
    width: 30%;
    left: -6%;
    bottom: -64%;
}
}

@media screen and (max-width: 575px){
	
	    .sweets {
        width: 17%;
        left: -6%;
        bottom: -47%;
    }
	
    .wasyoku {
        width: 30%;
        left: -9%;
        bottom: -44%;
    }
	
	.youshoku {
        width: 30%;
        left: -8%;
        bottom: -54%;
    }
}




        .pickup .con__ttl h3 {
        	position: relative;
        	font-size: 5em;
        	letter-spacing: 6px;
        }

        @media screen and (max-width: 767px) {
        	.pickup .con__ttl h3 {
        		font-size: 3.8em;
        		line-height: 1.2;
        	}
        }

        .pickup .con__ttl h3::before {
        	position: absolute;
        	content: "";
        	background-image: url(../img/leaf05.png);
        	background-repeat: no-repeat;
        	background-size: contain;
        	width: 200px;
        	height: 160px;
        	top: -45%;
        	right: 3%;
        	z-index: -1;
        }

        .pickup .con__ttl h3::after {
        	position: absolute;
        	content: "";
        	background-image: url(../img/leaf04.png);
        	background-repeat: no-repeat;
        	background-size: contain;
        	width: 170px;
        	height: 150px;
        	bottom: -45%;
        	left: -2%;
        	z-index: -1;
        }

        @media screen and (max-width: 767px) {
        	.pickup .con__ttl h3::before {
        		width: 150px;
        		height: 120px;
        		top: -45%;
        		right: -17%;
        	}

        	.pickup .con__ttl h3::after {
        		width: 140px;
        		height: 110px;
        		bottom: -45%;
        		left: -22%;
        	}
        }

        .notice {
        	width: 95%;
        	padding: 0 0 40px;
        	margin: auto;
        	text-align: left;
        }

        .notice p {
        	font-size: 0.9em;
        }

        .pickup {
        	position: relative;
        	padding: 15% 0;
        	overflow-x: hidden;
        }

        @media screen and (max-width: 767px) {
        	.pickup {
        		padding: 80px 0;
        	}
        }

        .pickup__list {
        	position: relative;
        	width: 95%;
        	margin: 0 auto;
        	max-width: 1300px;
        	margin-top: 80px;
        	z-index: 10;
        }

        @media screen and (max-width: 767px) {
        	.pickup__list {
        		width: 90%;
        		margin-top: 20px;
        	}
        }

        .pickup__list .slick01 {
        	display: flex;
        	justify-content: space-around;
        }

        .pickup__list .item__tenpo {
        	margin-bottom: 16px;
        	padding-bottom: 10px;
        	border-bottom: 1px solid #322A27;
        }

        @media screen and (max-width: 767px) {
        	.pickup__list .item__tenpo {
        		align-items: center;
        	}
        }

        @media screen and (max-width: 767px) {
        	.pickup__list .item__shopname p {
        		font-size: 1.4em;
        	}
        }

        .pickup .pickupitem {
        	display: flex;
        	flex-direction: column;
        	width: 30%;
        	background-color: #ffffff;
        	padding: 1em;
        }

        @media screen and (max-width: 767px) {
        	.pickup .pickupitem {
        		padding: 10px;
        	}
        }

        .pickup .pickupitem__img {
        	text-align: center;
        }

        .pickup .pickupitem__img img {
        	border-radius: 10px;
        }

        .pickup .pickupitem__txt {
        	padding: 1em 0.5em;
        	margin-top: 1.5em;
        	flex-grow: 1;
        }

        .slick-dots li.slick-active button:before {
        	color: #fff;
        	background: #fff;
        	opacity: 1;
        }

        .slick-dots li button:before {
        	opacity: 1;
        	border: 1px solid #fff;
        	border-radius: 50%;
        	background: #322A27;
        	color: #322A27;
        	width: 10px;
        	height: 10px;
        	font-size: 1px;
        }

        .slick-slider .slick-track,
        .slick-slider .slick-list {
        	margin-bottom: 4px;
        }

        .menu {
        	position: relative;
        	padding: 0;
        	overflow-x: hidden;
        	margin: 0 auto;
        }

        @media screen and (max-width: 767px) {
        	.menu {
        		background: none;
        	}
        }




.gourmetfestival-wrap{
	background-color: #FEF3D4;
	    padding-top: 5em;
}




        .menu__ttl {
        	position: relative;
        	text-align: center;
        }

        @media screen and (max-width: 767px) {
        	.menu__ttl {
        		width: 95%;
        		margin: auto;
        	}
        }

        .menu__ttl p {
        	position: relative;
        	z-index: 1;
        	font-size: 5em;
        	color: #990D2E;
        	line-height: 1;
        	font-weight: 600;
        	width: fit-content;
        	margin: auto;
        }

        @media screen and (max-width: 767px) {
        	.menu__ttl p {
        		font-size: 3em;
        	}
        }



.menu__ttl::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    width: 95%;
    height: 94%;
    background: #B80B45;
    opacity: 0.16; 
    clip-path: polygon(100% 100%, 100% 0, 0 50%);
}


.menu__ttl::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 95%;
    height: 94%;
    background: #B80B45;
    opacity: 0.16;
    clip-path: polygon(0 100%, 0 0, 100% 50%);
}


        .menu__listwrap {
        	position: relative;
        	width: 95%;
        	margin: 0 auto;
        	max-width: 1760px;
        	padding: 80px 0;
        }

        @media screen and (max-width: 767px) {
        	.menu__listwrap {
        		width: 100%;
        		padding: 60px 0;
        	}
        }



        @media screen and (max-width: 767px) {
        	.menu__listwrap::before {
        		width: 108px;
        		height: 83px;
        		top: -50px;
        		left: 20px;
        	}
        }



        @media screen and (max-width: 767px) {
        	.gourmet_wrap::before {
        		width: 100px;
        		height: 120px;
        		bottom: 0%;
        		right: 0%;
        	}
        }

        .menu__list {
        	width: 95%;
        	margin: 0 auto;
        	max-width: 1400px;
        	display: flex;
        	flex-wrap: wrap;
        	justify-content: center;
        	gap: 1em;
        }

        @media screen and (max-width: 767px) {
        	.menu__list {
        		gap: 0.5em;
        	}
        }




        .menu__list2 {
        	width: 95%;
        	margin: 0 auto;
        	max-width: 1400px;
        	display: flex;
        	flex-wrap: wrap;
        	justify-content: center;
        	gap: 1em;
        }

        @media screen and (max-width: 767px) {
        	.menu__list2 {
        		gap: 0.5em;
        	}
        }





        .menubtn {
        	width: 95%;
        	max-width: 840px;
        	margin: 0 auto;
        }

        .menubtn__list {
        	height: auto;
        }

        .menubtn__list li {
        	height: auto;
        }

        .item {
        	position: relative;
        	width: 23%;
        	min-width: 300px;
			    display: flex;
    flex-direction: column;
        }

        @media screen and (max-width: 767px) {
        	.item {
        		width: 49%;
        		min-width: auto;
        		margin: 10px 0;
        	}
        }

        @media screen and (max-width: 402px) {
        	.item {
        		width: 93%;
        		min-width: auto;
        		margin: 10px 0;
        	}
        }


        .item a {
        	position: relative;
        	display: block;
        	width: 100%;
        	height: 100%;
        	padding: 0.5em;
        	padding-bottom: 1em;
/*        	background: #fff;*/
        	border-radius: 10px;
/*        	box-shadow: 0 3px 6px #EE819530;*/
        	transition: all 0.3s;
        }

        @media screen and (max-width: 767px) {
        	.item a {
        		padding-bottom: 1.2em;
        	}
        }



.gourmetfestival-item{
	        	background: #fff;
        	box-shadow: 0 3px 6px #EE819530;	
}







        @media screen and (max-width: 767px) {
        	.item a::after {
        		width: 12%;
        		bottom: 4%;
        		right: 6%;
        	}
        }

        .item a:hover {
        	box-shadow: none;
        }

        .item p {
        	color: #322A27;
        }




.item > a {
    display: flex;
    flex-direction: column;
    flex: 1;
}










        .item__img {
        	position: relative;
        	aspect-ratio: 1 / 1;
        	overflow: hidden;
        	margin: auto;
        	align-items: center;
        }

        .item__img img {
        	border-radius: 10px;
/*        	position: absolute;*/
        	top: 50%;
        	left: 50%;
/*        	transform: translate(-50%, -50%);*/
        	width: 100%;
        	object-fit: cover;
        }

        .item__foodcourt {
        	position: absolute;
        	width: 40%;
        	min-width: 120px;
        	padding: 8px 0 8px 12px;
        	background: #3B8A00;
        	border-radius: 50px 0 0 50px;
        	top: 250px;
        	right: 0;
        	text-align: center;
        	z-index: 20;
        }

        @media screen and (max-width: 767px) {
        	.item__foodcourt {
        		width: 70%;
        		padding: 4px 0 4px 8px;
        		top: 45%;
        	}
        }

        @media screen and (max-width: 450px) {
        	.item__foodcourt {
        		top: 135px;
        	}
        }

        .item__foodcourt p {
        	color: #ffffff;
        }

        .item__txt {
        	margin-top: 8px;
    display: flex;
    flex-direction: column;
    flex: 1;	
        }

        .item__tenpo {
        	display: -webkit-box;
			margin-bottom: 10px;
     
        }

        .item__logo {
        	width: 24%;
        	max-width: 70px;
        	margin-right: 8px;
        	text-align: center;
        }

        @media screen and (max-width: 767px) {
        	.item__logo {
        		margin-right: 4px;
        		width: 30%;
        	}
        }

        .item__logo img {
        	padding: 4px;
        	box-shadow: 0 3px 6px #00000016;
        }

        .item__logo p {
        	margin-top: -3px;
        	font-size: 0.8em;
        }

        @media screen and (max-width: 767px) {
        	.item__logo p {
        		margin-top: 0;
        	}
        }

        .item__shopname {
        	width: 72%;
        }

        @media screen and (max-width: 767px) {
        	.item__shopname {
        		width: 68%;
        	}
        }

        .item__shopname p {
        	font-size: 1.1em;
        }

        @media screen and (max-width: 767px) {
        	.item__shopname p {
        		font-size: 1em;
        		line-height: 1.3;
        	}
        }

        .item__floor {
        	margin: 0;
        	padding: 0;
        	margin-top: 4px;
        	border: none;
        	text-align: center;
        }

        .item__floor p {
        	font-size: 0.8em;
        }

        .item__detail {
        	margin-top: 20px;
        	margin-bottom: 8px;
        }

        .item__detail a {
        	display: inline-block;
        	line-height: 1.4;
        }

        .item__detail a span {
        	background: linear-gradient(transparent 95%, #322A27 5%);
        }

        .item__price p {
        	text-align: right;
        	font-size: 1.5em;
        }

        .item__price p span {
        	font-size: 0.7em;
        }

        .item__price p span.tax {
        	font-size: 0.7em;
        }

        .search {
        	margin-top: 80px;
        	text-align: center;
        }

        @media screen and (max-width: 767px) {
        	.search {
        		margin-top: 40px;
        	}
        }

        .search__txt p {
        	position: relative;
        	display: inline-block;
        	font-size: 1.2em;
        	margin-bottom: 0.5em;
        }

        .search__txt p::before,
        .search__txt p::after {
        	content: "";
        	position: absolute;
        	width: 2px;
        	height: 100%;
        	background: #000000;
        	bottom: 0;
        }

        .search__txt p::before {
        	transform: rotate(-20deg);
        	left: -4%;
        }

        .search__txt p::after {
        	transform: rotate(20deg);
        	right: -4%;
        }

        .cp__btn {
        	max-width: 350px;
        	width: 70%;
        	margin: 0 auto;
        	max-width: 400px;
        	margin-top: 40px;
        }

        .cp__btn a {
        	position: relative;
        	display: block;
        	padding: 10px 0;
        	background: #ffffff;
        	border-radius: 40px;
        	color: #EE8195;
        	text-align: center;
        	font-size: 1.2em;
        	font-weight: 600;
        	box-shadow: 0 3px 6px #00000020;
        }

        .mainnotice {
        	width: 90%;
        	margin: 60px auto 120px;
        	max-width: 1100px;
        }

        .mainnotice p {
        	font-size: 0.9em;
        }

        #footer {
        	position: relative;
        	padding: 10px 0;
        	text-align: center;
        	font-size: 16px;
        	z-index: 10;
        	background-color: #ffffff;
        }

        @media all and (-ms-high-contrast: none) {
        	.line_anime {
        		height: auto;
        	}
        }

        .topbtn {
        	z-index: 999;
        }

        .topbtn {
        	display: inline-block;
        	padding-top: 0;
        	position: fixed;
        	bottom: 16px;
        	right: 15px;
        }

        .topbtn a {
        	text-decoration: none;
        	color: #fff;
        }

        .topbtn::before {
        	animation: scroll 3.5s infinite;
        	border: solid #fff;
        	border-width: 0 0 3px 3px;
        	content: "";
        	display: inline-block;
        	margin: auto;
        	position: absolute;
        	top: 0;
        	right: 0;
        	left: 0;
        	transform: rotate(135deg);
        	width: 20px;
        	height: 20px;
        }

        @keyframes scroll {
        	0% {
        		transform: rotate(135deg) translate(0, 0);
        	}

        	80% {
        		transform: rotate(135deg) translate(-20px, 20px);
        	}

        	0%,
        	80%,
        	100% {
        		opacity: 0;
        	}

        	40% {
        		opacity: 1;
        	}
        }

        .slide-in {
        	overflow: hidden;
        	display: inline-block;
        }

        .slide-in_inner {
        	display: inline-block;
        }

        /*左右のアニメーション*/

        .leftAnime {
        	opacity: 0;
        }

        .leftAnime2 {
        	opacity: 0;
        }

        .leftAnime3 {
        	opacity: 0;
        }

        .leftAnime-main {
        	opacity: 0;
        }

        .slideAnimeLeftRight {
        	animation-name: slideTextX100;
        	animation-duration: 0.8s;
        	animation-fill-mode: forwards;
        	opacity: 0;
        }

        .slideAnimeLeftRight2 {
        	animation-name: slideTextX100;
        	animation-duration: 0.8s;
        	animation-delay: 0.4s;
        	animation-fill-mode: forwards;
        	opacity: 0;
        }

        .slideAnimeLeftRight3 {
        	animation-name: slideTextX100;
        	animation-duration: 0.8s;
        	animation-delay: 0.8s;
        	animation-fill-mode: forwards;
        	opacity: 0;
        }

        .slideAnimeLeftRight-main {
        	animation-name: slideTextX100;
        	animation-duration: 1.2s;
        	animation-fill-mode: forwards;
        	opacity: 0;
        }

        @keyframes slideTextX100 {
        	from {
        		transform: translateX(-100%);
        		opacity: 0;
        	}

        	to {
        		transform: translateX(0);
        		opacity: 1;
        	}
        }

        .slideAnimeRightLeft {
        	animation-name: slideTextX-100;
        	animation-duration: 0.8s;
        	animation-delay: 0.4s;
        	animation-fill-mode: forwards;
        	opacity: 0;
        }

        .slideAnimeRightLeft2 {
        	animation-name: slideTextX-100;
        	animation-duration: 0.8s;
        	animation-delay: 0.8s;
        	animation-fill-mode: forwards;
        	opacity: 0;
        }

        .slideAnimeRightLeft3 {
        	animation-name: slideTextX-100;
        	animation-duration: 0.8s;
        	animation-delay: 1.2s;
        	animation-fill-mode: forwards;
        	opacity: 0;
        }

        .slideAnimeRightLeft-main {
        	animation-name: slideTextX-100;
        	animation-duration: 1.2s;
        	animation-fill-mode: forwards;
        	opacity: 0;
        }

        @keyframes slideTextX-100 {
        	from {
        		transform: translateX(100%);
        		opacity: 0;
        	}

        	to {
        		transform: translateX(0);
        		opacity: 1;
        	}
        }

        /*アニメーション*/

        .anime-b {
        	opacity: 0;
        	visibility: hidden;
        	transition: 2s;
        	transform: translateY(0);
        }

        .anime-b2 {
        	opacity: 0;
        	visibility: hidden;
        	transition-delay: 2s;
        	transition: 1s;
        	transform: translateY(0);
        }

        .anime-b3 {
        	opacity: 0;
        	visibility: hidden;
        	transition-delay: 1.6s;
        	transition: 1s;
        	transform: translateY(40px);
        }

        .active {
        	opacity: 1;
        	visibility: visible;
        	transform: translateY(0);
        }

        .item__shoplink {
/*	margin-top: 0.8em;*/
    font-size: 86%;
    color: #fff;
    background-color: #B80B45;
    text-align: center;
    padding: 0.5em 10px;
    border-radius: 50px;
			margin-top: auto;
		
        }



        @media screen and (max-width: 767px) {
        	.menu-wrap {
        		position: relative;
        		background-color: #FEF5F6;
        		padding-top: 6em;
        		padding-bottom: 2em;
        		background-image: none;
        	}

        	.menu-wrap::before {
        		content: "";
        		position: absolute;
        		width: 130px;
        		height: 130px;
        		background: url("../img/circle1.png") no-repeat;
        		background-size: contain;
        		left: 24%;
        		top: 0.3%;
        	}

        	.menu-bk {
        		width: 97%;
        	}
        }

        .menubtn__list {
        	display: flex;
        	justify-content: center;
        	width: 100%;
        	flex-wrap: wrap;
        	gap: 3%;
        	margin: auto;
        }

        @media screen and (max-width: 767px) {
        	.menubtn__list {
        		margin: auto;
        		justify-content: center;
        		gap: 1%;
        	}
        }

        .menubtn__list a {
    width: calc((95% - 20px) / 2);
        	margin-bottom: 10px;
        	padding: 0.3em;
			background-color: #FFFBE7;
			border: solid #826134 2px;
        }

        @media screen and (max-width: 767px) {
        	.menubtn__list a {
        		width: 46%;
        		padding:0.5em;
        	}
        }

        @media screen and (max-width: 575px) {
        	.menubtn__list a {
        		width: 49%;
        		padding:0.5em;
        	}
        }

        .menubtn__list li p {
        	text-align: center;
        	font-weight: 500;
        	font-size: 1em;
        	color: #826134;
        	letter-spacing: 0.1em;
			padding-left: 8px;
        }

        .menu1column {
        	background-color: #D5E48C;
        	padding: 20px 5px;
        	margin-bottom: 10px;
        	border-radius: 50px;
        	position: relative;
        	box-shadow: 2px 3px 2px 0px rgba(0, 0, 0, 0.15);
        }

        .menu1column p {
        	text-align: center;
        	font-weight: bold;
        	font-size: 1.2em;
        	color: #543C16;
        	letter-spacing: 0.1em;
        }

        .newshop_wrap {
        	position: relative;
        }

        .menu-box {
        	position: relative;
        	width: 100%;
        	margin: 0 auto;
background-image: repeating-linear-gradient(-45deg, #fcf4ee, #fcf4ee 20px, transparent 20px, transparent 40px);
        	padding: 2em 1em;
        	z-index: 20;
			    margin-top: 2em;
        }

        @media screen and (max-width: 767px) {
        	.menu-box {
        		margin: 0 auto 60px;
				margin-top: 2em;
        	}

        	.menubtn__list li p {
        		font-size: 1em;
        		padding: 0em 1em;
        	}
        }


        .menubtn__list li {
        	text-align: center;
			        border: solid #826134 2px;
    padding: 1.5em;
        }

/*
        .menubtn__list li img {
        	width: 70%;
        	transition: transform 0.2s ease;
        }

        .menubtn__list li img:hover {
        	transform: translateY(-5px);
        	opacity: 0.8;
        }
*/

        .hex-icon {
        	position: absolute;
        	top: 1%;
        	left: 1%;
        	width: 70px;
			z-index: 1;
        }

        @media screen and (max-width: 767px) {
        	.hex-icon {
        		width: 50px;
        		height: 60px;
        	}
        }

        .hex-icon span {
        	color: #fff;
        	text-align: center;
        	font-weight: bold;
        	line-height: 1.1;
        }

        .hex-icon .line1 {
        	font-size: 0.8em;
        	/* 一行目のサイズ、自由に調整可能 */
        }

        .hex-icon .line2 {
        	font-size: 1em;
        	/* 二行目のサイズ、自由に調整可能 */
        }

        .pickupitem__btn {
        	width: 80%;
        	margin: 20px auto 10px;
        	background-color: #322A27;
        	border-radius: 100px;
        	padding: 0.5em 1em;
        	font-size: 1em;
        	text-align: center;
        	color: #ffffff;
        	text-decoration: none;
        	display: block;
        	/* または inline-block */
        }

        .bottom-banner {
        	position: fixed;
        	left: 0;
        	right: 0;
        	bottom: 0;
        	height: 60px;
        	background: #EFB01E;
        	color: #322A27;
        	display: flex;
        	align-items: center;
        	justify-content: center;
        	transform: translateY(100%);
        	transition: transform 0.3s;
        	z-index: 900;
        	text-decoration: none;
        	font-size: 18px;
        	cursor: pointer;
        	font-family: "Noto Sans JP", sans-serif;
        	font-weight: 600;
        }

        .bottom-banner.show {
        	transform: translateY(0);
        }

        .bottom-banner span {
        	pointer-events: none;
        	/* テキスト内での誤クリック防止（ない場合もOK） */
        }

        .cp_ttl {
        	position: relative;
        	max-width: 540px;
        	width: 90%;
        	margin: auto;
        	opacity: 0;
        	transform: scale(0.8);
        	transition: opacity 0.6s ease, transform 0.6s ease;
        }

        .cp_ttl::before {
        	position: absolute;
        	content: "";
        	background-image: url(../img/cp-acc-r.png);
        	background-repeat: no-repeat;
        	background-size: contain;
        	width: 13%;
        	height: 35%;
        	top: -15%;
        	right: -9%;
        }

        @media screen and (max-width: 767px) {
        	.cp_ttl::before {
        		width: 13%;
        		height: 35%;
        		top: -15%;
        		right: -4%;
        	}
        }

        .cp_ttl::after {
        	position: absolute;
        	content: "";
        	background-image: url(../img/cp-acc-l.png);
        	background-repeat: no-repeat;
        	background-size: contain;
        	width: 10%;
        	height: 20%;
        	bottom: 3%;
        	left: -15%;
        }

        @media screen and (max-width: 767px) {
        	.cp_ttl::after {
        		width: 10%;
        		height: 20%;
        		bottom: -27%;
        		left: -7%;
        	}
        }

        .cp_ttl.is-show {
        	opacity: 1;
        	transform: scale(1);
        }


        .reaf01 {
        	position: absolute;
        	top: -5%;
        	left: 30%;
        	width: 250px;
        }

        .reaf02 {
        	position: absolute;
        	top: 20%;
        	left: 60%;
        	width: 250px;
        }

        @media screen and (max-width: 767px) {
        	.reaf01 {
        		position: absolute;
        		top: 3%;
        		left: -12%;
        		width: 220px;
        	}

        	.reaf02 {
        		position: absolute;
        		top: 20%;
        		left: 70%;
        		width: 200px;
        	}
        }

        .reaf03 {
        	position: absolute;
        	bottom: 0%;
        	left: 80%;
        	width: 190px;
        	z-index: -1;
        }

        .reaf04 {
        	position: absolute;
        	bottom: 2%;
        	left: 0%;
        	width: 200px;
        	z-index: -1;
        }

        @media screen and (max-width: 767px) {
        	.reaf03 {
        		bottom: 2%;
        		left: 70%;
        		width: 180px;
        	}

        	.reaf04 {
        		bottom: 0%;
        		left: 0%;
        		width: 160px;
        	}
        }

        .gormet-bg {
        	background-color: #815213;
			background-image: url("../img/check.png");
			background-position: center top;
			background-repeat: repeat;
			background-size: inherit;
        }

        .container {
        	aspect-ratio: 16 / 7;
        	width: 100%;
        	position: relative;
        	overflow: hidden;
        }

        .image {
        	position: absolute;
        	top: 0;
        	left: 0;
        	bottom: 0;
        	right: 0;
        	opacity: 0;
        	background-size: cover;
        	background-position: center center;
        	animation: image-switch-animation 85s infinite;
        	width: 110%;
        }

        .src1 {
        	background-image: url(../img/fv01.png);
        }

        .src2 {
        	background-image: url(../img/fv02.png);
        }

        .src3 {
        	background-image: url(../img/fv03.png);
        }

        .src4 {
        	background-image: url(../img/fv04.png);
        }

        .src5 {
        	background-image: url(../img/fv05.png);
        }

        .src6 {
        	background-image: url(../img/fv06.png);
        }

        .src7 {
        	background-image: url(../img/fv07.png);
        }

        .src8 {
        	background-image: url(../img/fv08.png);
        }

        .src9 {
        	background-image: url(../img/fv09.png);
        }

        .src10 {
        	background-image: url(../img/fv10.png);
        }

        .src11 {
        	background-image: url(../img/fv11.png);
        }

        .src12 {
        	background-image: url(../img/fv12.png);
        }

        .src13 {
        	background-image: url(../img/fv13.png);
        }

        .src14 {
        	background-image: url(../img/fv14.png);
        }

        .src15 {
        	background-image: url(../img/fv15.png);
        }

        .src16 {
        	background-image: url(../img/fv16.png);
        }

        .src17 {
        	background-image: url(../img/fv17.png);
        }

        @keyframes image-switch-animation {
        	0% {
        		opacity: 0;
        	}

        	5% {
        		opacity: 1;
        	}

        	25% {
        		opacity: 1;
        	}

        	30% {
        		opacity: 0;
        	}

        	100% {
        		opacity: 0;
        	}
        }

        .image:nth-of-type(1) {
        	animation-delay: 0s;
        }

        .image:nth-of-type(2) {
        	animation-delay: 5s;
        }

        .image:nth-of-type(3) {
        	animation-delay: 10s;
        }

        .image:nth-of-type(4) {
        	animation-delay: 15s;
        }

        .image:nth-of-type(5) {
        	animation-delay: 20s;
        }

        .image:nth-of-type(6) {
        	animation-delay: 25s;
        }

        .image:nth-of-type(7) {
        	animation-delay: 30s;
        }

        .image:nth-of-type(8) {
        	animation-delay: 35s;
        }

        .image:nth-of-type(9) {
        	animation-delay: 40s;
        }

        .image:nth-of-type(10) {
        	animation-delay: 45s;
        }

        .image:nth-of-type(11) {
        	animation-delay: 50s;
        }

        .image:nth-of-type(12) {
        	animation-delay: 55s;
        }

        .image:nth-of-type(13) {
        	animation-delay: 60s;
        }

        .image:nth-of-type(14) {
        	animation-delay: 65s;
        }

        .image:nth-of-type(15) {
        	animation-delay: 70s;
        }

        .image:nth-of-type(16) {
        	animation-delay: 75s;
        }

        .image:nth-of-type(17) {
        	animation-delay: 80s;
        }

        @media screen and (max-width: 1210px) {
        	.screen_wrap {
        		position: relative;
        		padding-top: 70px;
        		background-color: #FFEEBD;
        	}
        }

        .screen {
        	position: absolute;
        	top: 0;
        	left: 0;
        	width: 100%;
        	z-index: 40;
        }

        @media screen and (max-width: 1210px) {
        	.screen {
        		position: absolute;
        		top: 70px;
        		left: 0;
        		width: 100%;
        		z-index: 40;
        	}
        }

/*
        .left-pc-img {
        	position: fixed;
				top: -9%;
					left: 0%;
					width: 34vw;
        }

        .right-pc-img {
        	position: fixed;
        	bottom: -10%;
        	right: 0%;
        	width: 34vw;
        }
*/


        .left-pc-img2 {
		position: fixed;
			bottom: 3%;
			left: 5%;
			width: 200px;
        }

        .right-pc-img2 {
			position: fixed;
			top: 10%;
			right: 1%;
			width: 22%;
			
			
        }

@media screen and (min-height:100vh){
	.left-pc-img2{
		width: 10%;
	}
}




.fixed-lines {
    position: fixed;
    right: 0;
    bottom: 0;
    width: 800px;
    height: 800px;
    pointer-events: none;
    z-index: 0;
}

.fixed-lines span {
    position: absolute;
    width: 182%;
    height: 2px;
    background: #78B7AD;
    transform-origin: center;
}

/* ＼ 1本目 */
.fixed-lines span:nth-child(1) {
    top: 49%;
    left: 39%;
    transform: translate(-13%, -50%) rotate(-45deg);
}

/* ＼ 2本目 */
.fixed-lines span:nth-child(2) {
    top: 49%;
    left: 39%;
    transform: translate(-13%, -50%) rotate(-45deg) translateY(12px);
}

/* ／ 1本目 */
.fixed-lines span:nth-child(3) {
    top: 49%;
    left: 39%;
    transform: translate(-35%, -50%) rotate(45deg);
}

/* ／ 2本目 */
.fixed-lines span:nth-child(4) {
    top: 49%;
    left: 39%;
    transform: translate(-35%, -50%) rotate(45deg) translateY(12px);
}




.fixed-lines2 {
    position: fixed;
    left: 0;
    top: 0;

    width: 800px;
    height: 800px;
    pointer-events: none;
    z-index: 0;
}

.fixed-lines2 span {
    position: absolute;
    width: 182%;
    height: 2px;
    background: #78B7AD;
    transform-origin: center;
}

/* ／ 1本目 */
.fixed-lines2 span:nth-child(1) {
top: 49%;
    left: -36%;
    transform: translate(-13%, -50%) rotate(45deg);
}

/* ／ 2本目 */
.fixed-lines2 span:nth-child(2) {
top: 49%;
    left: -36%;
    transform: translate(-13%, -50%) rotate(45deg) translateY(12px);
}

/* ＼ 1本目 */
.fixed-lines2 span:nth-child(3) {
top: -10%;
    left: 35%;
    transform: translate(-35%, -50%) rotate(-45deg);
}

/* ＼ 2本目 */
.fixed-lines2 span:nth-child(4) {
top: -10%;
    left: 35%;
    transform: translate(-35%, -50%) rotate(-45deg) translateY(12px);
}









        @media screen and (max-width: 1040px) {
/*
        	.left-pc-img {
        		display: none;
        	}

        	.right-pc-img {
        		display: none;
        	}
			
*/
        	.left-pc-img2 {
        		display: none;
        	}

        	.right-pc-img2 {
        		display: none;
        	}			
			
        }

        .search__btn {
        	position: relative;
        	text-align: center;
        	font-weight: 800;
        	line-height: 1.2;
        	max-width: 450px;
        	width: 95%;
        	height: 60px;
        	margin: 0 auto;
        	border-radius: 100px;
        	background-color: #ffffff;
        	border: #83166A solid 2px;
        	box-shadow: 0 3px 6px #00000020;
        }

        .search__btn:hover {
        	opacity: 0.8;
        }

        .search__btn a {
        	position: relative;
        	display: inline-block;
        	width: 100%;
        	height: 100%;
        	text-decoration: none;
        	text-align: center;
        	border-radius: 100px;
        	color: #83166A;
        	font-size: 1.5em;
        	font-weight: bold;
        	padding: 15px 0;
        }

        @media screen and (max-width: 767px) {
        	.search__btn a {
        		padding: 10px 0;
        	}

        	.search__btn {
        		position: relative;
        		text-align: center;
        		font-weight: 800;
        		line-height: 1.2;
        		width: 95%;
        		height: 20%;
        		padding: 5px 10px;
        		max-width: 450px;
        	}
        }

        .search__btn a::before {
        	position: absolute;
        	content: "";
        	right: 35px;
        	top: 36%;
        	width: 16px;
        	height: 16px;
        	border-top: 2px solid #83166A;
        	border-right: 2px solid #83166A;
        	transform: rotate(45deg);
        }

        .search__btn a:hover {
        	opacity: 1;
        }

        .search__btn a:hover::before {
        	right: 30px;
        }

        @media screen and (max-width: 767px) {
        	.search__btn a::before {
        		top: 38%;
        		width: 10px;
        		height: 10px;
        		right: 20px;
        	}

        	.search__btn a:hover::before {
        		right: 15px;
        	}
        }



        .food-acc02 {
        	position: absolute;
        	width: 25%;
        	height: 20%;
        	bottom: 5%;
        	right: -5%;
        }

        @media screen and (max-width: 767px) {
        	.food-acc02 {
        		width: 30%;
        		height: 20%;
        		bottom: 18%;
        		right: -10%;
        	}
        }

        .food-acc03 {
        	position: absolute;
        	width: 40%;
        	bottom: -4%;
        	left: -9%;
        }

        @media screen and (max-width: 767px) {
        	.food-acc03 {
        		bottom: -5%;
        		left: -15%;
        		width: 50%;
        	}
        }

        .fv-acc01 {
        	position: absolute;
        	width: 20%;
        	top: 15%;
        	left: 2%;
        }

        @media screen and (max-width: 767px) {
        	.fv-acc01 {
        		width: 25%;
        		top: 25%;
        		left: -3%;
        		z-index: 10;
        	}
        }

        .fv-acc02 {
        	position: absolute;
        	width: 21%;
        	bottom: 30%;
        	right: 2%;
        	z-index: 20;
        }

        @media screen and (max-width: 767px) {
        	.fv-acc02 {
        		width: 26%;
        		bottom: 1%;
        		right: -5%;
        	}
        }



/************ひろしま恵みフェア*************/

#megumifair{
	margin-top: 4em;
}

.megumifair_inner{
	padding: 0 10px;
}


.megumifair_ttl{
	width: 88%;
	margin:  0 auto;
}

.megumifair_copy{
	background-color: #E4853A;
	padding: 10px 20px;
	width: 80%;
	margin:  0 auto;
	margin-top: 1em;
	margin-bottom: 2em;
	
}
.megumifair_copy p{
	text-align: center;
	color: #fff;
	font-size: 1em;
	font-weight: 400;
	line-height: 1.8em;
}

.megumifair-item{
	background: unset;
	box-shadow:unset;
}


#megumifair .item__img img{
	border-radius: 0;
}

#megumifair .item__txt{
	background: linear-gradient(to right, rgba(199, 159, 0, 0.70), rgba(199, 159, 0, 0.70));
	margin-top: -13%;
    z-index: 2;
}


#megumifair .item__shoplink{
	margin: 0 0 0 auto;
	    width: 50%;
	    border-radius: 0;
}

#megumifair .item__shopname p{
	color: #fff;
}

.item__shoplink{
	position: relative;
}

.item__shoplink::before{
	position: absolute;
    content: "";
    right: 5%;
    top: 34%;
    width: 13px;
    height: 13px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    transform: rotate(45deg);	
}

.grown-icon{
	position: absolute;
	width: 31%;
    bottom: 13%;	
	left: 0%;
}


@media screen and (max-width: 767px){
	#megumifair .item__txt{
		padding-bottom: 5px;
	}
	
	#megumifair .item__shoplink{
		margin: 0 auto;
    	width: 95%;
	}
}

@media screen and (max-width: 500px){
	.menubtn__list a{
		padding: 0.2em;
	}
	
	.menubtn__list li p{
		font-size: 0.8em;
	}
	
	.menubtn__list li{
		padding: 1em;
	}
}

@media screen and (max-width: 380px){
	.sweets,.youshoku,.wasyoku{
		display: none;
	}
	    .menubtn__list li {
        padding: 0.8em 0.3em;
    }
	
	.menubtn__list {
		        gap: 2%;
	}
}




/************animation*************/

.fade-up {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeUp 1s ease-out forwards;
}

@keyframes fadeUp {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}




.center-open {
    clip-path: inset(0 50% 0 50%);
    animation: centerOpen 1s ease-out forwards;
}

@keyframes centerOpen {
    0% {
        clip-path: inset(0 50% 0 50%);
    }
    100% {
        clip-path: inset(0 0 0 0);
    }
}



/*スクロールアップ*/
.scroll_up.on {
    transform: translateY(0);
    opacity: 1.0;
}

.scroll_up {
    transition: 1.0s ease-in-out;
    transform: translateY(30px);
    opacity: 0;
}




/*
.typing-text {
    visibility: hidden;
}

.typing-text.is-typing {
    visibility: visible;
}
*/