/*線画*/
.bg-0 {background-image: url(../images/bg.png); background-repeat: no-repeat; background-size: 100%; background-position: left 0% bottom 7rem;position: fixed;left: 0;top: 0;width: 2000vw;height: 100dvh;z-index: 1;}


/*くり抜き*/
.bg-1 {background-image: url(../images/bg-1.png); background-repeat: no-repeat; background-size: cover; background-position: right 50% top 50%;position: fixed;left: 50%;top: 50%;width: 100%;height: 100dvh; transform: translate(-50%, -50%) scale(1.2);
transform-origin: center center; transition: transform 1s ease-out;opacity: 1;z-index: 2;display: none;
/* filter: drop-shadow(0em 1.0em 1em hsla(208, 100%, 34%,0.5)); */
}


/*キャッチ*/
.container-catch {position: relative;display: flex;gap:2em;align-items:flex-end;flex-direction: column;padding-inline: 1rem;}
.container-catch-photo{width: auto;height: 16em;overflow: hidden;margin-top:0em; margin-inline: -1rem;}
.container-catch-photo-image {width: 100%;height: 100%;object-fit: cover;}
.catch-page {font-size: 1.0em;letter-spacing: 0.1em;width:fit-content;margin-inline:auto }
.catch-page p{background-color:unset;display: inline-block;margin-top: 1em;}
.tx-next-callenge{width: 20em;}

/*背景都市のシーン・空*/
#s3{width: 100%;height: 100dvh;overflow: hidden; background-image: 
    linear-gradient(to top, #ecfdff 0%, #b5ecff 100%);position: relative;background-position: left 0 bottom 7rem;background-repeat: no-repeat;}
/*横スクロール本体*/
.s3-wrapper {width: 1200vw;height: 100%;background-color: unset;overflow: hidden;position: absolute;display: inline-block;left: 0;bottom: 0;}
/*基準*/
.s3-inner {position: relative;height: 100%;}
/*電車*/
.bg-train{position: absolute;width: 11rem;left: 12rem;bottom:9.5rem;}
/*最背面*/
.bg-city{width: 1200vw;height: 100%;background-color: unset;
background-image:url("../images/index/bg/bg-city.svg"); background-repeat: no-repeat; background-size:100% auto;
background-position: left 0 bottom 7rem;display: block;position: absolute;left: 0;top: 0;}
/*バス長い*/
.bg-bus-long{position: absolute;width: 19rem;left: 79rem;bottom:7.3rem;}
/*バス普通*/
.bg-bus{position: absolute;width: 11rem;left: 240rem;bottom:7.3rem;}
/*ビートル*/
.bg-beetle{position: absolute;width: 7rem;left: 172rem;bottom:7.3rem;}
/*クレーン*/
.bg-crane{position: absolute;width: 0.4rem;left: 66.3rem;bottom:16.5rem;height: 10rem;}
.bg-crane img {object-fit:contain;object-position: 0 -8rem;width: 100%;height: 100%;}
/*クレーン2*/
.bg-crane-2{position: absolute;width: 0.4rem;left: 237.4rem;bottom:12.5rem;height: 10rem;}
.bg-crane-2 img {object-fit:contain;object-position: 0 -8rem;width: 100%;height: 100%;}
/*ショベルカー*/
.bg-excavator{position: absolute;width: 3.8rem;left: 73rem;bottom:7.3rem;}
/*ミキサー1*/
.bg-mixer-1{position: absolute;width: 4.2rem;left: 78rem;bottom:7.3rem;}
/*ミキサー2*/
.bg-mixer-2{position: absolute;width: 4.2rem;left: 83rem;bottom:7.3rem;}
/*ミキサー3*/
.bg-mixer-3{position: absolute;width: 4.2rem;left: 88rem;bottom:7.3rem;}
/*飛行機*/
.bg-plane{position: absolute;width: 8.0rem;left: 340rem;bottom:14.3rem;}
/* 背景のフロント */
.bg-front {width: 1200vw;height: 100%;background-color: unset;
background-image:url("../images/index/bg/bg-front.svg"); background-repeat: no-repeat; background-size:100% auto; background-position: left 0 bottom 7rem;display: block;position: absolute;left: 0;top: 0;}
/* 表示コンテンツ */
.people-1{width: 14em;left: 70rem;bottom: 6rem;position: absolute;will-change: transform;}
.people-2{width: 9em;left: 252rem;bottom: 5.4rem;position: absolute;will-change: transform;}

/*ムービースキップ*/
.btn-skip-movie {background-color:var(--c-text);color: #FFF;line-height: 1;position: fixed;z-index: 10;font-family: var(--ff-ja);-webkit-font-feature-settings: normal;font-feature-settings: normal;column-count: 1;-ms-writing-mode: tb-rl; writing-mode: vertical-rl;font-size: 1em;letter-spacing: 0.2em;right:0.0rem;bottom: 13rem;padding: 0.6em 0.2em 1.6em;cursor: pointer;background-image: url("../images/arrow-down-white.svg"); background-repeat: no-repeat; background-size: 1.2em auto; background-position: right 50% bottom 0.3em;}

/*ページのタイトル*/
.title-page-wrapper {position: absolute;left: 50%;top: 30%;z-index: 100;font-size: 1em;pointer-events: none;transform: translate(-50%,-50%);}
.title-page{font-size: 3.0em;font-family: var(--ff-ja);font-weight: normal;letter-spacing:0.3em;line-height: 1.4;white-space: nowrap;}
.title-page span {display:inline-block;}
.title-page-company{width: 20em;margin-top: 1em;}

/*PICKUP*/
#s1 {position: relative;z-index:100;}
.list-pickup {display: flex;width: 320vw;gap:3em;margin-top: 2em;}
.list-pickup-item {position: relative;z-index: 10;/* flex-grow: 1; *//* flex-shrink: 1; *//* flex-basis: 0; */}
.list-pickup-item-link {display: block;padding: 0;transition: all 0.5s ease-out;background-color: hsla(0, 0%, 100%,0.9);height: 100%;box-shadow:0em 1em 1em 0em hsla(211, 100%, 32%, 0.2)}
.list-pickup-item-image {margin-inline:auto;width: 100% !important;object-fit: cover;aspect-ratio: 16 / 10;}
.list-pickup-item-title {padding: 0.5em;width: 100%;text-align: center;font-size: 1.1em;}
.list-pickup-item-link:hover {box-shadow:0em 1em 1em 0em hsla(211, 100%, 32%, 0.2);transform: scale(1.05);}

/*新着情報*/
#s4 {position: relative;z-index: 300;padding-block: 10rem;}
.list-news {margin-top: 2em;display: flex;gap:1em;flex-wrap: wrap;}
.list-news-item {display: block;width: calc(50% - (1em * 1/2));}
.list-news-item-link {display: flex;gap: 1em;padding-block:1em ;flex-direction: column;}
.list-news-item-link-figure {width:100%;}
.list-news-item-link-figure-image {object-fit: cover;aspect-ratio: 3 / 1.8;}
.list-news-item-link-body {}
.list-news-item-link-body-data {font-size: 0.8em;display: flex;align-items: center;}
.list-news-item-link-body-data-category {display: inline-block;background-color: var(--c-accent);padding: 0 0.6em;line-height: 1.1;min-height: 1em;}
.list-news-item-link-body-data-date {margin-left: auto;font-family: var(--ff-en);}
.list-news-item-link-body-title {font-size: 0.9em;margin-top: 0.5em;}

/*GD*/
#s5{position: relative;z-index: 300;padding-block: 6rem;}
.gd-2015 {width: 18rem;display: block;margin-inline: auto;margin-inline: auto;}
.gd-2015 img {width: 100%;max-width: unset;}
.list-gd {margin-top: 6rem;display: flex;flex-direction: column;}
.list-gd-item {display: block;flex-grow: 1;flex-shrink: 1;flex-basis: 0;}
.list-gd-item-link {display: block;overflow: hidden;position: relative;}
.list-gd-item-image {width: 100% !important;max-width: unset;aspect-ratio: 16 / 9;object-fit: cover;}
.list-gd-item-title {background-color: hsla(0, 0%, 0%,0.5);position: absolute;top: 0;right: 0;bottom: 0;left: 0;display: flex;align-items: center;justify-content: center;color: #FFF;font-size: 1.2em;letter-spacing: 0.2em;text-align: center;}

/*新卒採用へリンク*/
.btn-rectuit-lp { background-image: 
    linear-gradient(to top right, #f10028 0%, #bd441c 100%)
  ;
;
color: #FFF;display: flex;align-items: center;justify-content: center;flex-direction: column;
;font-weight: bold;
position: fixed;border-radius: 50%;right: 1.5rem;bottom: 6.0rem;z-index: 100;width: 5rem;
aspect-ratio: 1;
transition: transform 0.3s ease-out;
}
.btn-rectuit-lp-text {color: #FFF;font-family: var(--ff-ja);font-size: 0.8rem;white-space: nowrap;display: inline-block;}
.btn-career-page{bottom: 0.5rem;
 background-image: 
    linear-gradient(to top left, #0050a5 0%, #00799f 100%)
  ;
}


.btn-rectuit-lp:hover {transform: scale(1.1);}

/*トップのテキストだけのお知らせスライダー*/
.fixed-text-news {z-index: 2900;position: fixed;top: 0;left: 0;;width:14rem;height:6rem;left: 7rem;top:0.8rem;}
.fixed-text-news-link {display: grid;gap:0.3em 0.3em;grid-template-columns: 1fr;}
.fixed-text-news-category {display:grid ;font-size: 0.7em;background-color: var(--c-primary);color: #FFF;line-height: 1;padding: 0.2em 0.7em;align-items: center;align-self: center;justify-self: left;white-space: nowrap;width: auto;}
.fixed-text-news-date {display: flex;font-size: 0.7em;line-height: 1;align-self: center;justify-self: start;width:auto;white-space: nowrap;align-items: center;letter-spacing:0.05em;padding: 0.2em 0em}
.fixed-text-news-title {font-family: var(--ff-ja);font-size: 0.8em;line-height: 1.0;display: block;overflow: hidden;
display: -webkit-box; -webkit-box-orient: vertical;
-webkit-line-clamp: 1; }
.fixed-text-news-title small {display:inline-block !important;margin-left: 1em !important;}
.fixed-text-news .swiper-button-prev {}
.fixed-text-news .swiper-button-next {}


/**/
.bg-2{background-image: 
    linear-gradient(to top, #e1ebf5 0%, #e1ebf5 100%)
  ;position: fixed;left: 0;top: 0;bottom: 0;right: 0;z-index: 3;}
.section-snap{
/* padding-block:4rem; */
}


@media (min-width: 500px) {


/*線画*/
.bg-0 {background-image: url(../images/bg.png); background-repeat: no-repeat; background-size: 100%; background-position: left 0% top 50%;position: fixed;left: 0;top: 0;width: 400%;height: 100dvh;bottom: auto;}

/*くり抜き*/
.bg-1 {background-image: url(../images/bg-1.png); background-repeat: no-repeat; background-size: cover; background-position: right 50% top 50%;position: fixed;left: 50%;top: 50%;width: 100%;height: 100dvh; transform: translate(-50%, -50%) scale(1.2);
transform-origin: center center; transition: transform 1s ease-out;opacity: 1;display: block;
/* filter: drop-shadow(0em 1.0em 1em hsla(208, 100%, 34%,0.5)); */
}

/*キャッチ*/
.container-catch {position: relative;display: flex;gap:4em;align-items:flex-end;flex-direction:row;padding-block: 4rem;}
.container-catch-photo{width: 62em;height: 27rem;overflow: hidden;margin-top:0em;}
.container-catch-photo-image {width: 100%;height: 100%;object-fit: cover;}
.catch-page {font-size: 1.0em;letter-spacing: 0.1em;width:fit-content;margin-inline:auto }
.catch-page p{background-color: unset;display: inline-block;margin-top:1em;}
.tx-next-callenge{width: auto;}

/*背景都市のシーン・空*/
#s3{width: 100%;height: 100dvh;overflow: hidden; background-image:linear-gradient(to top, #ecfdff 0%, #b5ecff 100%);
position: relative;background-position: left 0 bottom 0;}
/*横スクロール本体*/
.s3-wrapper {width: 400vw;height: 100%;background-color: unset;overflow: hidden;position: absolute;display: inline-block;left: 0;bottom: 0;}
/*基準*/
.s3-inner {position: relative;height: 100%;}
/*電車*/
.bg-train{position: absolute;width: 11rem;left: 10rem;bottom:2.5rem;}
/*最背面*/
.bg-city{width: 400vw;height: 100%;background-color: unset;
background-image:url("../images/index/bg/bg-city.svg"); background-repeat: no-repeat; background-size:100% auto; background-position: left 0 bottom 0;display: block;position: absolute;left: 0;top: 0;}
/*バス長い*/
.bg-bus-long{position: absolute;width: 19rem;left: 79rem;bottom:0.3rem;}
/*バス普通*/
.bg-bus{position: absolute;width: 11rem;left: 240rem;bottom:0.3rem;}
/*ビートル*/
.bg-beetle{position: absolute;width: 7rem;left: 176rem;bottom:0.3rem;}
/*クレーン*/
.bg-crane{position: absolute;width: 0.4rem;left: 67.9rem;bottom:9.5rem;height: 10rem;}
.bg-crane img {object-fit:contain;object-position: 0 -8rem;width: 100%;height: 100%;}
/*クレーン2*/
.bg-crane-2{position: absolute;width: 0.4rem;left: 243.5rem;bottom:5.5rem;height: 10rem;}
.bg-crane-2 img {object-fit:contain;object-position: 0 -8rem;width: 100%;height: 100%;}
/*ショベルカー*/
.bg-excavator{position: absolute;width: 3.8rem;left: 73rem;bottom:0.3rem;}
/*ミキサー1*/
.bg-mixer-1{position: absolute;width: 4.2rem;left: 78rem;bottom:0.3rem;}
/*ミキサー2*/
.bg-mixer-2{position: absolute;width: 4.2rem;left: 83rem;bottom:0.3rem;}
/*ミキサー3*/
.bg-mixer-3{position: absolute;width: 4.2rem;left: 88rem;bottom:0.3rem;}
/*飛行機*/
.bg-plane{position: absolute;width: 8.0rem;left: 320rem;bottom:0.3rem;}
/* 背景のフロント */
.bg-front {width: 400vw;height: 100%;background-color: unset;
background-image:url("../images/index/bg/bg-front.svg"); background-repeat: no-repeat; background-size:100% auto; background-position: left 0 bottom 0;display: block;position: absolute;left: 0;top: 0;}
/* 表示コンテンツ */
.people-1{width: 14em;left: 70rem;bottom: -2rem;position: absolute;}
.people-2{width: 9em;left: 250rem;bottom: -2rem;position: absolute;}

/*ページのタイトル*/
.title-page-wrapper {position: absolute;left: 50%;top: 50%;}
.title-page{font-size: 3.0em;font-family: var(--ff-ja);font-weight: normal;letter-spacing:0.3em;line-height: 1.4;white-space: nowrap;}
.title-page span {display:inline-block;}
.title-page-company{width: 19em;margin-top: 1em;}list-pickup

/*PICKUP*/
#s1 {position: relative;z-index:100;}
.list-pickup {display: flex;width: 180vw;gap:6em;margin-top: 2em;padding-left: 0;}
.list-pickup-item {position: relative;/* z-index: 10; *//* flex-grow: 1; *//* flex-shrink: 1; *//* flex-basis: 0; */}
.list-pickup-item-link {display: block;padding: 0;transition: all 0.5s ease-out;background-color: hsla(0, 0%, 100%,0.9);}
.list-pickup-item-image {margin-inline:auto;width: 100% !important;object-fit: cover;aspect-ratio: 16 / 10;}
.list-pickup-item-title {padding: 1em;width: 100%;text-align: center;}
.list-pickup-item-link:hover {box-shadow:0em 1em 1em 0em hsla(211, 100%, 32%, 0.2);transform: scale(1.05);}

/*新着情報*/
#s4 {position: relative;z-index: 300;padding-block: 10rem;}
.list-news {margin-top: 2em;display: flex;gap:3em;flex-wrap: nowrap;}
.list-news-item {display: block;width: calc(25% - (3em * 3/4));}
.list-news-item-link {display: flex;gap: 1em;padding-block:1em ;flex-direction: column;}
.list-news-item-link-figure {width:100%;}
.list-news-item-link-figure-image {object-fit: cover;aspect-ratio: 3 / 1.8;}
.list-news-item-link-body {}
.list-news-item-link-body-data {font-size: 0.8em;display: flex;}
.list-news-item-link-body-data-category {display: inline-block;background-color: var(--c-accent);padding: 0 0.6em;}
.list-news-item-link-body-data-date {margin-left: auto;}
.list-news-item-link-body-title {font-size: 0.9em;margin-top: 0.5em;}

/*GD*/
#s5{position: relative;z-index: 300;padding-block: 10rem;}
.gd-2015 {width: 30rem;display: block;margin-inline: auto;}
.list-gd {margin-top: 10rem;display: flex;flex-direction:row}
.list-gd-item {display: block;flex-grow: 1;flex-shrink: 1;flex-basis: 0;}
.list-gd-item-link {display: block;overflow: hidden;position: relative;}
.list-gd-item-image {width: 100% !important;max-width: unset;}
.list-gd-item-title {background-color: hsla(0, 0%, 0%,0.5);position: absolute;top: 0;right: 0;bottom: 0;left: 0;display: flex;align-items: center;justify-content: center;color: #FFF;font-size: 1.2em;letter-spacing: 0.2em;}


/*ムービースキップ*/
.btn-skip-movie {right:1.7rem}

/*新卒採用へリンク*/
.btn-rectuit-lp{right:4rem;bottom: 6.0rem;}
.btn-career-page{right: 4rem;bottom: 0.5rem;}


/*トップのテキストだけのお知らせスライダー*/
.fixed-text-news {left: 12rem;width: 100%;max-width: 61rem;height: 3rem;top: 2rem;}
.fixed-text-news-link {grid-template-columns:auto 5rem 1fr;align-content:center}
.fixed-text-news-title {display: block; -webkit-box-orient:unset;-webkit-line-clamp:unset;grid-column:unset;display: block;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;font-size: 0.9em;}
.fixed-text-news-category{width:fit-content;}
.fixed-text-news-date {grid-column:unset;margin-left: 0.5em;line-height: 1;align-items:center}


/**/
.section-snap{}

}


.pickup-swiper {margin-top: 2em;}
.pickup-swiper {overflow-x: hidden;}
.pickup-swiper .swiper-wrapper { width: auto;
display: inline-flex;
}

.pickup-swiper .swiper-pagination {position: static; margin-top: 2rem;}

:root {
    --swiper-theme-color: var(--c-primary);
}


@media (max-width: 500px) {
    .pickup-swiper .swiper-button-prev, .pickup-swiper .swiper-button-next {display: none;}
}