@charset "UTF-8";
/* ----------------------------------------
  Josh's Custom CSS Reset (_reset.scss)
  https://www.joshwcomeau.com/css/custom-css-reset/
---------------------------------------- */
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap");
*, *::before, *::after {
	box-sizing: border-box;
}

* {
	margin: 0;
}

@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}
body {
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
}

img, picture, video, canvas, svg {
	display: block;
	max-width: 100%;
}

input, button, textarea, select {
	font: inherit;
}

p, h1, h2, h3, h4, h5, h6 {
	overflow-wrap: break-word;
}

p {
	text-wrap: pretty;
}

h1, h2, h3, h4, h5, h6 {
	text-wrap: balance;
}

#root, #__next {
	isolation: isolate;
}

input[type=text],
input[type=email],
input[type=tel],
input[type=number],
input[type=password] {
	margin: 0;
	padding: 0;
	background: none;
	border: none;
	border-radius: 0;
	outline: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

/* ----------------------------------------
  Base Settings
---------------------------------------- */
html {
	line-height: 1.15; /* 1 */
	font-size: 62.5%;
}

body {
	margin: 0;
	font-family: "Noto Sans JP", sans-serif;
  	font-size: 1.6rem;
	line-height: 0;
  	color: #111111;
}

a {
  	text-decoration: none;
}

main {
  	overflow: hidden;
    line-height: 1.8;
}

.wrap {
  	position: relative;
}

.logo-top {
  	position: absolute;
  	top: 0;
  	left: 0;
  	background-color: #FFFFFF;
  	padding: 1.8rem 2.5rem;
  	z-index: 10;
}

.mv {
  	background-image: url(../img/mv-bg.png);
  	background-position: top center;
  	background-repeat: no-repeat;
  	background-size: cover;
  	height: 420px;
  	margin-bottom: 10.7rem;
}

.mv-inner {
  	position: relative;
  	width: 100%;
  	height: 100%;
  	max-width: 1400px;
  	margin: auto;
}

.mv-txt {
  	position: absolute;
  	top: 39%;
  	left: 95px;
  	z-index: 10;
}
.mv-txt h2 {
	max-width: 687px;
  	margin-bottom: 3rem;
}
.mv-txt h3 {
	color: #FFFFFF;
	font-size: 2rem;
	font-weight: 400;
	margin-left: 4.2rem;
}

.mv-img {
  	position: absolute;
  	top: 0;
  	right: 110px;
}
.mv-img p {
  	color: #FFFFFF;
  	font-size: 1.1rem;
  	text-align: right;
  	margin-top: 0.4rem;
  	margin-right: 8.2rem;
}

.mv-img--inner {
  	position: relative;
  	width: fit-content;
}
.mv-img--inner::before, .mv-img--inner::after {
  	position: absolute;
  	content: "";
  	background-repeat: no-repeat;
}
.mv-img--inner::before {
  	background-image: url(../img/mv-img--left.png);
  	width: 141px;
  	height: 149px;
  	bottom: -54px;
  	left: 0;
}
.mv-img--inner::after {
  	background-image: url(../img/mv-img--right.png);
  	width: 122.02px;
  	height: 198.43px;
  	bottom: -46px;
  	right: 0;
  	transform: translateX(43%);
}

.contents--a, .contents--b, .contents--c {
  	width: 100%;
}

.contents--a {
  	position: relative;
  	margin: auto;
  	max-width: 1000px;
}
.contents--a::before, .contents--a::after {
  	position: absolute;
  	content: "";
}
.contents--a::before {
  	background-image: url(../img/contents-bg--a.png);
  	background-repeat: no-repeat;
  	background-position: center;
  	width: 708px;
  	height: 727px;
  	top: 47px;
  	left: -593px;
  	z-index: -1;
}
.contents--a::after {
  	background-image: url(../img/contents-bg--b.png);
  	background-repeat: no-repeat;
  	background-position: center;
  	width: 625px;
  	height: 1024px;
  	bottom: 0;
  	right: -517px;
  	z-index: -1;
}

.two-column {
  	display: flex;
  	gap: 5rem;
}
.two-column .img-area {
  	margin-left: -70px;
}
.two-column .img-area img {
  	width: 100%;
}
.two-column .txt-area {
  	width: 100%;
  	max-width: 518px;
  	line-height: 2;
  	padding-top: 2rem;
}

.overview {
  	display: block;
  	align-items: center;
  	gap: 5rem;
  	background-color: #F4F5FA;
  	padding: 3.6rem;
}
.overview .tit {
  	flex-wrap: 1;
}
.overview img{
	width: 100%;
}

.ov-content {
  	flex-grow: 2;
  	background-color: #FFFFFF;
  	padding: 2.8rem 2.8rem 1.4rem 2.8rem;
}
.ov-content p {
  	font-size: 1.4rem;
  	font-weight: 700;
  	text-align: center;
  	border-top: 1px dotted #111111;
  	padding-top: 1.4rem;
}

.ov-content--inner {
  	display: flex;
  	justify-content: center;
  	padding-bottom: 2.5rem;
}
.ov-content--inner div {
  	position: relative;
  	color: #002AA0;
  	font-weight: 700;
  	text-align: center;
  	flex-grow: 1;
  	border: 1px solid #002AA0;
  	padding: 3rem 0;
  	margin-right: 5em;
}
.ov-content--inner div span {
  	display: block;
  	font-size: 1.2rem;
  	font-weight: 500;
  	color: #111111;
}
.ov-content--inner div::after {
  	position: absolute;
  	content: "…1単位";
  	font-weight: 400;
  	vertical-align: middle;
  	top: 40%;
  	right: -4em;
}

.contents--b {
	background-image: linear-gradient(180deg, #e3f3ff, #b5e6ff);
	padding-top: 9.5rem;
	padding-bottom: 10rem;
}
.contents--b .contents-b--inner {
  	position: relative;
}
.contents--b .contents-b--inner::before, .contents--b .contents-b--inner::after {
  	position: absolute;
  	content: "";
}
.contents--b .contents-b--inner::before {
  	background-image: url(../img/contents-bg--c.png);
  	background-repeat: no-repeat;
  	background-position: center;
  	width: 528px;
  	height: 449px;
  	top: -9.5rem;
  	left: -295px;
}
.contents--b .contents-b--inner::after {
  	background-image: url(../img/contents-bg--d.png);
  	background-repeat: no-repeat;
  	background-position: center;
  	width: 528px;
  	height: 449px;
  	bottom: -10rem;
  	right: -290px;
}
.contents--b .one-column {
  	position: relative;
  	background-color: #FFFFFF;
  	padding: 6rem 7rem 7rem;
  	z-index: 1;
}

.contents--c {
  	padding-top: 12rem;
  	padding-bottom: 12rem;
}
.element-block {
  	background-color: #F4F5FB;
  	padding: 7rem 20rem 6.5rem;
  	background-image: url(../img/contents-c--bg.png);
  	background-position: bottom;
  	background-repeat: no-repeat;
}
.element-block .element {
  	width: 100%;
  	max-width: 606px;
}

.consortium {
  	display: flex;
  	gap: 4.1rem;
  	border: 1px solid #D8D8D8;
  	padding: 4rem 3rem;
  	align-items: center;
}
.consortium figure {
  	position: relative;
}
.consortium figure::before {
  	position: absolute;
  	content: "";
  	width: 0;
  	height: calc(100% + 20px);
  	border-left: 1px dotted #aaaaaa;
  	right: -21px;
  	top: 0;
  	transform: translateY(-50%);
  	top: 50%;
}
.tit {
  	position: relative;
  	font-size: 2.8rem;
  	font-weight: 700;
  	margin-left: 30px;
  	line-height: 1;
}
.tit::before, .tit::after {
  	position: absolute;
  	content: "";
  	top: 0;
  	bottom: 0;
  	margin: auto;
  	background-color: #002AA0;
  	transform: skewX(15deg) translateX(-20px);
}
.tit::before {
  	width: 2px;
  	left: 0;
}
.tit::after {
  	width: 6px;
  	left: 4px;
}

.tit--txt-black {
  	font-size: 2rem;
  	font-weight: 500;
}
.tit--txt-black span {
  	font-size: 80%;
  	font-weight: 400;
}

.tit--txt-blue {
  	font-size: 1.8rem;
  	font-weight: 600;
  	color: #002AA0;
}

.tit--underline {
  	position: relative;
  	padding-bottom: 1.6rem;
}
.tit--underline::before, .tit--underline::after {
  	position: absolute;
  	content: "";
}
.tit--underline::before {
  	background-color: #002AA0;
  	width: 40px;
  	height: 2px;
  	left: 0;
  	bottom: 0;
}
.tit--underline::after {
  	background-color: #2E2E2E;
  	width: calc(100% - 43px);
  	height: 1px;
  	right: 0;
  	bottom: 1px;
}

.tit-decoration {
  	display: flex;
  	font-weight: 700;
  	text-align: center;
	font-size: 2.8rem;
}
.tit-decoration::before, .tit-decoration::after {
  	content: "";
  	background-image: url(../img/icon-tit-line.png);
  	background-repeat: repeat-x;
  	top: 0;
  	bottom: 0;
  	margin: auto;
  	height: 5px;
}
.tit-decoration::before {
  	flex-grow: 1;
  	left: 0;
}
.tit-decoration::after {
  	flex-grow: 1;
  	transform: rotate(180);
  	right: 0;
}
.tit-decoration span {
  	position: relative;
  	display: inline-block;
  	padding-left: 25px;
  	padding-right: 25px;
  	margin-left: 1rem;
  	margin-right: 1rem;
  	z-index: 1;
}
.tit-decoration span::before, .tit-decoration span::after {
  	position: absolute;
  	content: "";
  	background-image: url(../img/icon-tit.png);
  	top: 0;
  	bottom: 0;
  	margin: auto;
  	width: 17px;
  	height: 29px;
}
.tit-decoration span::before {
  	left: 0;
}
.tit-decoration span::after {
  	right: 0;
}

.asterisk {
  	position: relative;
}
.asterisk::before {
  	position: absolute;
  	content: "※";
  	font-size: 80%;
  	top: 2px;
  	left: -1.3em;
}

.btn-link--blue {
  	position: relative;
  	display: inline-block;
  	color: #FFFFFF;
  	font-weight: 500;
  	background-color: #002AA0;
  	padding: 1rem 3rem 1.4rem 1.8rem;
  	transition: all 0.3s;
}
.btn-link--blue::before {
  	position: absolute;
  	content: "";
  	background-image: url(../img/icon-arrow.svg);
  	background-size: cover;
  	background-repeat: repeat;
  	background-position: center;
  	width: 12px;
  	height: 13px;
  	right: 10px;
  	top: 0px;
  	bottom: 0;
  	margin: auto;
  	transform: translateY(-1.4px);
}
.btn-link--blue:hover {
  	opacity: 0.8;
}

.footer {
  	display: flex;
  	flex-direction: column;
  	align-items: center;
  	gap: 1.5rem;
  	background-color: #F4F5FB;
  	padding: 2rem;
}

address {
  	font-size: 1.2rem;
  	font-style: normal;
}

.mb10 {
  	margin-bottom: 1rem;
}
.mb17 {
  	margin-bottom: 1.7rem;
}
.mb20 {
  	margin-bottom: 2rem;
}

.mb25 {
  	margin-bottom: 2.5rem;
}

.mb30 {
  	margin-bottom: 3rem;
}

.mb35 {
  	margin-bottom: 3.5rem;
}

.mb40 {
  	margin-bottom: 4rem;
}

.mb60 {
  	margin-bottom: 6rem;
}

.mb65 {
  	margin-bottom: 6.5rem;
}

.mb65 {
  	margin-bottom: 6.5rem;
}

.mb90 {
  	margin-bottom: 9rem;
}

.pb70 {
  	padding-bottom: 7rem;
}

.pb100 {
  	padding-bottom: 10rem;
}

.fc-blue {
  	color: #002AA0;
}

.fs-s {
  	font-size: 80%;
  	margin-left: 1.3em;
}

.w1000 {
  	max-width: 1000px;
  	margin: auto;
}/*# sourceMappingURL=style.css.map */

.pdf a{
	display: block;
	max-width: 148px;
	margin: 30px auto 0px;
	border: solid 1px #002AA0; 
	background: #fff;
	padding: 13px 13px 13px 0px;
	text-align: center;
	color: #002AA0;
	position: relative;
}
.pdf a:hover{
	opacity: 0.8;
}
.pdf a::after{
	content: "";
	width: 13px;
	height: 17px;
	background: url("../img/pdf_icon.png");
	background-size: 100%;
	position: absolute;
	top: 50%;
	right: 0;
	transform: translate(-10px,-50%);
}

/*アニメーション*/
/* 共通初期状態 */
.anime_slide {
  	opacity: 0;
  	transition: all 0.8s ease-out;
  	will-change: transform, opacity;
}
.anime_fade {
  	opacity: 0;
  	transition: opacity 1s ease-out; /* ← 1.5秒に変更 */
  	will-change: opacity;
}
/* anime_slide: 初期は斜め左上へ */
.anime_slide {
  	transform: translate(-50px, -50px);
}
/* スライドイン後 */
.anime_slide.in-view {
  	transform: translate(0, 0);
  	opacity: 1;
}
/* フェードイン後 */
.anime_fade.in-view {
  	opacity: 1;
}
.anime_slide_top {
  	opacity: 0;
  	transform: translateY(-50px); /* 上から50px下がった位置に初期設定 */
  	transition: all 0.8s ease-out;
  	will-change: transform, opacity;
}

.anime_slide_top.in-view {
  	opacity: 1;
  	transform: translateY(0);
}
.anime_slide_down {
  	opacity: 0;
  	transform: translateY(50px); /* 下から50px上がった初期位置 */
  	transition: all 0.8s ease-out;
  	will-change: transform, opacity;
}

.anime_slide_down.in-view {
  	opacity: 1;
  	transform: translateY(0);
}

/*ipadpro*/
@media screen and (max-width: 1024px) {
	.mv-txt{
		padding: 0px 20px;
		left: 0;
	}
	.mv-txt h3{
		margin-left: 0px;
	}
	.contents--a{
		padding: 0px 20px 80px;
	}
	.contents--b{
		padding: 80px 20px;
	}
	.contents--b .one-column{
		padding: 30px;
	}
	.contents--b .contents-b--inner::before {
		background-image: url(../img/contents-bg--c.png);
		background-repeat: no-repeat;
		background-position: center;
		background-size: 100%;
		width: 300px;
		height: 290px;
		top: -9.5rem;
		left: -60px;
	}
	.contents--b .contents-b--inner::after {
		background-image: url(../img/contents-bg--d.png);
		background-repeat: no-repeat;
		background-position: center;
		background-size: 100%;
		width: 300px;
		height: 290px;
		bottom: -9.7rem;
		right: -60px;
	}
	.contents--c{
		padding: 80px 20px;
	}
}
.pc{
	display: block;
}
.sp{
	display: none;
}
/*sp*/
@media screen and (max-width: 820px) {
	.pc{
		display: none;
	}
	.sp{
		display: block;
	}
	.logo-top{
		padding: 13px 14px;
	}
	.mv{
		padding: 0px 10px;
		margin-bottom: 100px;
		background-image: url(../img/mv-bg_sp.png);
		background-position: top center;
		background-repeat: no-repeat;
		background-size: cover;
	}
	.mv-inner{
		max-width: 100%;
	}
	.mv-img{
		right: auto;
	}
	.mv-img--inner{
		width: auto;
	}
	.mv-txt{
		padding: 0px 10px;
		top: 29%;
		left: 0;
	}
	.mv-txt h2{
		max-width: 275px;
	}
	.mv-txt h3{
		font-size: 1.8rem;
		margin-left: 0;
	}
	.mv-img--inner::before,.mv-img--inner::after{
		display: none;
	}
	.mv-img.anime_slide {
		transform: translate(0px, -120px);
	}
	.mv-img.anime_slide.in-view{
		transform: translate(30px, -80px);
	}
	.mv-img .pc{
		display: block;
	}
	.mv-img .sp{
		display: none;
	}
	.mv-inner{
		position: relative;
	}
	.mv-inner p.note{
		position: absolute;
		bottom: 10px;
		right: 0;
		color: #fff;
		font-size: 1.1rem;
		display: none;
	}
	.contents--a{
		padding: 0px 20px;
		margin-bottom: 108px;
	}
	.contents--a p{
		font-size: 1.4rem;
		margin-bottom: 10px;
	}
	.two-column{
		display: flex;
    	flex-direction: column-reverse;
    	gap: 5rem;
	}
	.two-column .img-area{
		margin-left: 0px;
	}
	.two-column .txt-area{
		max-width: 100%;
	}
	
	.contents--b{
		padding: 80px 20px;
	}
	.contents--b p{
		font-size: 1.4rem;
		line-height: 1.8;
		margin-bottom: 20px;
	}
	.contents--b .one-column{
		padding: 30px;
	}
	.tit{
		font-size: 2.4rem;
		margin-bottom: 30px;
	}
	.tit--txt-black{
		font-size: 1.8rem;
		margin-bottom: 29px;
	}
	.tit--txt-black span{
		font-size: 1.4rem;
	}
	.tit--txt-blue{
		font-size: 1.6rem;
	}
	.btn-link--blue{
		width: 100%;
		font-size: 1.6rem;
    	text-align: center;
	}
	.contents--b .mb65{
		margin-bottom: 50px;
	}
	.contents--b .contents-b--inner::before {
		background-image: url(../img/contents-bg--c.png);
		background-repeat: no-repeat;
		background-position: center;
		background-size: 100%;
		width: 275px;
		height: 234px;
		top: -7.9rem;
		left: -55px;
	}
	.contents--b .contents-b--inner::after{
		background-image: url(../img/contents-bg--d.png);
		background-repeat: no-repeat;
		background-position: center;
		background-size: 100%;
		width: 275px;
		height: 234px;
		bottom: -8rem;
		right: -60px;
	}
	.contents--c{
		padding: 100px 20px 0px;
	}
	.element-block{
		padding: 40px 20px;
		background-image: url(../img/contents-c--bg_sp.png);
		background-position: center;
        background-size: 100%;
    	background-repeat: no-repeat;
	}
	.element-block .element{
		max-width: 100%;
	}
	.element-block .element figure{
		display: flex;
    	justify-content: center;
	}
	.contents--c .mb60{
		margin-bottom: 50px;
	}
	.consortium{
		display: block;
		padding: 20px;
		margin-bottom: 80px;
	}
	.consortium figure{
		display: flex;
    	justify-content: center;
		padding-bottom: 25px;
	}
	.consortium p{
		font-size: 1.4rem;
	}
	.consortium figure::before {
        position: absolute;
        content: "";
        width: calc(100% + 0px);
        height: 0;
        border-top: 1px dotted #aaaaaa;
        top: 80%;
        left: 0;
        transform: translateY(-50%);
    }
	
	.contents--a::before{
		background-image: url(../img/contents-bg--a_sp.png);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100%;
        width: 230px;
        height: 850px;
        top: auto;
        left: 0;
        z-index: -1;
        bottom: 247px;
	}
	.two-column .txt-area{
		position: relative;
	}
	.two-column .txt-area::after {
		content: "";
		background-image: url(../img/contents-bg--b_sp.png);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100%;
        width: 500px;
        height: 250px;
		position: absolute;
        bottom: auto;
        right: -170px;
        z-index: -1;
        top: -200px;
	}
	.contents--a::after{
		content: "";
        position: absolute;
        bottom: -111px;
        right: -50px;
        background-image: url(../img/contents-bg--b2_sp.png);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 100%;
        width: 230px;
        height: 150px;
        z-index: -1;
	}
	.overview .pc{
		display: block;
	}
	.overview .sp{
		display: none;
	}
}
@media screen and (max-width: 767px) {
	.mv-img .pc{
		display: none;
	}
	.mv-img .sp{
		display: block;
	}
	.mv-inner p.note{
		display: block;
	}
	.overview .pc{
		display: none;
	}
	.overview .sp{
		display: block;
	}
	.mv-img.anime_slide.in-view{
		transform: translate(30px, -60px);
	}
}
@media screen and (max-width: 390px) {
	.mv-img.anime_slide.in-view {
        transform: translate(30px, -30px);
    }
}