/**
 *
 * page-work.scss
 *
 */
/* ------------------------------------------------------------
 work-nav
------------------------------------------------------------ */
.work-nav {
	position: relative;
	z-index: 1;
}

@media screen and (min-width: 1024px) {
	.work-nav {
		margin-top: 12rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-nav {
		margin-top: 10.2rem ;
	}
}

.work-nav__inner {
	position: relative;
}

.work-nav__header {
	position: relative;
	z-index: 10;
	text-align: center;
}

.work-nav__list {
	position: relative;
	z-index: 10;
}

@media screen and (min-width: 1024px) {
	.work-nav__list {
		margin-top: 3rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-nav__list {
		margin-top: 3.8rem ;
	}
}

/* ----------------------------------------
 work-nav__card
---------------------------------------- */
.work-nav__card a {
	position: relative;
	display: flex;
	align-items: center;
	overflow: visible;
}

@media screen and (min-width: 1024px) {
	.work-nav__card a {
		padding: 4rem 4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-nav__card a {
		padding: 2.7rem 2.7rem ;
	}
}

@media (hover: hover) {
	.work-nav__card a:hover::before {
		-webkit-transform: var(--hover-scale);
		transform: var(--hover-scale);
	}
}

.work-nav__card a::before {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	border-radius: inherit;
	-webkit-filter: var(--shadow);
	filter: var(--shadow);
	background-color: var(--color-bg);
	transition: -webkit-transform var(--transition-hover);
	transition: transform var(--transition-hover);
	transition: transform var(--transition-hover), -webkit-transform var(--transition-hover);
}

@media screen and (min-width: 1024px) {
	.work-nav__card__figure {
		width: 16.1rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-nav__card__figure {
		width: 10.8rem ;
	}
}

.work-nav__card__contents {
	flex: 1;
	padding-right: 5rem ;
}

@media screen and (min-width: 1024px) {
	.work-nav__card__contents {
		margin-left: 3.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-nav__card__contents {
		margin-left: 2.4rem ;
	}
}

/* ---------- work-nav__card__heading ---------- */
.work-nav__card__heading {
	position: absolute;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	display: flex;
	flex-direction: column;
	align-items: center;
}

@media screen and (min-width: 1024px) {
	.work-nav__card__heading {
		gap: 3.4rem ;
		right: 3.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-nav__card__heading {
		gap: 1.2rem ;
		right: 2.2rem ;
	}
}

.work-nav__card__title {
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	font-weight: 700;
	letter-spacing: 0.08em;
}

@media screen and (min-width: 1024px) {
	.work-nav__card__title {
		font-size: var(--font-size20);
	}
}

@media screen and (max-width: 1023px) {
	.work-nav__card__title {
		font-size: var(--font-size16);
	}
}

/* ---------- work-nav__card__num ---------- */
.work-nav__card__num {
	color: var(--color-accent);
	font-family: var(--font-sans-serif);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
	letter-spacing: 0.06em;
}

.work-nav__card__num::before, .work-nav__card__num::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	font-size: inherit;
}

.work-nav__card__num::before {
	margin-top: var(--font-sans-serif-top);
}

.work-nav__card__num::after {
	margin-bottom: var(--font-sans-serif-bottom);
}

@media screen and (min-width: 1024px) {
	.work-nav__card__num {
		font-size: var(--font-size30);
	}
}

@media screen and (max-width: 1023px) {
	.work-nav__card__num {
		font-size: var(--font-size20);
	}
}

/* ---------- work-nav__card__en ---------- */
.work-nav__card__en {
	text-transform: uppercase;
	color: var(--color-accent);
	font-family: var(--font-sans-serif);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
	font-weight: 700;
	letter-spacing: 0.06em;
}

.work-nav__card__en::before, .work-nav__card__en::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	font-size: inherit;
}

.work-nav__card__en::before {
	margin-top: var(--font-sans-serif-top);
}

.work-nav__card__en::after {
	margin-bottom: var(--font-sans-serif-bottom);
}

@media screen and (min-width: 1024px) {
	.work-nav__card__en {
		font-size: var(--font-size16);
		--line-height: 1.3125;
		margin-top: 4.4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-nav__card__en {
		font-size: var(--font-size11);
		--line-height: 1.45455;
		margin-top: 2.9rem ;
	}
}

/* ----------------------------------------
 work-nav__motif
---------------------------------------- */
.work-nav__motif {
	position: absolute;
	z-index: 0;
	pointer-events: none;
}

@media screen and (min-width: 1024px) {
	.work-nav__motif {
		width: 84.1rem ;
		top: -52.7rem ;
		left: -72.1rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-nav__motif {
		width: 41.6rem ;
		top: -13.6rem ;
		left: -23.6rem ;
	}
}

/* ------------------------------------------------------------
 work-item
------------------------------------------------------------ */
.work-item {
	position: relative;
	z-index: 0;
}

@media screen and (min-width: 1024px) {
	.work-item {
		margin-top: 36.1rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item {
		margin-top: 30.7rem ;
	}
}

@media screen and (min-width: 1024px) {
	.work-item + .work-item {
		margin-top: 43rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item + .work-item {
		margin-top: 28.3rem ;
	}
}

/* ----------------------------------------
 work-item__figure
---------------------------------------- */
.work-item__figure {
	position: relative;
	container-type: inline-size;
}

.work-item__figure__inner {
	position: relative;
	z-index: 10;
	overflow: hidden;
}

.work-item__figure__inner figure {
	position: relative;
	left: 50%;
	-webkit-transform: translateX(-50%);
	transform: translateX(-50%);
	-webkit-mask-size: 100% 100%;
	mask-size: 100% 100%;
	-webkit-mask-position: center;
	mask-position: center;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
}

@media screen and (min-width: 1024px) {
	.work-item__figure__inner figure {
		min-width: 100.93333%;
		min-height: 72.9rem ;
		-webkit-mask-image: url("../img/work/item_figure_mask-pc.svg");
		mask-image: url("../img/work/item_figure_mask-pc.svg");
	}
}

@media screen and (max-width: 1023px) {
	.work-item__figure__inner figure {
		min-width: 150.75%;
		min-height: 37.3rem ;
		-webkit-mask-image: url("../img/work/item_figure_mask-sp.svg");
		mask-image: url("../img/work/item_figure_mask-sp.svg");
	}
}

.work-item__figure__inner figure::before {
	content: '';
	display: block;
	width: 100%;
}

@media screen and (min-width: 561px) {
	.work-item__figure__inner figure::before {
		padding-top: 45.16729%;
	}
}

@media screen and (max-width: 560px) {
	.work-item__figure__inner figure::before {
		padding-top: 61.85738%;
	}
}

.work-item__figure__en {
	position: absolute;
	top: 50%;
	left: 0;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	z-index: 1;
	width: 100%;
	color: var(--color-txt2);
	text-transform: uppercase;
	font-family: var(--font-sans-serif);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
	font-weight: 700;
	letter-spacing: 0.06em;
}

.work-item__figure__en::before, .work-item__figure__en::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	font-size: inherit;
}

.work-item__figure__en::before {
	margin-top: var(--font-sans-serif-top);
}

.work-item__figure__en::after {
	margin-bottom: var(--font-sans-serif-bottom);
}

@media screen and (min-width: 1024px) {
	.work-item__figure__en {
		font-size: var(--font-size25);
		padding: 0 var(--contents-lg-outside);
	}
}

@media screen and (max-width: 1023px) {
	.work-item__figure__en {
		font-size: var(--font-size18);
		--line-height: 1.44444;
		padding: 0 var(--contents-2xl-outside);
	}
}

.work-item__figure__en.-right {
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	right: 0;
	left: auto;
}

.work-item__figure__shadow {
	position: absolute;
	z-index: 0;
}

@media screen and (min-width: 1024px) {
	.work-item__figure__shadow {
		width: 95.13333cqw ;
		top: -32cqw ;
		right: -0.46667cqw ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__figure__shadow {
		width: 145.75cqw ;
		top: -59cqw ;
		right: -27.5cqw ;
	}
}

/* ----------------------------------------
 work-item__main
---------------------------------------- */
.work-item__inner {
	position: relative;
}

.work-item__main {
	position: relative;
	z-index: 10;
}

@media screen and (min-width: 1024px) {
	.work-item__main {
		display: flex;
		align-items: flex-start;
		justify-content: space-between;
		margin-top: 7.8rem ;
	}
	.work-item__main.-reverse {
		flex-direction: row-reverse;
	}
	.work-item__main.-reverse .work-item__contents {
		margin-left: auto;
		margin-right: 5.13866%;
	}
	.work-item__main.-reverse .work-item__figure2 {
		margin-left: 6.85155%;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__main {
		margin-top: 5.2rem ;
	}
}

/* ---------- work-nav__card__en ---------- */
.work-item__contents {
	position: relative;
}

@media screen and (min-width: 1024px) {
	.work-item__contents {
		width: 47.06362%;
		margin-top: 3.8rem ;
		margin-left: 5.13866%;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__contents {
		width: var(--contents-xl);
		margin-inline: auto;
	}
}

@media screen and (min-width: 1024px) {
	.work-item__contents__num {
		position: absolute;
		top: -3.4rem ;
		left: -5.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__contents__num {
		margin-inline: auto;
	}
}

.work-item__contents__title {
	letter-spacing: 0.08em;
}

@media screen and (min-width: 1024px) {
	.work-item__contents__title {
		font-size: var(--font-size52);
	}
}

@media screen and (max-width: 1023px) {
	.work-item__contents__title {
		text-align: center;
		font-size: var(--font-size38);
		margin-top: 2.1rem ;
	}
}

.work-item__contents__en {
	color: var(--color-accent);
	text-transform: uppercase;
	font-family: var(--font-sans-serif);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
	font-weight: 700;
	letter-spacing: 0.06em;
}

.work-item__contents__en::before, .work-item__contents__en::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	font-size: inherit;
}

.work-item__contents__en::before {
	margin-top: var(--font-sans-serif-top);
}

.work-item__contents__en::after {
	margin-bottom: var(--font-sans-serif-bottom);
}

@media screen and (min-width: 1024px) {
	.work-item__contents__en {
		font-size: var(--font-size15);
		--line-height: 1.33333;
		margin-top: 3rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__contents__en {
		text-align: center;
		font-size: var(--font-size11);
		--line-height: 1.36364;
		margin-top: 1.9rem ;
	}
}

.work-item__contents__catch {
	letter-spacing: 0.02em;
}

@media screen and (min-width: 1024px) {
	.work-item__contents__catch {
		font-size: var(--font-size30);
		--line-height: 1.8;
		margin-top: 5.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__contents__catch {
		text-align: center;
		font-size: var(--font-size24);
		--line-height: 1.66667;
		margin-top: 3.8rem ;
	}
}

@media screen and (min-width: 1024px) {
	.work-item__contents__txt {
		margin-top: 5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__contents__txt {
		margin-top: 3.5rem ;
	}
}

/* ---------- work-nav__card__en ---------- */
.work-item__figure2 {
	position: relative;
}

@media screen and (min-width: 1024px) {
	.work-item__figure2 {
		width: 30.99511%;
		margin-right: 6.85155%;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__figure2 {
		width: 23.2rem ;
		margin: 6.0rem auto 0;
	}
}

@media screen and (max-width: 1023px) and (min-width: 561px) {
	.work-item__figure2 {
		width: 31.78rem ;
	}
}

@media screen and (max-width: 560px) {
	.work-item__figure2 {
		width: 22.7rem ;
	}
}

.work-item__figure2 > img {
	position: relative;
	z-index: 10;
}

/* ----------------------------------------
 work-item__sections
---------------------------------------- */
.work-item__sections {
	position: relative;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.work-item__sections {
		margin-top: 11.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__sections {
		margin-top: 6.8rem ;
	}
}

@media screen and (max-width: 1023px) and (min-width: 768px) {
	.work-item__sections {
		width: var(--contents-xl);
	}
}

.work-item__section {
	position: relative;
	z-index: 10;
	background-color: var(--color-bg);
}

@media screen and (min-width: 1024px) {
	.work-item__section {
		padding: 6.2rem 4.6rem 4.6rem ;
	}
	.work-item__section:nth-of-type(1) {
		margin-top: 3.8rem ;
	}
}

@media screen and (max-width: 1023px) and (min-width: 768px) {
	.work-item__section {
		padding: 4rem 3rem 3rem ;
	}
}

@media screen and (max-width: 767px) {
	.work-item__section {
		width: calc( 100% - 5vw);
	}
	.work-item__section:nth-of-type(2n-1) {
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
		margin-left: auto;
		margin-right: 0;
		padding: 4rem 2.9rem 2.6rem 2.6rem ;
	}
	.work-item__section:nth-of-type(2n) {
		border-top-left-radius: 0;
		border-bottom-left-radius: 0;
		padding: 4rem 2.6rem 2.6rem 2.9rem ;
	}
}

/* ---------- work-item__section__contents ---------- */
.work-item__section__contents {
	position: relative;
	z-index: 10;
	display: flex;
	flex-direction: row-reverse;
}

@media screen and (min-width: 1024px) {
	.work-item__section__contents {
		padding: 0 0.4rem 0 1.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__section__contents {
		padding: 0 0 0 0.7rem ;
	}
}

/* ----- work-item__section__heading ----- */
.work-item__section__heading {
	display: flex;
	flex-direction: row-reverse;
	align-items: flex-start;
}

@media screen and (min-width: 1024px) {
	.work-item__section__heading {
		margin-left: 5.7rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__section__heading {
		margin-left: 2.2rem ;
	}
}

.work-item__section__sub {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--color-accent);
	color: var(--color-txt2);
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	letter-spacing: 0.08em;
}

@media screen and (min-width: 1024px) {
	.work-item__section__sub {
		width: 3.2rem ;
		height: 9.2rem ;
		font-size: var(--font-size13);
	}
}

@media screen and (max-width: 1023px) {
	.work-item__section__sub {
		width: 2.2rem ;
		height: 6.3rem ;
		font-size: var(--font-size9);
	}
}

.work-item__section__title {
	height: 0;
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	white-space: nowrap;
}

@media screen and (min-width: 1024px) {
	.work-item__section__title {
		font-size: var(--font-size30);
		--line-height: 1.4;
		margin-right: 2.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__section__title {
		font-size: var(--font-size20);
		--line-height: 1.4;
		margin-right: 1rem ;
	}
}

/* ----- work-item__section__txt ----- */
.work-item__section__txt {
	color: var(--color-accent);
}

@media screen and (min-width: 1024px) {
	.work-item__section__txt {
		margin-top: 0.7rem ;
	}
}

/* ---------- work-item__section__figure ---------- */
@media screen and (min-width: 1024px) {
	.work-item__section__figure {
		margin-top: 6rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__section__figure {
		margin-top: 3.3rem ;
	}
}

/* ----------------------------------------
 work-item__motif
---------------------------------------- */
[class*="work-item__motif-"] {
	position: absolute;
	z-index: 0;
	pointer-events: none;
}

@media screen and (min-width: 1024px) {
	.work-item__motif-1 {
		width: 32.8rem ;
		top: -43rem ;
		left: -33rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__motif-1 {
		width: 16.5rem ;
		top: -12.4rem ;
		left: -7rem ;
	}
}

.work-item__motif-2 {
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

@media screen and (min-width: 1024px) {
	.work-item__motif-2 {
		width: 25.2rem ;
		right: -38.1rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__motif-2 {
		width: 14.7rem ;
		right: -19.6rem ;
	}
}

@media screen and (min-width: 1024px) {
	.work-item__motif-3 {
		width: 57.4rem ;
		left: -42.8rem ;
		bottom: -28.6rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__motif-3 {
		width: 31.6rem ;
		top: 50%;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
		left: -16.8rem ;
	}
}

@media screen and (min-width: 1024px) {
	.work-item__motif-4 {
		width: 33.4rem ;
		top: -20.7rem ;
		right: -35.4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__motif-4 {
		width: 21.4rem ;
		top: -20.9rem ;
		right: -9rem ;
	}
}

@media screen and (min-width: 1024px) {
	.work-item__motif-5 {
		width: 68.1rem ;
		top: 34.8rem ;
		left: -60.6rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__motif-5 {
		width: 41.4rem ;
		top: 14.5rem ;
		left: -32.2rem ;
	}
}

@media screen and (min-width: 1024px) {
	.work-item__motif-6 {
		width: 32.5rem ;
		right: 6.7rem ;
		bottom: -11.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-item__motif-6 {
		width: 20.6rem ;
		right: 7rem ;
		bottom: -12.2rem ;
	}
}

/* ------------------------------------------------------------
 work-contact
------------------------------------------------------------ */
@media screen and (min-width: 1024px) {
	.work-contact {
		margin-top: 24.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-contact {
		margin-top: 27.2rem ;
	}
}

.work-contact__header {
	text-align: center;
}

/* ----------------------------------------
 work-contact__list
---------------------------------------- */
.work-contact__list {
	text-align: center;
}

@media screen and (min-width: 1024px) {
	.work-contact__list {
		display: flex;
		margin-top: 4.1rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-contact__list {
		margin-top: 5.3rem ;
	}
}

@media screen and (min-width: 1024px) {
	.work-contact__list li {
		flex-basis: 100%;
		padding: 4.8rem 2rem 5.4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-contact__list li {
		border-bottom: var(--solid3);
		padding-bottom: 3.6rem ;
	}
}

@media screen and (min-width: 1024px) {
	.work-contact__list li + li {
		border-left: var(--solid3);
	}
}

@media screen and (max-width: 1023px) {
	.work-contact__list li + li {
		padding-top: 3.5rem ;
	}
}

/* ---------- work-contact__list__button ---------- */
.work-contact__list__button {
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	margin-inline: auto;
}

@media screen and (min-width: 1024px) {
	.work-contact__list__button {
		height: 5.4rem ;
		margin-top: 3.4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-contact__list__button {
		height: 4.9rem ;
		margin-top: 1.7rem ;
	}
}

.work-contact__list__button a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background-color: var(--color-bg);
	transition: var(--transition-hover);
	transition-property: background-color, color, fill;
}

@media (hover: hover) {
	.work-contact__list__button a:hover {
		background-color: var(--color-accent);
		color: var(--color-txt2);
	}
}

@media screen and (min-width: 1024px) {
	.work-contact__list__button a:has(i) {
		width: 11rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-contact__list__button a:has(i) {
		width: 9.9rem ;
	}
}

@media screen and (min-width: 1024px) {
	.work-contact__list__button a span {
		font-size: var(--font-size15);
		padding: 0 2.6rem 0.1rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-contact__list__button a span {
		font-size: var(--font-size14);
		padding: 0 2.1rem 0.1rem ;
	}
}

/* ---------- work-contact__list__tel ---------- */
.work-contact__list__tel {
	font-family: var(--font-sans-serif);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
	letter-spacing: 0.06em;
}

.work-contact__list__tel::before, .work-contact__list__tel::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	font-size: inherit;
}

.work-contact__list__tel::before {
	margin-top: var(--font-sans-serif-top);
}

.work-contact__list__tel::after {
	margin-bottom: var(--font-sans-serif-bottom);
}

@media screen and (min-width: 1024px) {
	.work-contact__list__tel {
		font-size: var(--font-size31);
		margin-top: 3.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-contact__list__tel {
		font-size: var(--font-size28);
		margin-top: 2.2rem ;
	}
}

.work-contact__list__tel a {
	display: flex;
	align-items: center;
	justify-content: center;
}

@media screen and (min-width: 1024px) {
	.work-contact__list__tel i {
		display: none;
	}
}

@media screen and (max-width: 1023px) {
	.work-contact__list__tel i {
		margin: -2rem 0 -2rem 0.9rem ;
	}
}

.work-contact__list__small {
	color: var(--color-txt6);
	font-weight: 400;
}

@media screen and (min-width: 1024px) {
	.work-contact__list__small {
		font-size: var(--font-size11);
		margin-top: 1.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-contact__list__small {
		font-size: var(--font-size10);
		margin-top: 1.6rem ;
	}
}

/* ------------------------------------------------------------
 work-gallery
------------------------------------------------------------ */
@media screen and (min-width: 1024px) {
	.work-gallery {
		margin-top: 16.4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-gallery {
		margin-top: 14.4rem ;
	}
}

/* ----------------------------------------
 work-gallery__header
---------------------------------------- */
.work-gallery__title {
	color: var(--color-txt7);
	text-transform: uppercase;
	font-family: var(--font-sans-serif);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
	font-weight: 700;
}

.work-gallery__title::before, .work-gallery__title::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	font-size: inherit;
}

.work-gallery__title::before {
	margin-top: var(--font-sans-serif-top);
}

.work-gallery__title::after {
	margin-bottom: var(--font-sans-serif-bottom);
}

@media screen and (min-width: 1024px) {
	.work-gallery__title {
		font-size: var(--font-size110);
	}
}

@media screen and (max-width: 1023px) {
	.work-gallery__title {
		font-size: var(--font-size65);
	}
}

/* ----------------------------------------
 work-gallery__loopslider
---------------------------------------- */
.work-gallery__loopsliders {
	display: grid;
}

@media screen and (min-width: 1024px) {
	.work-gallery__loopsliders {
		gap: 4.6rem ;
		margin-top: 5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-gallery__loopsliders {
		gap: 2.5rem ;
		margin-top: 3.2rem ;
	}
}

@media screen and (min-width: 1024px) {
	.work-gallery__loopslider {
		--width: 27.9rem ;
		--gap: 2.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-gallery__loopslider {
		--width: 15.6rem ;
		--gap: 1.3rem ;
	}
}

.work-gallery__loopslider__zoom {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

@media screen and (min-width: 1024px) {
	.work-gallery__loopslider__zoom {
		--width: 11.1rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-gallery__loopslider__zoom {
		--width: 2.7rem ;
	}
}

@media screen and (min-width: 1024px) {
	.work-gallery__loopslider__zoom div {
		width: 3.3rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-gallery__loopslider__zoom div {
		width: 2.3rem ;
	}
}

.work-gallery__loopslider__zoom p {
	text-transform: uppercase;
	font-family: var(--font-sans-serif);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
	font-weight: 700;
	letter-spacing: 0.1em;
}

.work-gallery__loopslider__zoom p::before, .work-gallery__loopslider__zoom p::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	font-size: inherit;
}

.work-gallery__loopslider__zoom p::before {
	margin-top: var(--font-sans-serif-top);
}

.work-gallery__loopslider__zoom p::after {
	margin-bottom: var(--font-sans-serif-bottom);
}

@media screen and (min-width: 1024px) {
	.work-gallery__loopslider__zoom p {
		font-size: var(--font-size10);
		margin-top: 1.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.work-gallery__loopslider__zoom p {
		font-size: var(--font-size7);
		margin-top: 0.9rem ;
	}
}
/*# sourceMappingURL=sourcemaps/page-work.css.map */