@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:wght@400&display=swap');

@font-face {
	font-family: 'Schnyder Wide XL Web';
	src: url('../fonts/SchnyderWideXL-Light-Web.woff2') format('woff2'), url('../fonts/SchnyderWideXL-Light-Web.woff') format('woff');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}

body.post-type-archive-quicreative {
	background: #fff;
	color: #000;
}

/* QUI CREATIVE画面では既存テーマの共通ヘッダー/フッターを使わない。 */
body.post-type-archive-quicreative > header,
body.post-type-archive-quicreative > footer,
body.quicreative-projects-route > header,
body.quicreative-projects-route > footer,
body.single-quicreative > header,
body.single-quicreative > footer {
	display: none;
}

body.quicreative-menu-open {
	overflow: hidden;
}

.quicreative-studio {
	background: #fff;
	color: #000;
	font-family: 'Noto Sans JP', sans-serif;
	letter-spacing: 0;
}

.quicreative-studio a {
	color: inherit;
	text-decoration: none;
}

.quicreative-studio .sp-only {
	display: none;
}

.quicreative-studio .pc-only {
	display: revert;
}

.quicreative-studio h1,
.quicreative-studio h2,
.quicreative-studio h3,
.quicreative-local-logo,
.quicreative-footer-logo,
.quicreative-footer nav {
	font-family: 'Schnyder Wide XL Web', "Noto Serif JP", serif;
	font-weight: 400;
	letter-spacing: 0.3vmax;
}

.quicreative-hero {
	position: relative;
	min-height: 58vw;
	max-height: 900px;
	height: 100vh;
	background: #000;
	color: #fff;
	overflow: hidden;
}

.quicreative-hero::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 1;
	background: rgba(0, 0, 0, .25);
	pointer-events: none;
}

/* TOPのキービジュアル動画。PC/SPの動画ファイルはここで出し分ける。 */
.quicreative-hero-video,
.quicreative-hero-video video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.quicreative-hero-video {
	z-index: 0;
}

.quicreative-hero-video video {
	display: block;
	object-fit: cover;
}

.quicreative-hero-video-sp {
	display: none;
}

.quicreative-hero-copy {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 2;
	width: min(86vw, 960px);
	color: #fff;
	text-align: center;
	transform: translate(-50%, -50%);
	pointer-events: none;
}

.quicreative-hero-copy h1 {
	margin: 0;
	font-size: clamp(64px, 7.7vw, 100px);
	font-weight: 400;
	line-height: .9;
	letter-spacing: 0.3vmax;
	white-space: nowrap;
}

.quicreative-hero-copy p {
	margin: 28px 0 0;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: clamp(16px, 1.55vw, 18px);
	font-weight: 700;
	line-height: 1;
	letter-spacing: .18em;
}

.quicreative-local-header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 97px;
	padding: 0 3vw 0 3.6vw;
}

.quicreative-local-logo {
	font-size: clamp(20px, 1.8vw, 31px);
	line-height: 1;
}

.quicreative-menu-button {
	position: relative;
	width: 42px;
	height: 38px;
	color: #fff;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0;
	text-align: center;
}

.quicreative-menu-button span {
	display: block;
	width: 30px;
	height: 1px;
	margin: 0 auto 8px;
	background: #fff;
}

.quicreative-menu-button b {
	display: block;
	margin-top: -2px;
	font: inherit;
}

/* TOP/一覧/詳細で共通利用するQUI CREATIVE専用メニュー。 */
.quicreative-menu-overlay {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	justify-content: flex-end;
	align-items: stretch;
	background: transparent;
	color: #000;
	overflow-y: auto;
}

.quicreative-menu-overlay[hidden] {
	display: none;
}

.quicreative-menu-panel {
	position: relative;
	display: grid;
	grid-template-rows: 43.6% 56.4%;
	width: min(50vw, 680px);
	min-width: 560px;
	min-height: 100vh;
	margin-left: auto;
}

.quicreative-menu-panel,
.quicreative-menu-panel * {
	box-sizing: border-box;
}

.quicreative-menu-close {
	position: absolute;
	top: calc((97px - 38px) / 2);
	right: 3vw;
	z-index: 2;
	width: 46px;
	height: 38px;
	color: #fff;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .12em;
	text-align: center;
}

.quicreative-menu-close span {
	position: absolute;
	top: 7px;
	left: 8px;
	display: block;
	width: 34px;
	height: 1px;
	background: #fff;
	transform-origin: center;
}

.quicreative-menu-close span:first-child {
	transform: rotate(15deg);
}

.quicreative-menu-close span:nth-child(2) {
	transform: rotate(-15deg);
}

.quicreative-menu-close b {
	display: block;
	margin-top: 17px;
	font: inherit;
}

body.quicreative-projects-route .quicreative-menu-close,
body.single-quicreative .quicreative-menu-close {
	top: calc((97px - 38px) / 2);
	right: 36px;
}

.quicreative-menu-nav {
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: clamp(62px, 5.4vw, 76px);
	padding-left: clamp(72px, 9.8vw, 136px);
	background: #000;
	color: #fff;
}

.quicreative-menu-nav a {
	width: fit-content;
	max-width: 100%;
	font-family: 'Schnyder Wide XL Web', "Noto Serif JP", serif;
	font-size: clamp(48px, 4.1vw, 74px);
	letter-spacing: 0.3vmax;
	line-height: .9;
	color: #fff;
}

.quicreative-menu-nav a:hover {
	text-decoration: underline;
	text-underline-offset: 8px;
}

.quicreative-menu-contact {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	padding: clamp(70px, 7.8vw, 118px) clamp(64px, 9.3vw, 126px);
	background: #fff;
	color: #000;
}

.quicreative-menu-contact h2 {
	font-family: 'Schnyder Wide XL Web', "Noto Serif JP", serif;
	font-size: clamp(44px, 4.1vw, 68px);
	font-weight: 400;
	line-height: .9;
	letter-spacing: 0.3vmax;
	white-space: nowrap;
}

.quicreative-menu-contact p {
	font-family: "游ゴシック体";
	margin-top: 2.5vw;
	font-size: clamp(14px, .97vw, 18px);
	line-height: 1.85;
}

.quicreative-menu-contact .quicreative-outline-button {
	width: 100%;
	margin-top: 2.6vw;
}

/* カテゴリ一覧・詳細で使う黒背景のローカルヘッダー。 */
.quicreative-page-header {
	height: 97px;
	padding: 0 36px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	background: #000;
	color: #fff;
}

.quicreative-page-logo {
	font-family: 'Schnyder Wide XL Web', "Noto Serif JP", serif;
	font-size: clamp(20px, 1.55vw, 28px);
	letter-spacing: 0.3vmax;
	line-height: 1;
	color: #fff;
}

.quicreative-page-header .quicreative-menu-button {
	flex: 0 0 auto;
}

/* /quicreative/projects の一覧画面。 */
.quicreative-projects-archive {
	min-height: 1200px;
	padding: calc(97px + clamp(120px, 14.8vw, 213px)) 0 174px;
	background: #fff;
	text-align: center;
}

.quicreative-projects-archive.is-all-projects-visible {
	padding-bottom: 0;
}

.quicreative-projects-archive h1 {
	font-family: 'Schnyder Wide XL Web', "Noto Serif JP", serif;
	font-size: clamp(78px, 7vw, 115px);
	font-weight: 400;
	line-height: .9;
	letter-spacing: 0.3vmax;
}

/* SELECT CATEGORYはdetails要素。開いたカテゴリ一覧は投稿カード上に重ねる。 */
.quicreative-category-select {
	position: relative;
	z-index: 3;
	width: min(80vw, 1020px);
	min-width: 0;
	margin: 71px auto 0;
	border: 0;
	background: transparent;
	text-align: left;
	box-sizing: border-box;
}

.quicreative-category-select[open] {
	width: min(80vw, 1020px);
	min-width: 0;
	margin-left: auto;
	margin-right: auto;
	border: 1px solid #8f8f8f;
	border-bottom: 0;
	background: #fff;
}

.quicreative-category-select summary {
	position: relative;
	display: flex;
	align-items: center;
	width: min(24vw, 320px);
	min-width: 288px;
	height: 50px;
	padding: 0 46px 0 45px;
	border: 1px solid #8f8f8f;
	background: #fff;
	cursor: pointer;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 16px;
	font-weight: 800;
	letter-spacing: .22em;
	line-height: 1;
	white-space: nowrap;
	list-style: none;
	box-sizing: border-box;
}

.quicreative-category-select[open] summary {
	width: 100%;
	min-width: 0;
	border: 0;
}

.quicreative-category-select summary::-webkit-details-marker {
	display: none;
}

.quicreative-category-select summary::after {
	content: "↓";
	margin-left: 16px;
	font-size: inherit;
	letter-spacing: 0;
}

.quicreative-category-select[open] summary::after {
	content: "↑";
}

.quicreative-category-list {
	position: absolute;
	top: 100%;
	left: -1px;
	right: -1px;
	z-index: 4;
	display: flex;
	flex-wrap: wrap;
	column-gap: 63px;
	row-gap: 26px;
	padding: 22px 45px 58px;
	border: 1px solid #8f8f8f;
	border-top: 0;
	background: #fff;
}

.quicreative-category-list a {
	display: inline-block;
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 16px;
	font-weight: 800;
	letter-spacing: .15em;
	line-height: 1.1;
	white-space: nowrap;
	text-decoration: none;
}

.quicreative-category-list a.is-current {
	text-decoration: underline;
	text-underline-offset: 4px;
}

.quicreative-project-list-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 80px 60px;
	width: min(80vw, 1020px);
	margin: 49px auto 0;
	text-align: left;
}

.quicreative-project-list-grid .quicreative-project-card h3 {
	margin-top: 29px;
	font-family: "游明朝体", "Yu Mincho", YuMincho, serif;
	font-size: clamp(15px, 1.22vw, 17px);
}

.quicreative-project-card.is-extra-project {
	display: none;
}

.quicreative-project-card.is-extra-project.is-visible-project {
	display: block;
	animation: quicreative-project-reveal .45s ease both;
}

@keyframes quicreative-project-reveal {
	from {
		opacity: 0;
		transform: translateY(18px);
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

.quicreative-project-empty {
	grid-column: 1 / -1;
	margin: 100px 0;
	font-size: 16px;
	font-weight: 700;
	text-align: center;
}

.quicreative-view-more {
	margin-top: 93px;
	cursor: pointer;
}

.quicreative-view-more.is-disabled {
	visibility: hidden;
	pointer-events: none;
}

.quicreative-projects-page .quicreative-contact {
	border-top: 1px solid #707070;
	border-bottom: 0;
}

.quicreative-projects-page .quicreative-feature {
	display: none;
}

.quicreative-single-page .quicreative-contact {
	border-top: 1px solid #707070;
	border-bottom: 0;
}

/* 詳細画面。PCはメイン画像+本文の2カラム、SPは縦積みに切り替える。 */
.quicreative-project-detail {
	padding: calc(97px + clamp(72px, 8.8vw, 127px)) 0 10.5vw;
	background: #fff;
}

.quicreative-project-detail-inner {
	width: min(81vw, 1120px);
	margin: 0 auto;
	text-align: center;
}

.quicreative-project-detail-main {
	display: grid;
	grid-template-columns: minmax(0, 570px) minmax(0, 470px);
	gap: 70px;
	align-items: start;
	text-align: left;
}

.quicreative-project-main-image {
	width: 100%;
	aspect-ratio: 1;
	background: #4a4a4a;
	overflow: hidden;
}

.quicreative-project-main-image img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.quicreative-project-info {
	padding-top: 2px;
	font-family: "游明朝体";
}

.quicreative-project-info h1 {
	margin-top: 0;
	font-family: 'EB Garamond', "游明朝体", "Yu Mincho", YuMincho, serif;
	font-size: clamp(28px, 2.15vw, 38px);
	font-weight: normal;
	line-height: 1.35;
	letter-spacing: .06em;
}

.quicreative-project-category {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
	margin-top: 22px;
	font-family: 'Noto Sans JP', sans-serif;
}

.quicreative-project-category-name {
	display: inline-block;
	font-size: 13px;
	font-weight: normal;
	line-height: 1.5;
	letter-spacing: .08em;
	color: #707070;
}

.quicreative-project-description {
	margin-top: 26px;
	font-family: "游明朝体";
	font-size: clamp(14px, 1vw, 16px);
	font-weight: normal;
	line-height: 2.05;
	letter-spacing: .04em;
}

.quicreative-project-description p + p {
	margin-top: 1em;
}

.quicreative-project-description a {
	color: inherit;
	text-decoration: underline;
}

.quicreative-project-description iframe {
	display: block;
	width: 100%;
	max-width: 100%;
	border: 0;
}

.quicreative-project-description iframe[src*="youtube.com"],
.quicreative-project-description iframe[src*="youtube-nocookie.com"],
.quicreative-project-description iframe[src*="youtu.be"] {
	aspect-ratio: 16 / 9;
	height: auto;
}

.quicreative-project-credit {
	margin-top: 42px;
	font-family: "游明朝体";
	font-size: clamp(13px, .95vw, 15px);
	font-weight: normal;
	line-height: 1.65;
	letter-spacing: .06em;
}

.quicreative-project-credit-row {
	display: grid;
	grid-template-columns: max-content minmax(0, 1fr);
	column-gap: .45em;
	margin: 0;
}

.quicreative-project-credit-row + .quicreative-project-credit-row {
	margin-top: 4px;
}

.quicreative-project-credit-row dt,
.quicreative-project-credit-row dd {
	margin: 0;
	font-weight: normal;
}

.quicreative-project-credit-row dt::after {
	content: " :";
}

.quicreative-project-gallery {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 48px;
	margin-top: 54px;
}

.quicreative-project-gallery-item {
	aspect-ratio: 1;
	background: #4a4a4a;
	overflow: hidden;
}

.quicreative-project-gallery-item img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.quicreative-detail-back {
	margin-top: 109px;
	white-space: nowrap;
}

.quicreative-about {
	width: min(calc(100% - 60px), 850px);
	margin: 0 auto;
	padding: clamp(136px, 17vw, 238px) 0 clamp(136px, 19.6vw, 274px);
	text-align: center;
}

.quicreative-about h2,
.quicreative-projects h2,
.quicreative-contact h2 {
	font-size: clamp(64px, 7.3vw, 100px);
	line-height: .9;
}

.quicreative-about p {
	font-family: "游ゴシック体";
	margin-top: 57px;
	font-size: clamp(17px, 1.35vw, 22px);
	line-height: 2.1;
	text-align: left;
}

.quicreative-service {
	padding: clamp(136px, 16.95vw, 237px) 0;
	background: #000;
	color: #fff;
}

.quicreative-service h2 {
	margin-bottom: clamp(45px, 6.86vw, 96px);
	text-align: center;
	font-size: clamp(64px, 7.1vw, 100px);
	line-height: .9;
	color: #fff;
}

.quicreative-service-list {
	width: min(calc(100% - 60px), 1116px);
	margin: 0 auto;
}

.quicreative-service-item {
	display: grid;
	grid-template-columns: 158px minmax(0, 1fr);
	gap: clamp(28px, 3.2vw, 44px);
	align-items: center;
	margin: 0;
	padding-bottom: 5.2vw;
}

.quicreative-service-item:nth-child(1) {
	margin-left: 0;
}

.quicreative-service-item:nth-child(2),
.quicreative-service-item:nth-child(6) {
	margin-left: min(16vw, 220px);
}

.quicreative-service-item:nth-child(3),
.quicreative-service-item:nth-child(5) {
	margin-left: min(24vw, 320px);
}

.quicreative-service-item:nth-child(4) {
	margin-left: min(28vw, 360px);
}

.quicreative-service-item:nth-child(7) {
	margin-left: min(3vw, 42px);
}

.quicreative-service-image {
	width: 158px;
	aspect-ratio: 1;
	background: #4a4a4a;
	overflow: hidden;
}

.quicreative-service-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.quicreative-service-item:first-child .quicreative-service-image img {
	opacity: .18;
}

.quicreative-service-text {
	min-width: 0;
}

.quicreative-service-body {
	display: grid;
	grid-template-columns: max-content minmax(0, 1fr);
	column-gap: 0;
	align-items: start;
}

.quicreative-service-number {
	margin: 0;
	line-height: .95;
	font-family: 'Schnyder Wide XL Web', "Noto Serif JP", serif;
	font-size: clamp(28px, 3.35vw, 48px);
	font-weight: inherit;
	color: #fff;
}

.quicreative-service-number::after {
	content: "_";
}

.quicreative-service-content {
	min-width: 0;
}

.quicreative-service-content h3 {
	position: relative;
	display: block;
	align-items: baseline;
	gap: 0;
	max-width: 100%;
	font-size: clamp(28px, 3.35vw, 48px);
	line-height: .95;
	color: #fff;
}

.quicreative-service-item:hover .quicreative-service-number,
.quicreative-service-item:hover .quicreative-service-content h3,
.quicreative-service-item:hover .quicreative-service-content p {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: .12em;
}

.quicreative-service-content h3 {
	white-space: normal;
}

.quicreative-service-content p {
	font-family: "游ゴシック体";
	margin-top: 24px;
	font-size: clamp(14px, 1.25vw, 18px);
	line-height: 1.75;
	color: #fff;
}

.quicreative-projects {
	padding: 13vw 0 9.5vw;
	background: #fff;
	text-align: center;
}

.quicreative-project-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	column-gap: clamp(26px, 4.73vw, 66px);
	row-gap: clamp(56px, 7vw, 96px);
	width: min(calc(100% - 60px), 1116px);
	margin: clamp(45px, 6.08vw, 85px) auto 6vw;
	text-align: left;
}

.quicreative-project-card a,
.quicreative-project-card {
	display: block;
}

.quicreative-project-thumb {
	width: 100%;
	aspect-ratio: 1;
	background: #4a4a4a;
	overflow: hidden;
}

.quicreative-project-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.quicreative-project-card h3 {
	margin-top: 31px;
	font-size: clamp(22px, 1.65vw, 28px);
	line-height: 1.6;
}

.quicreative-projects .quicreative-project-card h3 {
	font-family: "游明朝体", "Yu Mincho", YuMincho, serif;
	font-size: clamp(15px, 1.22vw, 17px);
}

.quicreative-outline-button {
	display: inline-flex;
	appearance: none;
	align-items: center;
	justify-content: center;
	min-width: 284px;
	min-height: 55px;
	padding: 0 35px;
	border: 1px solid currentColor;
	background: transparent;
	color: inherit;
	font-family: inherit;
	font-size: 16px;
	font-weight: 800;
	letter-spacing: .3em;
	text-align: center;
	box-sizing: border-box;
}

.quicreative-feature {
	position: relative;
	min-height: 49.8vw;
	background: url("../img/quicreative/quicreative_feature.png") center / cover no-repeat;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
}

.quicreative-feature-copy {
	width: min(82vw, 1030px);
}

.quicreative-feature-copy h2 {
	font-size: clamp(56px, 6vw, 100px);
	line-height: .82;
	color: #fff;
}

.quicreative-feature-copy p {
	font-family: "游ゴシック体";
	width: min(68vw, 760px);
	margin: clamp(15px, 2.43vw, 34px) auto 0;
	font-size: clamp(15px, 1.05vw, 18px);
	font-weight: bold;
	line-height: 2.25;
	color: #fff;
}

.quicreative-outline-button-white {
	margin-top: 4.1vw;
	color: #fff;
}

.quicreative-contact {
	padding: 14.2vw 0 16vw;
	text-align: center;
	background: #fff;
}

.quicreative-contact p {
	margin-top: clamp(36px, 3.22vw, 45px);
	font-family: "游ゴシック体";
	font-size: clamp(17px, 1.25vw, 22px);
	font-weight: normal;
	line-height: 1.85;
	letter-spacing: .04em;
}

.quicreative-contact p + p {
	margin-top: 1.2vw;
}

.quicreative-contact .quicreative-outline-button {
	margin-top: 4.4vw;
}

.quicreative-footer {
	padding-top: clamp(40px, 4vw, 77px);
	padding-right: 0;
	padding-bottom: clamp(20px, 2.3vw, 41px);
	padding-left: 0;
	background: #000;
	color: #fff;
	text-align: center;
}

.quicreative-footer-logo {
	display: inline-block;
	width: clamp(116px, 11.8vw, 184px);
	line-height: 1;
}

.quicreative-footer-logo img {
	display: block;
	width: 100%;
	height: auto;
}

.quicreative-footer-logo::after {
	content: "www.qui.tokyo";
	display: block;
	margin-top: 7px;
	font-family: 'Noto Sans JP', sans-serif;
	font-size: 7px;
	font-weight: 700;
	letter-spacing: .22em;
	text-indent: 0;
}

.quicreative-footer nav {
	display: flex;
	justify-content: center;
	gap: 4vw;
	margin-top: 4.9vw;
	font-size: clamp(20px, 1.8vw, 29px);
	color: #fff;
}

.quicreative-footer nav a {
	color: #fff;
}

.quicreative-footer nav a:hover {
	text-decoration: underline;
	text-underline-offset: 8px;
}

.quicreative-footer-policy,
.quicreative-footer-copyright {
	display: none;
}

@media screen and (min-width: 768px) {
	.quicreative-studio > .quicreative-footer .quicreative-footer-policy,
	.quicreative-studio > .quicreative-footer .quicreative-footer-copyright {
		display: inline-block;
		font-family: 'Noto Sans JP', sans-serif;
		font-size: 11px;
		font-weight: 700;
		letter-spacing: .04em;
		color: #888;
	}

	.quicreative-footer nav {
		margin-bottom: clamp(32px, 10vw, 127px);
	}

.quicreative-studio > .quicreative-footer .quicreative-footer-policy {
		font-size: 13px;
		color: #909090;
		margin-right: 3vw;
	}

	.quicreative-studio > .quicreative-footer .quicreative-footer-policy,
	.quicreative-studio > .quicreative-footer .quicreative-footer-policy:visited,
	.quicreative-studio > .quicreative-footer .quicreative-footer-policy:hover,
	.quicreative-studio > .quicreative-footer .quicreative-footer-policy:active {
		color: #909090;
	}

	.quicreative-studio > .quicreative-footer .quicreative-footer-copyright {
		margin-left: 0;
	}
}

@media screen and (max-width: 1100px) {
	.quicreative-service-list {
		width: min(86vw, 900px);
	}

	.quicreative-service-item,
	.quicreative-service-item:nth-child(n) {
		margin-left: 0;
	}

	.quicreative-service-text h3 {
		white-space: normal;
	}
}

/* SPデザイン差分。TOP/一覧/詳細を画面別に調整する。 */
@media screen and (max-width: 768px) {
	.quicreative-studio {
		overflow: hidden;
	}

	.quicreative-studio .sp-only {
		display: revert;
	}

	.quicreative-studio .pc-only {
		display: none;
	}

	.quicreative-hero {
		min-height: 860px;
		height: 152vw;
		max-height: none;
	}

	.quicreative-hero::after {
		background: rgba(0, 0, 0, .18);
	}

	.quicreative-hero-video-pc {
		display: none;
	}

	.quicreative-hero-video-sp {
		display: block;
	}

	.quicreative-hero-copy {
		width: 100%;
		box-sizing: border-box;
		padding: 0 24px;
	}

	.quicreative-hero-copy h1 {
		max-width: 100%;
		font-size: clamp(42px, 11.2vw, 50px);
		letter-spacing: clamp(0px, .25vw, 1px);
		white-space: nowrap;
	}

	.quicreative-hero-copy p {
		margin-top: 18px;
		font-size: 11px;
		letter-spacing: .12em;
	}

	.quicreative-local-header {
		top: 0;
		left: 0;
		right: 0;
		height: 67px;
		padding: 0 28px 0 31px;
	}

	.quicreative-local-logo {
		font-size: 30px;
	}

	.quicreative-menu-button {
		width: 57px;
		height: 40px;
	}

	.quicreative-menu-button span {
		width: 53px;
		margin-bottom: 0;
	}

	.quicreative-menu-button span + span {
		margin-top: 13px;
	}

	.quicreative-menu-button b {
		display: none;
	}

	.quicreative-page-header {
		height: 67px;
		padding: 0 28px;
	}

	.quicreative-page-logo {
		font-size: 25px;
	}

	.quicreative-menu-overlay {
		width: 100vw;
		height: 100vh;
		height: 100dvh;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		align-items: flex-start;
		background: transparent;
	}

	.quicreative-menu-panel {
		display: grid;
		grid-template-rows: clamp(340px, 50vh, 475px) minmax(0, auto);
		width: calc(100vw - 14px);
		min-width: 0;
		min-height: 100vh;
		min-height: 100dvh;
		height: auto;
	}

	.quicreative-menu-close {
		top: 14px;
		right: 28px;
		width: 61px;
		height: 36px;
	}

	body.quicreative-projects-route .quicreative-menu-close,
	body.single-quicreative .quicreative-menu-close {
		top: 14px;
		right: 28px;
	}

	.quicreative-menu-close span {
		top: 12px;
		left: 0;
		width: 61px;
	}

	.quicreative-menu-close span:first-child {
		transform: rotate(12deg);
	}

	.quicreative-menu-close span:nth-child(2) {
		transform: rotate(-12deg);
	}

	.quicreative-menu-close b {
		display: none;
	}

	.quicreative-menu-nav {
		justify-content: flex-start;
		gap: clamp(56px, 16vw, 93px);
		padding: clamp(108px, 26vw, 126px) 28px clamp(54px, 14vw, 70px) clamp(56px, 14vw, 94px);
	}

	.quicreative-menu-nav a {
		font-size: clamp(40px, 12.5vw, 65px);
		line-height: .95;
	}

	.quicreative-menu-contact {
		justify-content: flex-start;
		padding: clamp(58px, 15vw, 118px) clamp(24px, 8.5vw, 92px) clamp(96px, 24vw, 128px);
	}

	.quicreative-menu-contact h2 {
		width: 100%;
		font-size: clamp(30px, 10.5vw, 50px);
		line-height: 1;
		text-align: center;
		white-space: nowrap;
	}

	.quicreative-menu-contact p {
		margin-top: clamp(34px, 10vw, 48px);
		font-size: clamp(15px, 4.2vw, 22px);
		line-height: 1.85;
		letter-spacing: .04em;
	}

	.quicreative-menu-contact .quicreative-outline-button {
		margin-top: clamp(36px, 10vw, 48px);
		min-height: clamp(64px, 17vw, 96px);
		font-size: clamp(18px, 5.2vw, 27px);
		letter-spacing: .34em;
	}

	.quicreative-about,
	.quicreative-projects,
	.quicreative-contact {
		padding-left: 30px;
		padding-right: 30px;
	}

	.quicreative-about {
		width: auto;
		padding-top: 136px;
		padding-bottom: 136px;
	}

	.quicreative-about h2,
	.quicreative-projects h2,
	.quicreative-contact h2,
	.quicreative-service h2 {
		font-size: clamp(42px, 13vw, 50px);
	}

	.quicreative-service h2 {
		margin-bottom: 45px;
	}

		.quicreative-about p {
			margin-top: 36px;
			font-size: clamp(13px, 3.7vw, 14px);
			line-height: 2.05;
		}

	.quicreative-about p + p {
		margin-top: 0;
	}

	.quicreative-service {
		padding: 136px 26px 0;
	}

	.quicreative-service-list {
		width: 100%;
	}

		.quicreative-service-item {
			display: block;
			padding-bottom: 106px;
		}

	.quicreative-service-image {
		width: 100%;
		aspect-ratio: 1;
		margin-bottom: 34px;
	}

	.quicreative-service-item:first-child .quicreative-service-image img {
		opacity: .18;
	}

	.quicreative-service-item:first-child .quicreative-service-image {
		background: #4b4b4b;
	}

		.quicreative-service-item:nth-child(1) {
			padding-bottom: 128px;
		}

		.quicreative-service-body {
			display: grid;
			grid-template-columns: max-content minmax(0, 1fr);
			column-gap: 0;
			align-items: start;
		}

		.quicreative-service-number {
			font-size: clamp(22px, 7.4vw, 28px);
			line-height: 1.35;
			font-family: 'Schnyder Wide XL Web', "Noto Serif JP", serif;
			font-weight: inherit;
		}

		.quicreative-service-content h3 {
			display: inline;
			font-size: clamp(22px, 7.4vw, 28px);
			line-height: 1.35;
		}

		.quicreative-service-content p {
			margin-top: 13px;
			padding-left: 0;
			font-size: clamp(14px, 4.2vw, 16px);
			font-weight: normal;
			line-height: 1.5;
			letter-spacing: .08em;
		}

	.quicreative-projects {
		padding: clamp(96px, 36.2vw, 136px) 0 clamp(120px, 42.9vw, 161px);
	}

	.quicreative-projects h2 {
		padding: 0 30px clamp(36px, 12vw, 45px);
		border-bottom: 1px solid #999;
	}

	.quicreative-project-grid {
		grid-template-columns: 1fr;
		width: 100%;
		gap: 0;
		margin: 0;
	}

		.quicreative-project-card {
			background: #fff;
		}

		.quicreative-project-grid .quicreative-project-card {
			margin-bottom: clamp(72px, 28.5vw, 107px);
		}

		.quicreative-project-grid .quicreative-project-card:last-child {
			margin-bottom: 0;
		}

		.quicreative-project-thumb {
			aspect-ratio: 1;
		}

	.quicreative-project-card h3 {
		padding-left: 35px;
		padding-right: 35px;
	}

	.quicreative-project-card h3 {
		margin-top: 33px;
		font-size: 27px;
	}

	.quicreative-projects > .quicreative-outline-button {
		display: none;
	}

	.quicreative-projects-archive {
		min-height: 0;
		padding: calc(67px + clamp(72px, 27vw, 106px)) 0 116px;
	}

	.quicreative-projects-archive h1 {
		font-size: 68px;
	}

	.quicreative-category-select {
		z-index: 3;
		width: calc(100% - 74px);
		min-width: 0;
		margin: 58px 37px 0;
	}

	.quicreative-category-select[open] {
		width: calc(100% - 74px);
		margin-left: 37px;
		margin-right: 37px;
		border-bottom: 0;
	}

		.quicreative-category-select summary {
			width: 100%;
			min-width: 0;
			height: 68px;
			padding: 0 64px 0 28px;
			font-size: 14px;
	}

	.quicreative-category-select summary::after {
		position: absolute;
		right: 28px;
		margin-left: 0;
	}

	/* SPのカテゴリメニューは一覧を押し下げず、カード上に白パネルを重ねる。 */
	.quicreative-category-list {
		display: grid;
		grid-template-columns: 1fr;
		row-gap: 30px;
		padding: 31px 28px 61px;
	}

	.quicreative-category-list a {
		font-size: 14px;
		line-height: 1;
	}

	.quicreative-project-list-grid {
		grid-template-columns: 1fr;
		width: 100%;
		gap: 107px;
		margin-top: 80px;
	}

	.quicreative-project-list-grid .quicreative-project-card h3 {
		padding-left: 35px;
		padding-right: 35px;
	}

	.quicreative-project-list-grid .quicreative-project-card h3 {
		margin-top: 33px;
		font-size: 16px;
	}

	.quicreative-view-more.quicreative-outline-button {
		width: calc(100% - 60px);
		margin: 107px 30px 0;
	}

	/* SP詳細はヘッダー直下にメイン画像を置き、ギャラリーを縦並びにする。 */
	.quicreative-project-detail {
		padding: 67px 0 160px;
		border-bottom: 1px solid #999;
	}

	.quicreative-project-detail-inner {
		width: 100%;
	}

	.quicreative-project-detail-main {
		display: block;
	}

	.quicreative-project-main-image {
		width: 100%;
	}

	.quicreative-project-info {
		padding: 35px 20px 0;
	}

		.quicreative-project-info h1 {
			margin-top: 0;
			font-size: clamp(24px, 8vw, 30px);
			line-height: 1.35;
		}

		.quicreative-project-category {
			margin-top: 22px;
		}

		.quicreative-project-category-name {
			font-size: 12px;
		}

		.quicreative-project-description {
			margin-top: 28px;
			font-size: clamp(14px, 4vw, 15px);
			line-height: 2.05;
		}

		.quicreative-project-credit {
			margin-top: 45px;
			font-size: clamp(13px, 3.7vw, 15px);
			line-height: 1.8;
		}

		.quicreative-project-credit-row {
			column-gap: .4em;
		}

		.quicreative-project-gallery {
			display: block;
		margin-top: 67px;
		padding: 0 31px;
	}

	.quicreative-project-gallery-item + .quicreative-project-gallery-item {
		margin-top: 21px;
	}

		.quicreative-detail-back {
			width: calc(100% - 60px);
			min-width: 0;
			min-height: 63px;
			margin: 104px 30px 0;
			font-size: 16px;
		}

	.quicreative-feature {
		display: block;
		min-height: 0;
		padding-top: 60vw;
		background: #000;
		text-align: left;
	}

	.quicreative-projects-page .quicreative-feature {
		display: block;
	}

	.quicreative-feature::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		height: 60vw;
		background: url("../img/quicreative/quicreative_feature.png") center / cover no-repeat;
	}

	.quicreative-feature-copy {
		position: relative;
		z-index: 1;
		width: auto;
		padding: clamp(47px, 15.2vw, 57px) 30px clamp(113px, 37.3vw, 140px);
	}

	.quicreative-feature-copy h2 {
		margin-left: -20px;
		margin-right: -20px;
		font-size: clamp(29px, 8.7vw, 34px);
		line-height: .95;
		text-align: center;
	}

	.quicreative-feature-copy p {
		width: auto;
		margin-top: clamp(10px, 4vw, 15px);
		font-size: 14px;
		font-weight: 800;
		line-height: 1.9;
	}

	.quicreative-feature-copy p br {
		display: none;
	}

	.quicreative-outline-button-white {
		margin-top: 31px;
		color: #fff;
	}

	.quicreative-contact {
		padding-top: 133px;
		padding-bottom: 142px;
		text-align: left;
	}

	.quicreative-contact h2 {
		font-size: clamp(36px, 11.5vw, 50px);
		text-align: center;
	}

	.quicreative-contact p {
		margin-top: clamp(28px, 9.6vw, 36px);
		font-size: 14px;
		font-weight: normal;
		line-height: 1.9;
	}

	.quicreative-contact p + p {
		margin-top: 0;
	}

	.quicreative-contact .quicreative-outline-button {
		margin-top: 46px;
	}

		.quicreative-outline-button {
			width: 100%;
			min-height: 53px;
		}

		.quicreative-outline-button.quicreative-detail-back {
			width: calc(100% - 60px);
		}

	.quicreative-footer {
		padding: 140px 30px;
		background: #000;
	}

	.quicreative-footer-logo {
		width: 162px;
	}

	.quicreative-footer-logo::after {
		margin-top: 14px;
		font-size: 6px;
	}

	.quicreative-footer nav {
		flex-direction: column;
		gap: 27px;
		margin-top: 70px;
		font-size: 28px;
	}

	.quicreative-footer nav a {
		color: #fff;
	}

	.quicreative-footer-policy,
	.quicreative-footer-copyright {
		display: block;
		font-family: 'Noto Sans JP', sans-serif;
		color: #888;
		text-align: center;
	}

	.quicreative-footer-policy {
		margin-top: 43px;
		font-size: 12px;
		color: #909090;
		font-weight: 700;
	}

	.quicreative-footer-policy,
	.quicreative-footer-policy:visited,
	.quicreative-footer-policy:hover,
	.quicreative-footer-policy:active {
		color: #909090;
	}

	.quicreative-footer-copyright {
		margin-top: 17px;
		font-size: 12px;
		font-weight: 700;
		letter-spacing: .02em;
	}
}