@charset "utf-8";
#loading {
	width: 100%;
	height: 100vh;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 200;
}
	.loading__container {
		width: 100%;
		height: 100%;
		background-color: var(--color--red);
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		transition: .8s;
		transform: translate(0%,0%);
		will-change: transform;
	}
	._open .loading__container {
		transform: translate(0%,-100%);
	}
		.loading__logo {
			width: 180px;
			height: auto;
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%,-50%);
			z-index: 1;
			transition: .4s;
		}
		.loading__logo._hide {
			opacity: 0;
		}
			.loading__logo svg {
				display: block;
				width: 100%;
				height: auto;
				fill: var(--color--white);
			}

#hero {
	width: 100%;
	height: 100vh;
	position: relative;
}
	.hero__inner {
		width: 100%;
		height: 100%;
	}
		.hero__image {
			width: 100%;
			height: 100%;
			position: relative;
		}
			.hero__image__list {
				width: 100%;
				height: 100%;
				position: relative;
			}
				.hero__image__item {
					width: 100%;
					height: 100%;
					position: absolute;
					top: 0;
					left: 0;
				}
					.hero__image__item img {
						width: 100%;
						height: 100%;
						object-fit: cover;
						object-position: center;
					}
			.hero__image__copy {
				width: calc((1000 / 1440) * 100%);
				height: auto;
				overflow: hidden;
				position: absolute;
				bottom: calc((50 / 600) * 100%);
				left: calc((100 / 1440) * 100%);
				z-index: 10;
			}
				.hero__image__copy__txt {
					width: 100%;
					height: auto;
					transform: translate(0%,100%);
					transition: .7s;
				}
				._show .hero__image__copy__txt {
					transform: translate(0%,0%);
				}
					.hero__image__copy__txt svg {
						display: block;
						width: 100%;
						height: auto;
						fill: var(--color--white);
					}
			.hero__image__logo {
				width: calc((180 / 1440) * 100%);
				height: auto;
				position: absolute;
				bottom: calc((50 / 600) * 100%);
				right: calc((110 / 1440) * 100%);
				z-index: 10;
			}
				.hero__image__logo img {
					width: 100%;
					height: auto;
				}

#about {
	width: 100%;
	height: auto;
	padding: 80px 0;
}
	.about__inner {
		display: flex;
		justify-content: space-between;
		align-items: center;
		width: 90%;
		max-width: 1200px;
		height: auto;
		margin: 0 auto;
	}
		.about__txt_wrap {
			width: calc((726 / 1200) * 100%);
			height: auto;
		}
			.about__txt_row {
				width: 100%;
				height: auto;
				position: relative;
			}
				.about__txt {
					width: 100%;
					height: auto;
					font-size: min(36px, calc((36 / 1440) * 100vw));
					font-weight: 900;
					line-height: 1.2;
					letter-spacing: 0em;
					color: var(--color--black);
				}
					.about__txt__c {
						color: var(--color--black);
					}
				.about__txt__mask {
					width: 100%;
					height: 100%;
					background-color: var(--color--white);
					opacity: .85;
					position: absolute;
					top: 0;
					right: 0;
					z-index: 1;
					transform: scale(1,1);
					transform-origin: right center;
				}
		.about__image_wrap {
			width: calc((398 / 1200) * 100%);
			height: auto;
			position: relative;
		}
			.about__image_swiper {
				width: 100%;
				height: auto;
			}
				.about__image {
					width: 100%;
					height: auto;
				}

#challenge {
	width: 100%;
	height: auto;
	padding: 100px 0 25px;
}
	.challenge__inner {
		width: 90%;
		max-width: 1200px;
		height: auto;
		margin: 0 auto;
	}
		.challenge__heading {
			width: 43.854%;
			height: auto;
			margin: 0 auto 38px;
			overflow: hidden;
		}
			.challenge__heading img {
				width: 100%;
				height: auto;
			}
		.challenge__contents {
			width: 100%;
			height: auto;
		}
			.challenge__contents__txt {
				width: 100%;
				height: auto;
				font-size: 24px;
				font-weight: 700;
				line-height: 1.7;
				letter-spacing: 0.02em;
				text-align: center;
			}
			.challenge__contents__txt:not(:last-of-type) {
				margin-bottom: 20px;
			}

#category {
	width: 100%;
	height: auto;
	padding: 100px 0 15px;
}
	.category__inner {
		width: 90%;
		max-width: 1200px;
		height: auto;
		margin: 0 auto;
	}
		.category__heading__wrap {
			width: 100%;
			height: auto;
			margin: 0 auto 78px;
		}
			.category__heading {
				width: 53.6155%;
				height: auto;
				margin: 0 auto 18px;
				overflow: hidden;
			}
				.category__heading img {
					width: 100%;
					height: auto;
				}
			.category__heading__sub {
				width: 100%;
				height: auto;
				margin: 0 auto;
				font-size: 22px;
				font-weight: 700;
				line-height: 1;
				letter-spacing: 0.12em;
				text-indent: 0.12em;
				text-align: center;
				overflow: hidden;
			}
				.category__heading__sub span {
					display: inline-flex;
					justify-content: center;
					align-items: center;
					transition-delay: .25s;
				}
				.category__heading__sub span::before,
				.category__heading__sub span::after {
					content: '';
					display: block;
					width: 18px;
					height: 3px;
					background-color: var(--color--black);
				}
				.category__heading__sub span::before {
					margin-right: 6px;
				}
				.category__heading__sub span::after {
					margin-left: 6px;
				}
		.category__contents {
			width: 100%;
			max-width: 900px;
			height: auto;
			margin: 0 auto;
		}
			.category__contents__btn_list {
				display: flex;
				justify-content: space-between;
				align-items: center;	
				width: 100%;
				height: auto;
				margin: 0 auto 85px;
                 gap: 15px;
			}
				.category__contents__btn_item {
					width: 46.89318%;
					height: auto;
				}
					.category__contents__btn {
						display: block;
						width: 100%;
						height: auto;
						position: relative;
					}
						.category__contents__btn::before {
							content: '';
							display: block;
							width: 100%;
							height: 100%;
							background-color: var(--color--red);
							border: solid 6px var(--color--black);
							position: absolute;
							top: 0;
							left: 0;
							z-index: 1;
							pointer-events: none;
						}
						.category__contents__btn img {
							width: 100%;
							height: auto;
						}
						.category__contents__btn img.txt {
							position: absolute;
							top: 0;
							left: 0;
							z-index: 2;
						}
			.category__contents__more {
				width: 100%;
				height: auto;
			}
				.category__contents__more__btn {
					display: block;
					width: 246px;
					height: 68px;
					border-radius: 34px;
					margin: 0 auto;
					overflow: hidden;
				}
					.category__contents__more__btn img {
						width: 100%;
						height: auto;
					}

#news {
	width: 100%;
	height: auto;
	padding: 100px 0 57px;
}
	.news__inner {
		width: 90%;
		max-width: 1100px;
		height: auto;
		margin: 0 auto;
	}
		.news__heading {
			display: flex;
			justify-content: space-between;
			align-items: flex-end;
			width: 100%;
			height: auto;
			margin: 0 auto 48px;
			border-bottom: solid 2px var(--color--black)
		}
			.news__heading__txt {
				width: 125px;
				height: auto;
				margin-bottom: 12px;
			}
				.news__heading__txt img {
					width: 100%;
					height: auto;
				}
			.news__heading__more_btn {
				display: block;
				width: 192px;
				height: auto;
				border: solid 2px var(--color--black);
				position: relative;
				top: 2px;
			}
				.news__heading__more_btn img {
					width: 100%;
					height: auto;
				}
		.news__list {
			width: 100%;
			height: auto;
		}
			.news__item {
				display: flex;
				justify-content: flex-start;
				align-items: flex-start;
				width: 100%;
				height: auto;
				font-size: 20px;
				font-weight: 300;
				line-height: 1.5;
				letter-spacing: 0.05em;
		}
			.news__item:not(:last-of-type) {
				margin-bottom: 18px;
			}
				.news__item__date {
					width: 165px;
					height: auto;
				}
				.news__item__ttl {
					flex: 1;
					height: auto;
					color: var(--color--black);
				}

/* PC ================================================== */
@media all and (min-width:720px){
/* category */
						.category__contents__btn::before {
							transition: .5s;
						}
						.category__contents__btn:hover::before {
							background-color: rgba(229, 0, 18, 0);

						}

/* news */
				.news__heading__more_btn img {
					transform: scale(1);
					transition: .4s;
				}
				.news__heading__more_btn:hover img {
					transform: scale(1.05);
				}
				.news__item__ttl {
					transition: .4s;
				}
				.news__item:hover .news__item__ttl {
					color: var(--color--red);
				}
}

/* SP ================================================== */
@media all and (max-width:719px){
/* loading */
#loading {
	height: 100vh;
}
		.loading__logo {
			width: 160px;
		}

/* hero */
			.hero__image__copy {
				width: calc((330 / 390) * 100%);
				bottom: initial;
				top: 47%;
				left: 50%;
				transform: translate(-50%,-50%);
			}
			.hero__image__logo {
				width: 30vw;
				bottom: 5vw;
				right: 5vw;
			}

/* about */
#about {
	padding: 60px 0;
}
	.about__inner {
		flex-direction: column;
		justify-content: flex-start;
		width: 92%;
	}
		.about__txt_wrap {
			width: 100%;
		}
				.about__txt {
					font-size: calc((17.5 / 375) * 100vw);
					white-space: nowrap;
				}
		.about__image_wrap {
			width: 100%;
			margin: 40px auto 0;
		}

/* challenge */
#challenge {
	padding: 60px 0 25px;
}
	.challenge__inner {
		max-width: initial;
	}
		.challenge__heading {
			width: 65.781%;
			margin: 0 auto 25px;
		}
			.challenge__contents__txt {
				font-size: 17px;
				line-height: 1.8;
			}
			.challenge__contents__txt:not(:last-of-type) {
				margin-bottom: 20px;
			}

#category {
	padding: 60px 0 15px;
}
	.category__inner {
		max-width: initial;
	}
		.category__heading__wrap {
			margin: 0 auto 40px;
		}
			.category__heading {
				width: 80.42325%;
				margin: 0 auto 10px;
			}
			.category__heading__sub {
				margin: 0 auto;
				font-size: 16px;
			}
				.category__heading__sub span::before,
				.category__heading__sub span::after {
					width: 14px;
					height: 2px;
				}
				.category__heading__sub span::before {
					margin-right: 4px;
				}
				.category__heading__sub span::after {
					margin-left: 4px;
				}
		.category__contents {
			width: 100%;
			max-width: 380px;
		}
			.category__contents__btn_list {
				display: block;
				width: 100%;
				height: auto;
				margin: 0 auto 45px;
			}
				.category__contents__btn_item {
					width: 100%;
					height: auto;
				}
				.category__contents__btn_item:not(:last-of-type) {
					margin-bottom: 15px;
				}
				.category__contents__more__btn {
					width: 150px;
					height: 41.5px;
					border-radius: 20.75px;
				}

#news {
	padding: 60px 0 30px;
}
	.news__inner {
		max-width: initial;
	}
		.news__heading {
			margin: 0 auto 30px;
		}
			.news__heading__txt {
				width: 85px;
				margin-bottom: 8px;
			}
			.news__heading__more_btn {
				width: 150px;
			}
			.news__item {
				display: block;
				font-size: 16px;
			}
			.news__item:not(:last-of-type) {
				margin-bottom: 20px;
			}
				.news__item__date {
					display: block;
					width: 100%;
					margin-bottom: 3px;
					font-size: 12px;
					color: var(--color--gray);
				}
				.news__item__ttl {
					flex: initial;
					width: 100%;
				}
}