.p-homeSection { position: relative; padding-block: var(--spc-28); @media (max-width: 768px) { padding-block: var(--spc-16); }} .p-homeHero { display: flex; align-items: center; height: 100svh; min-height: 60rem; padding-block: var(--spc-20); background-color: var(--c-blue); position: relative; overflow: hidden;} .p-homeHero__video { position: absolute; inset: 0; &::after { content: ''; position: absolute; inset: 0; background-color: rgba(var(--c-black-rgb), 0.2); } video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }} .p-homeHero-inner { width: 100%; transform: translateY(8%); position: relative; z-index: 2;} .p-homeHero__desc,.p-homeHero__title,.p-homeHero__titleEn { color: var(--c-white);} .p-homeHero__desc + .p-homeHero__title { margin-top: var(--spc-3);} .p-homeHero__title { font-weight: var(--fw-default); span { display: block; } & + .p-homeHero__titleEn { margin-top: var(--spc-5); }} .p-homeHero__titleEn + .p-homeHero__maaa { margin-top: var(--spc-7);} .p-homeHero__maaa + .p-homeHero__btn { margin-top: var(--spc-9);} .p-homeAboutUs { overflow: hidden;} .p-homeAboutUs-inner { position: relative;} .p-homeAboutUs-head + .p-homeAboutUs-content { margin-top: var(--spc-4);} .p-homeAboutUs-content { display: flex; flex-direction: column; gap: var(--spc-4); & + .p-homeAboutUs-bottom { margin-top: var(--spc-8); }} .p-homeAboutUs__figure { display: flex; align-items: center; position: absolute; inset: 0 var(--spc-8) 0 auto; width: 35%; max-width: 48rem; @media (max-width: 1024px) { align-items: flex-end; inset: var(--spc-3) var(--spc-3) var(--spc-3) auto; opacity: 0.3; } & > * { width: 100%; }} .p-homeAboutUs__title + .p-homeAboutUs__desc { margin-top: var(--spc-4);} .p-homeSupport { background-color: var(--c-blue-100);} .p-homeSupport-head { display: flex; justify-content: space-between; flex-direction: row-reverse; gap: var(--spc-4); @media (max-width: 1024px) { flex-direction: column; justify-content: flex-start; } & + .p-homeSupport-content { margin-top: var(--spc-6); @media (max-width: 768px) { margin-top: var(--spc-4); } }} .p-homeSupport__title span { display: block; margin-bottom: var(--spc-1);} .p-homeSupport__desc { border-top: solid .1rem var(--c-blue-200); padding-top: var(--spc-6); @media (max-width: 768px) { padding-top: var(--spc-4); } & + * { margin-top: var(--spc-6); }} .p-homeBusiness { --padding: 12rem; --margin: calc((100vw - var(--container-max-width)) / 2 + var(--container-padding)); --catch-width: calc(var(--padding) + var(--margin)); --catch-width-2xl: calc(var(--padding) + var(--container-padding)); --catch-width-lg: var(--container-padding-lg); --catch-width-md: var(--container-padding-md); position: relative; background-color: var(--c-blue-800);} .p-homeBusiness-inner { margin-left: var(--padding); padding-left: var(--spc-28); @media (max-width: 1280px) { padding-left: var(--spc-20); } @media (max-width: 768px) { margin-left: 0; padding-left: var(--spc-10); }} .p-homeBusiness-head + .p-homeBusiness-content { margin-top: var(--spc-6);} .p-homeBusiness-content > li + li { margin-top: var(--spc-10); padding-top: var(--spc-10); border-top: solid .1rem var(--c-blue-700);} .p-homeBusiness__catch { position: absolute; inset: 0 auto 0 0; width: var(--catch-width); background-size: cover; background-position: center; background-repeat: no-repeat; transition: none; @media (max-width: 1280px) { width: var(--catch-width-2xl); } @media (max-width: 768px) { width: var(--catch-width-lg); } @media (max-width: 600px) { width: var(--catch-width-md); }} .p-homeNews { background-color: var(--c-blue-900);} .p-homeNews-inner { display: grid; grid-template-columns: 1fr auto; column-gap: var(--spc-28); row-gap: var(--spc-16); @media (max-width: 1024px) { grid-template-columns: 1fr; } @media (max-width: 768px) { row-gap: var(--spc-6); }} .p-homeNews-head { grid-column: 2 / 3; grid-row: 1 / 2; @media (max-width: 1024px) { grid-column: 1 / 2; }} .p-homeNews-content { grid-column: 1 / 2; grid-row: 1 / 2; @media (max-width: 1024px) { grid-column: 1 / 2; grid-row: 2 / 3; }} .p-homeNews-bottom { grid-column: 1 / 3; grid-row: 2 / 3; @media (max-width: 1024px) { grid-column: 1 / 2; grid-row: 3 / 4; }} .p-homeNews__list > li + li { border-top: solid .1rem var(--c-blue-800);} .p-homeRecruit { --margin: calc((100vw - var(--container-max-width)) / 2 + var(--container-padding)); --kv-width: calc(100vw - (var(--spc-32) + var(--margin))); position: relative;} .p-homeRecruit__kv { position: absolute; inset: 0 0 0 auto; width: var(--kv-width); background-size: cover; background-position: center; background-repeat: no-repeat; transition: none; @media (max-width: 1280px) { width: calc(100% - var(--spc-52)); }}