/* common
-------------------------------------------------------------*/
.top-section { padding:80px 0px; margin:40px auto 80px; }

@media (max-width:991px){
  .top-section { margin-bottom:40px; }}
@media (max-width:767px){
	.button-primary { width:64%; }}
@media (max-width:480px){
	.button-primary { width:88%; }}

/* mv
-------------------------------------------------------------*/
.mv { overflow:hidden; }
.mv .inner1 { position: relative; z-index: 2; }
.top-catch-wrap { position: absolute; top:50%; left:50%; transform:translate(-50%, -50%); z-index: 2; width:100%; }
.top-catch { font-size:480%; color: #fff; line-height: 1.6; letter-spacing: 2.4px; text-align:center; }
.top-catch .spbr { display:none; }
.second-catch { margin-top:40px; font-size:160%; color: #fff; letter-spacing: 2px; text-align:center; }
.fs-cont { font-size:90%; }
.mv-cover-wrap { text-align: center; }
.mv-cover { max-width:1600px; position: relative; display: inline-block;}

.mv-cover:before { content: ""; position: absolute;
  top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 152, .5); }
.mv-cover:after { content: ""; position: absolute;
  top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(45deg, rgba(0, 0, 152,.4) 0, transparent 70%); }


.js-main-slider img { height: auto; }

@media (max-width: 1200px){
	.top-catch { font-size:400%; }
	.second-catch { margin-top:32px; font-size:152%;  }
}

@media (max-width: 991px){
	.top-catch { font-size:280%; }
	.second-catch { font-size:140%;  }
	.mv-cover img { height: 84svh; object-fit: cover; }}

@media (max-width: 599px){
	.top-catch-wrap { bottom: 40px; }
	.top-catch { font-size:240%; }
	.top-catch .spbr { display:block; }
	.second-catch { margin-top:52px; font-size:120%;  }}



/* intro-section
-------------------------------------------------------------*/
.intro-sec { padding-bottom:0; }
.intro-sec .inner1 { position:relative; }
.intro-fst-text { line-height: 2; }
.intro-text1 { margin-top:0px; font-weight:900; }
.intro-text2 { margin-top:0px; line-height:1.2; }
.intro-text3 { margin-top:12px; }

.button-wrap-intro { margin-top:56px; }
.intro-image-wrap { position:absolute; right:0; top:50%; transform:translateY(-50%);  }
.intro-image { width:360px; height:auto; }


@media (max-width:991px){
	.intro-sec { margin-top:0; }}

@media (max-width:920px){
	.intro-sec { margin-bottom:0; }
	.intro-sec .inner1 { padding-bottom:360px; }
	.intro-sec .button-primary { width: 80%; }
	.intro-image-wrap { top:inherit; transform:inherit;  bottom:0; }
	.intro-image { width:480px; height:320px; object-fit:cover; }
}
@media (max-width:599px){
	.intro-sec .button-primary { width: 100%; }}
@media (max-width:480px){
	.intro-sec { padding-top:48px; }
	.intro-sec .heading-primary { font-size:132%; }
	.button-wrap-intro { margin-top: 32px; }
	
}
@media (max-width:400px){
	.intro-sec .engtext-fs { font-size:300%; }
	.intro-sec .heading-primary { font-size:124%; }}

/* case-section
-------------------------------------------------------------*/
.case-sec { position: relative; background-image: repeating-linear-gradient(90deg, hsla(196,0%,79%,0.06) 0px, hsla(196,0%,79%,0.06) 1px,transparent 1px, transparent 96px),repeating-linear-gradient(0deg, hsla(196,0%,79%,0.06) 0px, hsla(196,0%,79%,0.06) 1px,transparent 1px, transparent 96px),repeating-linear-gradient(0deg, hsla(196,0%,79%,0.09) 0px, hsla(196,0%,79%,0.09) 1px,transparent 1px, transparent 12px),repeating-linear-gradient(90deg, hsla(196,0%,79%,0.09) 0px, hsla(196,0%,79%,0.09) 1px,transparent 1px, transparent 12px),linear-gradient(90deg, rgb(255,255,255),rgb(255,255,255)); padding-bottom:120px; }
.case-sec .inner1 { position:relative; z-index:2; }

.case-list { margin-top:56px; position: relative; z-index: 2;}
.case-item { width:30%; }
.case-item:nth-child(3n-1) { margin:0 5%; }
.case-link { overflow:hidden; display: block; background-color:#fff; box-shadow: rgba(var(--green-color-primary-rgb), 0.1) 0px 7px 29px 0px; color:#111; }
.case-text { padding:24px; }
.case-image { overflow:hidden; }
.case-link img { height: auto; }
.case-link h3 { color:#111; font-size:120%; }
.case-link p { font-size:90%; margin-top:12px; }
.case-link img { transition:transform var(--base-duration) var(--base-easing); }
.case-link:hover img { transform: scale(1.06,1.06); }

.case-intro-text { margin-top:24px; line-height: 1.8; }
.button-wrap-case { margin-top:24px; }
.button-wrap-case .button-primary { margin: auto; border-color:#fff; }
.green-bg { position: absolute; bottom:0; width:100%; z-index: 1;
  height:480px; background: linear-gradient(90deg, var(--blue-color-primary), var(--blue-color-primary)); }

@media (max-width:991px){
	.case-sec { margin:0; padding:40px 0 56px; }
	.case-list { margin-top:56px; width:80%; margin:48px 10% 0; }
	.case-item:nth-child(3n-1) { margin:0; }
	.case-list .case-item { width:100%; margin-bottom:6.4%; }}
@media (max-width:480px){
	.case-list { margin-top:56px; width:100%; margin:48px 0 0; }}


/* pagenav-section
-------------------------------------------------------------*/
.pagenav-sec { margin-bottom:0; padding-bottom:0; }
.page-nav { margin-top:48px; }
.page-nav-link { overflow: hidden; display:block; width:calc(100% / 3); height: 320px; position: relative; }
.page-nav-link h3 { font-size:160%; color:#fff; position: absolute; z-index: 3; left:40px; bottom:24px; }
.page-nav-image-wrap { position: relative; }
.page-nav-image-wrap:before { content: ""; position: absolute; z-index: 2;
  top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(var(--blue-color-primary-rgb), .1); }
.page-nav-image-wrap:after { content: ""; position: absolute; z-index: 2;
  top: 0; left: 0; width: 100%; height: 100%; background: linear-gradient(45deg, rgba(var(--blue-color-primary-rgb),1) 0, transparent 60%); }
.page-nav-image img { display: block; width: 100%; height: 320px; object-fit: cover; }
.page-nav-image img { transition:transform var(--base-duration) var(--base-easing); }
.page-nav-link:hover img { transform: scale(1.06,1.06); }

@media (max-width: 1200px){
	.page-nav-image img { height: 360px;  }}
@media (max-width:991px){
	.pagenav-sec { margin-top:0; padding-top:56px; }
	.page-nav { margin-top: 80px; }}

@media (max-width:767px){
	.page-nav-link { width:100%; height: 240px; }
}

