/**
 *
 * page-home.scss
 *
 */
/* ------------------------------------------------------------
 home-kv
------------------------------------------------------------ */
.home-kv {
	position: relative;
}

/* ----------------------------------------
 home-kv__intro
---------------------------------------- */
.home-kv__intro {
	clip-path: inset(0 0 0 0);
}

/* -------------------------
 home-kv__main
------------------------- */
.home-kv__main {
	position: relative;
	z-index: 1;
	height: 100vh;
}

.home-kv__catch {
	position: absolute;
	color: var(--color-txt2);
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	font-family: var(--font-mincho);
	letter-spacing: 0.14em;
}

@media screen and (min-width: 1024px) {
	.home-kv__catch {
		font-size: var(--font-size43);
		--line-height: 1.97674;
		left: 9.33333%;
		bottom: 14.11215%;
	}
}

@media screen and (max-width: 1023px) {
	.home-kv__catch {
		font-size: var(--font-size27);
		--line-height: 1.66667;
		left: 10.75%;
		bottom: 4.86111%;
	}
}

/* -------------------------
 home-kv__contents
------------------------- */
.home-kv__contents {
	position: relative;
	z-index: 1;
}

@media screen and (min-width: 1024px) {
	.home-kv__contents {
		padding: 80vh 0 90vh;
	}
}

@media screen and (max-width: 1023px) {
	.home-kv__contents {
		padding: 40vh 0 60vh;
	}
}

.home-kv__txt {
	font-family: var(--font-mincho);
	font-weight: 500;
}

@media screen and (min-width: 1024px) {
	.home-kv__txt {
		font-size: var(--font-size19);
		--line-height: 2.52632;
		margin-left: 10%;
	}
}

@media screen and (max-width: 1023px) {
	.home-kv__txt {
		font-size: var(--font-size14);
		--line-height: 2.21429;
		letter-spacing: 0.02em;
		margin-left: 7.5%;
	}
}

/* -------------------------
 home-kv__movie
------------------------- */
.home-kv__bg {
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100vw;
	height: 100vh;
}

.home-kv__bg::after {
	content: '';
	display: block;
	width: var(--loading-size);
	height: var(--loading-size);
	background-image: url("../img/common/icon/apng-loading.png");
	background-size: 100% 100%;
	background-position: center;
	background-repeat: no-repeat;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%) rotate(0.00001deg);
	transform: translate(-50%, -50%) rotate(0.00001deg);
	z-index: 10;
	pointer-events: none;
	opacity: .1;
	-webkit-filter: var(--filter-black);
	filter: var(--filter-black);
	transition: opacity var(--transition-icon-show);
}

body.is-load .home-kv__bg::after {
	opacity: 0;
}

.home-kv__bg li {
	opacity: 0;
	transition: opacity var(--transition-slider);
}

.home-kv__bg li.is-active {
	opacity: 1;
}

/* ---------- home-kv__dashed-1 ----------*/
.home-kv__dashed-1,
.home-kv__dashed-2 {
	--border-color: var( --color-txt2 );
	position: absolute;
	width: var(--border-width);
}

@media screen and (max-width: 1023px) {
	.home-kv__dashed-1,
	.home-kv__dashed-2 {
		--border-dashed-size: 6;
		--border-dasharray: 3 3;
		--stitch: 3;
		--gap: 3;
	}
}

.home-kv__dashed-1 {
	--slope-cos: cos( 7deg );
	top: 0;
	bottom: 0;
	height: calc( 100vh / var(--slope-cos));
	-webkit-transform: scale(1, -1) rotate(-7deg);
	transform: scale(1, -1) rotate(-7deg);
}

@media screen and (min-width: 1024px) {
	.home-kv__dashed-1 {
		left: 29.6%;
	}
}

@media screen and (max-width: 1023px) {
	.home-kv__dashed-1 {
		left: 34.25%;
	}
}

/* ---------- home-kv__dashed-2 ----------*/
.home-kv__dashed-2 {
	--slope-cos: cos( 39deg );
	top: 0;
	right: 0;
	-webkit-transform: rotate(-39deg);
	transform: rotate(-39deg);
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
}

@media screen and (min-width: 1024px) {
	.home-kv__dashed-2 {
		height: calc( 47.2vh / var(--slope-cos));
		right: 37.5vh;
	}
}

@media screen and (max-width: 1023px) {
	.home-kv__dashed-2 {
		height: calc( 24.65vh / var(--slope-cos));
		right: 19.44444vh;
	}
}

/* ----------------------------------------
 home-kv__movie
---------------------------------------- */
.home-kv__movie {
	position: relative;
	--slope-height: calc( 100vw * tan(2deg) );
	clip-path: polygon(0 var(--slope-height), 100% 0, 100% 100%, 0% 100%);
	margin-top: calc( var(--slope-height) * -1);
	height: 120vh;
}

.home-kv__movie__button {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.home-kv__movie__button__circle {
	position: relative;
	aspect-ratio: 162 / 162;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	border: var(--solid-current);
	color: var(--color-txt2);
	text-align: center;
	font-family: var(--font-sans-serif);
	letter-spacing: 0.08em;
	pointer-events: none;
	opacity: 0;
}

@media screen and (min-width: 1024px) {
	.home-kv__movie__button__circle {
		width: 16.2rem ;
		font-size: var(--font-size16);
		line-height: calc( 17 / 16 * 1em);
	}
}

@media screen and (max-width: 1023px) {
	.home-kv__movie__button__circle {
		width: 10rem ;
		font-size: var(--font-size13);
		line-height: calc( 17 / 13 * 1em);
	}
}

body.ua-not-hover .home-kv__movie__button__circle {
	opacity: 1;
}

.home-kv__movie__bg {
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100vw;
	height: 100vh;
}

/* ------------------------------------------------------------
 home-about
------------------------------------------------------------ */
@media screen and (min-width: 1024px) {
	.home-about {
		margin-top: 35rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-about {
		margin-top: 7.5rem ;
	}
}

.home-about__inner {
	position: relative;
}

/* ----------------------------------------
 home-about__figure
---------------------------------------- */
.home-about__figure {
	position: relative;
	aspect-ratio: 666 / 548;
	z-index: 0;
}

@media screen and (min-width: 1024px) {
	.home-about__figure {
		position: absolute;
		top: -25rem ;
		left: calc( 50% - 0.3rem);
		width: 66.6rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-about__figure {
		margin-inline: auto;
		width: 33.4rem ;
	}
}

@media screen and (max-width: 1023px) and (min-width: 561px) {
	.home-about__figure {
		width: 46.76rem ;
	}
}

@media screen and (max-width: 560px) {
	.home-about__figure {
		width: 33.4rem ;
	}
}

.home-about__figure::before {
	content: '';
	display: block;
	width: 100%;
	height: 100%;
	background-image: url("../img/home/about_video_over.svg");
	background-size: 100% 100%;
	background-position: center;
	background-repeat: no-repeat;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 10;
}

.home-about__figure video,
.home-about__figure img {
	-webkit-mask-image: url("../img/home/about_video_mask.svg");
	mask-image: url("../img/home/about_video_mask.svg");
	-webkit-mask-size: 100%;
	mask-size: 100%;
	-webkit-mask-size: cover;
	mask-size: cover;
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
}

/* ----------------------------------------
 home-about__contents
---------------------------------------- */
.home-about__contents {
	position: relative;
	z-index: 10;
}

@media screen and (min-width: 1024px) {
	.home-about__contents {
		margin-left: 11%;
	}
}

@media screen and (max-width: 1023px) {
	.home-about__contents {
		width: 78%;
		margin-inline: auto;
		margin-top: 6.1rem ;
	}
}

.home-about__txt {
	color: var(--color-txt7);
}

@media screen and (min-width: 1024px) {
	.home-about__txt {
		margin-top: 7.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-about__txt {
		margin-top: 6rem ;
	}
}

@media screen and (min-width: 1024px) {
	.home-about__button {
		margin-top: 6.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-about__button {
		margin-top: 5rem ;
	}
}

/* ------------------------------------------------------------
 home-piece
------------------------------------------------------------ */
@media screen and (min-width: 1024px) {
	.home-piece {
		margin-top: 16.7rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-piece {
		margin-top: 12.1rem ;
	}
}

.home-piece__inner {
	position: relative;
}

@media screen and (max-width: 1023px) {
	.home-piece__inner {
		width: 91.25%;
		margin: 0 0 0 auto;
	}
}

/* ----------------------------------------
 home-piece__figure
---------------------------------------- */
.home-piece__figure {
	position: relative;
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	margin: 0 0 0 auto;
}

@media screen and (min-width: 1024px) {
	.home-piece__figure {
		width: 83.33333%;
		height: 105.2rem ;
	}
}

@media screen and (max-width: 1023px) and (min-width: 561px) {
	.home-piece__figure {
		height: 70.56rem ;
	}
}

@media screen and (max-width: 560px) {
	.home-piece__figure {
		height: 58.8rem ;
	}
}

/* ---------- home-piece__figure__heading ---------- */
.home-piece__figure__heading {
	position: absolute;
	top: 33.7rem ;
	right: 10.72%;
	z-index: 10;
	display: flex;
	flex-direction: row-reverse;
}

@media screen and (max-width: 1023px) {
	.home-piece__figure__heading {
		display: none;
	}
}

.home-piece__figure__en {
	margin-left: 3.8rem ;
}

.home-piece__figure__en span {
	display: block;
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	font-family: var(--font-sans-serif);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
	font-size: var(--font-size14);
}

.home-piece__figure__en span::before, .home-piece__figure__en span::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	font-size: inherit;
}

.home-piece__figure__en span::before {
	margin-right: var(--font-sans-serif-top);
}

.home-piece__figure__en span::after {
	margin-left: var(--font-sans-serif-bottom);
}

.home-piece__figure__en span + span {
	margin-top: 1.5rem ;
}

.home-piece__figure__catch {
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	font-family: var(--font-mincho);
	font-size: var(--font-size22);
	--line-height: 2.27273;
	letter-spacing: 0.06em;
}

/* ----------------------------------------
 home-piece__contents
---------------------------------------- */
.home-piece__contents {
	z-index: 10;
}

@media screen and (min-width: 1024px) {
	.home-piece__contents {
		position: absolute;
		top: 51.3%;
		left: 7%;
		-webkit-transform: translateY(-50%);
		transform: translateY(-50%);
	}
}

@media screen and (max-width: 1023px) {
	.home-piece__contents {
		position: relative;
		margin-top: -12.4rem ;
	}
}

.home-piece__dashed {
	--border-color: var( --color-line5 );
}

@media screen and (min-width: 1024px) {
	.home-piece__dashed {
		width: 94.33962%;
		top: -16.2rem ;
		left: -28.30189%;
	}
}

@media screen and (max-width: 1023px) {
	.home-piece__dashed {
		--border-dashed-size: 6;
		--border-dasharray: 3 3;
		--stitch: 3;
		--gap: 3;
		width: 52.87671%;
		top: 5.7rem ;
		left: -9.58904%;
	}
}

@media screen and (min-width: 1024px) {
	.home-piece__title {
		width: 37.1rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-piece__title {
		width: 24.3rem ;
		margin-inline: auto;
	}
}

.home-piece__title img {
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}

.home-piece__catch {
	font-family: var(--font-mincho);
	font-weight: 500;
	letter-spacing: 0.06em;
}

@media screen and (min-width: 1024px) {
	.home-piece__catch {
		font-size: var(--font-size24);
		margin-top: 4.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-piece__catch {
		text-align: center;
		font-size: var(--font-size18);
		margin-top: 4.8rem ;
	}
}

.home-piece__txt {
	font-family: var(--font-mincho);
	font-weight: 500;
	letter-spacing: 0.04em;
}

@media screen and (min-width: 1024px) {
	.home-piece__txt {
		font-size: var(--font-size16);
		--line-height: 2.125;
		margin-top: 7.4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-piece__txt {
		text-align: center;
		font-size: var(--font-size13);
		--line-height: 2;
		margin-top: 3.9rem ;
	}
}

@media screen and (min-width: 1024px) {
	.home-piece__button {
		margin-top: 8.6rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-piece__button {
		display: flex;
		justify-content: center;
		margin-top: 4rem ;
	}
}

/* ------------------------------------------------------------
 home-service
------------------------------------------------------------ */
@media screen and (min-width: 1024px) {
	.home-service {
		margin-top: 20.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-service {
		margin-top: 14.5rem ;
	}
}

@media screen and (min-width: 1024px) {
	.home-service__inner {
		padding-right: 1.8rem ;
	}
}

.home-service__title {
	-webkit-font-feature-settings: 'palt' 1;
	font-feature-settings: 'palt' 1;
}

@media screen and (min-width: 1024px) {
	.home-service__title {
		padding: 0 6.3rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-service__title {
		padding: 0 2.5rem ;
	}
}

/* ----------------------------------------
 home-service__list
---------------------------------------- */
@media screen and (min-width: 1024px) {
	.home-service__list {
		margin-top: 10rem ;
	}
}

@media screen and (min-width: 561px) {
	.home-service__list {
		display: flex;
	}
}

@media screen and (max-width: 1023px) {
	.home-service__list {
		margin-top: 5.8rem ;
	}
}

.home-service__item {
	position: relative;
}

@media screen and (min-width: 561px) {
	.home-service__item {
		flex-basis: 100%;
		display: flex;
		flex-direction: column;
	}
	.home-service__item::before {
		content: '';
		display: block;
		height: calc( 100% - 9.0rem);
		position: absolute;
		left: 0;
		bottom: 0;
		border-left: var(--solid);
	}
}

@media screen and (min-width: 1024px) {
	.home-service__item {
		padding: 0 3.7rem 8.8rem 6.8rem ;
	}
}

@media screen and (max-width: 1023px) and (min-width: 561px) {
	.home-service__item {
		padding: 0 2.96rem 7.04rem 5.44rem ;
	}
}

@media screen and (max-width: 560px) {
	.home-service__item {
		padding: 0 3.5rem 0 2.5rem ;
	}
	.home-service__item + .home-service__item {
		border-top: var(--solid);
		margin-top: 5.4rem ;
		padding-top: 5.4rem ;
	}
}

/* ---------- home-service__item__figure ---------- */
.home-service__item__figure {
	display: flex;
	justify-content: space-between;
}

@media screen and (min-width: 1024px) {
	.home-service__item__figure {
		align-items: center;
	}
}

@media screen and (min-width: 1024px) {
	.home-service__item__figure figure {
		min-width: 20rem ;
		width: 43.29004%;
	}
}

@media screen and (max-width: 1023px) {
	.home-service__item__figure figure {
		min-width: 12rem ;
		width: 42.85714%;
	}
}

.home-service__item__figure figure.-line5 {
	border: var(--solid5);
}

.home-service__item__figure figure.-line9 {
	border: var(--solid9);
}

.home-service__item__en {
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	font-family: var(--font-sans-serif);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
	letter-spacing: 0.06em;
}

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

.home-service__item__en::before {
	margin-right: var(--font-sans-serif-top);
}

.home-service__item__en::after {
	margin-left: var(--font-sans-serif-bottom);
}

@media screen and (min-width: 1024px) {
	.home-service__item__en {
		font-size: var(--font-size22);
		--line-height: 1.18182;
		margin-top: 4.4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-service__item__en {
		font-size: var(--font-size16);
		--line-height: 1.625;
		margin-top: 3.1rem ;
	}
}

/* ---------- home-service__item__figure ---------- */
.home-service__item__title {
	font-family: var(--font-mincho);
	font-weight: 500;
	letter-spacing: 0.02em;
}

@media screen and (min-width: 1024px) {
	.home-service__item__title {
		font-size: var(--font-size24);
		--line-height: 1.66667;
		margin-top: 7rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-service__item__title {
		--line-height: 1.7;
		margin-top: 3.8rem ;
	}
}

@media screen and (max-width: 1023px) and (min-width: 561px) {
	.home-service__item__title {
		font-size: var(--font-size17);
	}
}

@media screen and (max-width: 560px) {
	.home-service__item__title {
		font-size: var(--font-size20);
	}
}

/* ---------- home-service__item__figure ---------- */
.home-service__item__txt {
	color: var(--color-txt12);
}

@media screen and (min-width: 1024px) {
	.home-service__item__txt {
		width: 73.16017%;
		margin-top: 5.5rem ;
		margin-bottom: 6.7rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-service__item__txt {
		margin-top: 3.1rem ;
		margin-bottom: 3.7rem ;
	}
}

/* ---------- home-service__item__figure ---------- */
@media screen and (min-width: 561px) {
	.home-service__item__button {
		margin-top: auto;
	}
}

/* ------------------------------------------------------------
 home-kiyasuto
------------------------------------------------------------ */
@media screen and (min-width: 1024px) {
	.home-kiyasuto {
		margin-top: 14rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-kiyasuto {
		margin-top: 15.7rem ;
	}
}

.home-kiyasuto__inner {
	position: relative;
	z-index: 10;
}

@media screen and (min-width: 768px) {
	.home-kiyasuto__inner {
		display: flex;
		align-items: flex-start;
	}
}

/* ----------------------------------------
 home-kiyasuto__figure
---------------------------------------- */
.home-kiyasuto__figure {
	position: relative;
}

@media screen and (min-width: 1024px) {
	.home-kiyasuto__figure {
		width: 69.2%;
		margin-top: 10.1rem ;
	}
}

@media screen and (max-width: 1023px) and (min-width: 768px) {
	.home-kiyasuto__figure {
		width: 65%;
	}
}

@media screen and (max-width: 767px) {
	.home-kiyasuto__figure {
		width: 100%;
	}
}

.home-kiyasuto__figure figure {
	position: relative;
	z-index: 0;
	overflow: hidden;
	border-top-right-radius: 38.05395% 52.45684%;
}

.home-kiyasuto__figure__dashed-pc {
	--border-color: var( --color-line12 );
	position: absolute;
	z-index: 1;
	width: 22.44701%;
	right: 1.15607%;
	bottom: -0.53121%;
}

@media screen and (max-width: 1023px) {
	.home-kiyasuto__figure__dashed-pc {
		display: none;
	}
}

.home-kiyasuto__figure__dashed-sp {
	--border-color: var( --color-line12 );
	--border-dashed-size: 6;
	--border-dasharray: 3 3;
	--stitch: 3;
	--gap: 3;
	position: absolute;
	z-index: 1;
	width: 22.5%;
	right: 1.75%;
	bottom: -1.37931%;
}

@media screen and (min-width: 1024px) {
	.home-kiyasuto__figure__dashed-sp {
		display: none;
	}
}

/* ----------------------------------------
 home-kiyasuto__contents
---------------------------------------- */
@media screen and (min-width: 768px) {
	.home-kiyasuto__contents {
		flex: 1;
		margin-left: 4.8%;
	}
}

@media screen and (max-width: 767px) {
	.home-kiyasuto__contents {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-top: 4.2rem ;
	}
}

/* ---------- home-kiyasuto__txt ---------- */
.home-kiyasuto__txt {
	-webkit-writing-mode: vertical-rl;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	font-family: var(--font-mincho);
}

@media screen and (min-width: 1024px) {
	.home-kiyasuto__txt {
		font-size: var(--font-size19);
		--line-height: 2.31579;
		letter-spacing: 0.06em;
	}
}

@media screen and (max-width: 1023px) and (min-width: 768px) {
	.home-kiyasuto__txt {
		font-size: var(--font-size13);
		--line-height: 2.31579;
		letter-spacing: 0.02em;
	}
}

@media screen and (max-width: 767px) {
	.home-kiyasuto__txt {
		font-size: var(--font-size15);
		--line-height: 2.4;
		letter-spacing: 0.04em;
	}
}

/* ---------- home-kiyasuto__header ---------- */
@media screen and (min-width: 1024px) {
	.home-kiyasuto__header {
		margin-top: 18.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-kiyasuto__header {
		margin-top: 5rem ;
	}
}

@media screen and (min-width: 1024px) {
	.home-kiyasuto__title {
		width: 21.5rem ;
		margin-left: 0.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-kiyasuto__title {
		width: 16.5rem ;
	}
}

@media screen and (min-width: 1024px) {
	.home-kiyasuto__catch {
		width: 21.1rem ;
		margin-top: 4.6rem ;
		margin-left: 0.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-kiyasuto__catch {
		width: 16.3rem ;
		margin-top: 2.1rem ;
	}
}

@media screen and (min-width: 1024px) {
	.home-kiyasuto__button {
		margin-top: 6.2rem ;
		margin-left: 1rem ;
	}
}

@media screen and (max-width: 1023px) and (min-width: 768px) {
	.home-kiyasuto__button {
		margin-top: 3rem ;
	}
}

@media screen and (max-width: 767px) {
	.home-kiyasuto__button {
		display: flex;
		justify-content: center;
		margin-top: 4rem ;
	}
}

/* ------------------------------------------------------------
 home-works
------------------------------------------------------------ */
.home-works {
	position: relative;
	overflow-x: clip;
	overflow-y: visible;
	background-color: var(--color-bg2);
}

@media screen and (min-width: 1024px) {
	.home-works {
		padding: 20rem 0 18.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-works {
		padding: 10.6rem 0 11.4rem ;
	}
}

@media screen and (max-width: 767px) {
	.home-works {
		margin-top: 10.1rem ;
	}
}

@media screen and (min-width: 768px) {
	.home-works::before {
		content: '';
		display: block;
		width: 100%;
		height: 8.8rem ;
		position: absolute;
		left: 0;
		bottom: 100%;
		background-color: var(--color-bg2);
	}
}

.home-works__inner {
	position: relative;
}

/* ----------------------------------------
 home-works__list
---------------------------------------- */
@media screen and (min-width: 1024px) {
	.home-works__list {
		margin-top: 6.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-works__list {
		margin-top: 4rem ;
	}
}

/* ----------------------------------------
 home-works__button
---------------------------------------- */
@media screen and (min-width: 1024px) {
	.home-works__button {
		position: absolute;
		top: 0.4rem ;
		right: 0;
	}
}

@media screen and (max-width: 1023px) {
	.home-works__button {
		display: flex;
		justify-content: center;
		margin-top: 3.5rem ;
	}
}

/* ------------------------------------------------------------
 home-flow
------------------------------------------------------------ */
.home-flow {
	position: relative;
	z-index: 0;
	overflow: hidden;
}

@media screen and (min-width: 1024px) {
	.home-flow {
		margin-top: 16.4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-flow {
		margin-top: 8rem ;
	}
}

.home-flow__inner {
	position: relative;
}

/* ----------------------------------------
 home-flow__header
---------------------------------------- */
@media screen and (min-width: 1024px) {
	.home-flow__header {
		padding: 0 5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-flow__header {
		text-align: center;
	}
}

/* ----------------------------------------
 home-flow__list
---------------------------------------- */
.home-flow__list {
	position: relative;
}

@media screen and (min-width: 1024px) {
	.home-flow__list {
		width: calc( 100% - 13.6rem);
		margin-top: 5.2rem ;
		margin-left: auto;
		margin-right: 0;
	}
}

@media screen and (max-width: 1023px) {
	.home-flow__list {
		display: flex;
		flex-direction: column-reverse;
		margin-top: 4rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-flow__list .swiper-wrapper {
		margin-top: 3rem ;
	}
}

/* ---------- home-flow__item ---------- */
.home-flow__item {
	border-left: var(--solid);
}

@media screen and (min-width: 1024px) {
	.home-flow__item {
		width: 57rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-flow__item {
		width: 30rem ;
	}
}

.home-flow__item:last-of-type {
	width: var(--contents);
}

@media screen and (min-width: 1024px) {
	.home-flow__item__inner {
		width: 57rem ;
		padding: 3.8rem 6rem 5.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-flow__item__inner {
		width: 30rem ;
		padding: 2.4rem 3.3rem 6.8rem ;
	}
}

/* ----- home-flow__item__num ----- */
.home-flow__item__num {
	display: flex;
	align-items: flex-end;
}

.home-flow__item__num span {
	display: block;
	font-family: var(--font-sans-serif);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
}

.home-flow__item__num span::before, .home-flow__item__num span::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	font-size: inherit;
}

.home-flow__item__num span::before {
	margin-top: var(--font-sans-serif-top);
}

.home-flow__item__num span::after {
	margin-bottom: var(--font-sans-serif-bottom);
}

@media screen and (min-width: 1024px) {
	.home-flow__item__num span {
		font-size: var(--font-size26);
	}
}

@media screen and (max-width: 1023px) {
	.home-flow__item__num span {
		font-size: var(--font-size21);
	}
}

@media screen and (min-width: 1024px) {
	.home-flow__item__num span:nth-of-type(1) {
		margin-bottom: 0.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-flow__item__num span:nth-of-type(1) {
		margin-bottom: 0.1rem ;
	}
}

@media screen and (min-width: 1024px) {
	.home-flow__item__num span:nth-of-type(2) {
		margin-left: 0.7rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-flow__item__num span:nth-of-type(2) {
		margin-left: 0.4rem ;
	}
}

/* ----- home-flow__item__title ----- */
.home-flow__item__title {
	font-family: var(--font-mincho);
	font-weight: 500;
	letter-spacing: 0.06em;
}

@media screen and (min-width: 1024px) {
	.home-flow__item__title {
		font-size: var(--font-size22);
		--line-height: 1.54545;
		margin-top: 8.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-flow__item__title {
		font-size: var(--font-size18);
		--line-height: 1.66667;
		margin-top: 5.3rem ;
	}
}

/* ----- home-flow__item__flex ----- */
@media screen and (min-width: 1024px) {
	.home-flow__item__flex {
		display: flex;
		margin-top: 9.7rem ;
	}
}

/* --- home-flow__item__figure --- */
@media screen and (min-width: 1024px) {
	.home-flow__item__figure {
		width: 18rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-flow__item__figure {
		height: 14.3rem ;
		display: flex;
		align-items: center;
		padding-left: 1.5rem ;
	}
}

@media screen and (min-width: 1024px) {
	.home-flow__item__figure img {
		width: var(--width);
		margin-top: var(--margin-top);
		margin-left: var(--margin-left);
	}
}

@media screen and (max-width: 1023px) {
	.home-flow__item__figure img {
		width: calc( var(--width) * .8095);
	}
}

.home-flow__item__figure [src*="flow_1"] {
	--width: 10.5rem ;
	--margin-top: 0.3rem ;
	--margin-left: 1.2rem ;
}

.home-flow__item__figure [src*="flow_2"] {
	--width: 12.1rem ;
	--margin-top: -0.3rem ;
	--margin-left: -0.9rem ;
}

.home-flow__item__figure [src*="flow_3"] {
	--width: 9.9rem ;
	--margin-top: -0.4rem ;
	--margin-left: 1.4rem ;
}

.home-flow__item__figure [src*="flow_4"] {
	--width: 11.8rem ;
	--margin-top: -1.9rem ;
	--margin-left: 0.9rem ;
}

.home-flow__item__figure [src*="flow_5"] {
	--width: 12.4rem ;
	--margin-top: -0.6rem ;
	--margin-left: -0.3rem ;
}

.home-flow__item__figure [src*="flow_6"] {
	--width: 11.2rem ;
	--margin-top: -1.3rem ;
	--margin-left: 0 ;
}

.home-flow__item__figure [src*="flow_7"] {
	--width: 12.4rem ;
	--margin-top: -1.5rem ;
	--margin-left: -0.2rem ;
}

/* --- home-flow__item__contents --- */
@media screen and (min-width: 1024px) {
	.home-flow__item__contents {
		flex: 1;
	}
}

.home-flow__item__txt {
	color: var(--color-txt7);
}

.home-flow__item__button {
	margin-top: 3.2rem ;
}

/* ----------------------------------------
 home-flow__nav
---------------------------------------- */
.home-flow__nav {
	display: flex;
	align-items: center;
	justify-content: center;
}

@media screen and (min-width: 1024px) {
	.home-flow__nav {
		position: absolute;
		top: 0;
		left: auto;
		bottom: 0px;
		right: 100%;
		width: 13.6rem ;
		z-index: 100;
		flex-direction: column;
		gap: 0.7rem ;
	}
	.home-flow__nav::before {
		content: '';
		display: block;
		width: 100vw;
		height: 100%;
		position: absolute;
		top: 0;
		right: 0;
		z-index: 1;
		background-color: var(--color-bg);
	}
}

@media screen and (max-width: 1023px) {
	.home-flow__nav {
		gap: 0.4rem ;
	}
}

.home-flow__nav li {
	position: relative;
	z-index: 2;
}

.home-flow__nav li.is-active button {
	pointer-events: none;
	background-color: var(--color-bg3);
}

.home-flow__nav button {
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background-color: var(--color-bg);
	color: var(--color-txt);
	transition: var(--transition-hover);
	transition-property: background-color, color;
}

@media screen and (min-width: 1024px) {
	.home-flow__nav button {
		width: 4.2rem ;
		height: 4.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-flow__nav button {
		width: 3.8rem ;
		height: 3.8rem ;
	}
}

@media (hover: hover) {
	.home-flow__nav button:hover {
		background-color: var(--color-main);
		color: var(--color-txt2);
	}
}

.home-flow__nav span {
	display: block;
	font-family: var(--font-sans-serif);
	padding-top: 0.1px;
	padding-bottom: 0.1px;
}

.home-flow__nav span::before, .home-flow__nav span::after {
	content: '';
	display: block;
	width: 0;
	height: 0;
	font-size: inherit;
}

.home-flow__nav span::before {
	margin-top: var(--font-sans-serif-top);
}

.home-flow__nav span::after {
	margin-bottom: var(--font-sans-serif-bottom);
}

@media screen and (min-width: 1024px) {
	.home-flow__nav__sharp {
		font-size: var(--font-size14);
	}
}

@media screen and (max-width: 1023px) {
	.home-flow__nav__sharp {
		font-size: var(--font-size11);
		margin-bottom: 0.2rem ;
	}
}

@media screen and (min-width: 1024px) {
	.home-flow__nav__num {
		font-size: var(--font-size18);
		margin-left: 0.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-flow__nav__num {
		font-size: var(--font-size14);
		margin-left: 0.1rem ;
	}
}

/* ------------------------------------------------------------
 home-request
------------------------------------------------------------ */
@media screen and (min-width: 1024px) {
	.home-request {
		margin-top: 13.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-request {
		margin-top: 5rem ;
	}
}

/* ------------------------------------------------------------
 home-news
------------------------------------------------------------ */
@media screen and (min-width: 1024px) {
	.home-news {
		margin-top: 16.7rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-news {
		margin-top: 8.4rem ;
	}
}

.home-news__inner {
	position: relative;
}

@media screen and (min-width: 1024px) {
	.home-news__inner {
		display: flex;
		justify-content: space-between;
	}
}

/* ----------------------------------------
 home-news__header
---------------------------------------- */
@media screen and (min-width: 1024px) {
	.home-news__header {
		width: 17.53846%;
		min-height: 18rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-news__header {
		text-align: center;
	}
}

/* ----------------------------------------
 home-news__main
---------------------------------------- */
@media screen and (min-width: 1024px) {
	.home-news__main {
		width: 82.61538%;
		padding-top: 0.6rem ;
	}
}

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

/* ----------------------------------------
 home-news__button
---------------------------------------- */
@media screen and (min-width: 1024px) {
	.home-news__button {
		position: absolute;
		left: 0;
		bottom: 1rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-news__button {
		display: flex;
		justify-content: center;
		margin-top: 3.1rem ;
	}
}

/* ------------------------------------------------------------
 home-contents
------------------------------------------------------------ */
.home-contents {
	position: relative;
}

@media screen and (min-width: 1024px) {
	.home-contents {
		margin-top: 17.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-contents {
		margin-top: 10.8rem ;
	}
}

/* ---------- home-contents__dashed ---------- */
.home-contents__dashed {
	--border-color: var( --color-line4 );
	position: absolute;
	left: 0;
	z-index: 10000;
}

@media screen and (min-width: 1024px) {
	.home-contents__dashed {
		width: 96%;
		top: 4rem ;
	}
}

/* ---------- home-contents__list ---------- */
.home-contents__list {
	display: grid;
}

@media screen and (min-width: 561px) {
	.home-contents__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 3.6rem ;
	}
}

@media screen and (max-width: 560px) {
	.home-contents__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0.7rem ;
	}
}

@media screen and (min-width: 1024px) {
	.home-contents__item {
		height: 58.3rem ;
	}
}

@media screen and (max-width: 1023px) and (min-width: 561px) {
	.home-contents__item {
		height: 23.32rem ;
	}
}

@media screen and (max-width: 560px) {
	.home-contents__item.-type1 {
		height: 25.3rem ;
	}
	.home-contents__item.-type1 a {
		padding: 2.7rem 10.79545%;
	}
	.home-contents__item.-type2 {
		grid-area: 1 / 1 / 2 / 3;
		height: 17.8rem ;
	}
	.home-contents__item.-type2 a {
		justify-content: center;
		padding: 2rem 7.77778% 0;
	}
}

.home-contents__item a {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	color: var(--color-txt2);
	white-space: nowrap;
}

@media screen and (min-width: 1024px) {
	.home-contents__item a {
		padding: 9.4rem 12.56684%;
	}
}

@media screen and (max-width: 1023px) and (min-width: 561px) {
	.home-contents__item a {
		justify-content: center;
		padding: 5rem 12.56684%;
	}
}

@media screen and (min-width: 1024px) {
	.home-contents__item i {
		margin-top: 3rem ;
		margin-left: 0.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-contents__item i {
		margin-top: 1.9rem ;
		margin-left: 0.3rem ;
	}
}

/* ------------------------------------------------------------
 home-contact
------------------------------------------------------------ */
.home-contact {
	border-top: var(--solid);
}

@media screen and (min-width: 1024px) {
	.home-contact {
		margin-top: 13.2rem ;
	}
}

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

.home-contact__column {
	display: grid;
}

@media screen and (min-width: 1024px) {
	.home-contact__column {
		grid-template-columns: 1133fr 366fr;
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__column {
		grid-template-columns: 1fr 1fr;
	}
}

/* ----------------------------------------
 home-contact__contact
---------------------------------------- */
@media screen and (min-width: 1024px) {
	.home-contact__contact {
		grid-area: 1 / 1 / 3 / 2;
		border-right: var(--solid);
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__contact {
		grid-area: 2 / 1 / 3 / 3;
		height: 26.6rem ;
		border-top: var(--solid);
	}
}

.home-contact__contact a {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 100%;
	height: 100%;
}

@media screen and (min-width: 1024px) {
	.home-contact__contact a {
		padding: 0 14.65137% 4rem;
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__contact a {
		padding: 0 14.5% 2rem;
	}
}

.home-contact__contact__txt {
	font-family: var(--font-mincho);
	font-weight: 500;
}

@media screen and (min-width: 1024px) {
	.home-contact__contact__txt {
		font-size: var(--font-size18);
		--line-height: 1.88889;
		letter-spacing: 0.02em;
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__contact__txt {
		font-size: var(--font-size14);
		--line-height: 2;
		letter-spacing: 0.06em;
	}
}

.home-contact__contact__flex {
	display: flex;
	align-items: center;
}

@media screen and (min-width: 1024px) {
	.home-contact__contact__flex {
		margin-top: 4.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__contact__flex {
		margin-top: 3.6rem ;
	}
}

@media screen and (min-width: 1024px) {
	.home-contact__contact__flex i {
		margin-left: 3rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__contact__flex i {
		margin-left: 2rem ;
	}
}

.home-contact__contact__title {
	font-family: var(--font-mincho);
	font-weight: 500;
	letter-spacing: 0.06em;
}

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

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

/* ----------------------------------------
 home-contact__sns
---------------------------------------- */
@media screen and (min-width: 1024px) {
	.home-contact__sns {
		height: 24.2rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__sns {
		height: 19rem ;
	}
}

@media screen and (min-width: 1024px) {
	.home-contact__sns.-note {
		grid-area: 1 / 2 / 2 / 3;
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__sns.-note {
		grid-area: 1 / 1 / 2 / 2;
	}
}

@media screen and (min-width: 1024px) {
	.home-contact__sns.-note .home-contact__sns__logo {
		margin-bottom: 3.5rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__sns.-note .home-contact__sns__logo {
		margin-bottom: 3.2rem ;
	}
}

@media screen and (min-width: 1024px) {
	.home-contact__sns.-note .home-contact__sns__logo, .home-contact__sns.-note .home-contact__sns__logo svg {
		width: 8.4rem ;
		height: 1.8rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__sns.-note .home-contact__sns__logo, .home-contact__sns.-note .home-contact__sns__logo svg {
		width: 6.2rem ;
		height: 1.3rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__sns.-note .home-contact__sns__txt {
		padding-left: 0.5em;
	}
}

@media screen and (min-width: 1024px) {
	.home-contact__sns.-instagram {
		grid-area: 2 / 2 / 3 / 3;
		border-top: var(--solid);
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__sns.-instagram {
		grid-area: 1 / 2 / 2 / 3;
		border-left: var(--solid);
	}
}

@media screen and (min-width: 1024px) {
	.home-contact__sns.-instagram .home-contact__sns__logo {
		margin-bottom: 3.1rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__sns.-instagram .home-contact__sns__logo {
		margin-bottom: 2.9rem ;
	}
}

@media screen and (min-width: 1024px) {
	.home-contact__sns.-instagram .home-contact__sns__logo, .home-contact__sns.-instagram .home-contact__sns__logo svg {
		width: 3.3rem ;
		height: 3.3rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__sns.-instagram .home-contact__sns__logo, .home-contact__sns.-instagram .home-contact__sns__logo svg {
		width: 2.5rem ;
		height: 2.5rem ;
	}
}

.home-contact__sns a {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

@media (hover: hover) {
	.home-contact__sns a:hover .home-contact__sns__logo {
		color: var(--color-txt);
	}
}

.home-contact__sns i {
	position: absolute;
	z-index: 1;
}

@media screen and (min-width: 1024px) {
	.home-contact__sns i {
		top: 1.9rem ;
		right: 1.9rem ;
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__sns i {
		top: 1.3rem ;
		right: 1.6rem ;
	}
}

.home-contact__sns__logo {
	color: var(--color-txt11);
	transition: color var(--transition-hover);
}

.home-contact__sns__txt {
	color: var(--color-txt7);
	text-align: center;
	font-family: var(--font-mincho);
	letter-spacing: 0.02em;
}

@media screen and (min-width: 1024px) {
	.home-contact__sns__txt {
		font-size: var(--font-size14);
	}
}

@media screen and (max-width: 1023px) {
	.home-contact__sns__txt {
		font-size: var(--font-size12);
		--line-height: 1.75;
	}
}
/*# sourceMappingURL=sourcemaps/page-home.css.map */
