/*//////////////////////////////////////////////////////////////
	media-queries
//////////////////////////////////////////////////////////////*/

/* ===== 1199px以下: SPレイアウト(1rem=10px @393px、最大640px幅のカラム) ===== */
@media screen and (max-width: 1199px) {

	:root {
		--grid-size: 1.55rem;
		--grid-w: .1rem;
	}

	html {
		font-size: calc(min(var(--vw, 1vw) * 100, 640px) / 39.3);
	}

	body {
		font-size: 1.4rem;
	}

	.br-pc {
		display: none;
	}

	.br-sp {
		display: inline;
	}

	.concept-text .gap,
	.overview .gap,
	.ticket-date .gap,
	.ticket-notes .gap {
		display: none;
	}

	/* ----- Hero / Nav ----- */
	.hero-main {
		max-width: none;
	}

	.nav {
		margin-top: 3rem;
	}

	.nav-list {
		display: grid;
		grid-template-columns: 14.2rem 14.1rem;
		justify-content: center;
		column-gap: 3rem;
		row-gap: .6rem;
	}

	.nav-list a {
		width: 100%;
		height: 3.7rem;
		border-radius: 3.7rem;
		font-size: 1.5rem;
		letter-spacing: .1em;
	}

	/* ----- Concept ----- */
	.concept {
		width: 39.3rem;
		max-width: none;
		height: 42.9rem;
		margin-top: 1.3rem;
	}

	.concept-photo-01 {
		left: .5rem;
		top: 0;
		width: 10.5rem;
	}

	.concept-photo-03 {
		left: 1.9rem;
		top: 25.8rem;
		width: 7.2rem;
	}

	.concept-photo-04 {
		left: 28.3rem;
		top: 3rem;
		width: 10.3rem;
	}

	.concept-text {
		top: 5.5rem;
		font-size: 1.4rem;
		line-height: 1.3;
	}

	.concept-text p+p {
		margin-top: 1.8rem;
	}

	.concept-text p:last-child {
		font-size: 1.4rem;
	}

	/* ----- Overview ----- */
	.overview {
		height: 27.5rem;
	}

	.overview-title {
		top: 1.85rem;
		font-size: 1.7rem;
	}

	.overview-list {
		left: calc(50% - 18.05rem);
		top: 5.3rem;
		width: 37.5rem;
		font-size: 1.27rem;
		line-height: 1.42;
	}

	.ov-row+.ov-row {
		margin-top: .4rem;
	}

	.ov-photo {
		left: calc(50% + 8.95rem);
		top: auto;
		bottom: 0;
		width: 9.5rem;
	}

	/* ----- Ticket ----- */
	.ticket {
		margin-top: 5.6rem;
	}

	.ticket-card {
		width: 37.5rem;
		padding: 1.5rem .3rem 2.4rem;
		border-radius: 3rem;
	}

	.ticket-title {
		font-size: 1.7rem;
	}

	.fee {
		grid-template-columns: 7.9rem 1fr;
		grid-template-rows: 3rem 4.5rem 3rem;
		width: 32.7rem;
		margin-top: 1.2rem;
		padding: .5rem 1.2rem;
		border-width: .15rem;
		box-sizing: border-box;
		font-size: 1.18rem;
	}

	.fee::before {
		left: 8.95rem;
		top: .5rem;
		width: .3rem;
		height: 10.5rem;
		background-size: .3rem 1.6rem;
	}

	.fee-label-pre {
		background-size: 1.6rem .3rem;
	}

	.fee-r1,
	.fee-r2 {
		background-position: .9rem bottom;
		background-size: 1.6rem .3rem;
	}

	.fee-price {
		padding-left: 1.9rem;
		white-space: nowrap;
	}

	.fee-r2 p {
		line-height: 1.3;
	}

	.fee-note {
		margin-top: 0;
		font-size: .9rem;
	}

	.ticket-sub {
		margin-top: 2.2rem;
		font-size: 1.7rem;
	}

	.ticket-date {
		width: 36.1rem;
		margin-top: 1.2rem;
		border-width: .15rem;
		font-size: 1.8rem;
		line-height: 3.3rem;
	}

	.ticket-btns {
		grid-template-columns: 20rem;
		row-gap: .8rem;
		margin-top: 2.1rem;
	}

	.ticket-btns li:first-child {
		margin-bottom: .9rem;
	}

	.btn-ticket {
		height: 4rem;
		border-radius: 4rem;
		font-size: 1.3rem;
	}

	.ticket-code {
		margin-top: 0;
		font-size: 1.2rem;
	}

	.ticket {
		padding-bottom: 0;
	}

	.ticket-card.is-before {
		padding-bottom: 4.2rem;
	}

	.ticket-card.is-before .ticket-notes {
		margin-top: 2.4rem;
	}

	.ticket-notes {
		margin-top: 2.5rem;
		padding: 0 .2rem 0 1.1rem;
		font-size: max(1rem, 9px);
		line-height: 1.3;
	}

	/* ----- Highlights ----- */
	.highlights {
		height: 61.2rem;
		margin-top: 5.2rem;
	}

	.highlights::before {
		width: 100%;
		height: 36.3rem;
	}

	.hl-inner {
		width: 39.3rem;
		max-width: none;
	}

	.hl-title {
		left: 0;
		width: 100%;
		top: 1.85rem;
		text-align: center;
		font-size: 1.7rem;
	}

	.hl-lead {
		left: 0;
		width: 100%;
		top: 5.7rem;
		text-align: center;
		font-size: 1.27rem;
		font-weight: 700;
	}

	.creator {
		left: 2rem;
		top: 12.2rem;
		width: 35.5rem;
		height: 20.7rem;
		border-radius: 2rem;
	}

	.creator-icon {
		left: 2.4rem;
		top: -.2rem;
		width: 8.9rem;
	}

	.creator-name {
		left: 11.4rem;
		right: 6.5rem;
		top: 2.2rem;
		white-space: nowrap;
		font-size: 1.3rem;
		line-height: 1.6;
	}

	.creator-bio {
		top: 8.5rem;
		font-size: 1.15rem;
		line-height: 1.37;
	}

	.hl-diorama {
		left: -.45rem;
		top: 28.5rem;
		width: 39.9rem;
		max-width: none;
	}

	.hl-credit {
		left: 4.1rem;
		top: 34rem;
		font-size: max(.65rem, 6px);
		color: var(--c-white);
	}

	/* ----- STUDIO ----- */
	.studio {
		height: 52.1rem;
	}

	.studio::before {
		left: 0;
		height: 27.9rem;
	}

	.studio-inner {
		width: 39.3rem;
		max-width: none;
	}

	.studio-photo {
		left: 3rem;
		top: 24.9rem;
		width: 33.4rem;
	}

	.studio-photo figcaption {
		right: 1rem;
		bottom: .6rem;
		font-size: max(.65rem, 6px);
	}

	.studio-title {
		left: 0;
		width: 100%;
		top: 1.65rem;
		text-align: center;
		font-size: 1.7rem;
	}

	.studio-text {
		left: 0;
		width: 100%;
		top: 4.75rem;
		text-align: center;
		font-size: 1.27rem;
		line-height: 1.36;
	}

	/* ----- Goods ----- */
	.goods {
		width: 37.5rem;
		height: 38.7rem;
		border-radius: 3rem;
	}

	.goods-title {
		padding-top: 2.05rem;
		font-size: 1.7rem;
		letter-spacing: 0;
	}

	.goods-lead {
		margin-top: 1.45rem;
		font-size: 1.25rem;
	}

	.goods-dolls {
		top: 9.8rem;
		width: 33.3rem;
	}

	.goods-credit {
		left: 23.3rem;
		top: 35.9rem;
		font-size: max(.65rem, 6px);
	}

	/* ----- Bonus ----- */
	.bonus {
		width: 39.3rem;
		height: 26rem;
		margin: 9.8rem auto 0;
	}

	.bonus::before {
		clip-path: polygon(8.65% 0, 100% 0, 100% 56.54%, 91.09% 100%, 0 100%, 0 43.46%);
	}

	.bonus-title {
		padding-top: 2.15rem;
		font-size: 1.7rem;
	}

	.bonus-text {
		left: 0;
		width: 100%;
		top: 5.3rem;
		text-align: center;
		font-size: 1.3rem;
		line-height: 1.3;
	}

	.bonus-sticker {
		left: 9.6rem;
		top: 15.35rem;
		width: 20.1rem;
	}

	.bonus-sparkle {
		left: 5.25rem;
		top: 12.85rem;
		width: 4.75rem;
	}

	.bonus-photo {
		left: 28.25rem;
		top: -4.65rem;
		width: 9.5rem;
	}

	/* ----- Instagram / Footer ----- */
	.insta {
		margin-top: 14.7rem;
	}

	.insta-box {
		width: 37.4rem;
		height: 12.6rem;
		padding-top: 2.2rem;
		border-radius: 3rem;
	}

	.insta-title {
		font-size: 1.55rem;
	}

	.insta-link {
		width: 24.5rem;
		margin-top: 2rem;
	}

	.footer {
		margin-top: 3.9rem;
		padding-bottom: 3.8rem;
		font-size: max(.9rem, 8px);
	}

	/* ----- Page top ----- */
	.pagetop {
		right: 1.2rem;
		bottom: 2rem;
		width: 6.2rem;
		height: 5.6rem;
	}

	.pagetop-text {
		font-size: 1.2rem;
	}

}

/* ===== 639px以下: SPのメインビジュアル(mv_sp.png)に切替済み。ナビ上余白をデザインどおりに詰める ===== */
@media screen and (max-width: 639px) {

	.nav {
		margin-top: .6rem;
	}

}

/* ===== モーション低減設定 ===== */
@media (prefers-reduced-motion: reduce) {

	html {
		scroll-behavior: auto;
	}

	.hero-main {
		animation: none;
	}

	* {
		transition: none !important;
	}

}
