@charset "UTF-8";
/* ==========================================================================
   09-responsive.css (v2)
   モバイルファースト基本。BPで progressive 拡張。
   末尾に prefers-reduced-motion / print。
   BP: 600 / 860 / 1024 / 1180
   ========================================================================== */

/* ==========================================================================
   タブレット縦: 600px+
   ========================================================================== */
@media (min-width: 600px) {
	.l-header__bar { min-height: 72px; }
	.c-catchphrase { display: block; }

	.l-footer__widgetArea {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ==========================================================================
   タブレット横: 860px+
   ========================================================================== */
@media (min-width: 860px) {
	.l-footer__widgetArea {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* ==========================================================================
   通常PC: 1024px+
   ========================================================================== */
@media (min-width: 1024px) {
	.l-footer__widgetArea {
		grid-template-columns: 1.6fr 1fr 1fr 1fr 1fr;
	}
	.l-footer__widgetArea > .l-footer__brand {
		grid-column: 1;
	}
}

/* ==========================================================================
   大画面PC: 1180px+
   ========================================================================== */
@media (min-width: 1180px) {
	.l-header__bar { min-height: 80px; }
}

/* ==========================================================================
   prefers-reduced-motion
   ========================================================================== */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration:  0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}

	.p-mishimaHero__visual:hover .p-mishimaHero__img,
	.p-mishimaCard:hover,
	.p-mishimaCatCard:hover,
	.p-mishimaCta__btn:hover {
		transform: none;
	}
}

/* ==========================================================================
   print
   ========================================================================== */
@media print {
	.l-header,
	.l-footer,
	.p-mishimaHero,
	.p-mishimaCta,
	.c-pageTopBtn,
	.p-pageTopBtn {
		display: none;
	}
	body { color: #000; background: #fff; }
	a { color: #000; text-decoration: underline; }
}