@charset "UTF-8"; /*---------- reset ----------*/ /*** The new CSS reset - version 1.7.3 (last updated 7.8.2022) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug */ *:where(:not(html, iframe, input, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: pointer; } /* Remove list styles (bullets/numbers) */ ol, ul, menu { list-style: none; } /* For images to not be able to exceed their container */ img { max-width: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; -moz-user-select: auto; user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; -moz-appearance: revert; appearance: revert; } /* reset default text opacity of input placeholder */ ::-moz-placeholder { color: unset; } ::placeholder { color: unset; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable=false])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; line-break: after-white-space; -webkit-user-select: auto; -moz-user-select: auto; user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable=true]) { -webkit-user-drag: element; } /* ========================= Breakpoints ========================= */ /* ========================= Font Family ========================= */ /* ========================= Color ========================= */ html { font-size: 0.7320644217vw; /* PC用の1rem定義 */ } @media screen and (max-width: 768px) { html { font-size: 2.6666666667vw; /* SP用の1rem定義 */ } } input, textarea, select, button { font-size: min(1rem, 16px); /* 最小16pxを確保 */ } * { margin-block-start: 0; margin-block-end: 0; padding-inline-start: 0; padding-inline-end: 0; } body { width: 100%; overflow-x: hidden; font-family: "Noto Sans JP", sans-serif; background-color: #fff; color: #050505; font-size: 1.5rem; line-height: 3rem; font-weight: 500; word-break: break-all; } /* ブラウザ対応 */ a { color: inherit; text-decoration: none; } button { -moz-appearance: none; appearance: none; -webkit-appearance: none; border: none; background: none; padding: 0; font: inherit; color: inherit; } /* リンクスタイル */ a { display: block; word-break: break-all; word-wrap: break-word; transition: 0.3s; } a.externalSite { text-decoration: underline; } a:hover { opacity: 0.5; } @media screen and (max-width: 768px) { a:hover { opacity: 1; } } /* 画像スタイル */ img { display: block; } /* フォント */ .jp { font-family: "Noto Sans JP", sans-serif; } .en { font-family: "Montserrat", sans-serif; } .roboto { font-family: "Roboto", sans-serif; } .roboto-c { font-family: "Roboto Condensed", sans-serif; } /* PC・SP 表示切り替え*/ @media screen and (max-width: 768px) { .pc { display: none; } } .sp { display: none; } @media screen and (max-width: 768px) { .sp { display: block; } } /* h2 */ .c-heading { display: flex; flex-direction: column; } .c-heading .c-heading__jp { color: #0E0D69; font-size: 3.4rem; line-height: 4.9rem; font-weight: 700; letter-spacing: 0.05em; } .c-heading .c-heading__jp span { font-size: 5rem; } .c-heading .c-heading__en { color: #E65000; font-size: 2rem; line-height: 2.4rem; } /* ボタン */ .c-btn { display: flex; justify-content: center; align-items: center; width: 21.4rem; height: 3.9rem; background-color: #fff; border: 0.1rem solid #050505; border-radius: 2.9rem; position: relative; } @media screen and (max-width: 768px) { .c-btn { margin: 0 auto; } } .c-btn::before { content: ""; width: 2.4rem; height: 2.4rem; background-image: url("../images/base/btn_arrow.svg"); background-repeat: no-repeat; background-size: cover; margin: auto; position: absolute; top: 0; bottom: 0; left: 0.9rem; transition: 0.3s; } .c-btn span { font-size: 1.4rem; transition: 0.3s; } .c-btn:hover { opacity: 1; } .c-btn:hover::before { transform: translate(1rem, 0); } .c-btn:hover span { color: #E65000; } /* 下層ページ FV */ .p-lower-fv { background-color: rgb(253, 250, 235); border-radius: 0 0 13rem 13rem; padding: 8.7rem 0 9.3rem; position: relative; } @media screen and (max-width: 768px) { .p-lower-fv { border-radius: 0; padding: 8rem 0 7.1rem; } } .p-lower-fv__inner { display: flex; justify-content: space-between; } @media screen and (max-width: 768px) { .p-lower-fv__inner { flex-direction: column-reverse; } } .p-lower-fv__text { padding: 13.8rem 0 0 13.9rem; } @media screen and (max-width: 768px) { .p-lower-fv__text { padding: 0 2rem; } } .p-lower-fv__text .c-heading { margin-bottom: 11.7rem; } @media screen and (max-width: 768px) { .p-lower-fv__text .c-heading { margin-top: 3rem; margin-bottom: 3.22rem; } } .p-lower-fv__text .c-heading .c-heading__jp { line-height: 7.2rem; } @media screen and (max-width: 768px) { .p-lower-fv__text .c-heading .c-heading__jp { font-size: 3rem; } .p-lower-fv__text .c-heading .c-heading__jp span { font-size: 3.6rem; } } .p-lower-fv__text .c-heading .c-heading__en { font-size: 1.6rem; line-height: 1.9rem; } .p-lower-fv__catch { width: 54.648rem; position: absolute; bottom: 32.03rem; left: 14rem; } @media screen and (max-width: 768px) { .p-lower-fv__catch { width: 100%; position: static; } } .p-lower-fv__image img { width: 78.3rem; height: 71rem; border-radius: 12rem 0 0 12rem; -o-object-fit: cover; object-fit: cover; } @media screen and (max-width: 768px) { .p-lower-fv__image img { width: 100%; height: auto; padding-left: 2rem; } } .p-lower-fv .fv-dec { position: absolute; } .p-lower-fv .fv-dec.left-top { width: 19.973rem; height: 21.261rem; top: -2rem; left: -2rem; } @media screen and (max-width: 768px) { .p-lower-fv .fv-dec.left-top { width: 8.413rem; height: 7.989rem; top: 5.85rem; left: -2.66rem; } } .p-lower-fv .fv-dec.left-bottom { width: 30.35rem; height: 27.543rem; bottom: 5.11rem; left: -7.25rem; } @media screen and (max-width: 768px) { .p-lower-fv .fv-dec.left-bottom { width: 12.725rem; height: 11.55rem; bottom: -5.75rem; left: -5.06rem; } } .p-lower-fv .fv-dec.right-top { width: 8.7rem; height: 10.5rem; top: 5.4rem; right: -2.5rem; } @media screen and (max-width: 768px) { .p-lower-fv .fv-dec.right-top { width: 4.454rem; height: 5.359rem; top: 7.23rem; right: -1rem; } } .p-lower-fv .fv-dec.right-bottom { width: 24.5rem; height: 20.839rem; bottom: 5.11rem; right: -5.8rem; } @media screen and (max-width: 768px) { .p-lower-fv .fv-dec.right-bottom { width: 10.554rem; height: 8.977rem; bottom: -5.78rem; right: -1.3rem; } } /* 下層ページ動画レイアウト */ .p-page-movie button { width: 100%; height: 100%; position: relative; cursor: pointer; } .p-page-movie button::before { content: ""; width: 5.7rem; height: 5.7rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: url("../images/base/movie-play-button.png") center/contain no-repeat; } /*---------- header ----------*/ .l-header { width: 100%; height: 8.7rem; padding: 0 0.7rem 0 4.5rem; background-color: #fff; position: fixed; z-index: 999; } @media screen and (max-width: 768px) { .l-header { height: 8rem; padding: 0 2.1rem 0 1rem; } } .l-header .l-header__inner { display: flex; align-items: center; } .l-header .l-header__inner .header__logo { display: flex; align-items: center; gap: 1.56rem; height: 8.6rem; } @media screen and (max-width: 768px) { .l-header .l-header__inner .header__logo { flex-direction: column; row-gap: 0.55rem; height: 7.016rem; } } .l-header .l-header__inner .header__logo img { height: 8.6rem; } @media screen and (max-width: 768px) { .l-header .l-header__inner .header__logo img { height: 5.5rem; } } .l-header .l-header__inner .header__logo:hover { opacity: 1; } .l-header .l-header__inner .header__ttl img { width: 15.927rem; } @media screen and (max-width: 768px) { .l-header .l-header__inner .header__ttl img { width: 21.301rem; height: 0.962rem; } } /*-- グローバルナビ --*/ #l-header__nav-global { display: grid; place-content: center; height: 7rem; background-color: #E65000; padding: 0 5rem; border-radius: 7rem; margin-left: auto; } @media screen and (max-width: 768px) { #l-header__nav-global { display: none; } } #l-header__nav-global .l-header__nav-global-list { display: flex; align-items: center; gap: 5rem; } #l-header__nav-global .l-header__nav-global-list li { color: #fff; font-size: 1.6rem; line-height: 7rem; } #l-header__nav-global .l-header__nav-global-list li span { font-size: 2rem; } #l-header__nav-global .l-header__nav-global-list li:hover a { color: #0E0D69; opacity: 1; } #l-header__nav-global .l-header__nav-global-list li.has-submenu { position: relative; /* サブメニュー（初期は非表示） */ } #l-header__nav-global .l-header__nav-global-list li.has-submenu .l-header__nav-level02 { position: absolute; top: calc(100% - 0.6rem); left: -5rem; width: 57.792rem; display: flex; flex-wrap: wrap; gap: 2rem 9.4rem; background: rgba(255, 255, 255, 0.9); padding: 4rem; border-radius: 3rem; opacity: 0; transform: translateY(-1rem); pointer-events: none; transition: opacity 0.3s ease, transform 0.3s ease; z-index: 100; } #l-header__nav-global .l-header__nav-global-list li.has-submenu .l-header__nav-level02 li a { font-size: 1.6rem; line-height: 2.4rem; color: #050505; } #l-header__nav-global .l-header__nav-global-list li.has-submenu .l-header__nav-level02 li a:hover { color: #E65000; } #l-header__nav-global .l-header__nav-global-list li.has-submenu .l-header__nav-level02 li.ma_minus { margin-left: -3.2rem; } #l-header__nav-global .l-header__nav-global-list li.has-submenu.about-work .l-header__nav-level02 { left: -17.192rem; } #l-header__nav-global .l-header__nav-global-list li.has-submenu { /* hoverで表示 */ } #l-header__nav-global .l-header__nav-global-list li.has-submenu:hover .l-header__nav-level02 { opacity: 1; transform: translateY(0); pointer-events: auto; } /*-- ハンバーガーナビ --*/ /* ボタン */ .openbtn { width: 2.1rem; height: 2.4rem; position: absolute; top: 2.7rem; right: 2.1rem; z-index: 9999; cursor: pointer; } .openbtn span { position: relative; } .openbtn span::before { content: ""; display: inline-block; width: 2.1rem; height: 0.4rem; border-radius: 0.5rem; background-color: #E65000; position: absolute; right: -2.1rem; transition: all 0.4s; } .openbtn span:nth-of-type(1)::before { top: 0; } .openbtn span:nth-of-type(2)::before { top: 1rem; } .openbtn span:nth-of-type(3)::before { top: 2rem; } .openbtn.active { width: 3.7rem; height: 3.7rem; background-color: #fff; border-radius: 5rem; top: 1.5rem; right: 2rem; } .openbtn.active span::before { width: 2rem; height: 0.1rem; right: -2.8rem; } .openbtn.active span:nth-of-type(1)::before { top: 1.2rem; transform: translateY(0.6rem) rotate(-45deg); } .openbtn.active span:nth-of-type(2)::before { opacity: 0; } .openbtn.active span:nth-of-type(3)::before { top: 2.4rem; transform: translateY(-0.6rem) rotate(45deg); } .openbtn { /* PCでは非表示 */ } @media screen and (min-width: 769px) { .openbtn { display: none; } } /* 背景丸 */ .circle-bg { position: fixed; z-index: 3; width: 10rem; height: 10rem; border-radius: 50%; background: #E65000; transform: scale(0); right: -5rem; top: calc(50% - 5rem); transition: all 0.5s; } .circle-bg.circleactive { transform: scale(50); } @media screen and (min-width: 769px) { .circle-bg { display: none; } } /* ナビ */ #l-header__nav-hamburger { display: none; position: fixed; inset: 0; margin-top: 9rem; z-index: 998; } #l-header__nav-hamburger.panelactive { display: block; } @media screen and (min-width: 769px) { #l-header__nav-hamburger { display: none; } } .l-header__nav-hamburger-list { display: grid; gap: 2rem; margin: 0 2rem; list-style: none; } .l-header__nav-hamburger-list > li { opacity: 0; animation: gnaviAnime 1s forwards; border-bottom: 0.1rem solid #fff; } .l-header__nav-hamburger-list > li.drawer { border-bottom: none; } .l-header__nav-hamburger-list a { display: block; padding-bottom: 0.5rem; color: #fff; text-decoration: none; font-size: 1.6rem; line-height: 2.9rem; } .l-header__nav-hamburger-list a span { font-size: 2rem; } /* ドロワーメニュー */ /* 親リンク */ .drawer-toggle { position: relative; display: flex; justify-content: space-between; align-items: center; color: #fff; text-decoration: none; font-size: 1.6rem; border-bottom: 0.1rem solid #fff; } .drawer-toggle span { font-size: 2rem; } .drawer-toggle { /* ＋ − */ } .drawer-toggle::before, .drawer-toggle::after { content: ""; position: absolute; right: 0; background: #fff; transition: 0.3s ease; } .drawer-toggle { /* 横線 */ } .drawer-toggle::before { width: 1.5rem; height: 0.1rem; bottom: 1.75rem; } .drawer-toggle { /* 縦線 */ } .drawer-toggle::after { width: 0.1rem; height: 1.5rem; right: 0.75rem; bottom: 1rem; } /* 子メニュー */ .drawer-menu { display: grid; row-gap: 1rem; max-height: 0; overflow: hidden; transition: max-height 0.35s ease; padding: 1rem 0 0 1.1rem; } .drawer-menu li { padding-left: 2.5rem; position: relative; } .drawer-menu li::before { content: ""; position: absolute; width: 1.7rem; height: 1.2rem; background: #fff; border-radius: 50%; transform: rotate(-25deg); margin: auto; position: absolute; top: 0; bottom: 0; left: 0; } .drawer-menu li a { padding: 0; font-size: 1.2rem; line-height: 1.7rem; } /* 開いた状態 */ .drawer.is-open .drawer-menu { max-height: 50rem; } .drawer.is-open .drawer-toggle::after { opacity: 0; } /* アニメーション */ @keyframes gnaviAnime { 0% { opacity: 0; } 100% { opacity: 1; } } /* 応募するボタン */ .l-header__apply { position: fixed; bottom: 12.9rem; right: 1rem; } @media screen and (max-width: 768px) { .l-header__apply { bottom: 0.8rem; right: 0; } } .l-header__apply::before { content: ""; position: absolute; inset: 0; border-radius: 10rem; background: transparent; box-shadow: 0 1.1rem 0 rgba(0, 0, 0, 0.25); z-index: -1; } @media screen and (max-width: 768px) { .l-header__apply::before { box-shadow: 0 0.8rem 0 rgba(0, 0, 0, 0.25); } } .l-header__apply .l-header__apply-inner { width: 10.9rem; height: 10.9rem; border-radius: 10rem; box-shadow: inset 0 0.3rem 0.6rem rgba(255, 255, 255, 0.65); background: linear-gradient(135deg, #0E0D69 0%, #3987C5 90%, #3C8FCB 100%); padding-top: 3.9rem; color: #fff; font-size: 1.6rem; line-height: 2.4rem; font-weight: 700; letter-spacing: 0.05em; text-align: center; transition: transform 0.3s ease; position: relative; } @media screen and (max-width: 768px) { .l-header__apply .l-header__apply-inner { width: 8.1rem; height: 8.1rem; font-size: 1.3rem; line-height: 1.9rem; padding-top: 2.7rem; } } .l-header__apply .l-header__apply-inner::before { content: ""; width: 0.7rem; height: 0.7rem; background-color: #E65000; border-radius: 1rem; margin: auto; position: absolute; left: 0; right: 0; bottom: 2.5rem; transition: transform 0.3s ease; } @media screen and (max-width: 768px) { .l-header__apply .l-header__apply-inner::before { width: 0.5rem; height: 0.5rem; bottom: 1.9rem; } } .l-header__apply:hover { opacity: 1; } .l-header__apply:hover .l-header__apply-inner { background: linear-gradient(135deg, #EB5505, #F2D455); transform: translateY(1.1rem); } @media screen and (max-width: 768px) { .l-header__apply:hover .l-header__apply-inner { background: linear-gradient(135deg, #0E0D69 0%, #3987C5 90%, #3C8FCB 100%); transform: none; } } .l-header__apply:hover .l-header__apply-inner::before { background-color: #0E0D69; transform: translateY(1.1rem); } @media screen and (max-width: 768px) { .l-header__apply:hover .l-header__apply-inner::before { background-color: #E65000; transform: none; } } /*---------- footer ----------*/ .l-footer { width: 100%; height: 14.4rem; padding: 0 14.2rem 0 16.6rem; background-color: #EBEBEB; border-radius: 12rem 12rem 0 0; position: relative; } .l-footer::before { content: ""; width: 100%; height: 100%; background-color: #fff; position: absolute; top: 0; left: 0; z-index: -1; } @media screen and (max-width: 768px) { .l-footer { height: auto; padding: 3.9rem 1.9rem 1.6rem 1.9rem; border-radius: 10rem 10rem 0 0; } } .l-footer .l-footer__inner { display: flex; justify-content: space-between; } @media screen and (max-width: 768px) { .l-footer .l-footer__inner { flex-direction: column; } } .l-footer .l-footer__inner .l-footer__img { display: flex; flex-direction: column; align-items: center; row-gap: 0.92rem; } @media screen and (max-width: 768px) { .l-footer .l-footer__inner .l-footer__img { flex-direction: column; row-gap: 0.72rem; } } .l-footer .l-footer__inner .l-footer__img .footer__logo img { height: 8.6rem; } @media screen and (max-width: 768px) { .l-footer .l-footer__inner .l-footer__img .footer__logo img { height: 6.9rem; } } .l-footer .l-footer__inner .l-footer__img h1 img { width: 26.744rem; } @media screen and (max-width: 768px) { .l-footer .l-footer__inner .l-footer__img h1 img { width: 25.698rem; } } .l-footer .l-footer__inner .l-footer__txt { margin-top: 3.39rem; /*-- グローバルナビ --*/ } .l-footer .l-footer__inner .l-footer__txt #l-footer__nav { display: flex; margin-left: auto; } .l-footer .l-footer__inner .l-footer__txt #l-footer__nav .l-footer__nav-list { display: flex; align-items: center; gap: 4rem; } @media screen and (max-width: 768px) { .l-footer .l-footer__inner .l-footer__txt #l-footer__nav .l-footer__nav-list { display: grid; grid-template-columns: 50% auto; gap: 4.2rem; row-gap: 2rem; width: 24.4rem; margin: 0 auto; } } .l-footer .l-footer__inner .l-footer__txt #l-footer__nav .l-footer__nav-list li { font-size: 1.6rem; line-height: 2.9rem; } @media screen and (max-width: 768px) { .l-footer .l-footer__inner .l-footer__txt #l-footer__nav .l-footer__nav-list li { line-height: 2.4rem; } } .l-footer .l-footer__inner .l-footer__txt #l-footer__nav .l-footer__nav-list li span { font-size: 2rem; } .l-footer .l-footer__inner .l-footer__txt .l-footer__copyright { font-size: 1.3rem; line-height: 1.9rem; text-align: right; margin-top: 3.81rem; } @media screen and (max-width: 768px) { .l-footer .l-footer__inner .l-footer__txt .l-footer__copyright { font-size: 1.2rem; line-height: 1.7rem; margin-top: 4rem; } } /*---------- top ----------*/ .p-top { overflow: hidden; } .p-top__mv { position: relative; } .p-top__mv .p-top__mv-img { position: relative; } .p-top__mv .p-top__mv-img img { width: 100%; } .p-top__mv .p-top__mv-txt { width: 69rem; position: absolute; bottom: 0; left: 1.2rem; z-index: 1; } @media screen and (max-width: 768px) { .p-top__mv .p-top__mv-txt { width: 100%; left: -1rem; bottom: 1rem; } } .p-top__mv .fv-dec { position: absolute; } .p-top__mv .fv-dec.left-top { width: 19.973rem; height: 21.261rem; top: -2rem; left: -2.5rem; } @media screen and (max-width: 768px) { .p-top__mv .fv-dec.left-top { width: 8.413rem; height: 7.989rem; top: 5.85rem; left: -2.66rem; } } .p-top__mv .fv-dec.left-bottom { width: 30.35rem; height: 27.543rem; bottom: -6.99rem; left: -7.25rem; } @media screen and (max-width: 768px) { .p-top__mv .fv-dec.left-bottom { width: 12.725rem; height: 11.55rem; bottom: -5.65rem; left: -5.06rem; } } .p-top__mv .fv-dec.right-top { width: 8.7rem; height: 10.5rem; top: 5.4rem; right: -2.5rem; } @media screen and (max-width: 768px) { .p-top__mv .fv-dec.right-top { width: 4.454rem; height: 5.359rem; top: 7.23rem; right: -1rem; } } .p-top__mv .fv-dec.right-bottom { width: 24.5rem; height: 20.839rem; bottom: -6.99rem; right: -5.8rem; } @media screen and (max-width: 768px) { .p-top__mv .fv-dec.right-bottom { width: 10.554rem; height: 8.977rem; bottom: -5.68rem; right: -1.3rem; } } .p-top__about-au { background-color: rgb(253, 243, 232); background-image: url("../images/top/top_bg_item.png"); background-repeat: no-repeat; background-size: 109.5%; background-position: -3rem 3rem; padding: 17.3rem 0 14.7rem; } @media screen and (max-width: 768px) { .p-top__about-au { background-size: 127.7%; background-position: -13.4rem 4.8rem; padding: 26.3rem 0 13.9rem; } } .p-top__about-au .p-top__about-au-inner { padding: 5.5rem 0 14rem 9.2rem; margin-left: 5rem; position: relative; z-index: 0; } @media screen and (max-width: 768px) { .p-top__about-au .p-top__about-au-inner { padding: 13.4rem 2rem 12rem 1rem; margin-left: 1rem; } } .p-top__about-au .p-top__about-au-inner::before { content: ""; width: 100%; height: 100%; background-color: #EBBF05; border-radius: 13rem 0 0 13rem; position: absolute; bottom: -3rem; left: 3rem; z-index: -2; } @media screen and (max-width: 768px) { .p-top__about-au .p-top__about-au-inner::before { border-radius: 5rem 0 0 5rem; } } .p-top__about-au .p-top__about-au-inner::after { content: ""; position: absolute; inset: 0; background-color: #fff; border-radius: 13rem 0 0 13rem; z-index: -1; } @media screen and (max-width: 768px) { .p-top__about-au .p-top__about-au-inner::after { border-radius: 5rem 0 0 5rem; } } .p-top__about-au .p-top__about-au-inner .about-au_description { display: flex; justify-content: space-between; } @media screen and (max-width: 768px) { .p-top__about-au .p-top__about-au-inner .about-au_description { flex-direction: column-reverse; } } .p-top__about-au .p-top__about-au-inner .about-au_description .about-au_txt { width: 40rem; } @media screen and (max-width: 768px) { .p-top__about-au .p-top__about-au-inner .about-au_description .about-au_txt { width: 100%; padding: 0 1rem; } } .p-top__about-au .p-top__about-au-inner .about-au_description .about-au_txt .c-heading .c-heading__jp { line-height: 6.4rem; } .p-top__about-au .p-top__about-au-inner .about-au_description .about-au_txt p { letter-spacing: 0.1em; margin: 8rem 0 6rem; } @media screen and (max-width: 768px) { .p-top__about-au .p-top__about-au-inner .about-au_description .about-au_txt p { margin: 1.6rem 0 3rem; } } .p-top__about-au .p-top__about-au-inner .about-au_description img { width: 73.3rem; height: 60.6rem; margin-top: -12.1rem; } @media screen and (max-width: 768px) { .p-top__about-au .p-top__about-au-inner .about-au_description img { width: 33.1rem; height: 28.8rem; margin-top: -30.8rem; margin-bottom: 2rem; margin-left: 3rem; } } .p-top__about-au .p-top__about-au-inner .about-au_point { display: flex; justify-content: center; flex-wrap: wrap; gap: 9rem 6.1rem; width: 73.2rem; margin: 14rem auto 0; } @media screen and (max-width: 768px) { .p-top__about-au .p-top__about-au-inner .about-au_point { width: 100%; gap: 3rem 1.5rem; margin: 6rem auto 0; } } .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item { display: flex; flex-direction: column; justify-content: space-between; } .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item .item_img { width: 18.7rem; position: relative; } @media screen and (max-width: 768px) { .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item .item_img { width: 13.9rem; } } .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item .item_img img { position: relative; z-index: 1; transition: 0.3s; } .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item .item_img::before { content: ""; width: 100%; height: 100%; background-color: #EBBF05; border-radius: 4.4rem; position: absolute; bottom: -0.9rem; right: -1.2rem; z-index: 0; } @media screen and (max-width: 768px) { .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item .item_img::before { bottom: -0.6rem; right: -0.9rem; } } .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item .item_img::after { content: ""; width: 5.1rem; height: 5.1rem; background-image: url("../images/top/point_arrow_before.svg"); background-repeat: no-repeat; background-size: cover; position: absolute; bottom: -0.9rem; right: -1.4rem; z-index: 2; transition: 0.3s; } @media screen and (max-width: 768px) { .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item .item_img::after { width: 3.7rem; height: 3.7rem; bottom: -0.6rem; right: -2.1rem; } } .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item p { width: 20.3rem; font-size: 1.6rem; text-align: center; margin-top: 2rem; padding-bottom: 0.5rem; border-bottom: 0.1rem solid #050505; transition: 0.3s; } @media screen and (max-width: 768px) { .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item p { width: 16rem; font-size: 1.2rem; line-height: 1.8rem; margin-top: 2.2rem; } } .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item:hover { opacity: 1; } .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item:hover .item_img img { transform: translate(1.2rem, 0.9rem); } @media screen and (max-width: 768px) { .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item:hover .item_img img { transform: none; } } .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item:hover .item_img::after { background-image: url("../images/top/point_arrow_after.svg"); transform: translate(-0.2rem, 0.2rem); } @media screen and (max-width: 768px) { .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item:hover .item_img::after { background-image: url("../images/top/point_arrow_before.svg"); transform: none; } } .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item:hover p { color: #E65000; border-bottom: 0.1rem solid #E65000; } @media screen and (max-width: 768px) { .p-top__about-au .p-top__about-au-inner .about-au_point .about-au_point-item:hover p { color: #050505; border-bottom: 0.1rem solid #050505; } } .p-top__about-work { padding: 12.3rem 0 13rem; margin-bottom: 23rem; position: relative; } @media screen and (max-width: 768px) { .p-top__about-work { padding: 22.5rem 0 11.4rem; margin-bottom: 20rem; } } .p-top__about-work::before { content: ""; position: absolute; inset: 0; background-color: rgb(253, 243, 232); background-image: url("../images/top/top_bg_item.png"); background-repeat: no-repeat; background-size: 109.5%; background-position: -3rem 1rem; border-radius: 0 0 13rem 13rem; z-index: -1; } @media screen and (max-width: 768px) { .p-top__about-work::before { background-size: 127.7%; border-radius: 0 0 5rem 5rem; background-position: -13rem 0; } } .p-top__about-work .p-top__about-work-inner { background-color: #fff; border-radius: 13rem; padding: 10.8rem 7.2rem 14rem 0; margin: 0 9.2rem; position: relative; } @media screen and (max-width: 768px) { .p-top__about-work .p-top__about-work-inner { border-radius: 5rem; padding: 12.4rem 2rem 13rem; margin: 0; } } .p-top__about-work .p-top__about-work-inner::before { content: ""; width: 100%; height: 100%; background-color: #EA831C; border-radius: 13rem; position: absolute; bottom: -3rem; left: 3rem; z-index: -1; } @media screen and (max-width: 768px) { .p-top__about-work .p-top__about-work-inner::before { border-radius: 5rem; bottom: -3.4rem; left: 0; } } .p-top__about-work .p-top__about-work-inner .about-work_description { display: flex; gap: 8rem; } @media screen and (max-width: 768px) { .p-top__about-work .p-top__about-work-inner .about-work_description { flex-direction: column; gap: 0; } } .p-top__about-work .p-top__about-work-inner .about-work_description .about-work_txt { width: 35rem; } @media screen and (max-width: 768px) { .p-top__about-work .p-top__about-work-inner .about-work_description .about-work_txt { width: 100%; padding: 0 1rem; } } .p-top__about-work .p-top__about-work-inner .about-work_description .about-work_txt p { letter-spacing: 0.1em; margin: 8rem 0 6rem; } @media screen and (max-width: 768px) { .p-top__about-work .p-top__about-work-inner .about-work_description .about-work_txt p { margin: 1.6rem 0 3rem; } } .p-top__about-work .p-top__about-work-inner .about-work_description img { width: 73.3rem; height: 60.6rem; margin-top: -16.8rem; margin-left: -11.2rem; } @media screen and (max-width: 768px) { .p-top__about-work .p-top__about-work-inner .about-work_description img { width: 33.1rem; height: 28.8rem; margin-top: -30.8rem; margin-left: -2rem; margin-bottom: 2rem; } } .p-top__about-work .p-top__about-work-inner .about-work_point { display: flex; justify-content: center; flex-wrap: wrap; gap: 9rem 6.1rem; width: 73.2rem; margin: 9.9rem auto 0; } @media screen and (max-width: 768px) { .p-top__about-work .p-top__about-work-inner .about-work_point { justify-content: space-between; width: 100%; gap: 3rem 1.5rem; margin: 6rem auto 0; } } .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item { display: flex; flex-direction: column; justify-content: space-between; } .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item .item_img { width: 18.7rem; position: relative; } @media screen and (max-width: 768px) { .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item .item_img { width: 13.9rem; } } .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item .item_img img { position: relative; z-index: 1; transition: 0.3s; } .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item .item_img::before { content: ""; width: 100%; height: 100%; background-color: #EBBF05; border-radius: 4.4rem; position: absolute; bottom: -0.9rem; right: -1.2rem; z-index: 0; } @media screen and (max-width: 768px) { .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item .item_img::before { bottom: -0.6rem; right: -0.9rem; } } .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item .item_img::after { content: ""; width: 5.1rem; height: 5.1rem; background-image: url("../images/top/point_arrow_before.svg"); background-repeat: no-repeat; background-size: cover; position: absolute; bottom: -0.9rem; right: -1.4rem; z-index: 2; transition: 0.3s; } @media screen and (max-width: 768px) { .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item .item_img::after { width: 3.7rem; height: 3.7rem; bottom: -0.6rem; right: -2.1rem; } } .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item p { width: 20.3rem; font-size: 1.6rem; text-align: center; margin-top: 2rem; padding-bottom: 0.5rem; border-bottom: 0.1rem solid #050505; transition: 0.3s; } @media screen and (max-width: 768px) { .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item p { width: 16rem; font-size: 1.2rem; line-height: 1.8rem; margin-top: 2.2rem; } } .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item:hover { opacity: 1; } .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item:hover .item_img img { transform: translate(1.2rem, 0.9rem); } @media screen and (max-width: 768px) { .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item:hover .item_img img { transform: none; } } .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item:hover .item_img::after { background-image: url("../images/top/point_arrow_after.svg"); transform: translate(-0.2rem, 0.2rem); } @media screen and (max-width: 768px) { .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item:hover .item_img::after { background-image: url("../images/top/point_arrow_before.svg"); transform: none; } } .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item:hover p { color: #E65000; border-bottom: 0.1rem solid #E65000; } @media screen and (max-width: 768px) { .p-top__about-work .p-top__about-work-inner .about-work_point .about-work_point-item:hover p { color: #050505; border-bottom: 0.1rem solid #050505; } } .p-top__wakuwaku { background: linear-gradient(0deg, rgb(251, 230, 210), rgb(251, 242, 205)); border-radius: 13rem; padding: 9.8rem 0 17.1rem; margin: 0 3rem; position: relative; } @media screen and (max-width: 768px) { .p-top__wakuwaku { border-radius: 5rem; padding: 8rem 2rem 9rem; margin: 0; } } .p-top__wakuwaku::before { content: ""; display: block; width: 100vw; height: 100vh; background-image: url(../images/top/top_fixed_bg.jpeg); background-size: cover; background-position: top; background-repeat: no-repeat; position: fixed; top: 0; left: 0; margin: 0 calc(50% - 50vw); z-index: -2; } @media screen and (max-width: 768px) { .p-top__wakuwaku::before { height: 100%; background-size: 350%; background-position: 45% top; } } .p-top__wakuwaku .c-heading { align-items: center; margin-bottom: 9rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .c-heading { margin-bottom: 3rem; } } .p-top__wakuwaku .c-heading .c-heading__jp { font-size: 5.6rem; line-height: 8.1rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .c-heading .c-heading__jp { font-size: 2.4rem; line-height: 3.5rem; text-align: center; } } .p-top__wakuwaku .c-heading .c-heading__en { font-size: 2.4rem; line-height: 2.9rem; margin-top: 0.2rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .c-heading .c-heading__en { font-size: 1.8rem; line-height: 2.2rem; margin-top: 0.5rem; } } .p-top__wakuwaku .p-top__wakuwaku-heading { display: flex; justify-content: center; align-items: center; width: 95.6rem; height: 9.2rem; background-color: #E65000; border-radius: 10rem; margin: 0 auto 13rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-heading { width: 33.5rem; height: 3.3rem; margin: 0 auto 6rem; } } .p-top__wakuwaku .p-top__wakuwaku-heading img { width: 80.203rem; height: 4.045rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-heading img { width: 29.812rem; height: 1.503rem; } } .p-top__wakuwaku .p-top__wakuwaku-point { display: flex; justify-content: center; flex-wrap: wrap; gap: 9rem 3rem; padding: 0 8.8rem; margin: 0 auto 9rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-point { flex-direction: column; gap: 2rem 0; padding: 0; margin-bottom: 12rem; } } .p-top__wakuwaku .p-top__wakuwaku-point .wakuwaku_point-item { width: calc(33.3333333333% - 2rem); background-color: #fff; padding: 3rem 3rem 2.8rem 3rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-point .wakuwaku_point-item { width: 26.1rem; padding: 2rem 2.2rem; margin: 0 auto; } } .p-top__wakuwaku .p-top__wakuwaku-point .wakuwaku_point-item img { width: 100%; margin-bottom: 3rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-point .wakuwaku_point-item img { margin-bottom: 1.5rem; } } .p-top__wakuwaku .p-top__wakuwaku-point .wakuwaku_point-item .wakuwaku_point-item-heading { color: #0E0D69; font-size: 2rem; line-height: 2.9rem; font-weight: 700; letter-spacing: 0.1em; text-align: center; margin-bottom: 3rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-point .wakuwaku_point-item .wakuwaku_point-item-heading { font-size: 1.3rem; line-height: 2.1rem; margin-bottom: 1.5rem; } } .p-top__wakuwaku .p-top__wakuwaku-point .wakuwaku_point-item p { letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-point .wakuwaku_point-item p { font-size: 1.4rem; line-height: 2.4rem; } } .p-top__wakuwaku .p-top__wakuwaku-point .wakuwaku_point-item:nth-of-type(4) img { width: 20rem; margin: 0 auto 3rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-point .wakuwaku_point-item:nth-of-type(4) img { width: 13.534rem; margin: 2rem auto; } } .p-top__wakuwaku .p-top__wakuwaku-movie { background-image: url("../images/top/top_wakuwaku_bg.svg"); background-repeat: no-repeat; background-size: 128rem; background-position: right top; padding: 18.7rem 0 13.8rem; margin-bottom: 9rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-movie { background-image: url("../images/top/top_wakuwaku_bg_sp.svg"); background-size: 25rem; background-position: 4rem 0; padding: 0 2.5rem 12rem; margin-bottom: 0; } } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery { display: flex; justify-content: space-between; gap: 9rem; padding: 0 14.3rem 0 16.3rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery { flex-direction: column; padding: 0; } } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery .wakuwaku_movie-gallery-txt .top-h3 { display: flex; flex-direction: column; } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery .wakuwaku_movie-gallery-txt .top-h3 .top-h3__en { color: #E65000; font-size: 4.5rem; line-height: 5.5rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery .wakuwaku_movie-gallery-txt .top-h3 .top-h3__en { text-align: center; } } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery .wakuwaku_movie-gallery-txt .top-h3 .top-h3__jp { font-size: 1.8rem; line-height: 2.6rem; letter-spacing: 0.05em; margin-top: 1rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery .wakuwaku_movie-gallery-txt .top-h3 .top-h3__jp { text-align: center; } } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery .wakuwaku_movie-gallery-txt p { letter-spacing: 0.1em; margin-top: 9rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery .wakuwaku_movie-gallery-txt p { text-align: center; margin-top: 1.6rem; margin-bottom: 6rem; } } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery .wakuwaku_movie-gallery-main { width: 58.2rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery .wakuwaku_movie-gallery-main { display: none; } } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery .wakuwaku_movie-gallery-main .movie__main-trigger { position: relative; width: 100%; aspect-ratio: 16/9; padding: 0; border: 0; background: none; cursor: pointer; position: relative; } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery .wakuwaku_movie-gallery-main .movie__main-trigger::before { content: ""; width: 5.7rem; height: 5.7rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: url("../images/base/movie-play-button.png") center/contain no-repeat; } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery .wakuwaku_movie-gallery-main .movie__main-trigger img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery .wakuwaku_movie-gallery-main .movie__main-trigger iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery .wakuwaku_movie-gallery-main .movie__caption { color: #0E0D69; line-height: 2.1rem; letter-spacing: 0.1em; text-align: center; margin-top: 3rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery .wakuwaku_movie-gallery-main .movie__caption { font-size: 1.3rem; line-height: 1.9rem; margin-top: 0.8rem; } } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery-sub { margin-top: 6rem; padding: 0 14.3rem 0 41.4rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery-sub { margin: 0; padding: 0; } } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery-sub { /* サムネ一覧 */ } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery-sub .movie__thumbs { display: flex; justify-content: right; gap: 1.6rem; width: 58.2rem; margin-left: auto; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery-sub .movie__thumbs { width: 100%; flex-direction: column; gap: 3rem; } } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery-sub .movie__thumbs li { width: 18.2rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery-sub .movie__thumbs li { width: 100%; } } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery-sub .movie__thumbs li button { position: relative; width: 100%; aspect-ratio: 16/9; padding: 0; border: none; background: none; cursor: pointer; position: relative; } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery-sub .movie__thumbs li button::before { content: ""; width: 3.8rem; height: 3.8rem; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: url("../images/base/movie-play-button.png") center/contain no-repeat; } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery-sub .movie__thumbs li button:has(iframe)::before { display: none; } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery-sub .movie__thumbs li button img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery-sub .movie__thumbs li button.is-active img { outline: 0.3rem solid #E65000; } .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery-sub .movie__thumbs li .movie__caption { color: #0E0D69; font-size: 1.3rem; line-height: 1.9rem; letter-spacing: 0.1em; text-align: center; margin-top: 1.8rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-movie .wakuwaku_movie-gallery-sub .movie__thumbs li .movie__caption { margin-top: 0; } } .p-top__wakuwaku .p-top__wakuwaku-gallery { background-image: url("../images/top/top_wakuwaku_bg.svg"); background-repeat: no-repeat; background-size: 128rem; background-position: right top; padding: 10.3rem 0 12.2rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-gallery { background-image: url("../images/top/top_wakuwaku_bg_sp.svg"); background-size: 25rem; background-position: 4rem -3rem; padding: 0; } } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-gallery { padding: 0 20rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-gallery { padding: 0; } } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-gallery .wakuwaku_gallery-gallery-txt { display: flex; gap: 6rem; margin-bottom: 3rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-gallery .wakuwaku_gallery-gallery-txt { flex-direction: column; gap: 3rem; margin-bottom: 6rem; } } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-gallery .wakuwaku_gallery-gallery-txt .top-h3 { display: flex; flex-direction: column; } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-gallery .wakuwaku_gallery-gallery-txt .top-h3 .top-h3__en { color: #E65000; font-size: 4.5rem; line-height: 5.5rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-gallery .wakuwaku_gallery-gallery-txt .top-h3 .top-h3__en { text-align: center; } } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-gallery .wakuwaku_gallery-gallery-txt .top-h3 .top-h3__jp { font-size: 1.8rem; line-height: 2.6rem; margin-top: 1rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-gallery .wakuwaku_gallery-gallery-txt .top-h3 .top-h3__jp { text-align: center; } } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-gallery .wakuwaku_gallery-gallery-txt .txt_box { width: 67.1rem; color: #fff; line-height: 2.55rem; letter-spacing: 0.1em; background-color: #E65000; border-radius: 3rem; padding: 2rem 4rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-gallery .wakuwaku_gallery-gallery-txt .txt_box { width: 31.5rem; line-height: 3rem; padding: 3rem 2.4rem; margin: 0 auto; } } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-gallery .wakuwaku_gallery-gallery-txt .txt_box span { font-size: 1.4rem; } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents { display: flex; gap: 6.3rem; padding: 0 18.4rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents { flex-direction: column; gap: 6rem; padding: 0; } } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male { width: calc(50% - 3.15rem); } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male { width: 100%; } } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-main, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-main { display: flex; justify-content: space-between; align-items: center; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-main, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-main { margin: 0 1rem; } } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-main .gallery__main-initial, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-main .gallery__main, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-main .gallery__main-initial, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-main .gallery__main { width: 34.3rem; height: 45.5rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-main .gallery__main-initial, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-main .gallery__main, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-main .gallery__main-initial, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-main .gallery__main { width: 24.1rem; height: 32.2rem; } } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-main .gallery__main-initial img, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-main .gallery__main img, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-main .gallery__main-initial img, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-main .gallery__main img { width: 100%; height: 45.5rem; border-radius: 6rem; -o-object-fit: cover; object-fit: cover; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-main .gallery__main-initial img, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-main .gallery__main img, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-main .gallery__main-initial img, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-main .gallery__main img { height: 32.2rem; } } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-main .js-gallery-main-female, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-main .js-gallery-main-male, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-main .js-gallery-main-female, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-main .js-gallery-main-male { display: none; } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-main .gallery__arrow, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-main .gallery__arrow { width: 2.8rem; height: 2.8rem; } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-sub, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-sub { margin-top: 0.5rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-sub, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-sub { width: 100vw; margin-left: calc(50% - 50vw); padding: 0 1rem; } } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-sub, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-sub { /* サムネ一覧 */ } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-sub .gallery__thumbs, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-sub .gallery__thumbs { display: flex; flex-wrap: wrap; gap: 0.5rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-sub .gallery__thumbs, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-sub .gallery__thumbs { gap: 0.4rem; } } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-sub .gallery__thumbs li, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-sub .gallery__thumbs li { height: 14.6rem; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-sub .gallery__thumbs li, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-sub .gallery__thumbs li { height: 12.1rem; } } .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-sub .gallery__thumbs li img, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-sub .gallery__thumbs li img { display: block; width: 10.3rem; height: 14.6rem; border-radius: 2rem; -o-object-position: center; object-position: center; -o-object-fit: cover; object-fit: cover; } @media screen and (max-width: 768px) { .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-female .wakuwaku_gallery-gallery-sub .gallery__thumbs li img, .p-top__wakuwaku .p-top__wakuwaku-gallery .wakuwaku_gallery-contents .wakuwaku_gallery-male .wakuwaku_gallery-gallery-sub .gallery__thumbs li img { width: 8.5rem; height: 12.1rem; } } .p-top__apply { margin: 13rem auto 0; padding-bottom: 17.98rem; position: relative; } @media screen and (max-width: 768px) { .p-top__apply { margin: 15.4rem auto 0; padding: 0 2rem 13.3rem; } } .p-top__apply::before { content: ""; width: 100%; height: 100.5rem; background-image: url("../images/top/top_gradation_bg.png"); background-size: cover; background-position: center; background-repeat: no-repeat; position: absolute; top: -55rem; left: 0; z-index: -1; } .p-top__apply::after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 34rem; background-color: #fff; z-index: -1; } @media screen and (max-width: 768px) { .p-top__apply::after { height: 120%; } } .p-top__apply .p-top__apply-txt { padding-left: 13.9rem; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-txt { position: static; padding-left: 0; } } .p-top__apply .p-top__apply-txt .c-heading .c-heading__jp { font-size: 6.3rem; line-height: 9.1rem; letter-spacing: 0.05em; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-txt .c-heading .c-heading__jp { font-size: 3.4rem; line-height: 4.9rem; text-align: center; } } .p-top__apply .p-top__apply-txt .c-heading .c-heading__en { font-size: 2.4rem; line-height: 2.9rem; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-txt .c-heading .c-heading__en { font-size: 2rem; line-height: 2.4rem; text-align: center; margin-top: 0.5rem; } } .p-top__apply .p-top__apply-txt p { font-size: 1.6rem; line-height: 2.6rem; letter-spacing: 0.05em; margin-top: 8rem; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-txt p { font-size: 1.5rem; line-height: 2.5rem; margin-top: 3rem; margin-bottom: 6rem; } } .p-top__apply .p-top__apply-map { width: 59.6rem; margin: -15.82rem auto 0; position: relative; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map { display: grid; row-gap: 3rem; width: 100%; margin: 0; } .p-top__apply .p-top__apply-map img { display: none; } } .p-top__apply .p-top__apply-map .map__area { width: 14.4rem; background-color: #fff; border: 0.1rem solid #050505; border-radius: 1rem; padding: 1.2rem 2rem; position: absolute; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area { width: 100%; padding: 1.5rem 2rem; position: relative; } } .p-top__apply .p-top__apply-map .map__area .map__area-toggle { width: 1.7rem; height: 1.7rem; background-image: url("../images/top/top_apply_open.svg"); background-repeat: no-repeat; background-size: contain; position: absolute; top: 2rem; right: 1.5rem; cursor: pointer; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area .map__area-toggle { top: 2.2rem; right: 2rem; } } .p-top__apply .p-top__apply-map .map__area { /* モーダルが開いている時 */ } .p-top__apply .p-top__apply-map .map__area:has(.pref-modal.is-open) { width: 20.2rem; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area:has(.pref-modal.is-open) { width: 100%; padding-bottom: 3rem; } } .p-top__apply .p-top__apply-map .map__area:has(.pref-modal.is-open) .map__area-toggle { background-image: url("../images/top/top_apply_close.svg"); right: 7.3rem; z-index: 2; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area:has(.pref-modal.is-open) .map__area-toggle { right: 2rem; } } .p-top__apply .p-top__apply-map .map__area .map__area-btn { width: 100%; font-size: 2rem; line-height: 2.9rem; font-weight: 700; } .p-top__apply .p-top__apply-map .map__area .pref-modal { display: none; visibility: hidden; pointer-events: none; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area .pref-modal { display: none; width: 100.5%; border: none; padding: 0; margin-top: 1rem; position: static; } } .p-top__apply .p-top__apply-map .map__area .pref-modal .pref-modal__content .pref-modal__list { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem 2rem; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area .pref-modal .pref-modal__content .pref-modal__list { grid-template-columns: 1fr; } } .p-top__apply .p-top__apply-map .map__area .pref-modal .pref-modal__content .pref-modal__list li a { width: -moz-fit-content; width: fit-content; font-size: 1.6rem; line-height: 2.4rem; margin-right: 2.1rem; position: relative; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area .pref-modal .pref-modal__content .pref-modal__list li a { width: 100%; margin-right: 0; border-bottom: 0.1rem dashed #050505; padding-bottom: 1rem; } } .p-top__apply .p-top__apply-map .map__area .pref-modal .pref-modal__content .pref-modal__list li a::before { content: ""; width: 1.3rem; height: 1.3rem; background-image: url("../images/top/target_blank.svg"); background-repeat: no-repeat; background-size: contain; margin: auto; position: absolute; top: 0; bottom: 0; right: -2rem; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area .pref-modal .pref-modal__content .pref-modal__list li a::before { right: 0; } } .p-top__apply .p-top__apply-map .map__area .pref-modal.is-open { display: block; width: 100%; background-color: #fff; visibility: visible; pointer-events: auto; margin-top: 2rem; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area .pref-modal.is-open { margin-top: 1rem; } } .p-top__apply .p-top__apply-map .map__area.is-hokkaido { top: 2.82rem; right: -11.4rem; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area.is-hokkaido { top: 0; right: 0; } } .p-top__apply .p-top__apply-map .map__area.is-hokkaido .map__area-toggle { width: 1.7rem; height: 1.7rem; background-image: url("../images/top/target_blank.svg"); } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area.is-hokkaido .map__area-toggle { top: 2.4rem; } } .p-top__apply .p-top__apply-map .map__area.is-tohoku { top: 13.17rem; right: -6rem; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area.is-tohoku { top: 0; right: 0; } } .p-top__apply .p-top__apply-map .map__area.is-kanto { top: 35.82rem; right: -3.8rem; z-index: 1; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area.is-kanto { top: 0; right: 0; } } .p-top__apply .p-top__apply-map .map__area.is-chubu { top: 23.12rem; right: 23.8rem; z-index: 2; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area.is-chubu { top: 0; right: 0; } } .p-top__apply .p-top__apply-map .map__area.is-kansai { top: 46.237rem; right: 14.6rem; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area.is-kansai { top: 0; right: 0; } } .p-top__apply .p-top__apply-map .map__area.is-chugoku { top: 30.12rem; right: 39.8rem; z-index: 1; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area.is-chugoku { top: 0; right: 0; } } .p-top__apply .p-top__apply-map .map__area.is-shikoku { top: 49.717rem; right: 35.3rem; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area.is-shikoku { top: 0; right: 0; } } .p-top__apply .p-top__apply-map .map__area.is-kyushu { top: 39.02rem; right: 53rem; } @media screen and (max-width: 768px) { .p-top__apply .p-top__apply-map .map__area.is-kyushu { top: 0; right: 0; } } /*---------- top ----------*/ .p-about_au { position: relative; overflow: hidden; } .p-about_au::before { content: ""; width: 100vw; height: 100vh; background-image: url(../images/about-au/about-au_fixed_bg.png); background-size: cover; background-position: top; background-repeat: no-repeat; display: block; position: fixed; top: 0; left: 0; margin: 0 calc(50% - 50vw); z-index: -1; } @media screen and (max-width: 768px) { .p-about_au::before { height: 100%; background-size: 350%; background-position: 45% top; } } .p-about_au__wrapper { background-color: #fff; border-radius: 13rem 0 0 13rem; margin: 10rem 0 22rem 11.6rem; padding: 9rem 0 14rem; position: relative; } @media screen and (max-width: 768px) { .p-about_au__wrapper { border-radius: 5rem 0 0 5rem; margin: 12rem 0 13rem 2rem; padding: 10.3rem 1rem 9.2rem 2rem; } } .p-about_au__wrapper::before { content: ""; width: 103%; height: 100%; background-color: #0E0D69; border-radius: 13rem 0 0 13rem; position: absolute; top: 3rem; left: -3rem; z-index: -1; } @media screen and (max-width: 768px) { .p-about_au__wrapper::before { border-radius: 5rem 0 0 5rem; top: 1rem; left: -1rem; } } .p-about_au__challenge { margin: 0 auto 14.8rem; } @media screen and (max-width: 768px) { .p-about_au__challenge { margin: 0 auto 6rem; } } .p-about_au__challenge .c-heading { margin-bottom: 5.6rem; } @media screen and (max-width: 768px) { .p-about_au__challenge .c-heading { margin-bottom: 3rem; } } .p-about_au__challenge .c-heading .c-heading__jp { text-align: center; } @media screen and (max-width: 768px) { .p-about_au__challenge .c-heading .c-heading__jp { font-size: 2.4rem; line-height: 3.6rem; } } .p-about_au__challenge .c-heading .c-heading__en { text-align: center; } @media screen and (max-width: 768px) { .p-about_au__challenge .c-heading .c-heading__en { margin-top: 0.5rem; } } .p-about_au__challenge .challenge-movie { width: 73.5rem; margin: 0 auto 5.2rem; } @media screen and (max-width: 768px) { .p-about_au__challenge .challenge-movie { width: 100%; margin: 0 auto 3rem; } } .p-about_au__challenge .challenge-movie .challenge-movie__caption { font-size: 1.6rem; line-height: 2.4rem; letter-spacing: 0.1em; font-weight: 700; text-align: center; margin-bottom: 1rem; } .p-about_au__challenge .challenge-movie .challenge-movie__main { position: relative; width: 100%; aspect-ratio: 16/9; overflow: hidden; background: #000; } .p-about_au__challenge .challenge-movie .challenge-movie__main iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; display: block; z-index: 1; } .p-about_au__challenge .challenge-movie .challenge-movie__main button.js-yt-play { position: absolute; inset: 0; width: 100%; height: 100%; border: none; background: none; cursor: pointer; z-index: 2; } .p-about_au__challenge .challenge-movie .challenge-movie__main button.js-yt-play img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; display: block; } .p-about_au__challenge .challenge-movie .challenge-movie__main button.js-yt-play::before { content: ""; position: absolute; top: 50%; left: 50%; width: 5.7rem; height: 5.7rem; transform: translate(-50%, -50%); background: url("../images/base/movie-play-button.png") center/contain no-repeat; pointer-events: none; } @media screen and (max-width: 768px) { .p-about_au__challenge .challenge-movie .challenge-movie__main button.js-yt-play::before { width: 3.8rem; height: 3.8rem; } } .p-about_au__challenge .challenge-history { display: flex; align-items: center; gap: 7rem; width: 90.3rem; background-color: #F5F5F5; border-radius: 7rem; padding: 4.3rem 9.5rem; margin: 0 auto 6rem; } @media screen and (max-width: 768px) { .p-about_au__challenge .challenge-history { flex-direction: column; gap: 2rem; width: 100%; border-radius: 5rem; padding: 6rem 4.5rem 6rem 3.5rem; margin: 0 auto 3rem; } } .p-about_au__challenge .challenge-history img { width: 40.4rem; } @media screen and (max-width: 768px) { .p-about_au__challenge .challenge-history img { width: 100%; } } .p-about_au__challenge .challenge-history .challenge-history__txt p { font-size: 1.6rem; line-height: 2.4rem; font-weight: 700; letter-spacing: 0.1em; text-align: center; margin-bottom: 3rem; } @media screen and (max-width: 768px) { .p-about_au__challenge .challenge-history .challenge-history__txt p { margin-bottom: 2rem; } } .p-about_au__challenge .challenge-history .challenge-history__txt .c-btn { display: flex; justify-content: right; align-items: center; width: 23.8rem; padding-right: 2.7rem; } .p-about_au__challenge > p { font-size: 1.6rem; line-height: 2.6rem; font-weight: 700; letter-spacing: 0.1em; text-align: center; margin-bottom: 3.6em; } @media screen and (max-width: 768px) { .p-about_au__challenge > p { font-size: 1.5rem; line-height: 3rem; } } .p-about_au__aushop .c-heading { margin-bottom: 5.6rem; } @media screen and (max-width: 768px) { .p-about_au__aushop .c-heading { margin-bottom: 3rem; } } .p-about_au__aushop .c-heading .c-heading__jp { text-align: center; } @media screen and (max-width: 768px) { .p-about_au__aushop .c-heading .c-heading__jp { font-size: 2.4rem; line-height: 3.6rem; } } .p-about_au__aushop .c-heading .c-heading__en { text-align: center; } @media screen and (max-width: 768px) { .p-about_au__aushop .c-heading .c-heading__en { margin-top: 0.9rem; } } .p-about_au__aushop p { width: 76.1rem; line-height: 2.6rem; letter-spacing: 0.1em; margin: 0 auto; } @media screen and (max-width: 768px) { .p-about_au__aushop p { width: 100%; line-height: 3rem; } } .p-about_au__aushop p.txt-center { text-align: center; font-weight: 700; margin-bottom: 6.2rem; } @media screen and (max-width: 768px) { .p-about_au__aushop p.txt-center { margin-bottom: 3rem; } } .p-about_au__aushop .aushop-img { width: 77rem; background-color: #F5F5F5; border-radius: 7rem; margin: 0 auto 3.4rem; padding: 2.89rem 10.5rem 2.6rem 9.7rem; } @media screen and (max-width: 768px) { .p-about_au__aushop .aushop-img { width: 100%; border-radius: 5rem; margin: 0 auto 3rem; padding: 4rem 0.5rem; } } .p-about_au__numbers { padding: 0 8.3rem; margin-bottom: 18rem; } @media screen and (max-width: 768px) { .p-about_au__numbers { padding: 0 1rem; } } .p-about_au__numbers .c-heading { margin-bottom: 15rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .c-heading { margin-bottom: 6rem; } } .p-about_au__numbers .c-heading .c-heading__jp { text-align: center; } @media screen and (max-width: 768px) { .p-about_au__numbers .c-heading .c-heading__jp { font-size: 2.4rem; line-height: 3.6rem; } } .p-about_au__numbers .c-heading .c-heading__en { text-align: center; } @media screen and (max-width: 768px) { .p-about_au__numbers .c-heading .c-heading__en { margin-top: 0.5rem; } } .p-about_au__numbers h3 { width: -moz-fit-content; width: fit-content; color: #fff; font-size: 1.8rem; line-height: 2.6rem; font-weight: 700; letter-spacing: 0.1em; background-color: #EB8A05; border-radius: 6rem; padding: 0.8rem 3.2rem; margin: 0 auto; } @media screen and (max-width: 768px) { .p-about_au__numbers h3 { text-align: center; } } .p-about_au__numbers .numbers-col1 { display: flex; gap: 2rem; margin-bottom: 1.9rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col1 { flex-direction: column; row-gap: 3rem; } } .p-about_au__numbers .numbers-col1 .numbers-col1__item { background-color: #fff; border-radius: 2.6rem; padding: 3rem 0 1.9rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col1 .numbers-col1__item { padding: 3rem 0 7.1rem; } } .p-about_au__numbers .numbers-col1 .numbers-col1__item.stores { width: 41.6rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col1 .numbers-col1__item.stores { width: 100%; } } .p-about_au__numbers .numbers-col1 .numbers-col1__item.stores img { width: 28.7rem; margin: 10.6rem auto 2.1rem; } .p-about_au__numbers .numbers-col1 .numbers-col1__item.stores .stores-contents { color: #E65000; font-size: 2.8rem; line-height: 4rem; font-weight: 700; text-align: center; } .p-about_au__numbers .numbers-col1 .numbers-col1__item.stores .stores-contents span { font-size: 2rem; line-height: 2.9rem; } .p-about_au__numbers .numbers-col1 .numbers-col1__item.stores .stores-contents span.roboto { font-size: 7.1rem; line-height: 9.3rem; margin: 0 0.3rem 0 1.02rem; } .p-about_au__numbers .numbers-col1 .numbers-col1__item.staff { width: 34.6rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col1 .numbers-col1__item.staff { width: 100%; } } .p-about_au__numbers .numbers-col1 .numbers-col1__item.staff img { width: 15.5rem; margin: 8.1rem auto 0.8rem; } .p-about_au__numbers .numbers-col1 .numbers-col1__item.staff .staff-contents { color: #E65000; font-size: 2.8rem; line-height: 4rem; font-weight: 700; text-align: center; } .p-about_au__numbers .numbers-col1 .numbers-col1__item.staff .staff-contents span { font-size: 2rem; line-height: 2.9rem; } .p-about_au__numbers .numbers-col1 .numbers-col1__item.staff .staff-contents span.roboto { font-size: 7.1rem; line-height: 9.3rem; margin: 0 0.3rem 0 1.02rem; } .p-about_au__numbers .numbers-col1 .numbers-col1__item.ratio { width: 39.8rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col1 .numbers-col1__item.ratio { width: 100%; padding: 3rem 0 1.9rem; } } .p-about_au__numbers .numbers-col1 .numbers-col1__item.ratio .ratio-contents { display: flex; justify-content: center; gap: 4.1rem; margin-top: 3.7rem; } .p-about_au__numbers .numbers-col1 .numbers-col1__item.ratio .ratio-contents .ratio-contents__item img { width: 9.2rem; margin: 0 auto 0.3rem; } .p-about_au__numbers .numbers-col1 .numbers-col1__item.ratio .ratio-contents .ratio-contents__item p { color: #EBA405; font-size: 2.4rem; line-height: 3.5rem; font-weight: 700; text-align: center; } .p-about_au__numbers .numbers-col1 .numbers-col1__item.ratio .ratio-contents .ratio-contents__item .ratio-contents__item-percent { color: #EBA405; font-size: 1.8rem; line-height: 2.6rem; font-weight: 700; letter-spacing: 0.1rem; margin-right: -1.7rem; } .p-about_au__numbers .numbers-col1 .numbers-col1__item.ratio .ratio-contents .ratio-contents__item .ratio-contents__item-percent span { font-size: 9rem; line-height: 11.8rem; } .p-about_au__numbers .numbers-col1 .numbers-col1__item.ratio .ratio-contents .ratio-contents__item:nth-of-type(2) img { width: 8.4rem; margin: 0.7rem auto 0; } .p-about_au__numbers .numbers-col1 .numbers-col1__item.ratio .ratio-contents .ratio-contents__item:nth-of-type(2) p { color: #E65000; } .p-about_au__numbers .numbers-col1 .numbers-col1__item.ratio .ratio-contents .ratio-contents__item:nth-of-type(2) .ratio-contents__item-percent { color: #E65000; } .p-about_au__numbers .numbers-col2 { display: flex; gap: 2rem; margin-bottom: 2rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 { flex-direction: column; row-gap: 3rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item { background-color: #fff; border-radius: 2.6rem; padding: 3rem 0 6.8rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item { padding: 3rem 0; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age { width: 52.5rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age { width: 100%; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents { display: grid; row-gap: 2.1rem; margin: 6.38rem auto 2.52rem; padding-left: 3.41rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents { row-gap: 1.73rem; margin: 2.57rem auto 6.35rem; padding-left: 1rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item { display: flex; } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item .age-contents__item-graph { height: 14.4rem; color: #fff; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item .age-contents__item-graph { height: 10.352rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item .age-contents__item-age { position: relative; z-index: 0; } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item .age-contents__item-age::before { content: ""; width: 10rem; height: 7.3rem; background-color: #FFF4E5; border-radius: 50%; transform: rotate(-45deg); position: absolute; top: 4.5rem; right: -2.7rem; z-index: -1; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item .age-contents__item-age::before { width: 7.189rem; height: 5.243rem; top: 2.5rem; right: -1.5rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_20 .age-contents__item-graph { display: flex; justify-content: center; align-items: baseline; width: 33.2rem; font-size: 7.3rem; line-height: 9.6rem; font-weight: 700; background-color: #E65000; padding-top: 2.61rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_20 .age-contents__item-graph { width: 23.867rem; font-size: 5.1rem; line-height: 6.7rem; padding-top: 2rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_20 .age-contents__item-graph span:first-child { letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_20 .age-contents__item-graph span:first-child { font-size: 4.9rem; line-height: 6.4rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_20 .age-contents__item-graph span:nth-child(2) { font-size: 4.9rem; line-height: 6.4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_20 .age-contents__item-graph span:nth-child(2) { font-size: 3.3rem; line-height: 4.4rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_20 .age-contents__item-graph span.jp { font-size: 2.9rem; line-height: 4.2rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_20 .age-contents__item-graph span.jp { font-size: 2rem; line-height: 2.9rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_20 .age-contents__item-age { color: #E65000; font-size: 2.6rem; line-height: 3.7rem; font-weight: 700; letter-spacing: 0.1em; margin-left: 1.4rem; padding-top: 4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_20 .age-contents__item-age { font-size: 1.8rem; line-height: 2.6rem; margin-left: 0.57rem; padding-top: 2.5rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_20 .age-contents__item-age .roboto { font-size: 5.8rem; line-height: 7.7rem; letter-spacing: 0; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_20 .age-contents__item-age .roboto { font-size: 4.1rem; line-height: 5.4rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_30 .age-contents__item-graph { display: flex; justify-content: center; align-items: baseline; width: 26.5rem; font-size: 6rem; line-height: 7.9rem; font-weight: 700; background-color: #EA831C; padding-top: 2.9rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_30 .age-contents__item-graph { width: 19.05rem; font-size: 4.2rem; line-height: 5.5rem; padding-top: 2.5rem; } } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_30 .age-contents__item-graph span:first-child { font-size: 3.9rem; line-height: 5.2rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_30 .age-contents__item-graph span:nth-child(2) { font-size: 4rem; line-height: 5.3rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_30 .age-contents__item-graph span:nth-child(2) { font-size: 2.8rem; line-height: 3.7rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_30 .age-contents__item-graph span.jp { font-size: 2.4rem; line-height: 3.5rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_30 .age-contents__item-graph span.jp { font-size: 1.6rem; line-height: 2.4rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_30 .age-contents__item-age { color: #EA831C; font-size: 2.6rem; line-height: 3.7rem; font-weight: 700; letter-spacing: 0.1em; margin-left: 1.1rem; padding-top: 4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_30 .age-contents__item-age { font-size: 1.8rem; line-height: 2.6rem; margin-left: 0.75rem; padding-top: 3rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_30 .age-contents__item-age .roboto { font-size: 4.6rem; line-height: 6rem; letter-spacing: 0; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_30 .age-contents__item-age .roboto { font-size: 3.1rem; line-height: 4rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_30 .age-contents__item-age::before { top: 3.5rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_30 .age-contents__item-age::before { top: 2.5rem; right: -2.5rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_40 .age-contents__item-graph { display: flex; justify-content: center; align-items: baseline; width: 17.1rem; font-size: 4.9rem; line-height: 6.4rem; font-weight: 700; background-color: #EBA405; padding-top: 4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_40 .age-contents__item-graph { width: 12.293rem; font-size: 3.3rem; line-height: 4.4rem; padding-top: 3rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_40 .age-contents__item-graph span:first-child { letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_40 .age-contents__item-graph span:first-child { font-size: 3.2rem; line-height: 4.3rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_40 .age-contents__item-graph span:nth-child(2) { font-size: 3.3rem; line-height: 4.4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_40 .age-contents__item-graph span:nth-child(2) { font-size: 2.3rem; line-height: 3rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_40 .age-contents__item-graph span.jp { font-size: 2rem; line-height: 2.9rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_40 .age-contents__item-graph span.jp { font-size: 1.3rem; line-height: 1.9rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_40 .age-contents__item-age { color: #EBA405; font-size: 2.6rem; line-height: 3.7rem; font-weight: 700; letter-spacing: 0.1em; margin-left: 2rem; padding-top: 4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_40 .age-contents__item-age { font-size: 1.8rem; line-height: 2.6rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_40 .age-contents__item-age .roboto { font-size: 4.6rem; line-height: 6rem; letter-spacing: 0; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_40 .age-contents__item-age .roboto { font-size: 3.1rem; line-height: 4rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_40 .age-contents__item-age::before { top: 4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_40 .age-contents__item-age::before { top: 3.5rem; right: -2.5rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_10 .age-contents__item-graph { display: flex; justify-content: center; align-items: baseline; width: 3.6rem; background-color: #EBBF05; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_10 .age-contents__item-graph { width: 2.588rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_10 .age-contents__item-age { display: flex; align-items: baseline; color: #EBBF05; font-size: 2.6rem; line-height: 3.7rem; font-weight: 700; letter-spacing: 0.1em; margin-left: 0.98rem; padding-top: 4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_10 .age-contents__item-age { font-size: 1.8rem; line-height: 2.6rem; padding-top: 3rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_10 .age-contents__item-age .age_10_percent { font-size: 4.9rem; line-height: 6.4rem; margin-right: 1.41rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_10 .age-contents__item-age .age_10_percent { font-size: 3.3rem; line-height: 4.4rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_10 .age-contents__item-age .age_10_percent span:first-child { letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_10 .age-contents__item-age .age_10_percent span:first-child { font-size: 3.2rem; line-height: 4.3rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_10 .age-contents__item-age .age_10_percent span:nth-child(2) { font-size: 3.3rem; line-height: 4.4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_10 .age-contents__item-age .age_10_percent span:nth-child(2) { font-size: 2.3rem; line-height: 3rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_10 .age-contents__item-age .age_10_percent span.jp { font-size: 2rem; line-height: 2.9rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_10 .age-contents__item-age .age_10_percent span.jp { font-size: 1.3rem; line-height: 1.9rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_10 .age-contents__item-age .roboto { font-size: 5.8rem; line-height: 7.7rem; letter-spacing: 0; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age .age-contents .age-contents__item.age_10 .age-contents__item-age .roboto { font-size: 3.1rem; line-height: 4rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__item.age img { width: 36.4rem; margin: 0 auto; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__item.age img { width: 100%; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper { display: grid; row-gap: 2rem; width: 65.4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper { width: 100%; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class { height: -moz-fit-content; height: fit-content; padding: 3rem 0; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class { padding: 3rem 1rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents { display: flex; justify-content: center; align-items: end; gap: 1.4rem; margin-top: 11.5rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents { gap: 0.7rem; margin-top: 10.5rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item { position: relative; } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_manager .class-contents__item-graph { display: flex; justify-content: center; align-items: baseline; width: 110%; color: #EBA405; font-size: 5.9rem; line-height: 7.8rem; font-weight: 700; letter-spacing: -0.05em; position: absolute; bottom: 5.6rem; left: -0.5rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_manager .class-contents__item-graph { width: 112%; font-size: 3.5rem; line-height: 4.6rem; bottom: 3.329rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_manager .class-contents__item-graph span:first-child { font-size: 5.8rem; line-height: 7.7rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_manager .class-contents__item-graph span:first-child { font-size: 3.4rem; line-height: 4.5rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_manager .class-contents__item-graph span:nth-child(2) { font-size: 4rem; line-height: 5.3rem; letter-spacing: 0; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_manager .class-contents__item-graph span:nth-child(2) { font-size: 2.3rem; line-height: 3rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_manager .class-contents__item-graph span.jp { font-size: 2.4rem; line-height: 3.5rem; letter-spacing: 0.1em; margin-left: 0.8rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_manager .class-contents__item-graph span.jp { font-size: 1.4rem; line-height: 2rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_manager .class-contents__item-class { display: flex; justify-content: center; align-items: center; width: 13rem; height: 5.6rem; color: #fff; font-size: 1.8rem; line-height: 2.6rem; font-weight: 700; letter-spacing: 0.1em; background-color: #EBA405; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_manager .class-contents__item-class { width: 7.728rem; height: 3.329rem; font-size: 1.4rem; line-height: 2rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_assistant-manager .class-contents__item-graph { display: flex; justify-content: center; align-items: baseline; width: 110%; color: #EBA405; font-size: 5.9rem; line-height: 7.8rem; font-weight: 700; letter-spacing: -0.05em; position: absolute; bottom: 6.7rem; left: -1rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_assistant-manager .class-contents__item-graph { width: 120%; font-size: 3.5rem; line-height: 4.6rem; bottom: 3.983rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_assistant-manager .class-contents__item-graph span:first-child { font-size: 5.8rem; line-height: 7.7rem; letter-spacing: 0.1em; margin-left: 0.4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_assistant-manager .class-contents__item-graph span:first-child { font-size: 3.5rem; line-height: 4.5rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_assistant-manager .class-contents__item-graph span:nth-child(2) { font-size: 4rem; line-height: 5.3rem; letter-spacing: 0; margin-left: -0.4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_assistant-manager .class-contents__item-graph span:nth-child(2) { font-size: 2.3rem; line-height: 3rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_assistant-manager .class-contents__item-graph span.jp { font-size: 2.4rem; line-height: 3.5rem; letter-spacing: 0.1em; margin-left: 0.4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_assistant-manager .class-contents__item-graph span.jp { font-size: 1.4rem; line-height: 2rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_assistant-manager .class-contents__item-class { display: flex; justify-content: center; align-items: center; width: 13rem; height: 6.7rem; color: #fff; font-size: 1.8rem; line-height: 2.6rem; font-weight: 700; letter-spacing: 0.1em; background-color: #EBA405; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_assistant-manager .class-contents__item-class { width: 7.728rem; height: 3.983rem; font-size: 1.4rem; line-height: 2rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_staff .class-contents__item-graph { display: flex; justify-content: center; align-items: baseline; width: 143%; color: #E65000; font-size: 8.3rem; line-height: 10.9rem; font-weight: 700; letter-spacing: -0.02em; position: absolute; bottom: 27rem; left: -2.5rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_staff .class-contents__item-graph { width: 160%; font-size: 4.9rem; line-height: 6.4rem; bottom: 16.23rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_staff .class-contents__item-graph span:first-child { font-size: 8.2rem; line-height: 10.8rem; letter-spacing: 0.1em; margin-left: -1rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_staff .class-contents__item-graph span:first-child { font-size: 4.9rem; line-height: 6.4rem; margin-left: -0.5rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_staff .class-contents__item-graph span:nth-child(2) { font-size: 5.6rem; line-height: 7.4rem; letter-spacing: 0; margin-left: -0.5rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_staff .class-contents__item-graph span:nth-child(2) { font-size: 3.2rem; line-height: 4.3rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_staff .class-contents__item-graph span.jp { font-size: 3.4rem; line-height: 4.9rem; letter-spacing: 0.1em; margin-left: 0.8rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_staff .class-contents__item-graph span.jp { font-size: 2rem; line-height: 2.9rem; margin-left: 0.4rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_staff .class-contents__item-class { display: flex; justify-content: center; align-items: center; width: 13rem; height: 27.3rem; color: #fff; font-size: 2.4rem; line-height: 3.5rem; font-weight: 700; letter-spacing: 0.1em; background-color: #E65000; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_staff .class-contents__item-class { width: 7.728rem; height: 16.23rem; font-size: 1.5rem; line-height: 2.1rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_others .class-contents__item-graph { display: flex; justify-content: center; align-items: baseline; width: 100%; color: #A8A8A8; font-size: 5.9rem; line-height: 7.8rem; font-weight: 700; position: absolute; bottom: 5.6rem; left: -0.5rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_others .class-contents__item-graph { width: 110%; font-size: 3.5rem; line-height: 4.6rem; bottom: 3.365rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_others .class-contents__item-graph span:first-child { font-size: 5.8rem; line-height: 7.7rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_others .class-contents__item-graph span:first-child { font-size: 3.4rem; line-height: 4.5rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_others .class-contents__item-graph span:nth-child(2) { font-size: 4rem; line-height: 5.3rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_others .class-contents__item-graph span:nth-child(2) { font-size: 2.3rem; line-height: 3rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_others .class-contents__item-graph span.jp { font-size: 2.4rem; line-height: 3.5rem; letter-spacing: 0.1em; margin-left: 0.2rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_others .class-contents__item-graph span.jp { font-size: 1.4rem; line-height: 2rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_others .class_others-ttl { width: 13rem; color: #A8A8A8; font-size: 1.8rem; line-height: 2.6rem; font-weight: 700; letter-spacing: 0.1em; text-align: center; margin-bottom: 0.5rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_others .class_others-ttl { width: 7.728rem; font-size: 1.4rem; line-height: 2rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_others .class-contents__item-class { display: block; width: 13rem; height: 2.8rem; background-color: #A8A8A8; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.class .class-contents .class-contents__item.class_others .class-contents__item-class { width: 7.728rem; height: 1.165rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how { height: -moz-fit-content; height: fit-content; padding-bottom: 5.84rem; position: relative; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how { padding: 3rem 1rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents { width: 34.85rem; height: 31.157rem; background-image: url(../images/about-au/about-au_numbers_how_bg.svg); background-repeat: no-repeat; background-size: cover; margin: 4.71rem 15.8rem 0 14.75rem; position: relative; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents { width: 100%; height: 48rem; background-image: url(../images/about-au/about-au_numbers_how_bg_sp.svg); margin: 3.5rem auto 0; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_fellow p { color: #EB6605; font-size: 2rem; line-height: 3.1rem; letter-spacing: 0.1em; font-weight: 700; position: absolute; top: -2.334rem; right: -10.9rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_fellow p { top: 1.3rem; right: 1rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_fellow .how-contents__item-graph { color: #fff; font-size: 5.2rem; line-height: 6.8rem; font-weight: 700; position: absolute; top: 10.82rem; right: 6.5rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_fellow .how-contents__item-graph { top: 18.87rem; right: 4.76rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_fellow .how-contents__item-graph span.jp { font-size: 1.6rem; line-height: 2.4rem; letter-spacing: 0.1em; margin-left: 0.54rem; } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_same p { color: #EB9305; font-size: 2rem; line-height: 3.1rem; letter-spacing: 0.1em; font-weight: 700; position: absolute; bottom: 2.76rem; left: -10.05rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_same p { bottom: 0.06rem; left: 2.5rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_same .how-contents__item-graph { color: #fff; font-size: 5.2rem; line-height: 6.8rem; font-weight: 700; position: absolute; bottom: 6.51rem; left: 4.57rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_same .how-contents__item-graph { bottom: 15.31rem; left: 5.22rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_same .how-contents__item-graph span:nth-child(2) { font-size: 3.3rem; line-height: 4.4rem; } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_same .how-contents__item-graph span.jp { font-size: 1.6rem; line-height: 2.4rem; letter-spacing: 0.1em; margin-left: 0.34rem; } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_alone p { color: #A8A8A8; font-size: 1.6rem; line-height: 2.4rem; letter-spacing: 0.1em; font-weight: 700; position: absolute; top: -3.03rem; left: -7.45rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_alone p { top: 2.66rem; left: 0; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_alone .how-contents__item-graph { color: #fff; font-size: 3.8rem; line-height: 5rem; font-weight: 700; position: absolute; top: 4.21rem; left: 5.68rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_alone .how-contents__item-graph { top: 12.25rem; left: 7.33rem; } } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_alone .how-contents__item-graph span:nth-child(2) { font-size: 2.4rem; line-height: 3.2rem; } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how .how-contents .how-contents__item.how_alone .how-contents__item-graph span.jp { font-size: 1.1rem; line-height: 1.6rem; letter-spacing: 0.1em; margin-left: 0.21rem; } .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how > img { width: 16.8rem; position: absolute; bottom: 3.9rem; right: 7.1rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col2 .numbers-col2__wrapper .numbers-col2__item.how > img { bottom: 3.09rem; right: 1rem; } } .p-about_au__numbers .numbers-col3 { display: flex; gap: 2rem; margin-bottom: 2rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 { flex-direction: column; row-gap: 3rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item { background-color: #fff; border-radius: 2.6rem; padding: 3rem 0 4rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging { width: 64.6rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging { width: 100%; padding: 3rem 1rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents { display: grid; row-gap: 2.1rem; width: 52rem; margin: 4.94rem auto 0; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents { width: 100%; row-gap: 1.6rem; margin: 2.3rem auto 0; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_thanks img { width: 16.7rem; margin: 0 auto 0.34rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_thanks img { width: 11.433rem; margin: 0 auto 0.43rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_thanks .challenging-contents__item-ttl { color: #E65000; font-size: 3.4rem; line-height: 4.9rem; font-weight: 700; letter-spacing: 0.09em; text-align: center; margin-bottom: 1.7rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_thanks .challenging-contents__item-ttl { font-size: 1.8rem; line-height: 2.6rem; margin-bottom: 1rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_thanks .challenging-contents__item-ttl span { display: inline-block; font-size: 2rem; line-height: 2.9rem; font-weight: 500; margin-top: 0.6rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_thanks .challenging-contents__item-ttl span { font-size: 1.2rem; line-height: 1.7rem; margin-top: 0.5rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_thanks .challenging-contents__item-graph { display: flex; justify-content: center; align-items: baseline; width: 40.5rem; height: 14.4rem; color: #fff; font-size: 7.3rem; line-height: 9.6rem; font-weight: 700; background-color: #E65000; padding-top: 2.4rem; margin-left: 5rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_thanks .challenging-contents__item-graph { width: 28.9rem; height: 10.3rem; font-size: 5rem; line-height: 6.6rem; padding-top: 1.73rem; margin-left: 0; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_thanks .challenging-contents__item-graph span:first-child { letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_thanks .challenging-contents__item-graph span:first-child { font-size: 4.9rem; line-height: 6.6rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_thanks .challenging-contents__item-graph span:nth-child(2) { font-size: 4.9rem; line-height: 6.4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_thanks .challenging-contents__item-graph span:nth-child(2) { font-size: 3.2rem; line-height: 4.3rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_thanks .challenging-contents__item-graph span.jp { font-size: 2.9rem; line-height: 4.2rem; letter-spacing: 0.1em; margin-left: 0.35rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_thanks .challenging-contents__item-graph span.jp { font-size: 1.9rem; line-height: 2.7rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_suggestion { display: flex; align-items: center; gap: 2rem; margin-left: 5rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_suggestion { gap: 1.5rem; margin-left: 0; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_suggestion .challenging-contents__item-graph { display: flex; justify-content: center; align-items: baseline; width: 22.1rem; height: 14.4rem; color: #fff; font-size: 6rem; line-height: 7.9rem; font-weight: 700; background-color: #EA831C; padding-top: 3.25rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_suggestion .challenging-contents__item-graph { width: 15.8rem; height: 10.3rem; font-size: 4.1rem; line-height: 5.4rem; padding-top: 2.26rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_suggestion .challenging-contents__item-graph span:first-child { letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_suggestion .challenging-contents__item-graph span:first-child { font-size: 3.9rem; line-height: 5.2rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_suggestion .challenging-contents__item-graph span:nth-child(2) { font-size: 4rem; line-height: 5.3rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_suggestion .challenging-contents__item-graph span:nth-child(2) { font-size: 2.7rem; line-height: 3.5rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_suggestion .challenging-contents__item-graph span.jp { font-size: 2.4rem; line-height: 3.5rem; letter-spacing: 0.1em; margin-left: 0.61rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_suggestion .challenging-contents__item-graph span.jp { font-size: 1.5rem; line-height: 2.1rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_suggestion .challenging-contents__item-ttl { color: #EA831C; font-size: 2rem; line-height: 3rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_suggestion .challenging-contents__item-ttl { font-size: 1.6rem; line-height: 2.4rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_achievement { display: flex; align-items: center; gap: 2rem; margin-left: 5rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_achievement { gap: 1.5rem; margin-left: 0; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_achievement .challenging-contents__item-graph { display: flex; justify-content: center; align-items: baseline; width: 18.2rem; height: 14.4rem; color: #fff; font-size: 4.9rem; line-height: 6.4rem; font-weight: 700; background-color: #EBA405; padding-top: 4.2rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_achievement .challenging-contents__item-graph { width: 13rem; height: 10.3rem; font-size: 3.3rem; line-height: 4.4rem; padding-top: 2.99rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_achievement .challenging-contents__item-graph span:first-child { letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_achievement .challenging-contents__item-graph span:first-child { font-size: 3.2rem; line-height: 4.3rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_achievement .challenging-contents__item-graph span:nth-child(2) { font-size: 3.3rem; line-height: 4.4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_achievement .challenging-contents__item-graph span:nth-child(2) { font-size: 2.1rem; line-height: 2.8rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_achievement .challenging-contents__item-graph span.jp { font-size: 2rem; line-height: 2.9rem; letter-spacing: 0.1em; margin-left: 0.43rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_achievement .challenging-contents__item-graph span.jp { font-size: 1.3rem; line-height: 1.9rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_achievement .challenging-contents__item-ttl { color: #EA831C; font-size: 1.8rem; line-height: 2.5rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging .challenging-contents .challenging-contents__item.challenging_achievement .challenging-contents__item-ttl { font-size: 1.6rem; line-height: 2.4rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging > img { width: 28.2rem; margin: -4rem auto 0; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__item.challenging > img { margin: 1.66rem auto 0; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper { display: grid; row-gap: 2rem; width: 53.4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper { width: 100%; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent { height: -moz-fit-content; height: fit-content; padding-bottom: 3.8rem; position: relative; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent { padding: 3rem 1rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-txt { color: #EB8A05; font-size: 1.3rem; line-height: 1.9rem; font-weight: 700; letter-spacing: 0.1em; text-align: center; margin-top: 1rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-txt { margin-top: 1.5rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents { width: 32.29rem; height: 31.07rem; background-image: url(../images/about-au/about-au_numbers_independent_bg.svg); background-repeat: no-repeat; background-size: cover; margin: 3.93rem 9.45rem 0 11.66rem; position: relative; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents { width: 100%; height: 56.5rem; background-image: url(../images/about-au/about-au_numbers_independent_bg_sp.svg); margin: 3rem auto 0; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_within3 p { color: #EB6605; text-align: right; position: absolute; top: -1.23rem; right: -6.23rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_within3 p { top: 0.7rem; right: 3.55rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_within3 p::before { content: ""; width: 7.843rem; height: 5.523rem; background-image: url(../images/about-au/about-au_numbers_independent_within3_deco.svg); background-repeat: no-repeat; background-size: cover; position: absolute; top: -0.86rem; left: -2.04rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_within3 p::before { left: -2.09rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_within3 p span { font-weight: 700; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_within3 p span.roboto { font-size: 6.5rem; line-height: 8.6rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_within3 p span:nth-child(2) { font-size: 1.8rem; line-height: 2.6rem; letter-spacing: 0.1em; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_within3 p span:nth-child(3) { font-size: 2.4rem; line-height: 3.5rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_within3 p span:last-child { display: block; font-size: 1.7rem; line-height: 2.5rem; letter-spacing: 0.1em; margin-top: -1.1rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_within3 .independent-contents__item-graph { color: #fff; font-size: 5.2rem; line-height: 6.8rem; font-weight: 700; letter-spacing: 0.05em; position: absolute; top: 9.64rem; right: 3.23rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_within3 .independent-contents__item-graph { top: 20.74rem; right: 5.25rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_within3 .independent-contents__item-graph span.jp { font-size: 1.6rem; line-height: 2.4rem; letter-spacing: 0.1em; margin-left: 0.54rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_4to6 p { color: #EB9305; text-align: right; position: absolute; bottom: 0.52rem; left: -8.26rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_4to6 p { bottom: 2.33rem; left: 4.37rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_4to6 p::before { content: ""; width: 10.753rem; height: 9.363rem; background-image: url(../images/about-au/about-au_numbers_independent_4to6_deco.svg); background-repeat: no-repeat; background-size: cover; position: absolute; top: -0.65rem; left: -0.6rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_4to6 p span { letter-spacing: 0.1em; font-weight: 700; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_4to6 p span.roboto { font-size: 4.6rem; line-height: 6rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_4to6 p span.roboto span { font-size: 2.6rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_4to6 p span:nth-child(2) { font-size: 1.8rem; line-height: 2.6rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_4to6 p span:last-child { display: inline-block; font-size: 2.5rem; line-height: 3.6rem; margin-top: -1.22rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_4to6 .independent-contents__item-graph { color: #fff; font-size: 5.2rem; line-height: 6.8rem; font-weight: 700; letter-spacing: 0.05em; position: absolute; bottom: 6.69rem; left: 5.41rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_4to6 .independent-contents__item-graph { bottom: 21.02rem; left: 5.09rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_4to6 .independent-contents__item-graph span:nth-child(2) { font-size: 3.3rem; line-height: 4.4rem; letter-spacing: 0.1em; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_4to6 .independent-contents__item-graph span.jp { font-size: 1.6rem; line-height: 2.4rem; letter-spacing: 0.1em; margin-left: 0.34rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_more p { color: #EBA405; position: absolute; top: -0.5rem; left: -6.16rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_more p { top: 6.4rem; left: 1.21rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_more p span { font-weight: 700; letter-spacing: 0.1em; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_more p span.roboto { font-size: 4rem; line-height: 5.3rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_more p span:nth-child(2) { display: inline-block; font-size: 1.2rem; line-height: 1.7rem; margin-left: -0.4rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_more p span:nth-child(3) { font-size: 1.6rem; line-height: 2.4rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_more p span:last-child { font-size: 1.2rem; line-height: 1.7rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_more .independent-contents__item-graph { color: #fff; font-size: 3.8rem; line-height: 5rem; font-weight: 700; letter-spacing: 0.05em; position: absolute; top: 5.92rem; left: 5.41rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_more .independent-contents__item-graph { top: 17.02rem; left: 5.09rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_more .independent-contents__item-graph span:nth-child(2) { font-size: 2.4rem; line-height: 3.2rem; letter-spacing: 0.1em; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent .independent-contents .independent-contents__item.independent_more .independent-contents__item-graph span.jp { font-size: 1.1rem; line-height: 1.6rem; letter-spacing: 0.1em; margin-left: 0.21rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent > img { width: 13.7rem; position: absolute; bottom: 3.7rem; right: 4.3rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.independent > img { bottom: 3.62rem; right: 1.69rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager { height: -moz-fit-content; height: fit-content; padding-bottom: 12.7rem; position: relative; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager { padding: 3rem 1rem 15.33rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager .manager-contents { width: 29.152rem; height: 15.769rem; margin: 13.23rem 16.52rem 0 7.73rem; position: relative; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager .manager-contents { margin: 15.31rem 4.35rem 0 0; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager .manager-contents::before { content: ""; width: 17.367rem; height: 12.722rem; background-color: #FFF4E5; border-radius: 50%; transform: rotate(-45deg); position: absolute; bottom: -7rem; right: -10.1rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager .manager-contents::before { right: -4.5rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager .manager-contents::after { content: ""; position: absolute; inset: 0; background-image: url(../images/about-au/about-au_numbers_manager_bg.svg); background-repeat: no-repeat; background-size: cover; z-index: 0; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager .manager-contents .manager-contents__item p { display: flex; position: absolute; top: -10.68rem; right: 2.55rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager .manager-contents .manager-contents__item p { top: -10.71rem; right: 3.52rem; } } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager .manager-contents .manager-contents__item p::before { content: ""; width: 5.006rem; height: 5.132rem; background-image: url(../images/about-au/about-au_numbers_manager_txt_deco.svg); background-repeat: no-repeat; background-size: cover; position: absolute; top: -0.29rem; right: 1.18rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager .manager-contents .manager-contents__item p span { color: #EB6605; font-weight: 700; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager .manager-contents .manager-contents__item p span:first-child { font-size: 2.9rem; line-height: 4.2rem; letter-spacing: 0.1em; padding-top: 3.19rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager .manager-contents .manager-contents__item p span.roboto { font-size: 15.3rem; line-height: 20.1rem; margin-left: -0.37rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager .manager-contents .manager-contents__item p span:last-child { align-self: flex-end; font-size: 2.6rem; line-height: 3.7rem; letter-spacing: 0.1em; margin-left: 0.94rem; padding-bottom: 4.5rem; } .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager > img { width: 18.606rem; position: absolute; bottom: 7.29rem; right: 7.87rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col3 .numbers-col3__wrapper .numbers-col3__item.manager > img { bottom: 9.33rem; right: 2rem; } } .p-about_au__numbers .numbers-col4 { display: flex; gap: 2rem; margin-bottom: 1.7rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 { flex-direction: column; row-gap: 3rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item { background-color: #fff; border-radius: 2.6rem; padding: 3rem 0 3.2rem; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime { width: 46.3rem; padding-bottom: 5.95rem; position: relative; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime { width: 100%; padding: 3rem 1rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents { width: 30.1rem; height: 31.255rem; background-image: url(../images/about-au/about-au_numbers_overtime_bg.svg); background-repeat: no-repeat; background-size: cover; margin: 4.49rem 8.25rem 0 7.95rem; position: relative; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents { width: 100%; height: 47.8rem; background-image: url(../images/about-au/about-au_numbers_overtime_bg_sp.svg); margin: 1.8rem auto 0; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_10hours p { color: #EB6605; text-align: right; position: absolute; top: -3.6rem; right: -6.23rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_10hours p { top: 1.52rem; right: 1.62rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_10hours p span { font-weight: 700; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_10hours p span.roboto { font-size: 5.2rem; line-height: 6.8rem; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_10hours p span:nth-child(2) { font-size: 2.8rem; line-height: 4rem; letter-spacing: 0.1em; margin-left: 0.2rem; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_10hours p span:nth-child(3) { font-size: 1.5rem; line-height: 2.1rem; letter-spacing: 0.1em; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_10hours .overtime-contents__item-graph { color: #fff; font-size: 4.6rem; line-height: 6rem; font-weight: 700; letter-spacing: 0.05em; position: absolute; top: 10.28rem; right: 1.4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_10hours .overtime-contents__item-graph { top: 17.07rem; right: 2.85rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_10hours .overtime-contents__item-graph span:nth-child(2) { font-size: 3rem; line-height: 3.9rem; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_10hours .overtime-contents__item-graph span.jp { font-size: 1.4rem; line-height: 2rem; letter-spacing: 0.1em; margin-left: 0.36rem; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_20hours p { color: #EB9305; text-align: right; position: absolute; bottom: -2.45rem; left: -2.35rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_20hours p { bottom: 4.3rem; left: 0.4rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_20hours p span { font-weight: 700; text-align: left; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_20hours p span.roboto { font-size: 3.2rem; line-height: 4.3rem; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_20hours p span:last-child { display: block; font-size: 1.2rem; line-height: 1.7rem; letter-spacing: 0.1em; margin-top: -0.6rem; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_20hours .overtime-contents__item-graph { color: #fff; font-size: 4.6rem; line-height: 6rem; font-weight: 700; letter-spacing: 0.05em; position: absolute; bottom: 5.07rem; left: 9.23rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_20hours .overtime-contents__item-graph { bottom: 14.82rem; left: 11.18rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_20hours .overtime-contents__item-graph span:nth-child(2) { font-size: 3rem; line-height: 3.9rem; letter-spacing: 0.1em; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_20hours .overtime-contents__item-graph span.jp { font-size: 1.4rem; line-height: 2rem; letter-spacing: 0.1em; margin-left: 0.36rem; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_30hours p { color: #EBA405; text-align: right; position: absolute; top: 3.7rem; left: -3.85rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_30hours p { top: 7.24rem; left: 0.4rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_30hours p span { letter-spacing: 0.1em; font-weight: 700; text-align: left; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_30hours p span.roboto { font-size: 2.3rem; line-height: 3rem; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_30hours p span:last-child { display: block; font-size: 1.2rem; line-height: 1.7rem; letter-spacing: 0.1em; margin-top: -0.4rem; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_30hours .overtime-contents__item-graph { color: #fff; font-size: 3rem; line-height: 3.9rem; font-weight: 700; letter-spacing: 0.05em; position: absolute; top: 12.41rem; left: 3.65rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_30hours .overtime-contents__item-graph { top: 19.2rem; left: 5.59rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_30hours .overtime-contents__item-graph span:first-child { font-size: 2.9rem; line-height: 3.8rem; letter-spacing: 0.05em; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_30hours .overtime-contents__item-graph span:nth-child(2) { font-size: 1.8rem; line-height: 2.4rem; letter-spacing: 0.1em; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_30hours .overtime-contents__item-graph span.jp { font-size: 0.8rem; line-height: 1.1rem; letter-spacing: 0.1em; margin-left: 0.22rem; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_more p { color: #A8A8A8; position: absolute; top: -2.8rem; left: 1.41rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_more p { top: 2.47rem; left: 5.35rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_more p span { font-weight: 700; letter-spacing: 0.1em; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_more p span.roboto { font-size: 2.1rem; line-height: 2.8rem; letter-spacing: 0.01em; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_more p span:last-child { font-size: 1.2rem; line-height: 1.7rem; letter-spacing: 0.1em; margin-left: 0.3rem; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_more .overtime-contents__item-graph { color: #fff; font-size: 3rem; line-height: 3.9rem; font-weight: 700; letter-spacing: -0.05em; position: absolute; top: 4.41rem; left: 8.96rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_more .overtime-contents__item-graph { top: 11.2rem; left: 10.9rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_more .overtime-contents__item-graph span:first-child { font-size: 2.9rem; line-height: 3.8rem; letter-spacing: 0.05em; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_more .overtime-contents__item-graph span:nth-child(2) { font-size: 1.8rem; line-height: 2.4rem; letter-spacing: 0.1em; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime .overtime-contents .overtime-contents__item.overtime_more .overtime-contents__item-graph span.jp { font-size: 0.8rem; line-height: 1.1rem; letter-spacing: 0.1em; margin-left: 0.24rem; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime > img { width: 13.9rem; position: absolute; bottom: 3.2rem; right: 3.9rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.overtime > img { width: 15.9rem; bottom: 6.2rem; right: 0.9rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private { width: 71.7rem; padding-bottom: 3rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private { width: 100%; padding: 3rem 1rem 4.29rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents { margin: 2.44rem 7.55rem 0 9.45rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents { margin: 2.68rem 0 0; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__txt { width: -moz-fit-content; width: fit-content; color: #E65000; font-size: 2.1rem; line-height: 3.2rem; font-weight: 700; text-align: center; margin: 0 0 1.54rem 5.39rem; position: relative; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__txt { font-size: 1.3rem; line-height: 2rem; margin: 0 0 0.6rem 4.84rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__txt::before { content: ""; width: 2.3rem; height: 5.6rem; border-left: 0.3rem solid #E65000; transform: rotate(-20deg); position: absolute; top: 0.5rem; left: -2rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__txt::before { width: 2.3rem; height: 3.22rem; transform: rotate(-30deg); top: 0; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__txt::after { content: ""; width: 2.3rem; height: 5.6rem; border-left: 0.3rem solid #E65000; transform: rotate(20deg); position: absolute; top: 1rem; right: -4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__txt::after { width: 2.3rem; height: 3.22rem; transform: rotate(30deg); top: 1rem; right: -3.5rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item { display: flex; height: 12.3rem; margin-bottom: 0.52rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item { height: 7.083rem; margin-bottom: 3.78rem; margin-left: 1.59rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level1 { display: flex; justify-content: center; align-items: baseline; width: 18.3rem; color: #fff; font-size: 5.3rem; line-height: 7rem; font-weight: 700; background-color: #EB6605; padding-top: 2.32rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level1 { width: 10.538rem; font-size: 4.2rem; line-height: 5.5rem; padding-top: 0.61rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level1 span:first-child { font-size: 5.1rem; line-height: 6.7rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level1 span:first-child { font-size: 3.2rem; line-height: 4.3rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level1 span:nth-child(2) { font-size: 3.5rem; line-height: 4.6rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level1 span:nth-child(2) { font-size: 2.5rem; line-height: 3.3rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level1 span.jp { font-size: 2.1rem; line-height: 3rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level1 span.jp { font-size: 1.2rem; line-height: 1.7rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level2 { display: flex; justify-content: center; align-items: baseline; width: 10.8rem; color: #fff; font-size: 4.4rem; line-height: 5.8rem; font-weight: 700; background-color: #EB9305; padding-top: 3.02rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level2 { width: 6.219rem; font-size: 2.9rem; line-height: 3.8rem; padding-top: 2.09rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level2 span:first-child { font-size: 4.5rem; line-height: 5.9rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level2 span:first-child { font-size: 1.5rem; line-height: 2rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level2 span:nth-child(2) { font-size: 3.1rem; line-height: 4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level2 span:nth-child(2) { font-size: 1.4rem; line-height: 1.9rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level2 span.jp { font-size: 1.5rem; line-height: 2.1rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level2 span.jp { font-size: 0.5rem; line-height: 0.7rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level3 { display: flex; justify-content: center; align-items: baseline; width: 13.2rem; color: #fff; font-size: 3rem; line-height: 3.9rem; font-weight: 700; background-color: #EBBF05; padding-top: 4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level3 { width: 7.601rem; font-size: 1.8rem; line-height: 2.4rem; padding-top: 3.09rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level3 span:first-child { font-size: 3.1rem; line-height: 4rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level3 span:first-child { font-size: 1.5rem; line-height: 2rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level3 span:nth-child(2) { font-size: 2.1rem; line-height: 2.8rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level3 span:nth-child(2) { font-size: 1.1rem; line-height: 1.5rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level3 span.jp { font-size: 1.1rem; line-height: 1.7rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level3 span.jp { font-size: 0.5rem; line-height: 0.7rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level4 { display: flex; justify-content: center; align-items: baseline; width: 10.8rem; color: #fff; font-size: 2.8rem; line-height: 3.7rem; font-weight: 700; background-color: #C6C6C6; padding-top: 4.12rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level4 { width: 6.219rem; font-size: 1.7rem; line-height: 2.3rem; padding-top: 3.19rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level4 span:first-child { font-size: 2.9rem; line-height: 3.8rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level4 span:first-child { font-size: 1.2rem; line-height: 1.6rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level4 span:nth-child(2) { font-size: 1.9rem; line-height: 2.5rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level4 span:nth-child(2) { font-size: 0.9rem; line-height: 1.1rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level4 span.jp { font-size: 1.1rem; line-height: 1.6rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level4 span.jp { font-size: 0.7rem; line-height: 1rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level5 { width: 1.5rem; background-color: #A8A8A8; position: relative; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level5 { width: 0.864rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level5::before { content: ""; width: 0.6rem; height: 3.2rem; border-left: 0.1rem solid #050505; transform: rotate(15deg); position: absolute; bottom: -1.8rem; right: 1rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level5::before { width: 0.646rem; height: 1.61rem; bottom: -0.8rem; right: 0.2rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level5 .level5-percent { display: flex; align-items: baseline; color: #A8A8A8; font-size: 2.5rem; line-height: 3.3rem; font-weight: 700; position: absolute; bottom: -4.3rem; right: -0.2rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level5 .level5-percent { font-size: 2rem; line-height: 2.6rem; } } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level5 .level5-percent span:first-child { font-size: 0.8rem; line-height: 1rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level5 .level5-percent span:nth-child(2) { font-size: 1.6rem; line-height: 2.1rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level5 .level5-percent span:nth-child(2) { font-size: 0.7rem; line-height: 0.9rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level5 .level5-percent span.jp { font-size: 1.2rem; line-height: 1.7rem; letter-spacing: 0.1em; margin-left: 0.3rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__item .private-contents__item-graph.level5 .level5-percent span.jp { font-size: 0.6rem; line-height: 0.9rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column { display: flex; gap: 4.73rem; margin-left: 6.65rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column { gap: 3.18rem; margin-left: 0.7rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column img { width: 15.6rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column img { width: 11.95rem; height: 11.873rem; margin-top: 1.1rem; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line { display: grid; row-gap: 0.44rem; margin-top: 2.66rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line { margin-top: 0; } } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line .line-level1, .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line .line-level2, .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line .line-level3, .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line .line-level4, .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line .line-level5 { display: flex; align-items: center; gap: 0.7rem; line-height: 2.1rem; font-weight: 700; letter-spacing: 0.1em; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line .line-level1 .line-level__color, .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line .line-level2 .line-level__color, .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line .line-level3 .line-level__color, .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line .line-level4 .line-level__color, .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line .line-level5 .line-level__color { width: 1.743rem; height: 1.743rem; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line .line-level1 .line-level__color { background-color: #E65000; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line .line-level2 .line-level__color { background-color: #EA831C; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line .line-level3 .line-level__color { background-color: #EBBF05; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line .line-level4 .line-level__color { background-color: #C6C6C6; } .p-about_au__numbers .numbers-col4 .numbers-col4__item.private .private-contents .private-contents__column .private-contents__line .line-level5 .line-level__color { background-color: #A8A8A8; } .p-about_au__numbers .numbers-col5 .numbers-col5__item { background-color: #fff; border-radius: 2.6rem; padding: 3rem 0 3.76rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item { padding: 3rem 1rem 5.7rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave { width: 100%; position: relative; } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave > p { color: #EB8A05; font-size: 1.3rem; line-height: 1.9rem; font-weight: 700; letter-spacing: 0.1em; text-align: center; margin: 1rem auto 3.14rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave > p { margin: 1.5rem auto 1.6rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__txt { width: -moz-fit-content; width: fit-content; color: #E65000; font-size: 2.1rem; line-height: 3.2rem; font-weight: 700; text-align: center; margin: 0 0 1.54rem 33.97rem; position: relative; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__txt { font-size: 1.3rem; line-height: 2rem; margin: 0 0 0.6rem 4.84rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__txt::before { content: ""; width: 2.3rem; height: 5.6rem; border-left: 0.3rem solid #E65000; transform: rotate(-20deg); position: absolute; top: 0.5rem; left: -2rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__txt::before { width: 2.3rem; height: 3.22rem; transform: rotate(-30deg); top: 0; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__txt::after { content: ""; width: 2.3rem; height: 5.6rem; border-left: 0.3rem solid #E65000; transform: rotate(20deg); position: absolute; top: 1rem; right: -4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__txt::after { width: 2.3rem; height: 3.22rem; transform: rotate(30deg); top: 1rem; right: -3.5rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents { display: flex; justify-content: center; align-items: center; margin: 0 auto 1.12rem; padding: 0 2.6rem 0 3.6rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents { flex-direction: column-reverse; align-items: inherit; margin: 0 auto; padding: 0; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item { display: flex; width: 82.2rem; height: 16.314rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item { width: 100%; height: 6.477rem; margin-left: 0.86rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level1 { display: flex; justify-content: center; align-items: baseline; width: 24.703rem; color: #fff; font-size: 6.6rem; line-height: 8.3rem; font-weight: 700; background-color: #EB6605; padding-top: 3.8rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level1 { width: 9.808rem; font-size: 3.8rem; line-height: 5rem; padding-top: 0.72rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level1 span:first-child { font-size: 6.4rem; line-height: 8.4rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level1 span:first-child { font-size: 2.9rem; line-height: 3.8rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level1 span:nth-child(2) { font-size: 4.4rem; line-height: 5.8rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level1 span:nth-child(2) { font-size: 2.5rem; line-height: 3.3rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level1 span.jp { font-size: 2.7rem; line-height: 3.9rem; letter-spacing: 0.1em; margin-left: 0.3rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level1 span.jp { font-size: 1.2rem; line-height: 1.7rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level2 { display: flex; justify-content: center; align-items: baseline; width: 19.7rem; color: #fff; font-size: 6.6rem; line-height: 8.7rem; font-weight: 700; background-color: #EB9305; padding-top: 3.8rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level2 { width: 7.822rem; font-size: 3.2rem; line-height: 4.3rem; padding-top: 1.07rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level2 span:first-child { font-size: 6.4rem; line-height: 8.4rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level2 span:first-child { font-size: 2.5rem; line-height: 3.3rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level2 span:nth-child(2) { font-size: 4.4rem; line-height: 5.8rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level2 span:nth-child(2) { font-size: 1.5rem; line-height: 2rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level2 span.jp { font-size: 2.7rem; line-height: 3.9rem; letter-spacing: 0.1em; margin-left: 0.3rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level2 span.jp { font-size: 0.8rem; line-height: 1.1rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level3 { display: flex; justify-content: center; align-items: baseline; width: 21.447rem; color: #fff; font-size: 3.7rem; line-height: 4.9rem; font-weight: 700; background-color: #EBBF05; padding-top: 5.5rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level3 { width: 8.496rem; font-size: 1.9rem; line-height: 2.5rem; padding-top: 2.28rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level3 span:first-child { font-size: 3.6rem; line-height: 4.8rem; letter-spacing: 0.1em; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level3 span:first-child { font-size: 1.2rem; line-height: 1.6rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level3 span:nth-child(2) { font-size: 2.5rem; line-height: 3.3rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level3 span:nth-child(2) { font-size: 1.3rem; line-height: 1.8rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level3 span.jp { font-size: 1.5rem; line-height: 2.1rem; letter-spacing: 0.1em; margin-left: 0.36rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level3 span.jp { font-size: 0.5rem; line-height: 0.7rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level4 { display: flex; justify-content: center; align-items: baseline; width: 8.55rem; color: #fff; font-size: 2rem; line-height: 2.6rem; font-weight: 700; background-color: #C6C6C6; padding-top: 6.8rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level4 { width: 3.395rem; font-size: 1.2rem; line-height: 1.6rem; letter-spacing: 0.1em; padding-top: 2.82rem; } } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level4 span:nth-child(2) { font-size: 0.5rem; line-height: 0.6rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level4 span:nth-child(2) { font-size: 1.5rem; line-height: 2rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level4 span:nth-child(2) { font-size: 0.6rem; line-height: 0.8rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level4 span.jp { font-size: 1.1rem; line-height: 1.6rem; letter-spacing: 0.1em; margin-left: 0.2rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level4 span.jp { font-size: 0.3rem; line-height: 0.4rem; margin-left: 0.12rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level5 { display: flex; justify-content: center; align-items: baseline; width: 7.8rem; color: #fff; font-size: 2rem; line-height: 2.6rem; font-weight: 700; background-color: #A8A8A8; padding-top: 6.8rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level5 { width: 3.097rem; font-size: 1.1rem; line-height: 1.5rem; letter-spacing: 0.1em; padding-top: 2.93rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level5 span.jp { font-size: 1.1rem; line-height: 1.6rem; letter-spacing: 0.1em; margin-left: 0.4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__item .leave-contents__item-graph.level5 span.jp { font-size: 0.3rem; line-height: 0.4rem; margin-left: 0; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__img1 { width: 13.6rem; margin-right: 2.77rem; margin-top: -5rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__img1 { width: 10.6rem; margin: 3.92rem 0 0 2.3rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__img2 { width: 13.1rem; margin-left: 2.13rem; margin-top: -4rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__img2 { display: none; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line { display: flex; justify-content: center; gap: 1.96rem; } @media screen and (max-width: 768px) { .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line { flex-direction: column; row-gap: 0.44rem; position: absolute; bottom: 5.7rem; right: 1rem; } } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line .line-level1, .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line .line-level2, .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line .line-level3, .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line .line-level4, .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line .line-level5 { display: flex; align-items: center; gap: 0.7rem; line-height: 2.1rem; font-weight: 700; letter-spacing: 0.1em; } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line .line-level1 .line-level__color, .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line .line-level2 .line-level__color, .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line .line-level3 .line-level__color, .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line .line-level4 .line-level__color, .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line .line-level5 .line-level__color { width: 1.743rem; height: 1.743rem; } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line .line-level1 .line-level__color { background-color: #E65000; } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line .line-level2 .line-level__color { background-color: #EA831C; } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line .line-level3 .line-level__color { background-color: #EBBF05; } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line .line-level4 .line-level__color { background-color: #C6C6C6; } .p-about_au__numbers .numbers-col5 .numbers-col5__item.leave .leave-contents__line .line-level5 .line-level__color { background-color: #A8A8A8; } .p-about_au + .l-footer::before { content: none; } /*------------------------------- p-about-work -------------------------------*/ :root { --about-work__content-inner: 12.1rem; } .p-about-work { padding-bottom: 18rem; } @media screen and (max-width: 768px) { .p-about-work { padding-bottom: 8rem; } } .p-about-work__kv.p-lower-fv { background-color: rgba(235, 147, 5, 0.07); border-radius: 0; overflow-x: clip; } .p-about-work__kv .p-lower-fv__catch { width: 73.962rem; bottom: 26.3rem; } .p-about-work__content-inner { padding-inline: var(--about-work__content-inner); display: grid; grid-template-columns: 17.9715302491% 82.0284697509%; position: relative; } @media screen and (max-width: 768px) { .p-about-work__content-inner { padding-inline: 0; grid-template-columns: 1fr; } } .p-about-work__content-main { margin-left: auto; width: 100%; } @media screen and (max-width: 768px) { .p-about-work__content-main { width: 100%; } } .p-about-work__job-description { scroll-margin-top: 24rem; padding-block: 0 10rem; padding-right: 1.8rem; position: relative; } @media screen and (max-width: 768px) { .p-about-work__job-description { padding-block: 0.45rem 9rem; padding-right: 0; } } .p-about-work__job-description::before { content: ""; width: 100vw; height: 100%; position: absolute; top: 0; left: calc(-17.8761061947% - 15.8rem); z-index: -1; background-color: rgba(235, 147, 5, 0.07); border-radius: 0 0 13rem 13rem; } @media screen and (max-width: 768px) { .p-about-work__job-description::before { left: 50%; transform: translateX(-50%); border-radius: 0 0 5rem 5rem; } } /*------------------------------- p-about-work__index -------------------------------*/ .p-about-work__index-wrap { width: 100%; position: relative; } @media screen and (max-width: 768px) { .p-about-work__index-wrap { display: none; } } .p-about-work__index { padding-right: 6.3rem; color: #E65000; position: sticky; top: 24rem; z-index: 10; } .p-about-work__index-title { padding-bottom: 1.4rem; font-size: 3.6rem; line-height: 4.8rem; border-bottom: 0.1rem solid #E65000; } .p-about-work__index-list { margin-top: 1.5rem; } .p-about-work__index-item a { padding-block: 1rem; font-size: 1.3rem; line-height: 3rem; letter-spacing: 0.05em; font-weight: 500; } /*------------------------------- p-job-description -------------------------------*/ .p-job-description__inner { padding-inline: 2.2rem; } .p-job-description__title { text-align: center; } .p-job-description__read { margin-top: 9rem; font-size: 2rem; line-height: 1.5; letter-spacing: 0.1em; font-weight: 700; text-align: center; } @media screen and (max-width: 768px) { .p-job-description__read { font-size: 1.5rem; margin-top: 3rem; } } .p-job-description__list { margin-top: 6rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.7rem; } @media screen and (max-width: 768px) { .p-job-description__list { margin-top: 3rem; grid-template-columns: repeat(1, 1fr); gap: 2rem; } } .p-job-description__item { padding-block: 3.5rem 6.5rem; padding-inline: 3rem; background-color: #fff; border-radius: 3rem; box-shadow: 0 0 1rem rgba(235, 85, 5, 0.24); } @media screen and (max-width: 768px) { .p-job-description__item { padding-block: 3.5rem 6rem; padding-left: 2.2rem; padding-right: 2.2rem; } } .p-job-description__item-img { margin-inline: auto; width: 21.7rem; } .p-job-description__item-img img { width: 21.7rem; height: 21.7rem; -o-object-fit: contain; object-fit: contain; border-radius: 21.7rem; } .p-job-description__item-title { margin-top: 3rem; font-size: 1.6rem; line-height: 1.625; letter-spacing: 0.04em; font-weight: 700; color: #E65000; text-align: center; } .p-job-description__item-text { margin-top: 3rem; padding-inline: 0.7rem; font-size: 1.5rem; line-height: 2.1428571429; letter-spacing: 0.1em; font-weight: 500; color: #050505; text-align: justify; } /*------------------------------- p-career-path -------------------------------*/ .p-career-path { scroll-margin-top: 13rem; margin-top: 14rem; } @media screen and (max-width: 768px) { .p-career-path { margin-top: 12rem; } } .p-career-path__inner { padding-left: 1.8rem; } @media screen and (max-width: 768px) { .p-career-path__inner { padding-left: 0; } } .p-career-path__title { text-align: center; } .p-career-path__read { margin-top: 9rem; font-size: 1.5rem; letter-spacing: 0.1em; color: #050505; text-align: center; } @media screen and (max-width: 768px) { .p-career-path__read { margin-top: 3rem; padding-inline: 2rem; } } .p-career-path__read p:nth-child(1) { line-height: 1.7333333333; font-weight: 500; } @media screen and (max-width: 768px) { .p-career-path__read p:nth-child(1) { line-height: 1.8666666667; } } .p-career-path__read p:nth-child(2) { margin-top: 3rem; line-height: 1.4666666667; font-weight: 400; } @media screen and (max-width: 768px) { .p-career-path__read p:nth-child(2) { margin-top: 2rem; } } .p-career-path__content { margin-top: 12rem; } @media screen and (max-width: 768px) { .p-career-path__content { margin-top: 6rem; } } .p-career-path__content-top { padding-block: 6.2rem 2.1rem; padding-inline: 2.2rem; background-color: rgba(230, 230, 230, 0.25); border-radius: 4rem; position: relative; } @media screen and (max-width: 768px) { .p-career-path__content-top { padding: 9rem 1rem; } } .p-career-path__content-title { letter-spacing: 0.1em; font-weight: 700; color: #E65000; text-align: center; background-color: #fff4e5; border-radius: 7rem; border: 0.3rem solid #E65000; position: absolute; left: 50%; transform: translateX(-50%); } @media screen and (max-width: 768px) { .p-career-path__content-title { border-radius: 1.5rem; position: static; transform: none; } } .p-career-path__content-top .p-career-path__content-title { padding-block: 1.5rem; width: calc(100% - 4.5rem); font-size: 2rem; line-height: 1.45; top: -2.9rem; } @media screen and (max-width: 768px) { .p-career-path__content-top .p-career-path__content-title { padding-block: 1.3rem; width: 100%; font-size: 2rem; line-height: 1.45; } } @media screen and (max-width: 768px) { .p-career-path__content-top-img { padding-inline: 6rem; margin: 6rem auto 0; } } .p-career-path__content-bottom { margin-top: 11rem; } @media screen and (max-width: 768px) { .p-career-path__content-bottom { margin-top: 6rem; } } .p-career-path__content-list { display: flex; gap: 2.3rem; } @media screen and (max-width: 768px) { .p-career-path__content-list { flex-direction: column; gap: 6rem; } } .p-career-path__content-item { background-color: rgba(230, 230, 230, 0.25); border-radius: 4rem; position: relative; } .p-career-path__content-item:nth-child(1) { padding-block: 4.8rem 1.4rem; padding-inline: 1.9rem 2.7rem; } @media screen and (max-width: 768px) { .p-career-path__content-item:nth-child(1) { padding: 9rem 1rem; } } .p-career-path__content-item:nth-child(2) { padding-block: 4.8rem 1.1rem; padding-inline: 3.4rem 3.3rem; } @media screen and (max-width: 768px) { .p-career-path__content-item:nth-child(2) { padding: 9rem 1rem; } } .p-career-path__content-bottom .p-career-path__content-title { padding-block: 1.3rem; width: calc(100% - 3rem); font-size: 1.8rem; line-height: 1.5; top: -4.2rem; } @media screen and (max-width: 768px) { .p-career-path__content-bottom .p-career-path__content-title { width: 100%; font-size: 2rem; line-height: 1.4; } } @media screen and (max-width: 768px) { .p-career-path__content-img { margin-top: 6rem; margin-inline: auto; } } .p-career-path__content-item:nth-child(1) .p-career-path__content-img { width: 39.4rem; } @media screen and (max-width: 768px) { .p-career-path__content-item:nth-child(1) .p-career-path__content-img { width: 31.2rem; } } .p-career-path__content-item:nth-child(1) .p-career-path__content-img img { width: 39.4rem; height: 31.1rem; -o-object-fit: contain; object-fit: contain; } @media screen and (max-width: 768px) { .p-career-path__content-item:nth-child(1) .p-career-path__content-img img { width: 31.2rem; height: 30rem; } } .p-career-path__content-item:nth-child(2) .p-career-path__content-img { width: 37.3rem; } @media screen and (max-width: 768px) { .p-career-path__content-item:nth-child(2) .p-career-path__content-img { width: 32.2rem; } } .p-career-path__content-item:nth-child(2) .p-career-path__content-img img { width: 37.3rem; height: 31.4rem; -o-object-fit: contain; object-fit: contain; } @media screen and (max-width: 768px) { .p-career-path__content-item:nth-child(2) .p-career-path__content-img img { width: 32.2rem; height: 26.6rem; } } /*------------------------------- p-interview -------------------------------*/ .p-interview { scroll-margin-top: 13rem; margin-top: 18rem; } @media screen and (max-width: 768px) { .p-interview { margin-top: 12rem; } } .p-interview__inner { padding-left: 1.8rem; } @media screen and (max-width: 768px) { .p-interview__inner { padding-left: 0; } } .p-interview__title { text-align: center; } .p-interview__list { margin-top: 9rem; margin-inline: auto; width: 74rem; display: flex; justify-content: center; flex-wrap: wrap; gap: 9rem 7.7rem; } @media screen and (max-width: 768px) { .p-interview__list { margin-top: 6rem; margin-inline: auto; width: 100%; gap: 3rem 3.6rem; } } .p-interview__item button { display: flex; flex-direction: column; justify-content: space-between; position: relative; cursor: pointer; } .p-interview__item-img { width: 18.7rem; position: relative; } @media screen and (max-width: 768px) { .p-interview__item-img { width: 13.9rem; } } .p-interview__item-img img { position: relative; z-index: 1; transition: 0.3s; } .p-interview__item-img::before { content: ""; width: 100%; height: 100%; background-color: #ebbf05; border-radius: 4.4rem; position: absolute; bottom: -0.9rem; right: -1.2rem; z-index: 0; } @media screen and (max-width: 768px) { .p-interview__item-img::before { bottom: -0.6rem; right: -0.9rem; } } .p-interview__item-img::after { content: ""; width: 5.1rem; height: 5.1rem; background-image: url("../images/top/point_arrow_before.svg"); background-repeat: no-repeat; background-size: cover; position: absolute; bottom: -0.9rem; right: -1.4rem; z-index: 2; transition: 0.3s; } @media screen and (max-width: 768px) { .p-interview__item-img::after { width: 3.7rem; height: 3.7rem; bottom: -0.6rem; right: -2.1rem; } } .p-interview__item-year { padding-block: 0.3rem; width: 11.2rem; font-size: 1.5rem; line-height: 2.1rem; font-weight: 700; color: #fff; text-align: center; border-radius: 0 3rem 3rem 0; background-color: rgba(230, 80, 0, 0.9); position: absolute; top: 13.2rem; left: 0; z-index: 10; transition: 0.3s; } @media screen and (max-width: 768px) { .p-interview__item-year { padding-block: 0.1rem; width: 6.9rem; font-size: 1rem; line-height: 1.5rem; top: 9.2rem; } } .p-interview__item-text { margin-top: 2rem; text-align: center; padding-bottom: 0.5rem; border-bottom: 0.1rem solid #050505; transition: 0.3s; } @media screen and (max-width: 768px) { .p-interview__item-text { margin-top: 2.2rem; } } .p-interview__item-title { font-size: 2.8rem; line-height: 3.7rem; font-weight: 300; font-style: italic; } .p-interview__item-title span { padding-bottom: 0.2rem; font-size: 2.1rem; line-height: 2.8rem; font-weight: 500; font-style: italic; } .p-interview__item-post { margin-top: -0.6rem; margin-left: 0.4rem; font-size: 1.6rem; line-height: 2.4rem; text-align: center; } @media screen and (max-width: 768px) { .p-interview__item-post { margin-top: -0.3rem; font-size: 1.2rem; line-height: 1.7rem; } } @media (any-hover: hover) { .p-interview__item:hover { opacity: 1; } .p-interview__item:hover .p-interview__item-img img, .p-interview__item:hover .p-interview__item-year { transform: translate(1.2rem, 0.9rem); } .p-interview__item:hover .p-interview__item-img::after { background-image: url("../images/top/point_arrow_after.svg"); transform: translate(-0.2rem, 0.2rem); } .p-interview__item:hover .p-interview__item-text { border-bottom: 0.1rem solid #E65000; color: #E65000; } } .p-interview__read { margin-top: 9rem; font-size: 1.5rem; line-height: 2.1rem; letter-spacing: 0.1em; color: #050505; text-align: center; } @media screen and (max-width: 768px) { .p-interview__read { margin-top: 3rem; padding-inline: 2rem; font-size: 1.2rem; line-height: 1.8rem; text-align: left; } } /*------------------------------- p-interview__modal -------------------------------*/ .p-interview-modal { padding-block: 9.4rem 11.9rem; display: none; position: fixed; top: 0; left: 0; bottom: 0; width: 100%; height: 100%; background-color: rgba(114, 114, 114, 0.8); z-index: 1000; overflow-y: auto; } @media screen and (max-width: 768px) { .p-interview-modal { padding-block: 3.6rem 3.3rem; } } .p-interview-modal__container { margin-inline: auto; max-width: 122.8rem; border-radius: 9rem; background-color: #fff; } @media screen and (max-width: 768px) { .p-interview-modal__container { max-width: 37.5rem; border-radius: 5rem; } } .p-interview-modal__inner { padding: 6rem 13.3rem 3.7rem; border-radius: 9rem; position: relative; } @media screen and (max-width: 768px) { .p-interview-modal__inner { padding: 8.5rem 1rem 17.9rem; border-radius: 5rem; } } .p-interview__item.-file1 .p-interview-modal__inner { background-color: rgba(235, 191, 5, 0.1); } .p-interview__item.-file2 .p-interview-modal__inner { background-color: rgba(235, 164, 5, 0.1); } .p-interview__item.-file3 .p-interview-modal__inner { background-color: rgba(235, 147, 5, 0.1); } .p-interview__item.-file4 .p-interview-modal__inner { background-color: rgba(234, 131, 28, 0.1); } .p-interview__item.-file5 .p-interview-modal__inner { background-color: rgba(230, 80, 0, 0.1); } .p-interview-modal__close-circle { width: 8.5rem; height: 8.5rem; position: absolute; top: 6rem; right: 7.3rem; z-index: 100; background-color: #fff; border: 0.1rem solid #050505; border-radius: 50%; transition: 0.2s; cursor: pointer; } @media screen and (max-width: 768px) { .p-interview-modal__close-circle { width: 4.4rem; height: 4.4rem; top: -1.6rem; right: 2rem; } } .p-interview-modal__close-circle::before, .p-interview-modal__close-circle::after { content: ""; width: 6rem; height: 0.1rem; position: absolute; top: 50%; left: 50%; background-color: #050505; } @media screen and (max-width: 768px) { .p-interview-modal__close-circle::before, .p-interview-modal__close-circle::after { width: 3.1rem; height: 0.1rem; } } .p-interview-modal__close-circle::before { transform: translate(-50%, -50%) rotate(45deg); } .p-interview-modal__close-circle::after { transform: translate(-50%, -50%) rotate(-45deg); } @media (any-hover: hover) { .p-interview-modal__close-circle:hover { opacity: 0.7; } } .p-interview-modal__heading { padding-inline: 16.8rem 5.2rem; position: relative; } @media screen and (max-width: 768px) { .p-interview-modal__heading { padding-inline: 0.5rem; } } .p-interview-modal__hgroup { color: #0E0D69; position: absolute; top: 50%; left: 0; transform: translateY(-50%); z-index: 50; pointer-events: none; } @media screen and (max-width: 768px) { .p-interview-modal__hgroup { width: 100%; } } .p-interview-modal__title { padding-block: 0.2rem; width: 29.4rem; border-radius: 6rem; display: flex; align-items: center; justify-content: center; gap: 2rem; } @media screen and (max-width: 768px) { .p-interview-modal__title { padding-block: 0; width: 15.6rem; gap: 0.6rem; } } .p-interview__item.-file1 .p-interview-modal__title, .p-interview__item.-file1 .p-interview-modal__year, .p-interview__item.-file1 .p-interview-modal__career-circle { background-color: #ebbf05; } .p-interview__item.-file2 .p-interview-modal__title, .p-interview__item.-file2 .p-interview-modal__year, .p-interview__item.-file2 .p-interview-modal__career-circle { background-color: #eba405; } .p-interview__item.-file3 .p-interview-modal__title, .p-interview__item.-file3 .p-interview-modal__year, .p-interview__item.-file3 .p-interview-modal__career-circle { background-color: #eb9305; } .p-interview__item.-file4 .p-interview-modal__title, .p-interview__item.-file4 .p-interview-modal__year, .p-interview__item.-file4 .p-interview-modal__career-circle { background-color: #ea831c; } .p-interview__item.-file5 .p-interview-modal__title, .p-interview__item.-file5 .p-interview-modal__year, .p-interview__item.-file5 .p-interview-modal__career-circle { background-color: #e65000; } .p-interview-modal__title small { font-size: 1.6rem; line-height: 2.4rem; font-weight: 500; } @media screen and (max-width: 768px) { .p-interview-modal__title small { font-size: 1rem; line-height: 1.5rem; } } .p-interview-modal__title strong { padding-bottom: 0.6rem; font-size: 4.6rem; line-height: 6rem; font-weight: 300; font-style: italic; } @media screen and (max-width: 768px) { .p-interview-modal__title strong { padding-bottom: 0rem; font-size: 2.4rem; line-height: 3.2rem; } } .p-interview-modal__title strong span { padding-bottom: 0.4rem; font-size: 3.3rem; line-height: 4.4rem; letter-spacing: 0.05em; font-weight: 500; font-style: italic; } @media screen and (max-width: 768px) { .p-interview-modal__title strong span { padding-bottom: 0rem; font-size: 1.8rem; line-height: 2.4rem; } } .p-interview-modal__post { margin-top: 2rem; padding-block: 2rem; padding-inline: 3.5rem; width: -moz-fit-content; width: fit-content; min-width: 20rem; font-size: 2.4rem; line-height: 3.5rem; font-weight: 700; text-align: center; background-color: #fff; border-radius: 6rem; } @media screen and (max-width: 768px) { .p-interview-modal__post { margin-top: 13.8rem; margin-left: auto; padding-block: 0.8rem; padding-inline: 2.3rem; min-width: 10.8rem; font-size: 1.5rem; line-height: 2.1rem; } } .p-interview-modal__year { margin-left: auto; padding-block: 2.3rem; width: 20rem; font-size: 1.6rem; line-height: 2.4rem; font-weight: 500; border-radius: 6rem; text-align: center; } @media screen and (max-width: 768px) { .p-interview-modal__year { padding-block: 1.2rem; width: -moz-fit-content; width: fit-content; min-width: 10.8rem; font-size: 1rem; line-height: 1.5rem; } } .p-interview-modal__img { width: 73.6rem; height: 44.7rem; } @media screen and (max-width: 768px) { .p-interview-modal__img { width: 100%; height: auto; } } .p-interview-modal__img img, .p-interview-modal__img iframe { -o-object-fit: contain; object-fit: contain; aspect-ratio: 736/447; } @media screen and (max-width: 768px) { .p-interview-modal__img img, .p-interview-modal__img iframe { aspect-ratio: 345/210; } } .p-interview-modal__img img { width: 73.6rem; height: 44.7rem; border-radius: 8rem; } @media screen and (max-width: 768px) { .p-interview-modal__img img { width: 34.5rem; height: 21rem; border-radius: 5rem; } } .p-interview-modal__career { margin-top: 3rem; margin-inline: auto; max-width: 86rem; display: flex; align-items: center; justify-content: center; gap: 2rem; } @media screen and (max-width: 768px) { .p-interview-modal__career { margin-top: 4.6rem; padding-inline: 0.5rem; align-items: initial; } } .p-interview-modal__career-circle { width: 7.6rem; height: 7.6rem; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 1.6rem; line-height: 2.4rem; font-weight: 700; color: #0E0D69; flex-shrink: 0; } .p-interview-modal__career-group { display: flex; gap: 5rem; } @media screen and (max-width: 768px) { .p-interview-modal__career-group { margin-top: 2.6rem; flex-direction: column; gap: 0.5rem; } } .p-interview-modal__career-list { display: flex; flex-wrap: wrap; row-gap: 0.5rem; } .p-interview-modal__career-list.-left { max-width: 31.5rem; } .p-interview-modal__career-list dt { width: 7.3rem; font-size: 1.5rem; line-height: 2.8rem; font-weight: 700; } .p-interview-modal__career-list dd { width: calc(100% - 7.3rem); font-size: 1.5rem; line-height: 2.6rem; font-weight: 500; } .p-interview-modal__career-list.-right dt.-border, .p-interview-modal__career-list.-right dd.-border { height: 1.5rem; border-bottom: 1px dashed #050505; } .p-interview-modal__career-list.-right dt.-other { font-size: 1.4rem; line-height: 2.8rem; font-weight: 500; } .p-interview-modal__career-text { margin-top: 1.5rem; font-size: 1.4rem; line-height: 2rem; letter-spacing: 0.1em; font-weight: 400; text-align: center; } @media screen and (max-width: 768px) { .p-interview-modal__career-text { margin-top: 2rem; padding-inline: 1rem; text-align: left; font-size: 1.2rem; line-height: 1.8rem; } } .p-interview-modal__content { margin-top: 3rem; padding-block: 9rem 11.7rem; display: flex; gap: 6.2rem; background-color: #fff; border-radius: 8rem; } @media screen and (max-width: 768px) { .p-interview-modal__content { margin-top: 6rem; padding-block: 6rem; flex-direction: column; gap: 3rem; border-radius: 5rem; } } .p-interview-modal__content-left { width: 32.7405857741%; } @media screen and (max-width: 768px) { .p-interview-modal__content-left { width: 100%; } } .p-interview-modal__content-hgroup { margin-left: 7.8rem; } @media screen and (max-width: 768px) { .p-interview-modal__content-hgroup { margin-left: 0; text-align: center; } } .p-interview-modal__content-title-en { font-size: 4rem; line-height: 4.9rem; font-weight: 400; color: #E65000; } .p-interview-modal__content-title-ja { margin-top: 0.5rem; font-size: 1.6rem; line-height: 2.4rem; letter-spacing: 0.05em; font-weight: 600; } .p-interview-modal__content-img { margin-top: 15rem; width: 100%; } @media screen and (max-width: 768px) { .p-interview-modal__content-img { margin-top: 3rem; width: 31.3rem; } } .p-interview-modal__content-img img { width: 31.3rem; height: 27rem; -o-object-fit: contain; object-fit: contain; border-radius: 0 20rem 20rem 0; } .p-interview-modal__content-right { width: 61.2970711297%; } @media screen and (max-width: 768px) { .p-interview-modal__content-right { width: 100%; } } .p-interview-modal__content-data { display: flex; flex-wrap: wrap; } @media screen and (max-width: 768px) { .p-interview-modal__content-data { padding-inline: 1.2rem; } } .p-interview-modal__content-data dt { width: 20.6484641638%; font-size: 3rem; line-height: 4rem; font-weight: 500; font-style: italic; color: #ebbf05; } @media screen and (max-width: 768px) { .p-interview-modal__content-data dt { width: 28.75%; font-size: 2.6rem; line-height: 3.4rem; } } .p-interview-modal__content-data dd { padding-top: 0.5rem; width: 79.3515358362%; font-size: 2rem; line-height: 3rem; letter-spacing: 0.05em; font-weight: 700; color: #0E0D69; } @media screen and (max-width: 768px) { .p-interview-modal__content-data dd { padding-top: 0.2rem; padding-left: 0.7rem; width: 71.25%; font-size: 1.8rem; line-height: 2.6rem; } } .p-interview-modal__content-data dd span { margin-top: 1.3rem; font-size: 1.5rem; line-height: 2.8rem; letter-spacing: 0.1em; font-weight: 500; color: #050505; display: block; } @media screen and (max-width: 768px) { .p-interview-modal__content-data dd span { margin-top: 1rem; line-height: 2.2rem; } } .p-interview-modal__content-data dd .inline-block { display: inline-block; } .p-interview-modal__content-data dt:not(:first-of-type), .p-interview-modal__content-data dd:not(:first-of-type) { margin-top: 1.7rem; } @media screen and (max-width: 768px) { .p-interview-modal__content-data dt:not(:first-of-type), .p-interview-modal__content-data dd:not(:first-of-type) { margin-top: 2rem; } } .p-interview-modal__content-text { margin-top: 6.3rem; display: flex; align-items: center; gap: 1.3rem; } @media screen and (max-width: 768px) { .p-interview-modal__content-text { margin-top: 5.8rem; padding-inline: 1rem; gap: 1.5rem; } } .p-interview-modal__content-text p:first-child { padding-block: 1.8rem; padding-inline: 1.1rem 1.7rem; font-size: 1.4rem; line-height: 2.4rem; letter-spacing: 0.05em; font-weight: 500; color: #E65000; background: url(../images/about-work/p-interview-modal__content-text-bg.png) center/contain no-repeat; text-align: center; } @media screen and (max-width: 768px) { .p-interview-modal__content-text p:first-child { padding-block: 1.9rem; padding-inline: 1rem 2rem; font-size: 1.2rem; line-height: 1.8rem; } } .p-interview-modal__content-text p:last-child { font-size: 1.6rem; line-height: 2.4rem; font-weight: 400; color: #0E0D69; } @media screen and (max-width: 768px) { .p-interview-modal__content-text p:last-child { font-size: 1.5rem; line-height: 2.3rem; } } .p-interview-modal__botoom { margin-top: 6rem; display: flex; } @media screen and (max-width: 768px) { .p-interview-modal__botoom { padding-inline: 1rem; flex-direction: column; } } .p-interview-modal__botoom-title { margin-top: 1.5rem; font-size: 1.6rem; line-height: 2.4rem; letter-spacing: 0.05em; font-weight: 700; color: #0E0D69; text-align: center; } @media screen and (max-width: 768px) { .p-interview-modal__botoom-title { margin-top: 0; } } .p-interview-modal__botoom-list { margin-left: 3rem; display: flex; gap: 2rem; } @media screen and (max-width: 768px) { .p-interview-modal__botoom-list { margin-top: 3rem; margin-left: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem; } } @media screen and (max-width: 768px) { .p-interview-modal__botoom-item:first-child { margin-left: 2.7rem; } } @media screen and (max-width: 768px) { .p-interview__item.-file4 .p-interview-modal__botoom-item:nth-child(3), .p-interview__item.-file5 .p-interview-modal__botoom-item:nth-child(3) { margin-left: 2.7rem; } } .p-interview-modal__botoom-item.-file4 { margin-left: 2.4rem; } .p-interview-modal__botoom-item.-file5 { margin-left: 0.3rem; } .p-interview-modal__botoom-item button { cursor: pointer; position: relative; } .p-interview-modal__botoom-body { display: flex; flex-direction: column; align-items: center; position: relative; } .p-interview-modal__botoom-img { width: 8.2rem; width: 12.8rem; position: relative; display: flex; } .p-interview-modal__botoom-img img { width: 8.2rem; height: 7.7rem; -o-object-fit: contain; object-fit: contain; border-radius: 2rem; } .p-interview-modal__botoom-label { margin-top: 0.3rem; width: -moz-max-content; width: max-content; font-size: 1.4rem; line-height: 2rem; letter-spacing: 0.05em; font-weight: 500; color: #0E0D69; position: relative; left: -2.1rem; } .p-interview-modal__botoom-file { padding-block: 0.8rem 0.4rem; width: 5.8rem; font-style: italic; color: #0E0D69; background-color: #fff; border-radius: 2rem 2rem 2rem 0; border: 0.1rem solid #0E0D69; display: flex; flex-direction: column; align-items: center; position: absolute; top: 0; right: 0; z-index: 10; transition: 0.3s; } @media (any-hover: hover) { .p-interview-modal__botoom-item.-file1 button:hover .p-interview-modal__botoom-file { background-color: #ebbf05; } .p-interview-modal__botoom-item.-file2 button:hover .p-interview-modal__botoom-file { background-color: #eba405; } .p-interview-modal__botoom-item.-file3 button:hover .p-interview-modal__botoom-file { background-color: #eb9305; } .p-interview-modal__botoom-item.-file4 button:hover .p-interview-modal__botoom-file { background-color: #ea831c; } .p-interview-modal__botoom-item.-file5 button:hover .p-interview-modal__botoom-file { background-color: #e65000; } } @media screen and (max-width: 768px) { .p-interview-modal__botoom-item.-file1 .p-interview-modal__botoom-file { background-color: #ebbf05; } } @media screen and (max-width: 768px) { .p-interview-modal__botoom-item.-file2 .p-interview-modal__botoom-file { background-color: #eba405; } } @media screen and (max-width: 768px) { .p-interview-modal__botoom-item.-file3 .p-interview-modal__botoom-file { background-color: #eb9305; } } @media screen and (max-width: 768px) { .p-interview-modal__botoom-item.-file4 .p-interview-modal__botoom-file { background-color: #ea831c; } } @media screen and (max-width: 768px) { .p-interview-modal__botoom-item.-file5 .p-interview-modal__botoom-file { background-color: #e65000; } } .p-interview-modal__botoom-file-label { font-size: 1.7rem; line-height: 2.4rem; font-weight: 500; } .p-interview-modal__botoom-file-number { margin-top: -0.6rem; font-size: 2.4rem; line-height: 3.2rem; font-weight: 300; } .p-interview-modal__close { margin-left: 2.6rem; } @media screen and (max-width: 768px) { .p-interview-modal__close { margin-top: 6rem; margin-inline: auto; } } .p-interview-modal__close-button { margin-top: 3.3rem; padding-block: 1.2rem; padding-right: 3.1rem; font-size: 1.4rem; line-height: 2rem; font-weight: 500; color: #0E0D69; border-bottom: 0.1rem solid #0E0D69; position: relative; transition: 0.3s; } @media screen and (max-width: 768px) { .p-interview-modal__close-button { margin-top: 0; padding-block: 1.2rem; padding-right: 3.1rem; font-size: 1.4rem; line-height: 2rem; } } @media (any-hover: hover) { .p-interview-modal__close-button:hover { opacity: 0.7; } } .p-interview-modal__close-button::before, .p-interview-modal__close-button::after { content: ""; width: 2.6rem; height: 0.1rem; position: absolute; top: 50%; right: -0.4rem; background-color: #0E0D69; } .p-interview-modal__close-button::before { transform: translateY(-50%) rotate(45deg); } .p-interview-modal__close-button::after { transform: translateY(-50%) rotate(-45deg); } /*------------------------------- p-support-step -------------------------------*/ .p-support-step { scroll-margin-top: 13rem; margin-top: 18rem; } @media screen and (max-width: 768px) { .p-support-step { margin-top: 12rem; } } .p-support-step__inner { padding-left: 1.8rem; } @media screen and (max-width: 768px) { .p-support-step__inner { padding-inline: 1rem; } } .p-support-step__title { text-align: center; } .p-support-step__read { margin-top: 6rem; font-size: 2rem; line-height: 3.4rem; letter-spacing: 0.1em; font-weight: 700; color: #0E0D69; text-align: center; } @media screen and (max-width: 768px) { .p-support-step__read { font-size: 1.5rem; line-height: 3rem; margin-top: 3rem; } } .p-support-step__movie { margin-top: 5.1rem; display: flex; flex-direction: column; align-items: center; } @media screen and (max-width: 768px) { .p-support-step__movie { margin-top: 6rem; } } .p-support-step__movie p { font-size: 1.6rem; line-height: 2.4rem; letter-spacing: 0.1em; font-weight: 700; } .p-support-step__movie-main { margin-top: 2rem; width: 71.1rem; height: 40rem; } @media screen and (max-width: 768px) { .p-support-step__movie-main { margin-top: 1.8rem; padding-inline: 1rem; width: 33.4rem; height: 17.7rem; } } .p-support-step__movie-main iframe { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } .p-support-step__content { margin-top: 15rem; } @media screen and (max-width: 768px) { .p-support-step__content { margin-top: 9rem; } } .p-support-step__content-title { padding-block: 1.5rem; font-size: 2rem; line-height: 2.9rem; letter-spacing: 0.1em; font-weight: 700; color: #E65000; text-align: center; background-color: #fff4e5; border-radius: 7rem; border: 0.3rem solid #E65000; } @media screen and (max-width: 768px) { .p-support-step__content-title { padding-block: 1.3rem; border-radius: 1.5rem; } } @media screen and (max-width: 768px) { .p-support-step__content-title { padding-block: 1.3rem; width: 100%; font-size: 2rem; line-height: 1.45; } } .p-support-step__content-img { margin-top: 5.9rem; margin-inline: auto; width: 89.2rem; } @media screen and (max-width: 768px) { .p-support-step__content-img { padding-inline: 6rem; width: 100%; } } .p-support-step__content-img img { width: 89.2rem; height: 31.4rem; -o-object-fit: contain; object-fit: contain; } @media screen and (max-width: 768px) { .p-support-step__content-img img { width: 31rem; height: 72.2rem; } } .p-support-step__content-text { margin-top: 5.1rem; padding-left: 1em; font-size: 1.5rem; line-height: 2.3rem; letter-spacing: 0.1em; text-indent: -1em; } @media screen and (max-width: 768px) { .p-support-step__content-text { font-size: 1.2rem; margin-top: 3rem; } } /*------------------------------- p-story -------------------------------*/ .p-story { scroll-margin-top: 13rem; margin-top: 14rem; margin-right: calc(var(--about-work__content-inner) * -1); width: calc(100% + var(--about-work__content-inner) - 0.4rem); } @media screen and (max-width: 768px) { .p-story { margin-top: 12rem; margin-inline: 0; width: 100%; } } .p-story__inner { padding-block: 9rem 16.1rem; position: relative; } @media screen and (max-width: 768px) { .p-story__inner { padding-block: 8rem 25.6rem; padding-inline: 2rem; } } .p-story__bg { position: absolute; top: 0; left: 0; z-index: -1; } .p-story__content { display: flex; flex-direction: column; align-items: center; } .p-story__title { padding-bottom: 1rem; width: 72rem; color: #fff; text-align: center; border-bottom: 0.5rem solid #fff; } @media screen and (max-width: 768px) { .p-story__title { width: 100%; } } .p-story__en { font-size: 2rem; line-height: 2.6rem; letter-spacing: 0.04em; font-weight: 700; } .p-story__jp { font-size: 4.2rem; line-height: 6.1rem; letter-spacing: 0.097em; font-weight: 700; } @media screen and (max-width: 768px) { .p-story__jp { font-size: 2.4rem; line-height: 3.2rem; } } .p-story__movie { margin-top: 9rem; width: 57.7rem; height: 35.7rem; } @media screen and (max-width: 768px) { .p-story__movie { margin-top: 6rem; padding-inline: 1rem; width: 33.4rem; height: 17.7rem; } } .p-story__movie img { border-radius: 8rem; } @media screen and (max-width: 768px) { .p-story__movie img { border-radius: 5rem; } } .p-story__movie img, .p-story__movie iframe { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } .p-page-movie__dummy { width: 57.7rem; height: 35.7rem; -o-object-fit: cover; object-fit: cover; border-radius: 8rem; } @media screen and (max-width: 768px) { .p-page-movie__dummy { width: 33.4rem; height: 17.7rem; border-radius: 5rem; } } /*---------- shop-search ----------*/ .p-shop-search { position: relative; overflow: hidden; } .p-shop-search__inner { max-width: 108.5rem; width: 90%; margin: 0 auto; padding: 10rem 0; } .p-shop-search__heading { padding-top: 4.8rem; text-align: center; color: #E65000; margin-bottom: 10rem; } @media screen and (max-width: 768px) { .p-shop-search__heading { margin-bottom: 5rem; } } .p-shop-search__heading-jp { font-size: 4.2rem; line-height: 1.5; font-weight: 700; } @media screen and (max-width: 768px) { .p-shop-search__heading-jp { font-size: 2rem; } } .p-shop-search__heading-jp span { font-size: 5rem; font-weight: bold; } @media screen and (max-width: 768px) { .p-shop-search__heading-jp span { font-size: 2.3rem; } } .p-shop-search__form { max-width: 34.6rem; width: 100%; margin: 0 auto 10rem; } @media screen and (max-width: 768px) { .p-shop-search__form { margin-bottom: 5rem; } } .p-shop-search__form-item { display: flex; flex-direction: column; gap: 1.6rem; } .p-shop-search__form-item-select { position: relative; } .p-shop-search__form-item-select::after { content: ""; width: 0; height: 0; border-style: solid; border-right: 0.9rem solid transparent; border-left: 0.9rem solid transparent; border-top: 1.2rem solid #fff; border-bottom: 0; position: absolute; top: 0; right: 2rem; bottom: 0; margin: auto; } .p-shop-search__select { width: 100%; background-color: #E65000; border: 0.1rem solid #E65000; border-radius: 1rem; padding: 1rem 2rem; color: #fff; font-size: 1.8rem; font-weight: 700; line-height: 1.5; cursor: pointer; transition: 0.3s; letter-spacing: 0.18rem; } @media screen and (max-width: 768px) { .p-shop-search__select { font-size: 1.4rem; } } .p-shop-search__result { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.5rem; } @media screen and (max-width: 768px) { .p-shop-search__result { grid-template-columns: repeat(2, 1fr); gap: 1.5rem; } } .p-shop-search__result-item { background-color: #fff; border-radius: 1rem; padding: 3rem 2rem; border: 0.2rem solid #EA831C; display: grid; grid-template-rows: subgrid; grid-row: span 5; gap: 0.1rem; } @media screen and (max-width: 768px) { .p-shop-search__result-item { padding: 1.5rem; } } .p-shop-search__result-item-shopname { font-size: 1.4rem; font-weight: 700; line-height: 1.5; color: #EA831C; margin-bottom: 1.5rem; } .p-shop-search__result-item-name { font-size: 2rem; font-weight: 700; line-height: 1.5; margin-bottom: 1.5rem; } @media screen and (max-width: 768px) { .p-shop-search__result-item-name { font-size: 1.4rem; } } .p-shop-search__result-item-zip { font-size: 1.4rem; font-weight: 400; line-height: 1.5; margin-bottom: 0.5rem; } @media screen and (max-width: 768px) { .p-shop-search__result-item-zip { font-size: 1.2rem; } } .p-shop-search__result-item-address { font-size: 1.4rem; font-weight: 400; line-height: 1.5; margin-bottom: 2.5rem; } @media screen and (max-width: 768px) { .p-shop-search__result-item-address { font-size: 1.2rem; } } .p-shop-search__result-item-url { display: block; width: 100%; background-color: #EA831C; border-radius: 5rem; padding: 1rem 2rem; color: #fff; font-size: 1.6rem; font-weight: 700; line-height: 1.5; margin-bottom: 0; margin-top: auto; text-align: center; justify-self: end; } @media screen and (max-width: 768px) { .p-shop-search__result-item-url { font-size: 1.4rem; padding: 0.8rem 1.5rem; } } .p-shop-search__result-item-url::after { content: ""; display: inline-block; width: 2.2rem; height: 1.9rem; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMiIgaGVpZ2h0PSIxOSIgdmlld0JveD0iMCAwIDIyIDE5Ij4NCiAgPGcgaWQ9IuOCsOODq+ODvOODl18yOTI3NTIiIGRhdGEtbmFtZT0i44Kw44Or44O844OXIDI5Mjc1MiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTExMTgyIC03MTYzLjgyOSkiPg0KICAgIDxnIGlkPSLplbfmlrnlvaJfMjE2MDYiIGRhdGEtbmFtZT0i6ZW35pa55b2iIDIxNjA2IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMTE4OCA3MTYzLjgyOSkiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIxIj4NCiAgICAgIDxyZWN0IHdpZHRoPSIxNiIgaGVpZ2h0PSIxMiIgc3Ryb2tlPSJub25lIi8+DQogICAgICA8cmVjdCB4PSIwLjUiIHk9IjAuNSIgd2lkdGg9IjE1IiBoZWlnaHQ9IjExIiBmaWxsPSJub25lIi8+DQogICAgPC9nPg0KICAgIDxnIGlkPSLplbfmlrnlvaJfMjE2MDciIGRhdGEtbmFtZT0i6ZW35pa55b2iIDIxNjA3IiB0cmFuc2Zvcm09InRyYW5zbGF0ZSgxMTE4MiA3MTcwLjgyOSkiIGZpbGw9Im5vbmUiIHN0cm9rZT0iI2ZmZiIgc3Ryb2tlLXdpZHRoPSIxIj4NCiAgICAgIDxyZWN0IHdpZHRoPSIxNiIgaGVpZ2h0PSIxMiIgc3Ryb2tlPSJub25lIi8+DQogICAgICA8cmVjdCB4PSIwLjUiIHk9IjAuNSIgd2lkdGg9IjE1IiBoZWlnaHQ9IjExIiBmaWxsPSJub25lIi8+DQogICAgPC9nPg0KICA8L2c+DQo8L3N2Zz4NCg=="); background-repeat: no-repeat; background-size: contain; margin: -0.2rem 0 auto 1rem; vertical-align: middle; line-height: 1.9rem; } @media screen and (max-width: 768px) { .p-shop-search__result-item-url::after { width: 1.8rem; height: 1.5rem; margin: -0.1rem 0 auto 0.8rem; } } .p-shop-search__result-item-url.-unset { background-color: #C6C6C6; } .p-shop-search__report { max-width: 70rem; width: 90%; margin: 0 auto; } .p-shop-search__report-table { width: 100%; border-collapse: collapse; margin-top: 2rem; } .preview { padding: 10rem 0; } /* ========================================================================== Layout Settings (ヘッダー被り対策) ========================================================================== */ .l-main { padding-top: 80px; } @media screen and (max-width: 768px) { .l-main { padding-top: 60px; } } /* ========================================================================== Page Header (固定パーツ) ========================================================================== */ .p-page-header { background-color: #f8f8f8; padding: 6rem 0; text-align: center; } .p-page-header__title { font-size: 3.2rem; font-weight: bold; color: #333; } @media screen and (max-width: 768px) { .p-page-header__title { font-size: 2.4rem; } } /* ========================== 見出し・リード文 ========================== */ .p-contact__title { font-size: 3.2rem; font-weight: 700; text-align: center; margin-bottom: 2rem; } .p-contact__lead { font-size: 1.6rem; text-align: center; margin-bottom: 4rem; } /* ========================================================================== Contact Form Section ========================================================================== */ .p-contact { padding: 8rem 0; } @media screen and (max-width: 768px) { .p-contact { padding: 4rem 2rem; } } .contact-info-box { margin: 32px 0; padding: 20px 24px; background: #f3f3f3; border-radius: 6px; } .contact-info-box__text { font-size: 15px; line-height: 1.8; margin-bottom: 20px; } .contact-info-box__hours { margin: 0; padding-top: 16px; border-top: 1px dashed #acacac; } .contact-info-box__hours-title { font-size: 13px; font-weight: 600; margin-bottom: 6px; } .contact-info-box__hours-body { font-size: 14px; line-height: 1.6; } .contact-info-box__hours-body span { display: block; margin-top: 6px; font-size: 12px; } .p-contact__form { max-width: 72rem; margin: 0 auto; padding: 10rem 0; } .p-contact__note { font-size: 1.4rem; color: #333; margin-bottom: 3rem; } /* フォームの行設定 */ .p-contact__row { display: flex; margin-top: 3rem; } @media screen and (max-width: 768px) { .p-contact__row { flex-direction: column; } } .p-contact__row p { margin: 0; line-height: 1.6; font-size: 1.6rem; } /* ラベル & fieldset対応 (ガイドライン P.13) */ .p-contact__label { width: 24rem; font-size: 1.6rem; font-weight: bold; color: #333; display: block; } @media screen and (max-width: 768px) { .p-contact__label { width: 100%; margin-bottom: 1rem; } } .p-contact__field { flex: 1; } .p-contact__field input[type=text], .p-contact__field input[type=email], .p-contact__field textarea { width: 100%; padding: 1.2rem; border: 1px solid #ccc; border-radius: 4px; font-size: 1.6rem; background: #fff; box-sizing: border-box; } .p-contact__field input[type=text]:focus, .p-contact__field input[type=email]:focus, .p-contact__field textarea:focus { outline: 3px solid #005fcc !important; outline-offset: 2px; } .p-contact__field textarea { min-height: 20rem; } .p-contact__field .wpcf7-list-item { display: inline-block; margin-right: 1.5rem; } @media screen and (max-width: 768px) { .p-contact__field .wpcf7-list-item { display: block; margin: 0.5rem 0; } } /* 必須ラベル (P.20 コントラスト確保) */ .required { color: #fff; background-color: #d40000; padding: 0.2rem 0.6rem; font-size: 1.2rem; margin-left: 1rem; border-radius: 2px; vertical-align: middle; } /* 案内・エラーメッセージ (P.16, P.29) */ .p-contact__row .p-contact__guide { font-size: 1.4rem; font-weight: bold; color: #d40000; background-color: #fff0f0; padding: 1rem; border: 1px solid #d40000; border-radius: 4px; margin-bottom: 1.5rem; text-align: center; } .p-contact__row .p-contact__guide.is-active { color: #008000; background-color: #f0fff0; border-color: #008000; } .p-contact__error { color: #d40000; font-weight: bold; margin: 1rem auto; text-align: center; } /* ボタンエリア */ .js-confirm-btn, .js-back-btn, .wpcf7-submit { display: inline-block; padding: 1.6rem 5rem; font-size: 1.6rem; font-weight: bold; border-radius: 10rem; cursor: pointer; border: none; transition: 0.3s; } .js-confirm-btn:focus, .js-back-btn:focus, .wpcf7-submit:focus { outline: 3px solid #005fcc !important; outline-offset: 2px; } .js-confirm-btn[disabled] { background-color: #e0e0e0; color: #767676; cursor: not-allowed; } .js-confirm-btn:not([disabled]) { background-color: #000; color: #fff; } .wpcf7-submit { background-color: #000; color: #fff; } .js-back-btn { background-color: #666; color: #fff; margin-right: 2rem; border-radius: 10rem; } @media screen and (max-width: 768px) { .js-back-btn { margin-right: 0; margin-bottom: 1.5rem; width: 100%; text-align: center; } } .wpcf7-submit { color: #fff; margin-right: 2rem; border-radius: 10rem; } @media screen and (max-width: 768px) { .wpcf7-submit { margin-right: 0; margin-bottom: 1.5rem; width: 100%; text-align: center; } } p:has(.js-confirm-btn), p:has(.js-back-btn) { display: flex; justify-content: center; } @media screen and (max-width: 768px) { p:has(.js-confirm-btn), p:has(.js-back-btn) { flex-direction: column; align-items: center; } } /* ボタンを基準にする */ .wpcf7-submit.has-spinner { position: relative; } /* スピナーをレイアウトから外す */ .wpcf7-spinner { position: absolute; right: -24px; /* 右に少しずらす */ top: 50%; transform: translateY(-50%); margin: 0; /* 余白リセット */ } /* ========================================================================== Thanks Page (Simple & Original Style) ========================================================================== */ .p-thanks { padding: 6rem 0; text-align: center; } .p-thanks__title { font-size: 2.8rem; font-weight: bold; margin-bottom: 3.2rem; } .p-thanks__message { font-size: 1.6rem; line-height: 2; margin-bottom: 4rem; display: inline-block; text-align: left; } .p-thanks__btn { display: inline-block; padding: 1.6rem 5rem; background-color: #000; color: #fff; text-decoration: none; font-weight: bold; border-radius: 10rem; } /*---------- 404 ----------*/ .p-404 { padding: 12rem 0; } @media screen and (max-width: 768px) { .p-404 { padding: 8rem 0; } } .p-404__inner { max-width: 108.5rem; width: 90%; margin: 0 auto; padding: 10rem 0; } .p-404__heading { text-align: center; color: #E65000; margin-bottom: 6rem; } @media screen and (max-width: 768px) { .p-404__heading { margin-bottom: 4rem; } } .p-404__heading-jp { font-size: 4.2rem; line-height: 1.5; font-weight: 700; } @media screen and (max-width: 768px) { .p-404__heading-jp { font-size: 2rem; } } .p-404__content { text-align: center; } .p-404__text { font-size: 1.6rem; line-height: 1.8; margin-bottom: 2.4rem; } @media screen and (max-width: 768px) { .p-404__text { font-size: 1.4rem; } } .p-404__links { display: flex; justify-content: center; gap: 3rem; margin-top: 4rem; } @media screen and (max-width: 768px) { .p-404__links { flex-direction: column; gap: 2rem; } } .p-404__link { display: inline-flex; align-items: center; justify-content: center; min-width: 22rem; padding: 1.2rem 3rem; border-radius: 5rem; font-size: 1.6rem; font-weight: 700; color: #fff; background-color: #EA831C; text-decoration: none; transition: opacity 0.3s; } .p-404__link:hover { opacity: 0.8; } .p-404__link.-secondary { background-color: #C6C6C6; } @media screen and (max-width: 768px) { .p-404__link { font-size: 1.4rem; min-width: auto; width: 100%; } } /*# sourceMappingURL=style.css.map */