@charset "utf-8";
/* -----------------------------
	loading
-------------------------------- */

.loading {
	width: 100%;
	height: 100%;
	transition: all 1s;
	/*background: #000;*/
	background: #fff;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	opacity: 1;
	visibility: visible;
	text-align: center;
}

.loading.is-active {
	opacity: 0;
	visibility: hidden;
}

.loading-animation {
	width: 100vw;
	height: 100vh;
	transition: all 1s;
	background: #000;
	z-index: 9999;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	opacity: 0;
	visibility: hidden;
	gap: 10px;
}

.loading-animation.is-active {
	opacity: 1;
	visibility: visible;
}
.loading-animation img{
	width: 200px;
	transition: all 1s;
}
.loading.is-active .loading-animation img{
	display: none;
}

@media screen and (max-width: 768px){
	.loading-animation p{
		margin: -60px auto 0;
	}
	.loading-animation img{
		width: 100px;
	}
}
/* -------------------------------------------------------------
    mv-area
-------------------------------------------------------------- */
#top .mv-area{
	/* height: 100vh; */
	min-height: 890px;
	height: 100vh;
	/* padding: 150px 0 0; */
	position: relative;
	display: flex;
	align-items: center;
}
#top .mv-area .inner{
	/* display: flex;
	justify-content: space-between; */
	/* position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 0;
	left: 0; */
	width: 50%;
	margin: 0 auto;
	/* text-align: center; */
}
#top .mv-area .mv-ttl{
	font-size: 8.0rem;
	font-weight: bold;
	line-height: 1.5;
	letter-spacing: 0.05em;
	margin: 0 0 15px;
	color: var(--txt-navy);
	/* text-shadow: 3px 3px 0 #FFF, -3px -3px 0 #FFF, -3px 3px 0 #FFF, 3px -3px 0 #FFF, 0px 3px 0 #FFF, 0 -3px 0 #FFF, -3px 0 0 #FFF, 3px 0 0 #FFF; */
}
@media screen and (max-width: 1300px) {
	#top .mv-area .mv-ttl{
		font-size: 6.0rem;
	}
}

#top .mv-area .txt{
	font-weight: bold;
	letter-spacing: 0.05em;
	text-shadow: 3px 3px 0 #FFF, -3px -3px 0 #FFF, -3px 3px 0 #FFF, 3px -3px 0 #FFF, 0px 3px 0 #FFF, 0 -3px 0 #FFF, -3px 0 0 #FFF, 3px 0 0 #FFF;
	text-shadow: 3px 3px 0 rgba(255, 255, 255, 0.4), -3px -3px 0 rgba(255, 255, 255, 0.4), -3px 3px 0 rgba(255, 255, 255, 0.4), 3px -3px 0 rgba(255, 255, 255, 0.4), 0px 3px 0 rgba(255, 255, 255, 0.4), 0 -3px 0 rgba(255, 255, 255, 0.4), -3px 0 0 rgba(255, 255, 255, 0.4), 3px 0 0 rgba(255, 255, 255, 0.4);
	text-shadow: 1px 1px 0 #FFF, -1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px -1px 0 #FFF, 0px 1px 0 #FFF, 0 -1px 0 #FFF, -1px 0 0 #FFF, 1px 0 0 #FFF;
}
#top .mv-area .mv-catch{
	font-size: 2.0rem;
	font-weight: 700;
	letter-spacing: 0.02em;
}
#top .mv-area .img{
	margin: 40px 0;
}
.movie video{
	width: 100%;
	height: 100%;
	object-fit: cover;

	/* 画像マスクを適用 */
	-webkit-mask-image: url("../img/movie-mask.png"); /* 透明部分が抜ける */
	-webkit-mask-repeat: no-repeat;
	-webkit-mask-position: center;
	-webkit-mask-size: contain;
}



.bg_img{
	/* position: absolute; */
	/*top: 208px;*/
	top: 50%;
	/*right: calc((100% - 1400px) / 2);*/
	line-height: 1;
	/* left: 50%;
	transform: translate(-50% , -50%); */
	z-index: -1;
	width: 50%;
}

.bg_img .masked {
	width: 675px;
	height: 564px;
	overflow: hidden;
	clip-path: url(#myClip);
}
.bg_img video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	vertical-align: bottom;
}

.svg-wrap{
	position:rerative;
	/* overflow:hidden; */
	text-align:center;
	/* max-width: 900px;
	max-width: 800px; */
	/* min-width: 800px; */
	width:auto;
	width: 100vw;
	width: 100%;
	height: 100vh;
	margin: 0 auto;
	display: flex;
	align-items: center;
}

.svg{
	margin: 0 auto 0;
	width: 100%;
	width: calc(100% + 20px);
	height: 100%;
}
/* .svg-wrap img{
	margin: 0 auto 0;
	width: 100%;
	height: 100%;
} */
svg{
	margin: 0 auto 0;
	width: 100%;
	height: calc(100% - 140px);
	overflow: visible;
}
/*
.bg_img video{
	position: fixed;
	z-index: -2;
	width: 100%;
	max-width: 1600px;
	height: 100vh;
	object-fit: cover;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
}
*/

.h1-area{
	/* width: 1200px; */
	top: auto;
    bottom: 10px;
	text-align: right;
	padding: 0 90px 0 0;
}
@media screen and (max-width: 768px) {
	#top .mv-area{
		padding: 0;
		min-height: inherit;
		height: 400px;
		margin: 60px 0 0;
		flex-wrap: wrap;
		padding: 0 0 20px;
	}
	#top .mv-area .inner{
		flex-wrap: wrap;
		width: 100%;
		/* position: absolute;
		top: 50%;
		transform: translateY(-50%);
		right: 0;
		left: 0; */
		margin: 0 auto;
		text-align: center;
	}
	#top .mv-area .inner .movie{
		order: 0;
		width: 100%;
	}
	#top .mv-area .inner .txt-box{
		width: 100%;
		order: 1;
		padding: 0 20px;
	}
	#top .mv-area .mv-ttl{
		font-size: 3.0rem;
		font-size: 2.8rem;
		margin: 0 0 20px;
		margin: 0 0 0px;
		/* text-shadow: 1px 1px 0 #FFF, -1px -1px 0 #FFF, -1px 1px 0 #FFF, 1px -1px 0 #FFF, 0px 1px 0 #FFF, 0 -1px 0 #FFF, -1px 0 0 #FFF, 1px 0 0 #FFF; */
	}
	#top .mv-area .mv-catch{
		font-size: 1.8rem;
		letter-spacing: 0.05em;
		line-height: 1.7;
	}
	#top .mv-area .inner .txt{
		text-align: left;
		font-weight: 500;
	}
	.bg_img{
		/* position: absolute; */
		/* top: 208px; */
		/* top: 50%; */
		/* right: calc((100% - 1400px) / 2); */
		line-height: 1;
		/* left: 50%;
		transform: translate(-50%,-50%); */
		z-index: -1;
		width: 100%;
		height: calc(100% - 190px);
	}
	.svg-wrap{
		height: 100%;
		padding: 10px 0 0;
	}
	svg{
		height: 100%;
	}
}
/* -------------------------------------------------------------
    alice-top-area
-------------------------------------------------------------- */
#top .alice-top-area{
	background: url(../img/bg-gradation.png) no-repeat center / cover;
	padding: 130px 0 120px;
	position: relative;
	border-radius: 50px;
}
#top .alice-top-area::before{
	position: absolute;
	content: "";
	background: url(../img/bg-alice.png) no-repeat center / cover;
	width: 100%;
	aspect-ratio: 1600/853;
	top: 0px;
	z-index: -1;
	border-radius: 50px 50px 0 0;
}

#top .alice-top-area .top-area{
	display: flex;
	align-items: center;
	gap: 40px;
	justify-content: space-between;
}

#top .alice-top-area .top-area .ttl{
	font-size: 1.6rem;
	font-weight: 600;
	letter-spacing: 0.05em;
	color: var(--main-color);
	color: #00BBE0;
	margin: 0 0 50px;
}
#top .alice-top-area .top-area .ttl-catch{
	font-size: 4.0rem;
	/*-webkit-text-stroke: 6px #fff;
	text-stroke: 2px 000;*/
	paint-order: stroke;
	line-height: 1.5;
	margin: 0 0 20px;
	white-space: nowrap;
}
#top .alice-top-area .top-area .txt-box{
	/*width: calc(100% - 680px);*/
	position: relative;
	/*color: #000;*/
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
}
#top .alice-top-area .top-area .txt-box .logo img{
	width: 390px;
}
#top .alice-top-area .top-area .txt-box .l{
	width: 400px;
}
#top .alice-top-area .top-area .txt-box .r{
	width: 720px;
}

#top .alice-top-area .top-area .txt-box .txt{
	font-weight: 600;
	font-size: 1.8rem;
	letter-spacing: 0.03em;
}
#top .alice-top-area .top-area .movie{
	background-color: #EAEAEA;
	width: 620px;
	height: 440px;
	border-radius: 20px;
	overflow: hidden;
}
#top .alice-top-area .feature-box .feature01{
	background-color: #fff;
	display: flex;
	padding: 50px 37px 50px 80px;
	gap: 40px;
	margin: 80px 0 0;
	justify-content: space-between;
	align-items: center;
	border-radius: 20px 20px 0 0;
}
#top .alice-top-area .feature-box .feature01 .txt-box{
	width: 480px;
}
#top .alice-top-area .feature-box .feature01 .img{
	width: 563px;
}
#top .alice-top-area .feature-box .feature-catch{
	font-size: 3.8rem;
	line-height: 1.5;
	font-weight: 700;
	letter-spacing: 0.05em;
	margin: 0 0 30px;
}
#top .alice-top-area .feature-box .txt + .txt{
	margin: 20px 0 0;
}
#top .alice-top-area .feature-box .index-list{
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
}
#top .alice-top-area .feature-box .index-list li{
	width: calc((100% - 35px) / 8);
	height: 80px;
	background-color: var(--bg-blue);
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	font-size: 1.4rem;
	line-height: 1.4;
}

#top .alice-top-area .feature-box .feature02{
	display: flex;
	/*background-color: #fff;*/
	background-color: #7594A4;
	align-items: center;
}
#top .alice-top-area .feature-box .feature02 .img{
	padding: 50px 50px 50px 40px;
	background-color: #F1F5F6;
}
#top .alice-top-area .feature-box .feature02 .img img{
	mix-blend-mode: multiply;
}
#top .alice-top-area .feature-box .feature02 .txt-box{
	padding: 60px 40px;
	height: -webkit-fill-available;
	background-color: var(--main-color);
	color: #fff;
	background: url(../img/illust-rabbit01.svg) no-repeat right 10px bottom / 52px 73px #7594A4;
}
#top .alice-top-area .feature-box .feature02 .txt-box .feature-catch{
	font-size: 2.4rem;
}
#top .alice-top-area .btn-more a{
	margin: 75px auto 0;
}
/* #top .alice-top-area .feature-item{
	display: flex;
	align-items: center;
	gap: 30px;
	margin: 30px 0 0;
}
#top .alice-top-area .feature-item .img{
	width: 300px;
	height: 300px;
	background-color: #EAEAEA;
} */
@media screen and (max-width: 768px) {
	#top .alice-top-area{
		padding: 60px 20px;
		background-repeat:repeat-y;
	}
	
	#top .alice-top-area::before{
		left: 0;
	}

	#top .alice-top-area .top-area{
		flex-wrap: wrap;
	}
	#top .alice-top-area .top-area .txt-box{
		width: 100%;
		text-align: center;
		display: block;
	}
	#top .alice-top-area .top-area .txt-box .l{
		width: 100%;
	}
	#top .alice-top-area .top-area .txt-box .r{
		width: 100%;
	}

	#top .alice-top-area .top-area .txt-box .logo img{
		/*height: 74px;*/
		width: 100%;
		max-width: 240px;
		margin: 0 auto;
	}
	#top .alice-top-area .top-area .ttl{
		margin: 0 0 10px;
		line-height: 1.5;
	}
	#top .alice-top-area .top-area .ttl-catch{
		white-space: wrap;
		font-size: 2.4rem;
		letter-spacing: 0;
		margin: 20px 0 10px;
		text-align: left;
	}
	#top .alice-top-area .top-area .txt-box .txt{
		text-align: left;
		font-weight: 500;
		font-size: 1.6rem;
	}
	#top .alice-top-area .top-area .movie{
		width: 100%;
		height: 220px;
	}
	#top .alice-top-area .top-area .movie img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
	/* 特徴１ */
	#top .alice-top-area .feature-box .feature01{
		margin: 30px 0 0;
		padding: 40px 20px 40px;
		flex-wrap: wrap;
		gap: 15px;
	}
	#top .alice-top-area .feature-box .feature01 .txt-box{
		width: 100%;
	}
	#top .alice-top-area .feature-box .feature01 .img{
		width: auto;
		margin: 0 -15px;
	}
	
	#top .alice-top-area .feature-box .feature-catch{
		font-size: 2.4rem;
		letter-spacing: 0;
		margin: 0 0 15px;
	}
	/* 特徴2 */
	#top .alice-top-area .feature-box .feature02{
		flex-wrap: wrap;
		background: none;
	}
	#top .alice-top-area .feature-box .feature02 .img{
		padding: 0 0 20px;
		order: 1;
		border-radius: 0 0 20px 20px;
	}
	#top .alice-top-area .feature-box .feature02 .txt-box{
		padding: 30px 20px;
		background-image: none;
		order: 0;
		height: auto;
	}
	#top .alice-top-area .feature-box .feature02 .txt-box .feature-catch{
		font-size: 2.2rem;
		margin: 0 0 15px;
	}
	#top .alice-top-area .btn-more a{
		margin: 30px auto 0;
	}
}

/* -------------------------------------------------------------
    scene-area
-------------------------------------------------------------- */
#top .scene-area{
	padding: 120px 0 120px;
	background-color: #F1F5F6;
	position: relative;
	border-radius: 50px 50px 0 0;
}
#top .scene-area .inner{
	position: relative;
}
/* #top .scene-area .inner::before{
	position: absolute;
	content: "";
	background: url(../img/illust-rabbit-navy.svg) no-repeat center / cover;
	width: 102px;
	height: 202px;
	right: 0;
	bottom: 0;
} */
#top .scene-area::after{
	position: absolute;
	content: "";
	background: url(../img/illust-rabbit-navy.svg) no-repeat center / cover;
	width: 102px;
	height: 202px;
	right: 10%;
	bottom: 5px;
}
#top .scene-area .scene-list{
	display: flex;
	flex-wrap: wrap;
	gap: 25px 24px;
	margin: 60px 0 0;
}
#top .scene-area .scene-list .scene-item{
	width: calc((100% - 72px) / 4);
	box-shadow: -6px -6px 24px rgba(0, 0, 0, 3%);
}
/* #top .scene-area .scene-list .scene-item.hr,
#top .scene-area .scene-list .scene-item.callcenter{
	width: calc((100% - 30px) / 2);
} */
#top .scene-area .scene-list .scene-item a{
	display: block;
	width: 100%;
	height: 100%;
	background-color: #fff;
	padding: 35px 20px 22px;
	position: relative;
	top: 0;
	transition: .5s;
	border: 1px #fff solid;
}
#top .scene-area .scene-list .scene-item a::before{
	position: absolute;
	content: "";
	background: url(../img/arrow-blue.svg) no-repeat center / cover;
	width: 30px;
	height: 7px;
	right: 10px;
	bottom: 13px;
	transition: .5s;
}
#top .scene-area .scene-list .scene-item a:hover{
	/*top: -5px;*/
	transition: .5s;
	border: 1px var(--main-color) solid;
}
#top .scene-area .scene-list .scene-item a:hover::before{
	/* box-shadow: 5px 5px 20px rgba(0, 0, 0, 0.1); */
	right: 5px;
	transition: .5s;
}
#top .scene-area .scene-list .scene-item a .fs-box{
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}
#top .scene-area .scene-list .scene-item a .fs-box .img{
	width: 60px;
    height: 60px;
    background: url(../img/icon-bg.png) center / cover, no-repeat;
    display: flex;
    justify-content: center;
    align-items: center;
	margin: 0 auto;
}
#top .scene-area .scene-list .scene-item a .fs-box .img img{
	width: 30px;
	height: 30px;
	aspect-ratio: 1 / 1;
	transition: all 1.2s;
}
#top .scene-area .scene-list .scene-item a:hover .fs-box img{
	transform: rotateY(360deg);
}
#top .scene-area .scene-list .scene-item a .fs-box .scene-ttl{
	font-size: 2.2rem;
	font-weight: 600;
	text-align: center;
	color: var(--txt-navy);
	margin: 0 0 30px;
}
#top .scene-area .scene-list .scene-item a .fs-box .disc-list li{
	padding: 15px 0 15px 20px;
	margin: 0;
	border-top: solid 1px #E2E2E2;
	font-size: 1.5rem;
	font-weight: 500;
}
#top .scene-area .scene-list .scene-item a .fs-box .disc-list li::before{
	top: 24px;
}
#top .scene-area .scene-list .scene-item .series-box{
	background-color: var(--bg-blue);
	padding: 20px 30px;
	display: flex;
	align-items: center;
	margin: 10px 0 0;
}
#top .scene-area .scene-list .scene-item .series-box .series-ttl{
	font-size: 1.6rem;
	line-height: 1.5;
	font-weight: 600;
	color: #333;
	padding: 16px 25px 16px 60px;
	margin: 0 25px 0 0;
	border-right: dashed 1px #AAB7B7;
	position: relative;
}
#top .scene-area .scene-list .scene-item .series-box .series-ttl::before{
	position: absolute;
	content: "";
	background: url(../img/mark-alice01.svg) no-repeat center / cover;
	width: 44px;
	height: 63px;
	left: 0;
	top: 50%;
	transform: translateY(-50%);
}
#top .scene-area .scene-list .scene-item .series-box .series-list li span{
	display: inline-block;
	min-width: 80px;
	max-width: 110px;
	height: 19px;
	line-height: 19px;
	font-size: 1.0rem;
	font-family: var(--font-jp);
	text-align: center;
	font-weight: 600;
	color: #fff;
	background-color: var(--main-color);
	margin: 0 10px 0 0;
	padding: 0 5px;
}
#top .scene-area .scene-list .scene-item .series-box .series-list li{
	font-family: var(--font-en);
	font-size: 1.8rem;
	font-weight: 500;
	color: #333;
}
#top .scene-area .scene-list .scene-item .series-box .series-list li:not(:last-of-type){
	margin: 0 0 15px;
}
@media screen and (max-width: 768px) {
	#top .scene-area{
		padding: 60px 20px;
	}
	#top .scene-area::after{
		display: none;
	}
	#top .scene-area .ttl-catch{
		font-size: 2.2rem;
		margin: 5px 0 30px;
	}
	#top .scene-area .scene-list{
		gap: 15px;
		margin: 0;
	}
	#top .scene-area .scene-list .scene-item{
		width: 100% !important;
	}
	#top .scene-area .scene-list .scene-item a{
		padding: 20px 15px;
	}
	#top .scene-area .scene-list .scene-item a .fs-box{
		gap: 15px !important;
	}
	#top .scene-area .scene-list .scene-item a .fs-box .txt-box{
		width: calc(100% - 75px) !important;
	}
	#top .scene-area .scene-list .scene-item a .fs-box .scene-ttl{
		font-size: 1.8rem !important;
		text-align: left;
		margin: 0 0 15px;
		font-weight: bold;
		line-height: 1.4;
	}
	#top .scene-area .scene-list .scene-item .series-box{
		display: none;
	}
	#top .scene-area .scene-list .scene-item a .fs-box .txt-box .disc-list li{
		font-size: 1.4rem;
		padding: 10px 0 10px 20px;
	}
}
/* -------------------------------------------------------------
    interview-area
-------------------------------------------------------------- */
.interview-area .inner{
	display: flex;
	justify-content: space-between;
	padding: 140px 0;
	position: relative;
}
.interview-area .inner::before{
	position: absolute;
	content: "";
	background: url(../img/illust-rabbit02.svg) no-repeat center / cover;
	width: 162px;
	height: 311px;
	left: -80px;
	bottom: 0;
}
.interview-area .inner .ttl-catch{
	margin: 40px 0 50px;
}
.interview-area .inner .interview-list{
	display: flex;
	gap: 50px;
}
.interview-area .inner .interview-list .interview-item a{
	display: block;
	position: relative;
	top: 0;
	transition: .5s;
}
.interview-area .inner .interview-list .interview-item a::before{
	position: absolute;
	content: "";
	background: url(../img/arrow-blue.svg) no-repeat center / cover;
	width: 30px;
	height: 7px;
	right: 0px;
	bottom: 0px;
	transition: .5s;
}
.interview-area .inner .interview-list .interview-item a:hover{
	top: -5px;
	transition: .5s;
}
.interview-area .inner .interview-list .interview-item a:hover::before{
	right: -5px;
	transition: .5s;
}
.interview-area .inner .interview-list .interview-item a .catch{
	font-size: 2.0rem;
	line-height: 1.6;
	color: #333;
	margin: 20px 0 9px;
}
.interview-area .inner .interview-list .interview-item a .company{
	font-size: 1.3rem;
	color: #888;
}
@media screen and (max-width: 768px)  {
	.interview-area .inner{
		padding: 60px 20px 120px;
		flex-wrap: wrap;
		position: relative;
	}
	.interview-area .inner::before{
		width: 95px;
		height: 182px;
		left: auto;
		right: -12px;
		bottom: auto;
		top: 77px;
		z-index: 1;
	}
	.interview-area .inner .ttl-box{
		width: 100%;
	}
	.interview-area .inner .ttl-catch{
		font-size: 2.2rem;
		margin: 20px 0 40px;
	}
	.interview-area .inner .interview-list{
		flex-wrap: wrap;
		gap: 20px;
		padding: 40px 0;
		position: relative;
		margin: 0 0 40px;
	}
	.interview-area .inner .interview-list::before{
		position: absolute;
		content: "";
		width: calc(100% - 35px);
		height: 100%;
		background-color: var(--bg-blue);
		top: 0;
		right: -20px;
	}
	.interview-area .inner .interview-list .interview-item{
		width: 100%;
	}
	.interview-area .inner .interview-list .interview-item a{
		display: flex;
		align-items: center;
		background-color: #fff;
		box-shadow: 0px 3px 20px rgb(0 0 0 / 5%);
	}
	.interview-area .inner .interview-list .interview-item a::before{
		right: 10px;
		bottom: 10px;
	}
	.interview-area .inner .interview-list .interview-item a .img{
		width: 120px;
		height: 120px;
	}
	.interview-area .inner .interview-list .interview-item a .img img{
		width: 100%;
		height: 100%;
	}
	.interview-area .inner .interview-list .interview-item a .txt-box{
		width: calc(100% - 120px);
		padding: 0 0 0 20px;
		background-color: #fff;
	}
	.interview-area .inner .interview-list .interview-item a .catch{
		margin: 0;
		font-size: 1.8rem;
	}
	.interview-area .inner .btn-more{
		position: absolute;
		bottom: 60px;
		right: 0;
		left: 0;
		margin: 0 auto;
	}
	.interview-area .inner .btn-more a{
		margin: 0 auto;
	}
}
/* -------------------------------------------------------------
    about-area
-------------------------------------------------------------- */
.about-area{
	padding: 80px 0;
	background: url(../img/bg-gradation1.png) no-repeat center / cover;
	position: relative;
}
.about-area .inner{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.about-area .inner .ttl-m .jp span{
	font-family: var(--font-en);
}
.about-area .inner .ttl-catch{
	margin: 40px auto 30px;
	font-size: 2.6rem;
}
.about-area .inner .btn-more{
	margin: 40px auto 0;
}
@media screen and (max-width: 768px) {
	.about-area{
		padding: 230px 20px 60px;
	}
	.about-area::before{
		position: absolute;
		content: "";
		background: url(../img/top-about-sp.jpg) no-repeat center / contain;
		width: 100%;
		aspect-ratio: 375/180;
		top: 0;
		left: 0;
	}
	.about-area .inner{
		flex-wrap: wrap;
	}
	.about-area .inner div{
		width: 100%;
	}
	.about-area .ttl-m .jp{ 
		font-size: 2.2rem;
	}
	.about-area .inner .ttl-catch{
		margin: 20px 0 10px;
		font-size: 2.2rem;
	}
	.about-area .inner .btn-more{
		margin: 30px auto 0;
	}
	
}
/* -------------------------------------------------------------
    news-area   標準仕様
-------------------------------------------------------------- */
#top .ninews-area {
	margin: 80px 0 90px 0;
}

#top .ninews-area .ninews-inner {
	gap: 70px;
	justify-content: space-between;
}

#top .ninews-area .ninews-head {
	width: 100px;
}
#top .ninews-area .ninews-head .ttl-s .jp{
	font-size: 2.4rem;
	letter-spacing: 0;
}
#top .ninews-area .ninews-head-link {
	color: var(--cmnblack);
	gap: 5px;
    font-size: 1.6rem;
	margin: 25px 0 0;
}

#top .ninews-area .ninews-head-link:hover {
	/* background: var(--link); */
	border-color: var(--link);
	color: var(--link);
}

#top .ninews-area .ninews-head-link::before {
	content: "\f054";
    font: 900 1.2rem / 1 var(--webicon);
    padding: 3px 0 0;
	color: var(--main-color);
}

#top .ninews-area .ninews-list {
	width: calc(100% - 105px - 70px);
}

#top .ninews-area .ninews-date {
	color: var(--cmnblack);
	font: 500 1.5rem /1 var(--lato);
	letter-spacing: .05em;
}
#top .ninews-cate-wrap .ninews-cate{
	border: none;
	color: var(--cmnblack);
	padding: 0;
	min-width: 60px;
}
#top .ninews-area .ninews-cate-wrap .ninews-cate:nth-child(3n) {
	display: none;
}

#top .ninews-area .ninews-title {
	color: var(--cmnblack);
	font-size: 1.6rem;
	font-weight: 500;
	letter-spacing: 0em;
	line-height: 1.5;
}

@media screen and (max-width: 768px) {
	#top .ninews-area {
		margin: 40px 0 0;
	}
	#top .ninews-area .ninews-inner{
		padding: 0 20px 60px;
	}
	#top .ninews-area .ninews-head {
		margin: 0 0 20px;
		width: 100%;
	}
	#top .ninews-area .ninews-head .ttl-s .jp{
		font-size: 2.2rem;
	}
	#top .ninews-area .ninews-head-link {
		font-size: 1.4rem;
		margin: 0;
		gap: 5px;
		padding: 8px 14px 10px;
	}

	#top .ninews-area .ninews-list {
		width: 100%;
	}

	#top .ninews-area .ninews-date {
		font-size: 1.3rem;
	}

	#top .ninews-area .ninews-title {
		font-size: 1.5rem;
	}
}

/* -------------------------------------------------------------
    news-area   ninews-no-thumb サムネイルなし
-------------------------------------------------------------- */
#top .ninews-no-thumb .ninews-title::before {
	content: "\f105";
	color: var(--link);
	font: 900 1.4rem/1 var(--webicon);
	right: 7px;
	top: 50%;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
}

#top .ninews-no-thumb .ninews-item a {
	gap: 20px;
	padding: 0 0 20px 0;
}


#top .ninews-no-thumb .ninews-title {
	padding: 0 35px 0 0;
}

#top .ninews-no-thumb .ninews-item a:hover .ninews-title::before {
	right: 0;
}

#top .ninews-no-thumb .ninews-date {
	width: 100px;
}

#top .ninews-no-thumb .ninews-elements {
	gap: 20px;
}

@media screen and (max-width: 768px) {
	#top .ninews-no-thumb .ninews-item:not(:last-child) {
		margin-bottom: 18px;
	}

	#top .ninews-no-thumb .ninews-item a {
		padding: 0 0 18px;
		padding: 0;
	}

	#top .ninews-no-thumb .ninews-elements {
		gap: 10px;
	}

	#top .ninews-no-thumb .ninews-title {
		margin: 8px 0 0 0;
		padding: 0 18px 0 0;
	}

	#top .ninews-area .ninews-title::before {
		font-size: 1.3rem;
		top: 53%;
	}
}

/* -------------------------------------------------------------
    news-area   ninews-have-thumb サムネイルあり
-------------------------------------------------------------- */
#top .ninews-have-thumb.ninews-list {
	gap: 20px;
}

#top .ninews-have-thumb .ninews-item {
	width: calc((100% - 20px) / 2);
}

#top .ninews-have-thumb .ninews-item a {
	gap: 20px;
}

#top .ninews-thumb__img {
	width: 240px;
	height: 180px;
}

#top .ninews-thumb__img img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: .5s;
}

#top .ninews-have-thumb a:hover img {
	transform: scale(1.15);
}

#top .ninews-thumb__elements {
	gap: 10px;
	width: calc(100% - 240px - 20px);
}

#top .ninews-have-thumb .ninews-title {
	-webkit-line-clamp: 2;
	max-height: 50px;
}

#top .ninews-have-thumb .ninews-elements {
	gap: 12px;
}

@media screen and (max-width: 768px) {
	#top .ninews-have-thumb .ninews-item {
		width: 100%;
	}

	#top .ninews-have-thumb .ninews-item a {
		gap: 15px;
	}

	#top .ninews-thumb__img {
		width: 45%;
		height: auto;
		aspect-ratio: 3/2;
	}

	#top .ninews-thumb__elements {
		gap: 5px;
		width: calc(45% - 15px);
	}

	#top .ninews-have-thumb .ninews-elements {
		gap: 8px 10px;
	}
}

/* -------------------------------------------------------------
    column-area
-------------------------------------------------------------- */
#top .column-area{
	padding: 90px 0 ;
	position: relative;
	background-color: #F3F8FA;
}
/* #top .column-area::before{
	position: absolute;
	content: "";
	background: #282A33;
	width: 50%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: -1;
} */
#top .column-area .inner{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
/* #top .column-area .inner .column-head{
	color: #fff;
}
#top .column-area .inner .column-head .ttl-m .en{
	color: #fff;
}
#top .column-area .inner .column-head .ttl-m .en::before{
	
} */
#top .column-area .inner .column-head .ttl-catch{
	font-size: 1.6rem;
	margin: 30px 0;
}
#top .column-area .inner .column-head .column-head-link{
	color: #333;
    gap: 5px;
    font-size: 1.6rem;
    margin: 25px 0 0;
	align-items: center;
    display: flex;
    justify-content: center;
    width: fit-content;
}
#top .column-area .inner .column-head .column-head-link:hover {
	/* background: var(--link);
	border-color: var(--link); */
	color: var(--link);
}
#top .column-area .inner .column-head .column-head-link::before{
	content: "\f054";
    font: 900 1.2rem / 1 var(--webicon);
    padding: 3px 0 0;
	color: var(--main-color);
}
#top .column-area .inner .column-list{
	display: flex;
	flex-wrap: wrap;
	gap: 30px;
	position: relative;
	/* margin: 60px 0 0 0; */
	/* padding: 60px 0 0; */
	width: 880px;
	justify-content: flex-start;
}
/* #top .column-area .inner .column-list::before{
	position: absolute;
	content: "";
	width: 100%;
	min-width: 1020px;
	background-color: var(--bg-blue);
	height: 400px;
	z-index: -1;
	right: -100px;
	top: 50%;
	transform: translateY(-50%);
} */
#top .column-area .inner .column-list .column-item{
	width: calc((100% - 60px) / 3);
	max-width: 260px;
	min-width: 260px;
	position: relative;
	top: 0;
	transition: .5s;
}
#top .column-area .inner .column-list .column-item:hover{
	top: -5px;
	transition: .5s;
}
#top .column-area .inner .column-list .column-item .img img{
	width: 100%;
	height: 180px;
	object-fit: cover;
}
#top .column-area .inner .column-list .column-item .txt-box{
	position: relative;
	margin: 13px 0 0;
}
#top .column-area .inner .column-list .column-item .txt-box .date{
    color: #333;
    font: 500 1.4rem / 1 var(--lato);
    letter-spacing: .05em;
}
#top .column-area .inner .column-list .column-item .txt-box .cate-wrap{
	display: flex;
	gap: 5px;
	position: absolute;
	right: 0;
	top: 0;
}
#top .column-area .inner .column-list .column-item .txt-box .cate{
    color: var(--main-color);
    font-size: 1.4rem;
    line-height: 1;
    display: flex;
    flex-shrink: 0;
}
#top .column-area .inner .column-list .column-item .txt-box .column-title{
	color: var(--cmnblack);
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.5;
	margin: 8px 0 0;
}
@media screen and (max-width: 768px) {
	#top .column-area{
		padding: 50px 20px;
		padding: 50px 0;
	}
	#top .column-area::before{
		width: 100%;
		height: 414px;
	}
	#top .column-area .inner .column-head{
		width: 100%;
		padding: 0 20px;
	}
	#top .column-area .inner .column-head .ttl-m .jp{
		font-size: 2.2rem;
	}
	#top .column-area .inner .column-head .ttl-catch{
		margin: 20px 0 20px;
	}
	#top .column-area .inner .column-head .column-head-link{
		position: absolute;
		bottom: 15px;
		right: 20px;
		font-size: 1.4rem
	}
	
	#top .column-area .inner .column-list{
		width: calc(100% - 20px);
		gap: 15px;
		padding: 25px 20px;
		background-color: #fff;
		margin: 0 0 0 auto;
	}
	#top .column-area .inner .column-list::before{
		display: none;
	}
	#top .column-area .inner .column-list .column-item{
		width: 100%;
		max-width: none;
		min-width: none;
	}
	#top .column-area .inner .column-list .column-item a{
		display: flex;
		gap: 15px;
		align-items: center;
	}
	#top .column-area .inner .column-list .column-item .img{
		width: 100px;
		height: 100px;
	}
	#top .column-area .inner .column-list .column-item .img img{
		height: 100%;
	}
	#top .column-area .inner .column-list .column-item .txt-box{
		width: calc(100% - 115px);
		margin: 0;
	}
	#top .column-area .inner .column-list .column-item .txt-box .date{
		text-align: right;
		font-size: 1.2rem;
	}
	#top .column-area .inner .column-list .column-item .txt-box .cate-wrap{
		right: auto;
		left: 0;
	}
	#top .column-area .inner .column-list .column-item .txt-box .cate{
		font-size: 1.2rem;
	}
}