@charset "utf-8";
/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Shippori+Mincho&display=swap');

html {
	scroll-behavior: smooth;
}

/****************************************
春DM2026
*****************************************/

#spring2026 {
	max-width: 1200px;
	margin: 0 auto;
	font-family: "Shippori Mincho", serif;
}
#spring2026 img {
	max-width: 100%;
}
#spring2026 * {
	box-sizing: border-box;
}

#spring2026 .content {
	margin-left: auto;
	margin-right: auto;
	padding-top: 6vw;
	padding-bottom: 6vw;
	background: url(../../images/spring-dm/bg_haru01.webp) repeat-y #f9e4e2;
	background-size: 100% auto;
}
#spring2026 .content--02 {
	background: center top / 100% auto url(../../images/spring-dm/bg_haru02.webp) repeat-y #f9e4e2;
}
#spring2026 .content--03 {
	background: center top / 100% auto url(../../images/spring-dm/bg_haru03.webp) repeat-y #f9e4e2;
}
#spring2026 .content--04 {
	background: center top / 100% auto url(../../images/spring-dm/bg_haru04.webp) repeat-y;
}
#spring2026 .content.content--gift {
	padding: 0;
	background: center top / 100% auto url(../../images/spring-dm/bg_gift.webp) repeat-y;
}

@media only screen and (max-width: 767px) {
	#spring2026 .content {
		margin-left: -4vw;
		margin-right: -4vw;
	}
}
@media only screen and (min-width: 768px) {
	#spring2026 .content {
		padding: 60px 20px;
	}
	#spring2026 .content.content--gift {
		padding: 0 20px;
	}
}

/* 上部キャッチ */
.spring-catch {
	margin-bottom: 1em;
	color: #cc6666;
	font-size: min(2rem,5vw);
	font-family: "Noto Sans JP", sans-serif;
	text-align: center;
}
@media only screen and (min-width: 768px) {
	.spring-catch {
		display: flex;
		gap: 1%;
	}
	.spring-catch::before ,
	.spring-catch::after {
		display: block;
		content: '';
		background: center / contain url(../../images/spring-dm/haru_title_deco01.webp) no-repeat;
		flex: 1;
	}
	.spring-catch .text {
		display: block;
		width: 13em;
	}
}

/* メインビジュアル */
.spring-main {
	margin-bottom: 30px;
	line-height: 1;
}
.spring-main__bottom {
	padding: 15px 0;
	background: center bottom / 100% auto url(../../images/spring-dm/haru_main_bg.webp) no-repeat #fef0f1;
}
.spring-main__bottom .ribon {
	padding-right: 15px;
}
.spring-main__bottom .date {
	padding: 15px;
}
@media only screen and (max-width: 767px) {
	#spring2026 .spring-main {
		margin-left: -4vw;
		margin-right: -4vw;
	}
}
@media only screen and (min-width: 768px) {
	.spring-main__bottom {
		display: flex;
		align-items: center;
		padding: 0;
	}
}

/* バナー */
#spring2026 .bnr-list--spring {
	margin-bottom: 30px;
}

/*ボタン*/
#spring2026 .btn-box {
	margin-top: 20px;
	text-align: center;
}
#spring2026 .btn-box a {
	display: inline-block;
	width: 560px;
	max-width: 80vw;
	padding: .5em 0;
	border-radius: 50vh;
	background: no-repeat 95% 50% #cc3333;
	color: #FFF;
	font-size: min(2rem,4.5vw);
	text-align: center;
}
#spring2026 .btn-box a:hover {
	background-color: #d97979;
}
@media only screen and (min-width: 768px) {
	#spring2026 .btn-box {
		margin-top: 40px;
	}
	#spring2026 .btn-box a {
		background-size: 14px auto;
	}
}

/*特典*/
#spring2026 .tokuten {
	padding-bottom: 10vw;
	position: relative;
	z-index: 0;
}
#spring2026 .tokuten .tokuten-box {
	position: relative;
	z-index: 0;
}
#spring2026 .tokuten .heading {
	margin: 0 0 3vw;
	text-align: center;
}
#spring2026 .tokuten .heading img {
	max-width: 88%;
}
#spring2026 .tokuten .tokuten-list {
	max-width: calc(100vw - 30px);
	margin: 0 auto;
	text-align: center;
}
#spring2026 .tokuten .tokuten-list li {
	margin-bottom: 2vw;
}
@media only screen and (min-width: 768px) {
	#spring2026 .tokuten {
		padding-bottom: 80px;
		position: relative;
		z-index: 0;
	}
	#spring2026 .tokuten .tokuten-box {
		position: relative;
		z-index: 0;
	}
	#spring2026 .tokuten .heading {
		text-align: center;
		margin: 0 0 30px;
	}
	#spring2026 .tokuten .tokuten-list {
		width: 1060px;
		margin: 0 auto 20px;
		display: flex;
		flex-wrap: wrap;
		gap: 20px;
	}
	#spring2026 .tokuten .tokuten-list li {
		width: calc((100% - 20px) / 2);
		margin-bottom: 0;
	}
	#spring2026 .tokuten .tokuten-list li.wide {
		width: 100%;
	}
}

/*商品リンク*/
#spring2026 .link {
	margin: 0 auto;
	padding: 0 0 6vw;
	position: relative;
	z-index: 0;
}
#spring2026 .link .heading {
	position: relative;
	margin: 0 0 5vw;
	text-align: center;
}
#spring2026 .link .heading .text {
	display: inline-block;
	padding-left: .2em;
	font-size: min(2rem,6vw);
	letter-spacing: .2em;
}
#spring2026 .link .heading::before ,
#spring2026 .link .heading::after {
	position: absolute;
	content: "";
	top: 50%;
	width: 16vw;
	height: 0.1vw;
	background: #333;
}
#spring2026 .link .heading::before {
	left: 0;
}
#spring2026 .link .heading::after {
	right: 0;
}
#spring2026 .link .pagelink-list {
	width: 80vw;
	margin: 0 auto 3vw;
	text-align: center;
}
#spring2026 .link .pagelink-list li {
	margin-bottom: 2vw;
}
@media only screen and (min-width: 768px) {
	#spring2026 .link {
		position: relative;
		padding-bottom: 80px;
		z-index: 0;
	}
	#spring2026 .link .heading {
		position: relative;
		max-width: 1060px;
		margin: 0 auto 50px;
		text-align: center;
	}
	#spring2026 .link .heading::before {
		width: calc(50% - 10em);
		height: 1px;
	}
	#spring2026 .link .heading::after {
		width: calc(50% - 10em);
		height: 1px;
	}
	#spring2026 .link .pagelink-list {
		display: flex;
		flex-wrap: wrap;
		gap: 20px 40px;
		max-width: 960px;
		margin: 0 auto;
	}
	#spring2026 .link .pagelink-list li {
		width: calc((100% - 40px) / 2);
		margin-bottom: 0;
	}
}

/* ヘッディング */
.pickhead {
	margin-bottom: 30px;
	background: #FFF;
}
.pickhead__image {
	line-height: 1;
}
.pickhead__text h3 {
	margin-bottom: .5em;
	color: #cc9900;
	font-size: min(1.75rem,4.5vw);
}
.pickhead__text h3 span {
	display: inline-block;
}
.pickhead__text p {
	font-size: min(1.25rem,3vw);
}
@media only screen and (max-width: 767px) {
	.pickhead__image {
		position: relative;
		overflow: hidden;
		aspect-ratio: 5 / 2;
		z-index: 10;
	}
	.pickhead__image img {
		position: absolute;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
		top: 0;
		left: 0;
	}
	.pickhead__text {
		position: relative;
		margin-top: -60px;
		padding: 30px 4vw 4vw;
		background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 50px, rgba(255, 255, 255, 1) 100%);
		z-index: 20;
	}
}
@media only screen and (min-width: 768px) {
	.pickhead {
		display: flex;
		flex-direction: row-reverse;
	}
	.pickhead__image {
		position: relative;
		width: 560px;
	}
	.pickhead__text {
		position: relative;
		display: flex;
		align-items: center;
		flex: 1;
		margin-right: -60px;
		padding-left: 30px;
		background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 50px, rgba(255, 255, 255, 1) 100%);
		z-index: 20;
	}
	.pickhead__text h3 span + span {
		margin-left: 4em;
	}
}

.rankhead {
	margin-bottom: 30px;
	background: #F2F2F2;
	text-align: center;
}
.rankhead.rankhead--bottom0 {
	margin-bottom: 0;
}
.rankhead__image {
	line-height: 1;
}
.rankhead__text .icon {
	display: inline-block;
	max-width: 20%;
}
.rankhead__text h3 {
	margin-bottom: .5em;
	font-size: min(2.5rem,5.5vw);
}
@media only screen and (max-width: 767px) {
	.rankhead__text {
		position: relative;
		padding: 4vw 4vw;
	}
}
@media only screen and (min-width: 768px) {
	.rankhead {
		display: flex;
	}
	.rankhead__image {
		overflow: hidden;
		position: relative;
		width: 560px;
		aspect-ratio: 56 / 35;
		z-index: 10;
	}
	.rankhead__image img {
		position: absolute;
		width: 100%;
		height: 100%;
		object-fit: cover;
		object-position: center;
		top: 0;
		left: 0;
	}
	.rankhead__text {
		position: relative;
		display: flex;
		justify-content: center;
		align-items: center;
		flex: 1;
		margin-right: -60px;
		padding-right: 50px;
		background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 50px, rgba(255, 255, 255, 1) 100%);
		z-index: 20;
	}
	.rankhead__text .icon {
		max-width: none;
	}
}
#spring2026 .tabekata .title-block {
	margin-bottom: 0;
}
/*商品一覧レイアウト*/
#spring2026 .product-list {
	position: relative;
	z-index: 0;
}
#spring2026 .product-list-inner {
	max-width: calc(100vw - 30px);
	margin: 0 auto;
}
#spring2026 .product-list .product-box {
	background: #ffffff;
}
#spring2026 .product-list .btn-box + .product-box {
	margin-top: 40px;
}
#spring2026 .product-list .product-box:not(:last-child) {
	margin-bottom: 40px;
}
@media only screen and (min-width: 768px) {
	#spring2026 .product-list-inner {
		max-width: 1060px;
	}
	#spring2026 .product-list .product-box {
		padding: 0 0 20px;
	}
}

/*商品一覧*/
#spring2026 .ranking-list {
	display: flex;
	flex-wrap: wrap;
	width: 94%;
	margin: 0 auto;
	gap: 15px;
	text-align: center;
}
#spring2026 .ranking-list li {
	width: calc((100% - 15px) / 2);
}
#spring2026 .ranking-list li a {
	text-decoration: none;
}
#spring2026 .ranking-list li .thumb img {
	margin-bottom: 1vw;
	width: 100%;
}
#spring2026 .ranking-list  li .icon {
	margin-bottom: 1vw;
}
#spring2026 .ranking-list  li .icon img {
	width: auto;
	height: 2em;
}
#spring2026 .ranking-list li .name {
	margin: 0 0 1vw;
	font-size: min(1rem,3.7vw);
}
#spring2026 .ranking-list li .price {
	font-size: 3.7vw;
	color: #e1506e;
	margin: 0 0 1vw;
}
#spring2026 .ranking-list li .price .tax {
	font-size: 3.2vw;
}
#spring2026 .ranking-list li .btn::before {
	display: block;
	content: '\8A73\7D30\30FB\3054\8CFC\5165\306F\3053\3061\3089';
	padding: .3em 1.5em .3em .25em;
	border-radius: 50vh;
	background: no-repeat 92% 50% #cc3333;
	background-image: url('data:image/svg+xml,%3Csvg%20viewBox%3D%220%200%2018%2018%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22m8.1%2017.1c-4.1%200-8.1-3.1-8.1-9s4-8.1%208.1-8.1c5.9%200%209%204%209%208.1%200%205.9-3.1%209-9%209zm-2.1-13.1v10l8-5z%22%20fill%3D%22%23fff%22%20fill-rule%3D%22evenodd%22%2F%3E%3C%2Fsvg%3E');
	background-size: 1.05em auto;
	color: #FFF;
	font-size: min(.875rem,2.5vw);
}
#spring2026 .ranking-list li a:hover .btn::before {
	background-color: #e06d6d;
}
#spring2026 .ranking-list.ranking-list-box1 {
	margin: 0 auto 6vw;
}
#spring2026 .ranking-list.ranking-list-box1:last-child {
	margin-bottom: 0;
}
#spring2026 .ranking-list.ranking-list-box1 li {
	width: 540px;
	max-width: 54vw;
	margin: 0 auto;
}
#spring2026 .ranking-list.ranking-list-box1 li .icon {
	width: 24vw;
	margin: 0 auto 2vw;
}
#spring2026 .ranking-list.ranking-list-box1 li .thumb img {
	margin: 0 0 1.5vw;
}
#spring2026 .ranking-list.ranking-list-box1 li .name {
	font-size: min(1.5rem, 4.4vw);
	margin: 0 0 1vw;
}
#spring2026 .ranking-list.ranking-list-box1 li .price {
	font-size: 4.4vw;
	margin: 0 0 1vw;
}
#spring2026 .ranking-list.ranking-list-box1 li .price .tax {
	font-size: 3.5vw;
}
#spring2026 .ranking-list.ranking-list-box1 li .btn::before {
	padding: .5em 1.5em .5em .25em;
	font-size: min(1.25rem,3.5vw);
}

@media only screen and (min-width: 768px) {
	#spring2026 .ranking-list {
		padding: 20px 0;
		gap: 20px;
	}
	#spring2026 .ranking-list li {
		width: calc((100% - 60px) / 4);
	}
	#spring2026 .ranking-list.sepa02 {
		width: 720px;
		max-width: 80%;
		gap: 30px;
	}
	#spring2026 .ranking-list.sepa02 li {
		width: calc((100% - 30px) / 2);
	}
	#spring2026 .ranking-list.sepa05 li {
		width: calc((100% - 80px) / 5);
	}
	#spring2026 .ranking-list li .thumb img {
		margin-bottom: 10px;
	}
	#spring2026 .ranking-list  li .icon {
		margin-bottom: 10px;
	}
	#spring2026 .ranking-list  li .icon img {
		height: 2.5em;
	}
	#spring2026 .ranking-list li .name {
		margin-bottom: 10px;
	}
	#spring2026 .ranking-list li .price {
		margin-bottom: 10px;
		font-size: 17px;
	}
	#spring2026 .ranking-list li .price .tax {
		font-size: 12px;
	}
	#spring2026 .ranking-list li .btn::before {
		padding: .5em 1.5em .5em .25em;
	}
	#spring2026 .ranking-list.ranking-list-box1 {
		width: auto;
		margin: 0 auto 40px;
	}
	#spring2026 .ranking-list.ranking-list-box1 li .icon {
		margin-bottom: 20px;
	}
	#spring2026 .ranking-list.ranking-list-box1 li .icon img {
		height: 3em;
	}
	#spring2026 .ranking-list.ranking-list-box1 li .thumb img {
		margin: 0 0 15px;
	}
	#spring2026 .ranking-list.ranking-list-box1 li .name {
		margin: 0 -1em 10px;
	}
	#spring2026 .ranking-list.ranking-list-box1 li .price {
		font-size: 24px;
		margin: 0 0 10px;
	}
	#spring2026 .ranking-list.ranking-list-box1 li .price .tax {
		font-size: 15px;
	}
	#spring2026 .ranking-list.ranking-list-box1 li .btn {
		width: 320px;
		margin: 0 auto;
	}
	#spring2026 .ranking-list.ranking-list-box1 li .btn::before {
		padding: .7em 1.5em .7em .25em;
	}
}

/* メディア紹介 */
.media-shoukai {
	padding: 30px 0;
}

/* ギフト */
.gifthead {
	padding: .5em;
	background: center / cover url(../../images/spring-dm/gift_title_bg.webp);
	color: #330000;
	font-size: min(2.75rem,6vw);
	text-align: center;
}
.gifthead b {
	display: inline-block;
	font-size: 120%;
}
.giftbody {
	max-width: calc(100vw - 30px);
	margin: 0 auto;
	padding: 6vw 0;
}
.giftbody__bnr-list {
	display: flex;
	flex-direction: column;
	gap: 20px;
	line-height: 1;
}
.giftbody__bnr-list li {
	background: #f0f0e8;
}
.giftbody__bnr-list img {
	width: 100%;
}
.giftbody__bnr-list .text-wrap {
	padding: 1em;
	font-size: min(1.125rem,4vw);
	line-height: 1.4;
}
.giftbody__bnr-list .text-wrap h4 {
	margin-bottom: .2em;
	font-size: 120%;
}
.giftbody__bnr-list .datetime .text-wrap h4 {
	color: #a28d4d;
}
.giftbody__bnr-list .icon {
	padding: 20px 0 0 8%;
	text-align: center;
}
.giftbody__bnr-list .icon img {
	width: 60%;
}

@media only screen and (min-width: 768px) {
	.gifthead {
		margin-left: -20px;
		margin-right: -20px;
	}
	.giftbody {
		max-width: 1060px;
		padding: 60px 20px;
	}
	.giftbody__bnr-list {
		flex-direction: row;
		flex-wrap: wrap;
	}
	.giftbody__bnr-list li {
		width: calc((100% - 20px * 1) / 2);
	}
	.giftbody__bnr-list li.wide {
		width: 100%;
	}
	.giftbody__bnr-list .datetime {
		display: flex;
		align-items: center;
		padding: 20px;
	}
	.giftbody__bnr-list .datetime .icon {
		width: 320px;
		max-width: 40%;
		padding: 0;
	}
	.giftbody__bnr-list .datetime .icon img {
		width: auto;
	}
	.giftbody__bnr-list .datetime .text-wrap {
		flex: 1;
		padding: 0;
		font-size: min(1.625rem,5vw);
	}
}

@media only screen and (min-width: 768px) {
}

/*「永平寺そば　極」ができるまで*/
#spring2026 .history {
	background: url("../../images/oseibo/bg-pink.jpg");
	background-size: 50% auto;
	padding: 9vw 5vw;
}
#spring2026 .history .history-box {
	width: 100%;
}
#spring2026 .history .history-box1 {
	margin: 0 0 9vw;
}
#spring2026 .history .history-box .heading {
	margin: 0 0 4vw;;
	color: #fff;
	font-size: min(3rem,9vw);
	line-height: 1.4;
	text-align: center;
}
#spring2026 .history .history-box .img1 {
	width: 100%;
	margin: 0 0 4vw;
}
#spring2026 .history .history-box .txt {
	margin: 0 auto 5vw;
}
#spring2026 .history .history-box .txt p {
	color: #fff;
	font-size: min(1.125rem,3.8vw);
	line-height: 1.94;
}

@media only screen and (max-width: 767px) {
}
@media only screen and (min-width: 768px) {
	/*「永平寺そば　極」ができるまで*/
	#spring2026 .history {
		padding: 90px 30px;
		background-size: auto auto;
	}
	#spring2026 .history .history-box {
		max-width: 1000px;
		margin: 0 auto;
	}
	#spring2026 .history .history-box1 {
		margin-bottom: 90px;
	}
	#spring2026 .history .history-box .heading {
		margin-bottom: 40px;
		text-align: center;
		line-height: 1.4;
	}
	#spring2026 .history .history-box .img1 {
		margin-bottom: 40px;
	}
	#spring2026 .history .history-box .txt {
		width: 700px;
		max-width: 90%;
		margin: 0 auto 50px;
	}
	#spring2026 .history .history-box .img-box {
		display: flex;
	}
}


@media only screen and (max-width: 767px) {
	.sp_hide {
		display: none;
	}
}
@media only screen and (min-width: 768px) {
	.pc_hide {
		display: none;
	}
}