@charset "utf-8";
/* CSS Document */

/*
* MV
******************************************************/
.index-mv {
    width: 100%;
    height: 100svh;
    position: relative;
}
.mv-heading-start.started {
    opacity: 0;
    animation: 2s fadeUptext ease-in-out forwards;
    text-shadow: 1px 1px 0 rgba(0, 0, 0, .1);
}
.index-mv-heading {
    position: absolute;
    z-index: 1;
}
.index-mv-heading.heading01 {
    top:90px;
    right: 0;
    color: var(--color-default);
}
.index-mv-heading.heading02 {
    bottom:90px;
    right: 0;
    color: var(--color-slider-text);
}
.index-mv-heading.heading03 {
    top:90px;
    left: 0;
    color: var(--color-slider-text);
}
.index-mv-heading-catch {
    font-weight: var(--font-bold);
    line-height: 1.5;
}
.index-mv-heading-catch.catch01 {
    font-size: 2.6rem;
    border-bottom: 2px solid var(--color-default);
}
.index-mv-heading-catch.catch02 {
    font-size: 1.8rem;
    padding: 0 .55em 6px;
    /*border-bottom: 2px solid var(--color-slider-text);*/
}
.index-mv-heading-catch.catch03 {
    font-size: 1.8rem;
    padding: 0 .55em 6px;
    /*border-bottom: 2px solid var(--color-default);*/
}
.index-mv-heading h1 {
    font-weight: var(--font-bold);
    line-height: 1.55em;
    font-weight: 500;
}
.index-mv-heading.heading01 h1 {
    font-size: 1.8rem;
    margin: 14px;
}
.index-mv-heading.heading02 h1 {
    font-size: 2.4rem;
    text-align: right;
    margin: 3px .55em;
}
.index-mv-heading.heading03 h1 {
    font-size: 2.4rem;
    text-align: right;
    margin: 3px .55em;
}
@media print, screen and (min-width: 1080px) {
    .index-mv {
        width: 100%;
        height: calc(100svh - 120px);
        position: relative;
    }
    .index-mv-heading.heading01 {
        top:80px;
    }
    .index-mv-heading.heading02 {
        bottom:160px;
    }
    .index-mv-heading.heading03 {
        top:80px;
    }
    .index-mv-heading-catch.catch01 {
        font-size: 4.3rem;
    }
    .index-mv-heading-catch.catch02 {
        font-size: 3rem;
        padding: 0 .55em .25em;
    }
    .index-mv-heading-catch.catch03 {
        font-size: 3rem;
        padding: 0 .55em .25em;
    }
    .index-mv-heading h1 {
        font-weight: var(--font-bold);
    }
    .index-mv-heading.heading01 h1 {
        font-size: 3rem;
        margin: 20px 60px 0 60px;
    }
    .index-mv-heading.heading02 h1 {
        font-size: 4rem;
    }
    .index-mv-heading.heading03 h1 {
        font-size: 4rem;
    }
}
/*
* MV SWIPER
******************************************************/
.mv {
    width: 100%;
}
.mv .swiper-fade .swiper-slide {
     transition-property: opacity, -webkit-transform !important;
     transition-property: opacity, transform !important;
     transition-property: opacity, transform, -webkit-transform !important;
     pointer-events: none;
 }
 .mv .swiper-fade .swiper-slide-active {
     pointer-events: auto;
 }
.swiper-wrapper {
     height: calc(100vh - 120px)!important;
 }
 .mv .slide-media {
    height: 100svh;
}
.mv .slide-media img {
     transition: 7s 1s ease-out;
     object-fit: cover;
     height: 100%;
     max-width: fit-content;
 }
 .mv .swiper-slide[class*=-active] .slide-media img {
     -webkit-transition-delay: 0s;
             transition-delay: 0s;
     -webkit-transform: scale(1.05);
             transform: scale(1.05);
 }
 @media print, screen and (min-width: 1080px) {
    .mv {
        padding:0;
    }
    .mv .slide-media img {
       object-fit: cover;
       max-width: 100%;
   }
 }
@media print, screen and (min-width: 1480px) {
     /*.mv {
         padding:0;
     }
     .mv .slide-media img {
        object-fit: none;
        object-position: bottom center;
        max-width: 100%;
    }
    */
 }

.index-panel-content {
    padding: 60px 0;
    position: relative;
}
.index-panel-content p {
    font-size: 1.3rem;
    margin: 1.55em 0 0 0;
}
.index-panel-heading {
    color: var(--color-default);
    background: var(--color-theme-primary);
    border-bottom-right-radius: 10px;
    max-width: 308px;
    position: absolute;
    top:40px;
    left: 0;
    z-index: 3;
}
.index-panel-heading a,
.index-panel-heading.as_reverse a {
	color: var(--color-default);
	display:block;
    padding: 24px;
}
.index-panel-heading.as_reverse {
    background: var(--color-theme-secondary);
    left: inherit;
    right:0;
    border-bottom-right-radius: inherit;
    border-bottom-left-radius: 10px;
}
.index-panel-bg {
    max-width: 100%;
    height: 500px;
    margin: 0;
}
.index-panel-bg-img {
    position: absolute;
	bottom: 100px;
    right: 0;
    z-index: 2;
    width: 320px;
    height: 320px;
    overflow: hidden;
}
.index-panel-bg-img.as_reverse {
    right: inherit;
    left: 0;
}
.index-panel-bg-img img {
	max-width: fit-content;
}
.index-panel-links {
    position: absolute;
    z-index: 3;
    top: 280px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
}
.index-panel-links ul {
	max-width: fit-content;
	margin: auto;
    padding: 30px 0 0 0;
}
.index-panel-links li {
    width: 320px;
    margin: 0 0 8px 0;
}
.index-panel-links li a {
    display: block;
    font-weight: var(--font-bold);
    font-size: 1.6rem;
    background: var(--color-rgba-white);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    text-align: center;
    border: 2px solid var(--color-button-border);
    width: 100%;
    height: 46px;
    line-height: 46px;
}
.index-panel-links li a:hover {
    background: var(--color-default);
    color: var(--color-button-text);
}

@media print, screen and (min-width: 1080px) {
    .index-panel-content {
        padding: 60px 0;
    }
    .index-panel-content p {
        font-size: 2rem;
    }
    .index-panel-heading {
        max-width: 540px;
        border-bottom-right-radius: 30px;
    }
	.index-panel-heading a,
    .index-panel-heading.as_reverse a {
        padding: 60px;
    }
    .index-panel-heading.as_reverse {
        border-bottom-left-radius: 30px;
    }
    .index-panel-bg {
        max-width: var(--content-size);
        height: 610px;
        margin: auto;
    }
    .index-panel-bg-img {
        left: inherit;
        bottom: -20px;
        right: -20px;
        width: 940px;
        height: 639px;
    }
    .index-panel-links {
        left: inherit;
        top: inherit;
        bottom: 70px;
        right: 40px;
        transform: none;
        -webkit-transform: none;
    }
    .index-panel-links.as_reverse {
        left: 80px;
    }
    .index-panel-links ul {
        max-width: var(--max-size);
		margin: auto;
        display:flex;
        justify-content:space-between;
        align-items: flex-start;
        padding: 100px 0 0 0;
        flex-wrap: wrap;
        margin: 0 auto;
    }
    .index-panel-links li {
        width: 48%;
        margin: 0 0 20px 0;
    }
    .index-panel-links li a {
        width: 100%;
        max-width: 350px;
        font-size:1.8rem;
    }
}
/* ANIMATION */
.index-panel-heading.delighter.started {
    animation: fadeSlide 1.2s forwards ease-in-out
}
.index-panel-heading.as_reverse.delighter.started {
    animation: fadeSlide 1.2s forwards ease-in-out
}
.index-panel-bg-img img.delighter.started {
    width: 100%;
    height: auto;
    animation: animationZoom 5s ease-in-out forwards;
    object-fit: cover;
}
.index-panel-bg-img img.as_reverse.delighter.started {
    width: 100%;
    height: auto;
    animation: animationZoom 5s ease-in-out forwards;
}

/*
* NEWS
******************************************************/
.index-news-content {
    padding: 40px 20px;
    margin: 0 auto;
}
@media print, screen and (min-width: 1080px) {
    .index-news {
        margin: 30px 0 0 0;
    }
    .index-news-content {
        padding: 60px 0;
    }
}

/*
* SERVICE
******************************************************/
.index-service {
    padding: 0 0 50px 0;
}
.index-service-link01 {
    background: url(/public/assets/img/index/bg-service01.webp) no-repeat center center/cover;
}
.index-service-link02 {
    background: url(/public/assets/img/index/bg-service02.webp) no-repeat center center/cover;
}
.index-service-link03 {
    background: url(/public/assets/img/index/bg-service03.webp) no-repeat center center/cover;
}
.index-service-link04 {
    background: url(/public/assets/img/index/bg-service04.webp) no-repeat center center/cover;
}
.index-service-link {
    width: 100%;
    height: 200px;
    position: relative;
}
.hover-panel {
    transition: var(--transition-slow);
    height: 100%;
}
.hover-panel:hover {
    background:  rgba(0,0,0,.3);
    height: 100%;
}
@media print, screen and (min-width: 1080px) {
    .index-service {
        height: 520px;
    }
    .index-service .ge-content-bg-inner {
        top:50px;
    }
    .index-service .ge-content-bg-layer {
        height: 560px;
	}
    .index-service-content {
        max-width: var(--max-size);
        margin: auto;
    }
}
/*
* SUSTAINABILITY
******************************************************/
.index-sustainability {
    margin: 0 auto;
}
@media print, screen and (min-width: 1080px) {
    .index-sustainability {
        padding:60px 0 0 0;
    }
    .index-sustainability-links ul {
        display:block;
    }
    .index-sustainability-links li {
        margin: 0;
        width: 360px;
    }
}
/*
* RECRUIT
******************************************************/
.index-recruit {
    margin: 0 auto;
}
.index-recruit-links {
    top: 220px;
}
@media print, screen and (min-width: 1080px) {
    .index-recruit {
        padding: 60px 0 0 0;
    }
    .index-recruit-links ul {
        display:block;
    }
    .index-recruit-links li {
        margin: 0 0 20px 0;
        width: 360px;
    }
}
/*
* INFO
******************************************************/
.index-infomation {
    margin: 0 auto;
}
@media print, screen and (min-width: 1080px) {
    .index-infomation {
        padding: 40px 0 0 0;
    }
    .index-infomation-links ul {
        display:block;
    }
    .index-infomation-links li {
        margin: 0 0 20px 0;
        width: 360px;
    }
}

