/* 今月のおすすめスライダー：外観 → カスタマイズ → 追加CSS に貼り付け */

	.offt-monthly {
		--hw-orange: #b86580;
		--hw-dark: #59434b;
		--hw-cream: #fff7fa;
		background-color: #f8e5ea;
		position: relative;
		left: 50%;
		width: 100vw;
		max-width: none;
		margin: 0 0 42px -50vw;
		padding: 38px max(20px, calc((100vw - 1180px) / 2)) 34px;
		overflow: hidden;
		box-sizing: border-box;
	}
	.offt-monthly, .offt-monthly * { box-sizing: border-box; }
	.offt-monthly > * { position: relative; z-index: 1; }
	.offt-monthly > .offt-monthly__background {
		position: absolute; inset: 0; z-index: 0;
		width: 100%; height: 100%; margin: 0;
		object-fit: cover; opacity: .78; pointer-events: none;
	}
	.offt-monthly .offt-halloween__heading { margin-bottom: 14px; text-align: center; }
	.offt-monthly .offt-halloween__heading p {
		margin: 0 0 2px; color: #a05c72; font-size: 10px; font-weight: 700; letter-spacing: .24em;
	}
	.offt-monthly .offt-halloween__heading h2 {
		margin: 0; padding: 0; border: 0; background: none; color: var(--hw-dark);
		font-size: 24px; font-weight: 600; line-height: 1.45; letter-spacing: .08em;
	}
	.offt-monthly .offt-halloween__viewport {
		position: relative; max-width: 1180px; margin: 0 auto; overflow: hidden;
	}
	.offt-monthly .offt-halloween__track {
		position: relative; display: flex; gap: 16px; align-items: stretch; transition: transform .55s ease;
	}
	.offt-monthly .offt-halloween__slide {
		display: flex; flex: 0 0 calc((100% - 32px) / 3); flex-direction: column;
		min-width: 0; margin: 0; overflow: hidden; background: #fff;
		box-shadow: 0 5px 18px rgba(57, 42, 31, .11);
	}
	.offt-monthly .offt-halloween__image {
		display: block; height: 225px; overflow: hidden; background: #fff5f8;
	}
	.offt-monthly .offt-halloween__image img {
		display: block; width: 100%; height: 100%; margin: 0; object-fit: cover; transition: transform .5s ease;
	}
	.offt-monthly .offt-halloween__image:hover img { transform: scale(1.025); }
	.offt-monthly .offt-halloween__content {
		display: flex; flex: 1; flex-direction: column; align-items: center; justify-content: center;
		min-width: 0; min-height: 175px; padding: 20px 20px 22px; color: var(--hw-dark); text-align: center;
	}
	.offt-monthly .offt-halloween__label {
		margin: 0 0 6px; color: var(--hw-orange); font-size: 9px; font-weight: 700; letter-spacing: .16em;
	}
	.offt-monthly .offt-halloween__content h3 {
		margin: 0 0 8px; padding: 0; border: 0; background: none; color: var(--hw-dark);
		font-size: 17px; font-weight: 600; line-height: 1.5; letter-spacing: .02em;
	}
	.offt-monthly .offt-halloween__price { margin-bottom: 13px; font-size: 16px; font-weight: 600; }
	.offt-monthly .offt-halloween__price del { margin-right: 7px; color: #8e847b; font-size: 14px; }
	.offt-monthly .offt-halloween__price ins { text-decoration: none; }
	.offt-monthly .offt-halloween__button {
		display: inline-flex; align-items: center; justify-content: center; min-width: 126px; min-height: 36px;
		padding: 7px 17px; background: var(--hw-dark); color: #fff; font-size: 12px; text-decoration: none;
		transition: background .25s ease;
	}
	.offt-monthly .offt-halloween__button:hover { background: var(--hw-orange); color: #fff; }
	.offt-monthly .offt-halloween__arrow {
		position: absolute; top: 50%; z-index: 3; width: 38px; height: 52px; padding: 0;
		transform: translateY(-50%); border: 0; background: rgba(89,67,75,.78); color: #fff;
		font-family: Arial, sans-serif; font-size: 31px; font-weight: 300; line-height: 1; cursor: pointer;
	}
	.offt-monthly .offt-halloween__prev { left: 0; }
	.offt-monthly .offt-halloween__next { right: 0; }
	.offt-monthly .offt-halloween__dots {
		display: flex; justify-content: center; gap: 8px; margin-top: 14px;
	}
	.offt-monthly .offt-halloween__dots button {
		width: 8px; height: 8px; margin: 0; padding: 0; border: 0; border-radius: 50%;
		background: #dfbdc9; cursor: pointer;
	}
	.offt-monthly .offt-halloween__dots button[aria-current="true"] { background: var(--hw-orange); }
	.offt-monthly .offt-halloween__all { margin: 13px 0 0; text-align: center; }
	.offt-monthly .offt-halloween__all a {
		color: #59434b; font-size: 13px; font-weight: 600; text-decoration: underline; text-underline-offset: 4px;
	}
	@media (max-width: 1023px) and (min-width: 768px) {
		.offt-monthly .offt-halloween__slide { flex-basis: calc((100% - 16px) / 2); }
	}
	@media (max-width: 767px) {
		.offt-monthly { margin-bottom: 28px; padding: 28px 18px 24px; }
		.offt-monthly .offt-halloween__heading h2 { font-size: 21px; }
		.offt-monthly .offt-halloween__slide { flex-basis: 100%; }
		.offt-monthly .offt-halloween__image { height: 225px; }
		.offt-monthly .offt-halloween__content { min-height: 170px; padding: 19px 20px 22px; }
		.offt-monthly .offt-halloween__content h3 { font-size: 17px; }
		.offt-monthly .offt-halloween__arrow { top: 50%; width: 33px; height: 46px; }
	}
	@media (prefers-reduced-motion: reduce) {
		.offt-monthly .offt-halloween__track,
		.offt-monthly .offt-halloween__image img { transition: none; }
	}
