.Challenge a:hover, .Child a:hover, .HeaderRec a:hover { opacity: .6 } .Challenge img, .Child img, .HeaderRec img { max-width: 100% } .Challenge .Inner, .Child .Inner, .HeaderRec .Inner { margin: 0 auto; max-width: 1050px; width: 100% } .Challenge .Inner--big, .Child .Inner--big, .HeaderRec .Inner--big { max-width: 1200px } .Challenge .Inner--position, .Child .Inner--position, .HeaderRec .Inner--position { position: relative } @media screen and (max-width: 480px) { .Challenge .Inner, .Child .Inner, .HeaderRec .Inner { padding: 0 20px; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box } } .Challenge .pc, .Child .pc, .HeaderRec .pc { display: block !important } @media screen and (max-width: 769px) { .Challenge .pc, .Child .pc, .HeaderRec .pc { display: none !important } } .Challenge .pc--flex, .Child .pc--flex, .HeaderRec .pc--flex { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important } @media screen and (max-width: 769px) { .Challenge .pc--flex, .Child .pc--flex, .HeaderRec .pc--flex { display: none !important } } .Challenge .sp, .Child .sp, .HeaderRec .sp { display: none !important } @media screen and (max-width: 769px) { .Challenge .sp, .Child .sp, .HeaderRec .sp { display: block !important } } .Challenge .sp--flex, .Child .sp--flex, .HeaderRec .sp--flex { display: none !important } @media screen and (max-width: 769px) { .Challenge .sp--flex, .Child .sp--flex, .HeaderRec .sp--flex { display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important } } .HeaderRec { background-color: #f2f2f2 } .HeaderRec__wrap { max-width: 1980px; margin: 0 auto; height: 50px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center } @media screen and (max-width: 480px) { .HeaderRec__wrap { position: relative; height: 40px } } .HeaderRec__wrap__left { display: block; line-height: 50px; font-size: calc(14 * 1px); font-weight: bold; padding-left: 30px; font-family: "メイリオ", "Meiryo", "MS ゴシック", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif } @media screen and (max-width: 480px) { .HeaderRec__wrap__left { line-height: 40px; height: 40px; font-size: calc(10 * 1px); padding-left: 17px } } .HeaderRec__wrap__right__ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; list-style: none } /* 2024/1/26 ABSにて削除(ローカルナビ対応) */ /* .HeaderRec__wrap__right__ul.top .HeaderRec__wrap__right__ul__list:nth-child(1) a::before { content: ""; width: 100%; height: 4px; position: absolute; bottom: 0; left: 0; background-color: #0b2ea1 } .HeaderRec__wrap__right__ul.voice1 .HeaderRec__wrap__right__ul__list:nth-child(2) a::before { content: ""; width: 100%; height: 4px; position: absolute; bottom: 0; left: 0; background-color: #0b2ea1 } .HeaderRec__wrap__right__ul.voice2 .HeaderRec__wrap__right__ul__list:nth-child(3) a::before { content: ""; width: 100%; height: 4px; position: absolute; bottom: 0; left: 0; background-color: #0b2ea1 } */ /* 2024/1/26 ABSにて追加(ローカルナビ対応) */ .HeaderRec__wrap__right__ul .HeaderRec__wrap__right__ul__list__link.on::before { content: ""; width: 100%; height: 4px; position: absolute; bottom: 0; left: 0; background-color: #0b2ea1 } .HeaderRec__wrap__right__ul__list__link { display: block; line-height: 50px; font-size: calc(14 * 1px); text-decoration: none; margin-left: 20px; margin-right: 20px; font-family: "メイリオ", "Meiryo", "MS ゴシック", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", sans-serif; position: relative } .HeaderRec__wrap__right__ul__list__link:hover { color: #000 } .HeaderRec__wrap__right__ul__list__link--btn { width: 109px; text-align: center; background-color: #1f2f5d; color: #fff; font-size: calc(14 * 1px); margin-right: 0px } .HeaderRec__wrap__right__ul__list__link--btn:hover { color: #fff } @media screen and (max-width: 480px) { .HeaderRec__wrap__right__ul__list__link--btn { margin-left: 0 } } @media screen and (max-width: 480px) { .HeaderRec__wrap__spMenu { font-size: calc(11 * 1px); padding-right: 17px; text-decoration: none; color: #000 } .HeaderRec__wrap__spMenu:hover { color: #000 } } .HeaderRec__wrap__ul { position: absolute; top: 25px; left: 0; width: 100%; background-color: #fff; padding: 0px; z-index: 9999; list-style: none; max-height: 0; padding-left: 20px; overflow: hidden; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .HeaderRec__wrap__ul.is-active { padding: 40px; padding-left: 20px; display: block; max-height: 1000px; -webkit-transition: all .3s ease-in-out; transition: all .3s ease-in-out } .HeaderRec__wrap__ul__li { margin-bottom: 30px } .HeaderRec__wrap__ul__li__link { font-size: calc(16 * 1px); position: relative; padding: 13px 0 } .HeaderRec__wrap__ul__li__link.on { position: relative } .HeaderRec__wrap__ul__li__link.on:before { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 4px; background: #0d2ea1 } .Challenge { background-color: #f8f8f8; color: #231815 } .Challenge .Fv { width: 100%; background-color: #f8f8f8 } @media screen and (max-width: 480px) { .Challenge .Fv { padding-bottom: 40px } } .Challenge .Fv__wrap { width: 100%; height: 47.65739Vw; position: relative; position: relative } @media screen and (max-width: 480px) { .Challenge .Fv__wrap { height: 123.2Vw } } .Challenge .Fv__wrap__fv { position: absolute; z-index: -1 } .Challenge .Fv__wrap__fv--pc { width: 100%; height: 47.65739Vw; display: block } @media screen and (max-width: 480px) { .Challenge .Fv__wrap__fv--pc { display: none } } .Challenge .Fv__wrap__fv--sp { width: 100%; height: 123.2Vw; display: none } @media screen and (max-width: 480px) { .Challenge .Fv__wrap__fv--sp { display: block } } .Challenge .Fv__wrap__text { position: absolute; top: 50%; left: 10%; -webkit-transform: translate(0, -60%); -ms-transform: translate(0, -60%); transform: translate(0, -60%) } @media screen and (max-width: 480px) { .Challenge .Fv__wrap__text { top: 22%; left: 28px; -webkit-transform: translate(0, -60%); -ms-transform: translate(0, -60%); transform: translate(0, -60%) } } .Challenge .Fv__wrap__text__catch { display: inline-block; padding: 5px 10px; margin: 0; font-size: 2.2Vw; font-weight: bold; color: #0c2e98; background-color: #fff; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; letter-spacing: .06em } @media screen and (max-width: 480px) { .Challenge .Fv__wrap__text__catch { padding: 1px 6px; font-size: calc(20 * 1px) } } .Challenge .Fv__wrap__text__catch--2 { -webkit-transform: translate(0, -1px); -ms-transform: translate(0, -1px); transform: translate(0, -1px) } .Challenge .Fv__wrap__text__catch--3 { -webkit-transform: translate(0, -2px); -ms-transform: translate(0, -2px); transform: translate(0, -2px) } .Challenge .Fv__wrap__text__catch--4 { -webkit-transform: translate(0, -3px); -ms-transform: translate(0, -3px); transform: translate(0, -3px) } .Challenge .Menu { margin-bottom: 105px; padding-top: 100px } @media screen and (max-width: 480px) { .Challenge .Menu { display: none } } .Challenge .Menu__wrap__box { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding-left: 0 } .Challenge .Menu__wrap__box__list { list-style: none; border-left: 2px solid #bebebe; -webkit-box-sizing: border-box; box-sizing: border-box; width: 14.2857142857%; text-align: center } .Challenge .Menu__wrap__box__list:last-child { border-right: 2px solid #bebebe } .Challenge .Menu__wrap__box__list__link { font-weight: bold; text-decoration: none } .Challenge .Message__wrap__box { margin-left: 160px } @media screen and (max-width: 480px) { .Challenge .Message__wrap__box { margin-left: 0px } } .Challenge .Message__wrap__box__thought { font-size: calc(50 * 1px); letter-spacing: .08em; font-family: "Noto Sans JP", sans-serif; font-weight: 600; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt" } @media screen and (max-width: 480px) { .Challenge .Message__wrap__box__thought { line-height: 1.4; font-size: calc(25 * 1px) } } .Challenge .Message__wrap__box__text { font-size: calc(20 * 1px); letter-spacing: .06em; font-family: "Noto Sans JP", sans-serif; font-weight: 600; line-height: 2; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; margin-bottom: 0 } @media screen and (max-width: 480px) { .Challenge .Message__wrap__box__text { font-size: calc(15 * 1px) } } .Challenge .Interview__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 0 35px } @media screen and (max-width: 480px) { .Challenge .Interview__wrap { padding: 0px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } } .Challenge .Interview__wrap__card { margin-top: 30px; width: 48%; display: block } @media screen and (max-width: 480px) { .Challenge .Interview__wrap__card { width: 100% } } .Challenge .Interview__wrap__card__img { position: relative } .Challenge .Interview__wrap__card__img:before { font-size: calc(20 * 1px); font-weight: bold; color: #fff; background-color: #0c2e98; height: 46px; line-height: 46px; text-align: center; width: 102px; position: absolute; left: 20px; top: 0; letter-spacing: .06em; font-family: "Noto Sans JP", sans-serif } @media screen and (max-width: 480px) { .Challenge .Interview__wrap__card__img:before { width: 70px; height: 27px; line-height: 27px; left: 20px; font-size: calc(13 * 1px) } } .Challenge .Interview__wrap__card__img--1:before { content: "事務系" } .Challenge .Interview__wrap__card__img--2:before { content: "技術系" } .Challenge .Interview__wrap__card__img__arrow { position: absolute; width: 50px; height: 50px; bottom: 22px; right: 22px; border-radius: 50% } @media screen and (max-width: 480px) { .Challenge .Interview__wrap__card__img__arrow { width: 40px; height: 40px; bottom: 15px; right: 15px } } .Challenge .Interview__wrap__card__comment { font-size: calc(25 * 1px); font-weight: bold; letter-spacing: .06em; line-height: 1.7; font-family: "Noto Sans JP", sans-serif; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt" } @media screen and (max-width: 480px) { .Challenge .Interview__wrap__card__comment { font-size: calc(18 * 1px) } } .Challenge .Interview__wrap__card__ini { font-size: calc(18 * 1px); letter-spacing: .06em; line-height: 1.8; font-family: "Noto Sans JP", sans-serif; font-weight: bold; margin: 0; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt" } @media screen and (max-width: 480px) { .Challenge .Interview__wrap__card__ini { font-size: calc(16 * 1px) } } .Challenge .Interview__wrap__card__position { font-size: calc(16 * 1px); letter-spacing: .06em; line-height: 1.8; font-family: "Noto Sans JP", sans-serif; margin-top: 0px; margin-bottom: 0px; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt" } @media screen and (max-width: 480px) { .Challenge .Interview__wrap__card__position { font-size: calc(14 * 1px) } } .Challenge .Interview__wrap__card__coution { font-size: calc(12 * 1px); letter-spacing: .06em; line-height: 2.3; font-family: "Noto Sans JP", sans-serif; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; margin: 0 } @media screen and (max-width: 480px) { .Challenge .Interview__wrap__card__coution { font-size: calc(14 * 1px) } } .Challenge .Work__support { font-size: calc(30 * 1px); letter-spacing: .08em; line-height: 3; font-weight: 600; position: relative } @media screen and (max-width: 480px) { .Challenge .Work__support { font-size: calc(20 * 1px) } } .Challenge .Work__support:before { content: ""; width: 30px; height: 3px; background-color: #0c2e98; position: absolute; bottom: 0; left: 0 } .Challenge .Work__roop { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; padding: 0 35px } @media screen and (max-width: 480px) { .Challenge .Work__roop { padding: 0px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } } .Challenge .Work__roop__card { width: 48%; padding-bottom: 30px } .Challenge .Work__roop__card:nth-child(5), .Challenge .Work__roop__card:nth-child(6) { margin-bottom: 0px } @media screen and (max-width: 480px) { .Challenge .Work__roop__card { width: 100% } } .Challenge .Work__roop__card__title { font-size: calc(25 * 1px); letter-spacing: .06em; line-height: 1.8; font-weight: 600; margin-bottom: 20px; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; font-family: "Noto Sans JP", sans-serif } @media screen and (max-width: 480px) { .Challenge .Work__roop__card__title { font-size: calc(18 * 1px); margin-bottom: 0px } } .Challenge .Work__roop__card__content { font-size: calc(15 * 1px); letter-spacing: .06em; line-height: 2; font-weight: 400; font-family: "Noto Sans JP", sans-serif } @media screen and (max-width: 480px) { .Challenge .Work__roop__card__content { margin-top: 0 } } .Challenge .Work__roopBlue { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; padding: 0 35px } @media screen and (max-width: 480px) { .Challenge .Work__roopBlue { padding: 0px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } } .Challenge .Work__roopBlue__card { background-color: #edeff3; border-radius: 10px; width: 48%; -webkit-box-sizing: border-box; box-sizing: border-box; padding: 50px 30px; margin-bottom: 35px } .Challenge .Work__roopBlue__card:nth-child(3), .Challenge .Work__roopBlue__card:nth-child(4) { margin-bottom: 0px } .Challenge .Work__roopBlue__card:nth-child(3):nth-child(3), .Challenge .Work__roopBlue__card:nth-child(4):nth-child(3) { margin-bottom: 10px } @media screen and (max-width: 480px) { .Challenge .Work__roopBlue__card { width: 100%; margin-bottom: 10px; padding: 30px 20px 20px } } .Challenge .Work__roopBlue__card__title { font-size: calc(25 * 1px); letter-spacing: .06em; color: #0c2e98; line-height: 1.8; font-weight: 600; margin-bottom: 20px; margin-top: 0; font-family: "Noto Sans JP", sans-serif } @media screen and (max-width: 480px) { .Challenge .Work__roopBlue__card__title { font-size: calc(18 * 1px); margin-bottom: 0 } } .Challenge .Work__roopBlue__card__content { font-size: calc(15 * 1px); letter-spacing: .06em; line-height: 2; font-weight: 400; margin-bottom: 0; font-family: "Noto Sans JP", sans-serif } @media screen and (max-width: 480px) { .Challenge .Work__roopBlue__card__content { margin-top: 0; line-height: 2 } } .Challenge .Case__roop { margin-top: 75px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; padding: 0 35px } @media screen and (max-width: 480px) { .Challenge .Case__roop { padding: 0px } } .Challenge .Case__roop__card { width: 30%; border-top: 2px solid #0c2e98; padding-bottom: 30px } .Challenge .Case__roop__card:nth-child(4), .Challenge .Case__roop__card:nth-child(5), .Challenge .Case__roop__card:nth-child(6) { padding-bottom: 0px } @media screen and (max-width: 480px) { .Challenge .Case__roop__card:nth-child(4), .Challenge .Case__roop__card:nth-child(5), .Challenge .Case__roop__card:nth-child(6) { padding-bottom: 20px } } @media screen and (max-width: 480px) { .Challenge .Case__roop__card { width: 48%; padding-bottom: 20px } .Challenge .Case__roop__card:nth-child(5), .Challenge .Case__roop__card:nth-child(6) { border-bottom: 3px solid #0c2e98 } } .Challenge .Case__roop__card__number { color: #0c2e98; font-family: "Open Sans", sans-serif; font-weight: 600; font-size: calc(15 * 1px); letter-spacing: .06em } .Challenge .Case__roop__card__title { font-size: calc(23 * 1px); letter-spacing: .06em; line-height: 1.8; font-weight: bold; margin: 0px 0px 10px; font-family: "Noto Sans JP", sans-serif } @media screen and (max-width: 480px) { .Challenge .Case__roop__card__title { font-size: calc(18 * 1px) } } .Challenge .Case__roop__card__type { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start } .Challenge .Case__roop__card__type__bold { font-size: calc(15 * 1px); letter-spacing: .06em; line-height: 2; font-weight: bold; font-family: "Noto Sans JP", sans-serif } @media screen and (max-width: 480px) { .Challenge .Case__roop__card__type__bold { font-size: calc(13 * 1px) } } .Challenge .Case__roop__card__type__normal { font-size: calc(15 * 1px); letter-spacing: .06em; line-height: 2; font-weight: normal; margin: 0; font-family: "Noto Sans JP", sans-serif } @media screen and (max-width: 480px) { .Challenge .Case__roop__card__type__normal { font-size: calc(13 * 1px) } } .Challenge .Recruit { padding-bottom: 170px } @media screen and (max-width: 480px) { .Challenge .Recruit { padding-bottom: 0px } } .Challenge .enTitle { font-size: calc(15 * 1px); line-height: 1.9; letter-spacing: .06em; font-weight: bold; margin-bottom: 0px; position: relative; padding-left: 26px; font-family: "Outfit", sans-serif } @media screen and (max-width: 480px) { .Challenge .enTitle { font-size: calc(14 * 1px); margin-bottom: 0px } } .Challenge .enTitle:before { content: ""; position: absolute; width: 12px; height: 3px; background-color: #0c2e98; top: 50%; left: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%) } .Challenge .jaTitle { font-size: calc(45 * 1px); letter-spacing: .06em; font-weight: bold; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; margin-top: 12px } @media screen and (max-width: 480px) { .Challenge .jaTitle { margin-top: 6px; font-size: calc(25 * 1px) } } .Challenge .blue { color: #0c2e98 } .Challenge .explain { font-size: calc(15 * 1px); line-height: 1.95; letter-spacing: .06em; margin-bottom: 1.5rem; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; font-family: "Noto Sans JP", sans-serif } .Challenge .explain text { font-size: calc(12 * 1px) } @media screen and (max-width: 480px) { .Challenge .explain text { font-size: calc(14 * 1px) } } .Challenge .hr { margin-top: 75px; margin-bottom: 75px; background-color: #bebebe; height: 1px; width: 100% } @media screen and (max-width: 480px) { .Challenge .hr { margin-top: 50px; margin-bottom: 45px } } .RecruitBtn { background-color: #fff; width: 100% } .RecruitBtn__wrap { width: 100%; padding: 100px 35px; -webkit-box-sizing: border-box; box-sizing: border-box } @media screen and (max-width: 480px) { .RecruitBtn__wrap { padding: 60px 0px } } .RecruitBtn__wrap__btn { height: 153px; width: 100%; text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; border-radius: 10px; position: relative } @media screen and (max-width: 480px) { .RecruitBtn__wrap__btn { height: 94px } } .RecruitBtn__wrap__btn.newGraduate { background-color: #005aa4 } .RecruitBtn__wrap__btn.halfway { background-color: #1f2f5d } .RecruitBtn__wrap__btn:nth-child(1) { margin-bottom: 15px } .RecruitBtn__wrap__btn:nth-child(2) { margin-bottom: 15px } .RecruitBtn__wrap__btn__img { position: absolute; top: 50%; right: 20px; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); height: 28px; width: 28px } .RecruitBtn__wrap__btn__img__arrow { width: 100% } .RecruitBtn__wrap__btn__top { margin: 0; margin-top: 16px; color: #fff; font-size: calc(25 * 1px); font-weight: bold; letter-spacing: .08em; line-height: 1.5 } @media screen and (max-width: 480px) { .RecruitBtn__wrap__btn__top { margin-top: 0px; font-size: calc(14 * 1px) } } .RecruitBtn__wrap__btn__bottom { margin: 0; color: #fff; font-size: calc(14 * 1px); font-weight: normal; letter-spacing: .08em } @media screen and (max-width: 480px) { .RecruitBtn__wrap__btn__bottom { font-size: calc(10 * 1px) } } .Challenge .Faq__wrap { padding: 0 35px } @media screen and (max-width: 480px) { .Challenge .Faq__wrap { padding: 0px } } .Challenge .Faq .accordion { margin-bottom: 10px; border: none; border-radius: 5px; background-color: #fff } .Challenge .Faq .accordion__title { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: relative; padding: 30px 2em 30px 80px; color: #000; font-size: calc(17 * 1px); font-weight: 600; font-family: "Noto Sans JP", sans-serif; cursor: pointer; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; list-style: none } @media screen and (max-width: 480px) { .Challenge .Faq .accordion__title { font-size: calc(13 * 1px); padding: 15px 20px 15px 45px } } .Challenge .Faq .accordion__title:before { content: "Q"; position: absolute; left: 1em; font-weight: 600; font-size: 1.3em; color: #0c2e98; font-size: calc(33 * 1px); font-family: "Open Sans", sans-serif; font-weight: 600 } @media screen and (max-width: 480px) { .Challenge .Faq .accordion__title:before { font-size: calc(18 * 1px); left: 20px } } .Challenge .Faq .accordion__title::after { width: 47px; height: 47px; line-height: 45px; background-color: #0c2e98; margin-left: 10px; color: #fff; content: "+"; text-align: center; font-size: calc(30 * 1px); border-radius: 50%; -webkit-transition: -webkit-transform .5s; transition: -webkit-transform .5s; transition: transform .5s; transition: transform .5s, -webkit-transform .5s } @media screen and (max-width: 480px) { .Challenge .Faq .accordion__title::after { margin-left: 0px; width: 27px; height: 27px; line-height: 25px; font-size: calc(18 * 1px); -ms-flex-negative: 0; flex-shrink: 0 } } .Challenge .Faq .accordion__title.open::after { content: "ー"; line-height: 44px; font-size: calc(28 * 1px) } @media screen and (max-width: 480px) { .Challenge .Faq .accordion__title.open::after { font-size: calc(16 * 1px); line-height: 26px } } .Challenge .Faq .accordion__answer { display: block; -webkit-box-sizing: border-box; box-sizing: border-box; max-height: 0; overflow: hidden; -webkit-transition: max-height .3s ease-in-out; transition: max-height .3s ease-in-out } .Challenge .Faq .accordion__answer__content { padding: 0px 110px 30px 80px; font-size: calc(15 * 1px); color: #231815; letter-spacing: .06em; line-height: 1.8; font-weight: 400; font-family: "Noto Sans JP", sans-serif; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt" } @media screen and (max-width: 480px) { .Challenge .Faq .accordion__answer__content { font-size: calc(13 * 1px); padding: 0px 20px 15px 45px } } .Challenge .Faq .accordion .js-accordion-title.open+.accordion__answer { max-height: none } .Challenge .Tab.tabs { margin-top: 100px; padding-bottom: 40px; background-color: rgba(0, 0, 0, 0); width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; margin: 0 35px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } @media screen and (max-width: 480px) { .Challenge .Tab.tabs { margin: 0px; padding-bottom: 60px } } .Challenge .Tab .tab_item { width: calc(33.3333333333% - 12px); height: 100px; background-color: #0c2e98; font-size: calc(18 * 1px); text-align: center; color: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; float: left; text-align: center; font-weight: bold; -webkit-transition: all .2s ease; transition: all .2s ease; border-top-right-radius: 10px; border-top-left-radius: 10px } @media screen and (max-width: 480px) { .Challenge .Tab .tab_item { height: 50px; width: calc(33.3333333333% - 4px) } } @media screen and (max-width: 480px) { .Challenge .Tab .tab_item p { line-height: 1.5; font-size: calc(10 * 1px) } } .Challenge .Tab .tab_item:hover { opacity: .75 } .Challenge .Tab input[name=tab_item] { display: none } .Challenge .Tab .tab_content { display: none; padding: 40px 52px 0; clear: both; overflow: hidden; background-color: #fff; padding-bottom: 60px } @media screen and (max-width: 480px) { .Challenge .Tab .tab_content { padding: 40px 20px 0 } } .Challenge .Tab #all:checked~#all_content, .Challenge .Tab #programming:checked~#programming_content, .Challenge .Tab #design:checked~#design_content { display: block } .Challenge .Tab.tabs input:checked+.tab_item { background-color: #fff; color: #0c2e98 } .Challenge .Tab__title { font-size: calc(30 * 1px); letter-spacing: .08em; line-height: 3; font-weight: bold; font-family: "Noto Sans JP", sans-serif; position: relative; margin-bottom: 50px } @media screen and (max-width: 480px) { .Challenge .Tab__title { font-size: calc(20 * 1px); line-height: 1.6; letter-spacing: .06em; margin-bottom: 40px } } .Challenge .Tab__title:before { content: ""; position: absolute; width: 30px; height: 3px; background-color: #0c2e98; bottom: -10px; left: 0 } @media screen and (max-width: 480px) { .Challenge .Tab__title:before { bottom: -15px } } .Challenge .Tab__cont__card { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap } .Challenge .Tab__cont__card__left { width: 18%; border-bottom: 1px solid #000; font-size: calc(15 * 1px); font-weight: bold; font-family: "Noto Sans JP", sans-serif; padding-bottom: 30px; padding-top: 30px } @media screen and (max-width: 480px) { .Challenge .Tab__cont__card__left { font-size: calc(18 * 1px); border-bottom: none; padding-bottom: 0px; padding-top: 0px; width: 100% } } .Challenge .Tab__cont__card__right { width: 79%; border-bottom: 1px solid #bebebe; padding-bottom: 30px; padding-top: 30px; font-size: calc(15 * 1px); font-family: "Noto Sans JP", sans-serif; line-height: 2 } @media screen and (max-width: 480px) { .Challenge .Tab__cont__card__right { padding-top: 15px; width: 100%; margin-bottom: 30px; line-height: 1.7 } } .Challenge .Tab__cont__card__right .sp-space { display: none } @media screen and (max-width: 480px) { .Challenge .Tab__cont__card__right .sp-space { display: inline-block } } .Challenge .Tab__cont__card__right .linkDesign { font-size: calc(15 * 1px); font-family: "Noto Sans JP", sans-serif; text-decoration: none; line-height: 2; color: #000 } .Challenge .Tab__cont__card__right .linkDesign:hover { opacity: .6 } .Challenge .Tab__cont__card__right .linkDesign img { padding-top: 10px; padding-left: 4px; width: 15px } @media screen and (max-width: 480px) { .Challenge .Tab__cont__card:last-child .Tab__cont__card__right { border-bottom: none } } .Child { font-family: "Noto Sans JP", sans-serif } .Child .Fv { margin-bottom: 80px; position: relative; height: 47.7306002928Vw; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; -webkit-box-align: center; -ms-flex-align: center; align-items: center } @media screen and (max-width: 480px) { .Child .Fv { display: block; height: auto; margin-bottom: 30px } } .Child .Fv__bg { position: absolute; left: 0; top: 0; width: 100%; height: 47.7306002928Vw; z-index: -1 } @media screen and (max-width: 480px) { .Child .Fv__bg { height: 99.4666666667Vw; position: static } } .Child .Fv__interview { position: absolute; right: 10Vw; top: 50px; font-family: "Outfit", sans-serif; line-height: 1.9; letter-spacing: .06em; font-weight: bold; font-size: calc(15 * 1px) } @media screen and (max-width: 480px) { .Child .Fv__interview { right: 20px; top: 20px } } .Child .Fv__interview:before { content: ""; width: 12px; height: 2px; background-color: #0c2e98; display: block; position: absolute; top: 50%; left: -20px; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%) } .Child .Fv__box { display: block; width: 100% } .Child .Fv__box__cat1, .Child .Fv__box__cat2 { background-color: #0c2e98; color: #fff; font-size: calc(18 * 1px); font-weight: bold; width: 77px; height: 29px; line-height: 29px; text-align: center } @media screen and (max-width: 480px) { .Child .Fv__box__cat1, .Child .Fv__box__cat2 { display: none } } .Child .Fv__box__cat2 { display: none } @media screen and (max-width: 480px) { .Child .Fv__box__cat2 { margin-top: 16px; margin-bottom: 16px; display: block; font-weight: bold; font-size: calc(13 * 1px); color: #0c2e98; border: 1px solid #0c2e98; border-radius: 2px; height: 27px; line-height: 27px; padding: 0 6px; -webkit-box-sizing: border-box; box-sizing: border-box; background-color: rgba(0, 0, 0, 0) } } .Child .Fv__box__catch { font-size: calc(50 * 1px); font-weight: bold; line-height: 1.4; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt"; margin-bottom: 20px; margin-top: 20px; letter-spacing: .08em } @media screen and (max-width: 480px) { .Child .Fv__box__catch { font-size: calc(25 * 1px) } } .Child .Fv__box__catch__blue { color: #0c2e98; margin: 0 } .Child .Fv__box__catch__black { color: #000; margin: 0 } .Child .Fv__box__ini { font-size: calc(18 * 1px); font-weight: bold; margin: 0 } .Child .Fv__box__explain { font-size: calc(16 * 1px); margin: 0 } .Child .Fv__box__coution { font-size: calc(14 * 1px); margin: 0 } .Child .Cont { padding-bottom: 60px } @media screen and (max-width: 480px) { .Child .Cont { padding-bottom: 20px } } .Child .Cont__wrap__card__ttl { font-size: calc(40 * 1px); font-weight: bold; margin-top: 6px; margin-bottom: 10px; letter-spacing: .08em; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt" } @media screen and (max-width: 480px) { .Child .Cont__wrap__card__ttl { font-size: calc(18 * 1px) } } .Child .Cont__wrap__card__text { font-size: calc(15 * 1px); line-height: 2; padding-bottom: 20px; letter-spacing: .06em; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt" } @media screen and (max-width: 480px) { .Child .Cont__wrap__card__text { font-size: calc(15 * 1px) } } .Child .Cont__wrap__card__img { padding-bottom: 40px } @media screen and (max-width: 480px) { .Child .Cont__wrap__card__img { padding-bottom: 0px } } .Child .subTitle { font-size: calc(25 * 1px); line-height: 1.9; letter-spacing: .06em; font-weight: bold; margin-bottom: 0px; position: relative; padding-left: 26px; color: #0c2e98; -webkit-font-feature-settings: "palt"; font-feature-settings: "palt" } @media screen and (max-width: 480px) { .Child .subTitle { font-size: calc(14 * 1px); margin-bottom: 0px; padding-left: 20px; margin-top: 25px } } .Child .subTitle:before { content: ""; position: absolute; width: 12px; height: 3px; background-color: #0c2e98; top: 50%; left: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%) } @media screen and (max-width: 480px) { .Child .subTitle:before { height: 2px } } .Child .Boss { background-color: #edeff3; padding: 95px 0 100px } @media screen and (max-width: 480px) { .Child .Boss { padding: 40px 0 50px } } .Child .Boss__ttl { display: block; font-size: calc(30 * 1px); position: relative; font-weight: bold; margin-bottom: 100px; padding-left: 6px } @media screen and (max-width: 480px) { .Child .Boss__ttl { font-size: calc(18 * 1px); margin-bottom: 30px; padding-left: 0px } } .Child .Boss__ttl:before { content: ""; position: absolute; bottom: -20px; left: 6px; display: block; width: 30px; height: 3px; background-color: #0c2e98 } @media screen and (max-width: 480px) { .Child .Boss__ttl:before { width: 18px; bottom: -7px; left: 0px } } .Child .Boss__message { margin-top: 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 55px 65px; background-color: #fff; border-radius: 10px } @media screen and (max-width: 480px) { .Child .Boss__message { padding: 25px 20px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } } .Child .Boss__message__left { width: 30%; -webkit-box-sizing: border-box; box-sizing: border-box; padding-right: 40px } @media screen and (max-width: 480px) { .Child .Boss__message__left { width: 100%; padding-right: 0px; padding-bottom: 27px } } @media screen and (max-width: 480px) { .Child .Boss__message__left__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; padding-bottom: 20px } } .Child .Boss__message__left__wrap__img { margin: 0 auto; width: 170px; height: 170px } @media screen and (max-width: 480px) { .Child .Boss__message__left__wrap__img { -ms-flex-negative: 0; flex-shrink: 0; margin-left: 10px; margin-right: 15px; width: 125px; height: 125px } } .Child .Boss__message__left__wrap__box__ini { font-size: calc(16 * 1px); font-weight: bold; margin-bottom: 0 } @media screen and (max-width: 480px) { .Child .Boss__message__left__wrap__box__ini { font-size: calc(14 * 1px) } } .Child .Boss__message__left__wrap__box__explain { font-size: calc(14 * 1px); margin: 0 } .Child .Boss__message__left__coution { font-size: calc(12 * 1px); margin: 0 } @media screen and (max-width: 480px) { .Child .Boss__message__left__coution { text-align: center } } .Child .Boss__message__right { width: 70%; background-color: #f8f8f8; border-radius: 10px; padding: 40px 50px; -webkit-box-sizing: border-box; box-sizing: border-box; line-height: 2; font-size: calc(15 * 1px) } @media screen and (max-width: 480px) { .Child .Boss__message__right { padding: 30px 20px; width: 100%; font-size: calc(15 * 1px); line-height: 1.75 } } .Child .Boss__message__right__message { letter-spacing: .06em } @media screen and (max-width: 480px) { .Child .Boss__message__right__message { margin: 0 } } .starting-salary { position: relative; } .starting-salary:after { content: "※2024年4月入社実績"; position: absolute; bottom: -1.2rem; left: 0; font-size: 80%; font-weight: normal; font-family: "Noto Sans JP", sans-serif; } .Challenge .Recruit { padding-bottom: 85px; } .Challenge .Tab.tabs { margin: 0; } .Challenge .Work__roopBlue__card:nth-child(3):nth-child(3) { margin-bottom: 0; } @media screen and (max-width: 480px) { .Challenge .Work__roopBlue__card:nth-child(3):nth-child(3) { margin-bottom: 10px; } }