@charset "UTF-8"; @font-face { font-family: "LINE Seed"; src: url("../fonts/LINESeedJP_OTF_Rg.woff2") format("woff2"); font-weight: normal; font-style: normal; } @font-face { font-family: "LINE Seed"; src: url("../fonts/LINESeedJP_OTF_Bd.woff2") format("woff2"); font-weight: bold; font-style: normal; } /*** The new CSS reset - version 1.8.2 (last updated 23.12.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, 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: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu { list-style: none; } /* For images to not be able to exceed their container */ /* 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; } /* 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; } /* preformatted text - use only for this feature */ pre { all: revert; } /* reset default text opacity of input placeholder */ ::-moz-placeholder { color: unset; } ::placeholder { color: unset; } /* remove default dot (•) sign */ ::marker { content: ""; } /* 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; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable=true]) { -webkit-user-drag: element; } /* Revert Modal native behavior */ :where(dialog:modal) { all: revert; } /*css調整*/ html { font-family: NotoSansCJKjp, sans-serif; font-size: 0.58vw; } @media screen and (max-width: 767px) { html { font-size: 1.3vw; } } body { font-size: 1.6rem; max-width: 198rem; margin: 0 auto; } .Inner { width: 1000px; margin: 0 auto; padding: 0; } .header { position: fixed; top: 0; left: 0; right: 0; padding: 3.891rem; z-index: 1000; color: #ffffff; } @media screen and (min-width: 768px) { .header { padding: 3.8rem 9.8rem 4rem; } } .header--lower { color: #066DFA; } .header__inner { display: flex; justify-content: space-between; align-items: center; } .header__logo { z-index: 5; } .header__logo-link { display: block; } .header__logo-image { width: 30.7rem; height: 9.255rem; -o-object-fit: contain; object-fit: contain; } @media screen and (min-width: 768px) { .header__logo-image { width: 23.9rem; height: 7.2rem; } } @media screen and (min-width: 768px) { .header__menu { display: none; } } .header__menu-nav { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: black; display: none; } .header__menu-nav.is-active { display: block; } .header__menu-nav-list { display: flex; flex-direction: column; justify-content: center; align-items: center; height: 100%; color: white; } .header__menu-nav-list.vertical { gap: 2rem; } .header__menu-button { display: flex; align-items: center; gap: 1.1rem; z-index: 5; position: relative; } .header__menu-button-text { font-size: 1.843rem; } .header__menu-button-text .menu-text { display: block; } .header__menu-button-text .menu-text.is-active { display: none; } .header__menu-button-text .cross-text { display: none; } .header__menu-button-text .cross-text.is-active { display: block; } .header__menu-button-hamburger { display: flex; justify-content: center; align-items: center; width: 8.192rem; height: 8.192rem; background-color: white; border-radius: 50%; } .header__menu-button-hamburger.lower { background-color: #066DFA; } .header__menu-button .hamburger { display: block; width: 4.578rem; height: 1.446rem; } .header__menu-button .hamburger.is-active { display: none; } .header__menu-button .cross { display: none; width: 3.916rem; height: 3.821rem; } .header__menu-button .cross.is-active { display: block; } .header__nav { display: none; } @media screen and (min-width: 768px) { .header__nav { display: block; } } .header__nav-list { display: flex; flex-wrap: wrap; list-style: none; padding: 0; margin: 0; justify-content: flex-start; } .header__nav-item { margin-right: 0.2rem; text-align: left; } .header__nav-item:last-child { margin-right: 0; } .header__nav-link { text-decoration: none; transition: opacity 0.3s ease; display: block; padding: 0.5rem 1rem; } .header__nav-link:hover { opacity: 0.8; } .header__nav-link.vertical { display: flex; flex-direction: column; justify-content: center; align-items: center; } .header__nav-main { display: block; font-size: 3.68rem; font-weight: 600; text-transform: uppercase; line-height: 1.2; } @media screen and (min-width: 768px) { .header__nav-main { font-size: 1.8rem; } } .header__nav-sub { display: block; font-size: 2.66rem; font-weight: normal; line-height: 1.2; font-family: "LINE Seed", sans-serif; font-weight: normal; } @media screen and (min-width: 768px) { .header__nav-sub { font-size: 1.3rem; } } .footer { background-color: black; color: white; padding: 10rem 0 20.442rem 0; display: flex; flex-direction: column; align-items: center; gap: 3rem; } @media screen and (min-width: 768px) { .footer { padding: 8.5rem 0 10.1rem; gap: 4rem; } } .footer__logo { margin-top: 3.144rem; } @media screen and (min-width: 768px) { .footer__logo { margin-top: 0; } } .footer__logo-link { display: block; } .footer__logo-image { width: 30.72rem; height: 9.255rem; -o-object-fit: contain; object-fit: contain; } @media screen and (min-width: 768px) { .footer__logo-image { width: 23.9rem; height: 7.2rem; } } .footer__nav-list { display: flex; flex-direction: column; gap: 3.686rem; align-items: center; flex-wrap: wrap; list-style: none; padding: 0; margin: 0; justify-content: flex-start; } @media screen and (min-width: 768px) { .footer__nav-list { flex-direction: row; align-items: flex-start; gap: 2rem; } } .footer__nav-item { margin-right: 0.2rem; text-align: left; } .footer__nav-item:last-child { margin-right: 0; } .footer__nav-link { color: #ffffff; text-decoration: none; transition: opacity 0.3s ease; display: block; padding: 0.5rem 1rem; } .footer__nav-link:hover { opacity: 0.8; } .footer__nav-main { display: block; font-size: 3.072rem; font-weight: 600; text-transform: uppercase; line-height: 1.2; text-align: center; } @media screen and (min-width: 768px) { .footer__nav-main { text-align: left; font-size: 1.8rem; } } .footer__nav-sub { display: block; font-size: 2.253rem; font-weight: normal; line-height: 1.2; text-align: center; font-family: "LINE Seed", sans-serif; font-weight: normal; } @media screen and (min-width: 768px) { .footer__nav-sub { text-align: left; font-size: 1.3rem; } } .footer__copyright { margin-top: 5.358rem; } @media screen and (min-width: 768px) { .footer__copyright { margin-top: 0; font-size: 1.4rem; } } .fv { background-image: url("../images/fv-bg.webp"); background-size: cover; background-position: center; width: 100%; height: 174rem; position: relative; overflow: hidden; } @media screen and (min-width: 768px) { .fv { height: 88rem; } } .fv__image1 { width: 28.8rem; height: 28.8rem; position: absolute; top: 118.4rem; right: -2.5rem; z-index: 3; } @media screen and (min-width: 768px) { .fv__image1 { z-index: 0; width: 24rem; height: 24rem; top: 15rem; left: 10.4rem; } } .fv__image2 { width: 28.8rem; height: 28.8rem; position: absolute; top: 75.1rem; left: -3.2rem; z-index: 1; } @media screen and (min-width: 768px) { .fv__image2 { width: 24rem; height: 24rem; top: 20rem; left: auto; right: 7.4rem; } } .fv__image3 { position: absolute; left: 11rem; top: 128rem; z-index: 3; width: 28.8rem; height: 28.8rem; } @media screen and (min-width: 768px) { .fv__image3 { z-index: 1; width: 24rem; height: 24rem; top: auto; left: auto; right: 84.5rem; bottom: 4.9rem; } } .fv__content { color: white; padding: 21.9rem 3.8rem 0 3.8rem; z-index: 1; display: flex; flex-direction: column; align-items: center; } @media screen and (min-width: 768px) { .fv__content { align-items: flex-start; padding-top: 35rem; padding-left: 9.4rem; } } .fv__title { font-size: 7.987rem; display: flex; flex-direction: column; font-weight: bold; position: relative; z-index: 1; text-align: center; } @media screen and (min-width: 768px) { .fv__title { font-size: 10rem; text-align: left; } } .fv__title span { font-size: 6.758rem; } @media screen and (min-width: 768px) { .fv__title span { font-size: 6.4rem; } } .fv__subtitle { font-size: 4.5rem; margin-top: 2.5rem; z-index: 1; position: relative; font-family: "LINE Seed", sans-serif; font-weight: normal; } @media screen and (min-width: 768px) { .fv__subtitle { font-size: 4rem; margin-top: 2.4rem; } } .fv__description { font-size: 3.27rem; margin-top: 1.7rem; z-index: 1; position: relative; text-align: center; font-family: "LINE Seed", sans-serif; font-weight: normal; } @media screen and (min-width: 768px) { .fv__description { font-size: 1.7rem; margin-top: 2rem; text-align: left; } } .fv__description br { display: none; text-align: center; } @media screen and (min-width: 768px) { .fv__description br { display: block; text-align: left; } } .fv .hero { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; overflow: hidden; } .fv .hero__bg { width: 100%; height: 71.6rem; position: absolute; right: 0; bottom: 20.4rem; z-index: 0; } @media screen and (min-width: 768px) { .fv .hero__bg { width: 98rem; height: 73rem; bottom: 0; } } .fv .hero__main { position: absolute; left: -4rem; bottom: 20.4rem; width: 92.97rem; aspect-ratio: 1008/880; z-index: 2; overflow: hidden; } @media screen and (min-width: 768px) { .fv .hero__main { right: -1.7rem; left: auto; width: 90rem; bottom: 0; } } .section { padding-bottom: 18.342rem; } @media screen and (min-width: 768px) { .section { padding-bottom: 16.9rem; } } .section:last-child { padding-bottom: 4rem; } @media screen and (min-width: 768px) { .section:last-child { padding-bottom: 8rem; } } .section__inner { z-index: 3; position: relative; margin: 0 auto; width: 100%; border-radius: 2rem 2rem 0 0; margin-top: -10.2rem; max-width: 69.01rem; } @media screen and (min-width: 768px) { .section__inner { margin-top: -10rem; max-width: 115rem; } } .section__inner.white { background-color: white; } .section__inner.lightblue { background-color: #01A7FF; } .section__inner.blue { background-color: #066DFA; } .section__header { display: flex; align-items: center; justify-content: center; gap: 1.2rem; padding-top: 2.867rem; } @media screen and (min-width: 768px) { .section__header { justify-content: flex-start; gap: 2.5rem; padding-top: 5.1rem; padding-left: 8.2rem; } } .section__title { font-size: 6.14rem; font-weight: bold; } @media screen and (min-width: 768px) { .section__title { font-size: 5rem; } } .section__subtitle { font-size: 2.86rem; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .section__subtitle { font-size: 1.8rem; } } .section.white { color: #066DFA; background: linear-gradient(rgba(0, 0, 0, 0) 10.2rem, white 10.2rem); } @media screen and (min-width: 768px) { .section.white { background: linear-gradient(rgba(0, 0, 0, 0) 10rem, white 10rem); } } .section.lightblue { color: white; background: linear-gradient(rgba(0, 0, 0, 0) 10.2rem, #01A7FF 10.2rem); } @media screen and (min-width: 768px) { .section.lightblue { background: linear-gradient(rgba(0, 0, 0, 0) 10rem, #01A7FF 10rem); } } .section.blue { color: white; background: linear-gradient(rgba(0, 0, 0, 0) 10.2rem, #066DFA 10.2rem); } @media screen and (min-width: 768px) { .section.blue { background: linear-gradient(rgba(0, 0, 0, 0) 10rem, #066DFA 10rem); } } .section__news { color: black; padding: 0; margin-top: 2.3rem; } @media screen and (min-width: 768px) { .section__news { padding: 0 7.5rem; margin-top: 2.9rem; } } .section__news-item { display: flex; gap: 1.1rem; justify-content: space-between; align-items: center; border-top: 1px dotted black; padding: 4.3rem 1.638rem; } @media screen and (min-width: 768px) { .section__news-item { padding: 3.3rem 0; } } .section__news-item:first-child { border-top: 1px solid black; } .section__news-item:last-child { border-bottom: 1px solid black; } .section__news-item-inner { display: flex; flex-direction: column; gap: 1rem; } @media screen and (min-width: 768px) { .section__news-item-inner { flex-direction: row; gap: 3.1rem; } } .section__news-item-info { display: flex; align-items: center; gap: 1.2rem; } .section__news-item svg { flex-shrink: 0; display: inline-block; width: 3.686rem; height: 3.277rem; } @media screen and (min-width: 768px) { .section__news-item svg { width: 1.8rem; height: 1.6rem; } } .section__news-date { font-size: 2.867rem; font-weight: bold; } @media screen and (min-width: 768px) { .section__news-date { font-size: 2rem; } } .section__news-category { border-radius: 999rem; background-color: #398CFF; color: #E5FF1A; padding: 0.25rem 2.5rem; font-size: 2.458rem; font-weight: bold; min-width: 14rem; text-align: center; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .section__news-category { font-size: 1.6rem; padding: 0.25rem 4rem; } } .section__news-new { font-weight: semi-bold; color: #FF3939; border: 1px solid #FF3939; border-radius: 0.5rem; font-size: 2.458rem; padding: 0.2rem 0.8rem; margin-right: 0.5rem; } @media screen and (min-width: 768px) { .section__news-new { font-size: 1.6rem; } } .section__news-title { font-size: 3.072rem; font-family: "LINE Seed", sans-serif; font-weight: normal; display: -webkit-box; -webkit-line-clamp: 2; /* 表示する行数 */ -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; max-height: 3em; /* おおよその3行分の高さ */ } .section__news-title a { text-decoration: underline; } @media screen and (min-width: 768px) { .section__news-title { font-size: 1.8rem; } } .section__column { display: grid; gap: 2.9rem; margin-top: 6.731rem; } @media screen and (min-width: 768px) { .section__column { margin-top: 0rem; grid-template-columns: repeat(3, 1fr); padding: 3.5rem 7.5rem 0 7.5rem; } } .section__column-item { display: flex; flex-direction: column; gap: 1.5rem; } .section__column-image { width: 100%; aspect-ratio: 350/220; display: inline-block; border-radius: 0.8rem; -o-object-fit: cover; object-fit: cover; } .section__column-info { display: flex; gap: 1.2rem; align-items: center; } .section__column-date { font-size: 2.867rem; font-weight: bold; color: #E5FF1A; } @media screen and (min-width: 768px) { .section__column-date { font-size: 2rem; } } .section__column-category { border-radius: 999rem; background-color: #E5FF1A; color: #398CFF; padding: 0.25rem 4rem; font-size: 2.458rem; font-weight: bold; min-width: 14rem; text-align: center; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .section__column-category { font-size: 1.6rem; } } .section__column-title { display: flex; align-items: center; justify-content: space-between; gap: 1.4rem; } .section__column-title-text { font-size: 3.686rem; font-weight: bold; margin-top: 1.5rem; color: white; text-decoration: underline; font-family: "LINE Seed", sans-serif; font-weight: bold; display: -webkit-box; -webkit-line-clamp: 3; /* 表示する行数 */ -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; max-height: 4.5em; /* おおよその3行分の高さ */ } @media screen and (min-width: 768px) { .section__column-title-text { font-size: 2.2rem; } } .section__column-title svg { width: 3.686rem; height: 3.277rem; flex-shrink: 0; } @media screen and (min-width: 768px) { .section__column-title svg { width: 1.8rem; height: 1.6rem; } } .section__column-link { background-color: white; padding: 2.5rem 0; width: 100%; display: inline-block; text-align: center; border-radius: 999px; color: #398CFF; font-size: 3.686rem; font-weight: bold; position: relative; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .section__column-link { padding: 2.1rem 0; width: 48.5rem; font-size: 2.2rem; } } .section__column-link svg { position: absolute; right: 5.734rem; top: 50%; transform: translateY(-50%); width: 3.686rem; height: 3.277rem; } @media screen and (min-width: 768px) { .section__column-link svg { right: 2.6rem; width: 1.8rem; height: 1.6rem; } } .section__column-cta { display: flex; justify-content: center; margin-top: 5rem; } @media screen and (min-width: 768px) { .section__vision { padding: 3.5rem 7.5rem 0 7.5rem; } } .section__vision-theme { color: #E5FF1A; font-size: 4.506rem; font-family: "LINE Seed", sans-serif; font-weight: bold; margin-top: 5.093rem; text-align: center; } @media screen and (min-width: 768px) { .section__vision-theme { text-align: left; font-size: 3.4rem; margin-top: 0; } } @media screen and (min-width: 768px) { .section__vision-theme br { display: none; } } .section__vision-description { font-size: 3.277rem; margin-top: 2rem; font-family: "LINE Seed", sans-serif; font-weight: normal; } @media screen and (min-width: 768px) { .section__vision-description { margin-top: 3rem; font-size: 1.8rem; } } .section__vision-content { display: grid; gap: 2.4rem; margin-top: 6.144rem; } @media screen and (min-width: 768px) { .section__vision-content { grid-template-columns: repeat(3, 1fr); margin-top: 2.4rem; } } .section__vision-image { width: 100%; aspect-ratio: 350/220; display: inline-block; border-radius: 0.8rem; } @media screen and (min-width: 768px) { .section__vision-image { border-radius: 3rem; } } .section__vision-item-title { font-size: 3.686rem; margin-top: 2rem; color: #E5FF1A; text-align: center; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .section__vision-item-title { text-align: left; font-size: 2.2rem; } } .section__vision-item-description { font-size: 3.277rem; margin-top: 1.2rem; font-family: "LINE Seed", sans-serif; font-weight: normal; } @media screen and (min-width: 768px) { .section__vision-item-description { font-size: 1.8rem; margin-top: 2rem; } } .section__vision-cta { display: flex; justify-content: center; margin-top: 5rem; } @media screen and (min-width: 768px) { .section__buddy { padding: 3.5rem 7.5rem 0 7.5rem; } } .section__buddy-theme { color: #E5FF1A; font-size: 3.4rem; font-weight: bold; } .section__buddy-description { font-size: 1.8rem; margin-top: 3rem; } .section__buddy-content { display: grid; gap: 2.4rem; margin-top: 6.731rem; } @media screen and (min-width: 768px) { .section__buddy-content { margin-top: 2.4rem; grid-template-columns: repeat(3, 1fr); } } .section__buddy-image { width: 100%; aspect-ratio: 350/220; display: inline-block; border-radius: 0.8rem; -o-object-fit: cover; object-fit: cover; } @media screen and (min-width: 768px) { .section__buddy-image { border-radius: 3rem; } } .section__buddy-item-title { font-size: 3.686rem; text-align: center; margin-top: 2rem; color: #E5FF1A; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .section__buddy-item-title { text-align: left; font-size: 2.2rem; margin-top: 3rem; } } .section__buddy-item-description { font-size: 3.277rem; margin-top: 1.2rem; font-family: "LINE Seed", sans-serif; font-weight: normal; } @media screen and (min-width: 768px) { .section__buddy-item-description { font-size: 1.8rem; margin-top: 2rem; } } .section__buddy-link { background-color: white; padding: 2.5rem 0; width: 100%; display: inline-block; text-align: center; border-radius: 999px; color: #398CFF; font-size: 3.686rem; font-weight: bold; position: relative; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .section__buddy-link { padding: 2.1rem 0; width: 48.5rem; font-size: 2.2rem; } } .section__buddy-link svg { position: absolute; right: 5.734rem; top: 50%; transform: translateY(-50%); width: 3.686rem; height: 3.277rem; } @media screen and (min-width: 768px) { .section__buddy-link svg { right: 2.6rem; width: 1.8rem; height: 1.6rem; } } .section__buddy-cta { display: flex; justify-content: center; margin-top: 3rem; } @media screen and (min-width: 768px) { .section__buddy-cta { margin-top: 5rem; } } @media screen and (min-width: 768px) { .section__business { padding: 3.5rem 7.5rem 0 7.5rem; } } .section__business-theme { color: #E5FF1A; font-size: 3.4rem; font-weight: bold; } .section__business-description { font-size: 1.8rem; margin-top: 3rem; } .section__business-content { display: grid; gap: 6.144rem; margin-top: 6.731rem; } @media screen and (min-width: 768px) { .section__business-content { margin-top: 2.4rem; gap: 5.9rem; grid-template-columns: repeat(2, 1fr); } } .section__business-image { width: 100%; aspect-ratio: 520/327; display: inline-block; border-radius: 0.8rem; -o-object-fit: cover; object-fit: cover; } @media screen and (min-width: 768px) { .section__business-image { border-radius: 3rem; } } .section__business-item-title { font-size: 3.686rem; margin-top: 2.041rem; color: #066DFA; text-decoration: underline; position: relative; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .section__business-item-title { font-size: 3.2rem; margin-top: 3rem; } } .section__business-item-title svg { position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 3.686rem; height: 3.277rem; } @media screen and (min-width: 768px) { .section__business-item-title svg { width: 1.8rem; height: 1.6rem; } } .section__business-item-description { font-size: 1.8rem; margin-top: 2rem; } .lower__inner { max-width: 100rem; margin: 0 auto; width: 100%; } .sales-promotion { padding: 6.144rem 3.891rem 8.192rem 3.891rem; } @media (min-width: 768px) { .sales-promotion { padding: 10rem 0 9rem 0; } } .sales-promotion__catchphrase { font-size: 4.301rem; font-weight: 700; color: #066DFA; } @media (min-width: 768px) { .sales-promotion__catchphrase { font-size: 3.1rem; } } .sales-promotion__content { margin-top: 6.144rem; } .sales-promotion__content:first-of-type { margin-top: 4rem; } @media (min-width: 768px) { .sales-promotion__content { margin-top: 3.2rem; } } .sales-promotion__content-title { font-size: 3.686rem; font-weight: 700; } @media (min-width: 768px) { .sales-promotion__content-title { font-size: 2.6rem; } } .sales-promotion__content-description { font-size: 3.277rem; font-weight: 400; margin-top: 2.2rem; } @media (min-width: 768px) { .sales-promotion__content-description { font-size: 1.8rem; line-height: 177%; } } .sales-promotion__content-image { margin-top: 4.2rem; width: 100%; aspect-ratio: 337/197; -o-object-fit: cover; object-fit: cover; border-radius: 1.638rem; } @media (min-width: 768px) { .sales-promotion__content-image { aspect-ratio: 1100/350; } } .sales-promotion__cta { margin-top: 8.192rem; display: flex; justify-content: center; } @media (min-width: 768px) { .sales-promotion__cta { margin-top: 3.2rem; } } .sales-promotion__cta-link { background-color: #066DFA; padding: 2.6rem 0; width: 64.922rem; display: inline-block; text-align: center; border-radius: 999px; color: white; font-size: 3.686rem; font-weight: bold; position: relative; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media (min-width: 768px) { .sales-promotion__cta-link { font-size: 2.2rem; width: 48.5rem; padding: 2.1rem 0; } } .sales-promotion__cta-link svg { position: absolute; right: 5.734rem; top: 50%; transform: translateY(-50%); width: 3.686rem; height: 3.277rem; } @media (min-width: 768px) { .sales-promotion__cta-link svg { right: 2.6rem; width: 1.8rem; height: 1.6rem; } } .sales-promotion__cta-cta { display: flex; justify-content: center; margin-top: 5rem; } .subsidies { padding: 6.144rem 3.891rem 8.192rem 3.891rem; } @media (min-width: 768px) { .subsidies { padding: 10rem 0 9rem 0; } } .subsidies__catchphrase { font-size: 4.301rem; font-weight: 700; color: #066DFA; } @media (min-width: 768px) { .subsidies__catchphrase { font-size: 3.1rem; } } .subsidies__content { margin-top: 3.2rem; } .subsidies__content-title { font-size: 3.686rem; font-weight: 700; } @media (min-width: 768px) { .subsidies__content-title { font-size: 2.6rem; } } .subsidies__content-description { font-size: 3.277rem; font-weight: 400; margin-top: 2.2rem; } @media (min-width: 768px) { .subsidies__content-description { font-size: 1.4rem; } } .subsidies__content-image { margin-top: 6.144rem; width: 100%; aspect-ratio: 337/197; -o-object-fit: cover; object-fit: cover; border-radius: 1.638rem; } @media (min-width: 768px) { .subsidies__content-image { aspect-ratio: 1100/350; } } .subsidies__cta { margin-top: 8.192rem; display: flex; justify-content: center; } .subsidies__cta-link { background-color: #066DFA; padding: 2.6rem 0; width: 64.922rem; display: inline-block; text-align: center; border-radius: 999px; color: white; font-size: 3.686rem; font-weight: bold; position: relative; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media (min-width: 768px) { .subsidies__cta-link { font-size: 2.2rem; width: 48.5rem; padding: 2.1rem 0; } } .subsidies__cta-link svg { position: absolute; right: 5.734rem; top: 50%; transform: translateY(-50%); width: 3.686rem; height: 3.277rem; } @media (min-width: 768px) { .subsidies__cta-link svg { right: 2.6rem; width: 1.8rem; height: 1.6rem; } } .subsidies__cta-cta { display: flex; justify-content: center; margin-top: 5rem; } .it-solutions { padding: 6.144rem 3.891rem 8.192rem 3.891rem; } @media (min-width: 768px) { .it-solutions { padding: 10rem 0 9rem 0; } } .it-solutions__catchphrase { font-size: 4.301rem; font-weight: 700; color: #066DFA; } @media (min-width: 768px) { .it-solutions__catchphrase { font-size: 3.1rem; } } .it-solutions__content { display: grid; gap: 6.144rem; margin-top: 5.12rem; } @media screen and (min-width: 768px) { .it-solutions__content { grid-template-columns: 1fr 1fr; gap: 5.9rem; } } .it-solutions__content-image { width: 100%; aspect-ratio: 520/327; -o-object-fit: cover; object-fit: cover; border-radius: 1.5rem; } .it-solutions__content-title { margin-top: 4.096rem; font-size: 3.686rem; font-weight: bold; } @media (min-width: 768px) { .it-solutions__content-title { font-size: 3rem; } } .it-solutions__content-description { margin-top: 2.048rem; font-size: 3.277rem; font-weight: 400; } @media (min-width: 768px) { .it-solutions__content-description { font-size: 1.8rem; } } .company__section-header { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 2.021rem; } @media screen and (min-width: 768px) { .company__section-header { gap: 2.5rem; flex-direction: row; justify-content: flex-start; } } .company__section-title { color: #066DFA; font-size: 6.14rem; font-weight: bold; } @media screen and (min-width: 768px) { .company__section-title { font-size: 5rem; } } .company__section-subtitle { color: #066DFA; font-size: 2.86rem; font-weight: bold; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .company__section-subtitle { font-size: 2rem; } } .company__top-message { padding: 8.192rem 3.891rem; max-width: 110rem; margin: 0 auto; } @media screen and (min-width: 768px) { .company__top-message { padding: 10rem 0 10rem 0; grid-template-columns: 1fr 1fr; gap: 5.9rem; } } .company__top-message-inner { display: grid; gap: 5.12rem; margin-top: 5.12rem; } @media screen and (min-width: 768px) { .company__top-message-inner { grid-template-columns: 1fr 1fr; gap: 5.9rem; margin-top: 5.5rem; } } .company__top-message-content { display: flex; flex-direction: column; justify-content: space-between; order: 2; gap: 2.048rem; } @media screen and (min-width: 768px) { .company__top-message-content { order: 1; } } .company__top-message-content-title { font-size: 3.686rem; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .company__top-message-content-title { font-size: 3rem; } } .company__top-message-content-body { font-size: 3.277rem; font-family: "LINE Seed", sans-serif; font-weight: normal; line-height: 170%; } @media screen and (min-width: 768px) { .company__top-message-content-body { font-size: 1.8rem; } } .company__top-message-content-cto { font-size: 3.277rem; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .company__top-message-content-cto { font-size: 2.2rem; } } .company__top-message-image { width: 100%; aspect-ratio: 337/197; order: 1; border-radius: 1.638rem; display: inline-block; -o-object-fit: cover; object-fit: cover; } @media screen and (min-width: 768px) { .company__top-message-image { order: 2; aspect-ratio: 520/528; border-radius: 1.5rem; } } .company__main-client { background-color: #EDEDED; padding: 8.192rem 3.891rem 8.192rem 3.891rem; } @media (min-width: 768px) { .company__main-client { padding: 9.8rem 0; } } .company__main-client-inner { max-width: 110rem; margin: 0 auto; } .company__main-client-list { font-size: 3.482rem; line-height: 170%; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .company__main-client-list { font-size: 2rem; } } .company__main-client-list-wrapper { margin-top: 5.12rem; display: grid; } @media screen and (min-width: 768px) { .company__main-client-list-wrapper { grid-template-columns: 1fr 1fr; gap: 5.9rem; } } .company__overview { padding: 8.192rem 3.891rem 8.192rem 3.891rem; } @media (min-width: 768px) { .company__overview { padding: 10rem 0 10rem 0; } } .company__overview-inner { max-width: 110rem; margin: 0 auto; } .company__overview-table { width: 100%; margin-top: 6.144rem; } @media screen and (min-width: 768px) { .company__overview-table { margin-top: 2.4rem; } } .company__overview-table iframe { border: 0; width: 100%; aspect-ratio: 337/197; margin-top: 3.277rem; } @media screen and (min-width: 768px) { .company__overview-table iframe { aspect-ratio: 1100/450; } } .company__overview-table-row { padding-top: 4.915rem; padding-bottom: 4.915rem; border-top: 0.205rem solid black; } @media screen and (min-width: 768px) { .company__overview-table-row { padding-top: 3.2rem; padding-bottom: 3.2rem; border-top: 0.1rem solid black; } } .company__overview-table-row:last-child { border-bottom: 0.205rem solid black; } @media screen and (min-width: 768px) { .company__overview-table-row:last-child { border-bottom: 0.1rem solid black; } } .company__overview-table-inner { display: flex; gap: 3.9rem; } .company__overview-table-property { width: 13.109rem; font-size: 3.277rem; flex-shrink: 0; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .company__overview-table-property { font-size: 2.2rem; width: 20rem; } } .company__overview-table-value { font-size: 3.277rem; font-family: "LINE Seed", sans-serif; font-weight: normal; } @media screen and (min-width: 768px) { .company__overview-table-value { font-size: 2.2rem; } } @media screen and (min-width: 768px) { .company__overview-table-value br { display: none; } } .company__history { background-color: #EDEDED; padding: 8.192rem 3.891rem 8.192rem 3.891rem; } @media (min-width: 768px) { .company__history { padding: 10rem 0 10rem 0; } } .company__history-inner { max-width: 110rem; margin: 0 auto; } .company__history-table { width: 100%; margin-top: 6.144rem; } @media screen and (min-width: 768px) { .company__history-table { margin-top: 2.4rem; } } .company__history-table iframe { border: 0; width: 100%; aspect-ratio: 337/197; margin-top: 3.277rem; } .company__history-table-row { padding-top: 4.915rem; padding-bottom: 4.915rem; border-top: 0.205rem solid black; } @media screen and (min-width: 768px) { .company__history-table-row { padding-top: 3.2rem; padding-bottom: 3.2rem; border-top: 0.1rem solid black; } } .company__history-table-row:last-child { border-bottom: 0.205rem solid black; } @media screen and (min-width: 768px) { .company__history-table-row:last-child { border-bottom: 0.1rem solid black; } } .company__history-table-inner { display: flex; gap: 3.9rem; } .company__history-table-property { width: 13.109rem; font-size: 3.277rem; flex-shrink: 0; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .company__history-table-property { font-size: 2.2rem; width: 20rem; } } .company__history-table-value { font-size: 3.277rem; font-family: "LINE Seed", sans-serif; font-weight: normal; } @media screen and (min-width: 768px) { .company__history-table-value { font-size: 2.2rem; } } .commodities { padding: 6.144rem 3.891rem 8.192rem 3.891rem; } @media (min-width: 768px) { .commodities { padding: 10rem 0 9rem 0; } } .commodities__catchphrase { font-size: 4.301rem; font-weight: 700; color: #066DFA; } @media (min-width: 768px) { .commodities__catchphrase { font-size: 3.1rem; } } .commodities__content { display: grid; gap: 6.144rem; } @media screen and (min-width: 768px) { .commodities__content { grid-template-columns: 1fr 1fr; gap: 5.9rem; } } .commodities__content-image { width: 100%; aspect-ratio: 520/327; -o-object-fit: cover; object-fit: cover; border-radius: 1.5rem; } .commodities__content-title { margin-top: 4.096rem; font-size: 3.686rem; font-weight: bold; } @media (min-width: 768px) { .commodities__content-title { font-size: 3rem; margin-top: 2.5rem; } } .commodities__content-description { margin-top: 2.048rem; font-size: 3.277rem; font-weight: 400; } @media (min-width: 768px) { .commodities__content-description { font-size: 1.8rem; } } .column { padding: 6.144rem 3.891rem 8.192rem 3.891rem; } @media (min-width: 768px) { .column { padding: 10rem 0 9rem 0; } } .column__content { display: grid; gap: 6.144rem; } @media (min-width: 768px) { .column__content { grid-template-columns: repeat(2, 1fr); gap: 5.9rem; } } .column__item { display: flex; flex-direction: column; gap: 3.277rem; } @media screen and (min-width: 768px) { .column__item { gap: 1.5rem; } } .column__item-image { width: 100%; aspect-ratio: 337/197; display: inline-block; border-radius: 0.8rem; -o-object-fit: cover; object-fit: cover; } @media screen and (min-width: 768px) { .column__item-image { aspect-ratio: 520/327; } } .column__item-info { display: flex; align-items: center; justify-content: space-between; } .column__item-info-inner { display: flex; gap: 1.2rem; } .column__item-date { font-size: 2.867rem; font-weight: bold; color: #398CFF; } @media screen and (min-width: 768px) { .column__item-date { font-size: 2rem; } } .column__item-category { border-radius: 999rem; background-color: #E5FF1A; color: #398CFF; padding: 0.25rem 4rem; font-size: 2.458rem; font-weight: bold; min-width: 14rem; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .column__item-category { font-size: 1.6rem; } } .column__item-title { display: flex; align-items: center; justify-content: space-between; gap: 1.4rem; margin-top: 2.048rem; } @media screen and (min-width: 768px) { .column__item-title { margin-top: 1.3rem; } } .column__item-title-text { font-size: 3.686rem; font-weight: bold; text-decoration: underline; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .column__item-title-text { font-size: 2.8rem; } } .column__item-title-text a { overflow: hidden; white-space: normal; text-overflow: ellipsis; -webkit-line-clamp: 3; display: -webkit-box; max-height: 139.5px; } .column__item-title svg { width: 3.686rem; height: 3.277rem; flex-shrink: 0; } @media screen and (min-width: 768px) { .column__item-title svg { width: 1.8rem; height: 1.6rem; } } .column__item-link { background-color: white; padding: 2.1rem 0; width: 100%; display: inline-block; text-align: center; border-radius: 999px; color: #398CFF; font-size: 1.8rem; font-weight: bold; position: relative; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .column__item-link { width: 48.5rem; font-size: 2.2rem; } } .column__item-link svg { position: absolute; right: 2.6rem; top: 50%; transform: translateY(-50%); } .column__item-cta { display: flex; justify-content: center; margin-top: 5rem; } .column__item-summary { margin-top: 3.072rem; } @media screen and (min-width: 768px) { .column__item-summary { margin-top: 1.8rem; } } .column__item-summary .post-excerpt { font-size: 3.277rem; } @media screen and (min-width: 768px) { .column__item-summary .post-excerpt { font-size: 1.8rem; } } .column__item-summary .read-more { color: #398CFF; text-decoration: underline; } .column .pagination { color: #398CFF; font-size: 4.096rem; font-weight: bold; display: flex; justify-content: center; margin-top: 7.168rem; border-top: 0.205rem solid black; } @media screen and (min-width: 768px) { .column .pagination { font-size: 3rem; } } .column .pagination__list { display: flex; gap: 5.086rem; margin-top: 7.168rem; } @media screen and (min-width: 768px) { .column .pagination__list { gap: 2rem; } } .column .pagination__item .page-numbers { color: #B6D5FF; text-decoration: underline; } .column .pagination__item .page-numbers.current { color: #398CFF; text-decoration: none; } .column .pagination__item .prev svg { width: 3rem; height: 2.7rem; display: inline-block; } .column .pagination__item .next svg { width: 3rem; height: 2.7rem; display: inline-block; } .buddy { max-width: 100%; } .buddy__content:nth-child(even) { background-color: #EDEDED; } .buddy__content-inner { display: grid; padding: 8.192rem 3.891rem; max-width: 110rem; } @media screen and (min-width: 768px) { .buddy__content-inner { grid-template-columns: 1fr 1fr; -moz-column-gap: 5.9rem; column-gap: 5.9rem; padding: 10rem 0 9rem 0; margin: 0 auto; } } @media (min-width: 768px) { .buddy__content .pc-reverse { flex-direction: row-reverse; } } .buddy__content-catchphrase { font-size: 4.301rem; font-family: "LINE Seed", sans-serif; font-weight: bold; color: #066DFA; } @media screen and (min-width: 768px) { .buddy__content-catchphrase { font-size: 3rem; } } .buddy__content-name { font-size: 3.686rem; color: #066DFA; margin-top: 3.072rem; margin-bottom: 5.12rem; font-family: "LINE Seed", sans-serif; font-weight: bold; } @media screen and (min-width: 768px) { .buddy__content-name { font-size: 2.2rem; margin-top: 1.3rem; margin-bottom: 0; } } .buddy__content-image { width: 69.018rem; aspect-ratio: 337/197; -o-object-fit: cover; object-fit: cover; border-radius: 1.638rem; -o-object-position: center; object-position: center; image-rendering: -webkit-optimize-contrast; /* Safari */ image-rendering: crisp-edges; /* Firefox */ image-rendering: pixelated; /* Chrome */ } @media screen and (min-width: 768px) { .buddy__content-image { width: 100%; aspect-ratio: 520/528; margin-top: 0; grid-row: 1/4; grid-column: 2/3; } } @media screen and (min-width: 768px) { .buddy__content-qa-1 { padding-top: 2.2rem; } } @media screen and (min-width: 768px) { .buddy__content-qa-2 { grid-column: 1/3; padding-top: 5rem; } } @media screen and (min-width: 768px) { .buddy__content-qa-3 { grid-column: 1/3; padding-top: 5rem; } } .buddy__content-question { font-size: 3.686rem; font-family: "LINE Seed", sans-serif; font-weight: bold; margin-top: 5.12rem; } @media screen and (min-width: 768px) { .buddy__content-question { font-size: 1.8rem; margin-top: 0; } } .buddy__content-answer { font-size: 3.277rem; margin-top: 2.048rem; font-family: "LINE Seed", sans-serif; font-weight: normal; line-height: 177%; } @media screen and (min-width: 768px) { .buddy__content-answer { font-size: 1.8rem; margin-top: 2.5rem; } } @media screen and (min-width: 768px) { .contact { max-width: 110rem; margin: 0 auto; } } @media (min-width: 768px) { .contact .lower__fv-content { padding-left: 0; padding-top: 21.5rem; height: auto; } } .contact .wpcf7-radio { display: flex; align-items: center; gap: 1rem; } .contact .wpcf7-list-item { margin-top: 1.639rem; } .contact .wpcf7-list-item label { display: flex; align-items: center; gap: 1rem; } .contact__description { font-size: 3.277rem; padding: 0 3.891rem; margin-top: 7.168rem; } @media (min-width: 768px) { .contact__description { padding: 0; font-size: 1.8rem; margin-top: 3.6rem; } } .contact form { background-color: #EDEDED; padding: 7.168rem 3.891rem; display: flex; flex-direction: column; gap: 5.12rem; margin-top: 7.168rem; } .contact form br { display: none; } @media screen and (min-width: 768px) { .contact form { padding: 5.4rem 5rem; gap: 3rem; border-radius: 1.5rem; margin-bottom: 10rem; } } .contact label { font-family: "LINE Seed", sans-serif; font-weight: bold; font-size: 3.686rem; display: flex; align-items: center; flex-direction: row; gap: 1.2rem; } @media screen and (min-width: 768px) { .contact label { font-size: 2.2rem; gap: 2rem; } } .contact label.optional::before { content: "任意"; color: white; background-color: black; font-size: 2.662rem; padding: 0.3rem 3rem; border-radius: 999px; } @media screen and (min-width: 768px) { .contact label.optional::before { font-size: 1.6rem; padding: 0.2rem 1.8rem; } } .contact label.required::before { content: "必須"; color: white; background-color: #FF3939; font-size: 2.662rem; padding: 0.3rem 3rem; border-radius: 999px; height: 100%; display: inline-block; } @media screen and (min-width: 768px) { .contact label.required::before { font-size: 1.6rem; padding: 0.2rem 1.8rem; } } .contact input { width: 100%; margin-top: 1.639rem; background-color: white; border: 0.205rem solid #C1C1C1; padding: 1.843rem 2.458rem; width: 100%; border-radius: 1rem; font-weight: normal; font-size: 3.686rem; } .contact input::-moz-placeholder { color: #ADADAD; } .contact input::placeholder { color: #ADADAD; } @media screen and (min-width: 768px) { .contact input { padding: 1.6rem 2.9rem; font-size: 2.2rem; } } .contact input[type=radio] { background-color: white; width: 3.866rem; height: 3.866rem; border-radius: 999px; padding: 0; margin-top: 0; border: 0.258rem solid #C1C1C1; } @media screen and (min-width: 768px) { .contact input[type=radio] { width: 3rem; height: 3rem; } } .contact input[type=radio]:checked { background-color: #7A7A7A; border: 0.7rem solid white; } .contact input[type=submit] { background-color: #066DFA; color: white; font-size: 3.686rem; font-weight: bold; border-radius: 999px; text-align: center; justify-self: center; position: relative; border: none; text-align: center; margin-top: 0; height: 10.6rem; } @media screen and (min-width: 768px) { .contact input[type=submit] { font-size: 2.2rem; height: 7.4rem; } } .contact input[type=checkbox] { width: 4.506rem; height: 4.506rem; border: 0.258rem solid #C1C1C1; margin-top: 0; position: relative; flex-shrink: 1; padding: 0; border-radius: 0.5rem; } @media screen and (min-width: 768px) { .contact input[type=checkbox] { width: 3.5rem; height: 3.5rem; } } .contact input[type=checkbox]:checked:before { position: absolute; top: -1rem; left: 1.5rem; transform: rotate(50deg); width: 2rem; height: 4rem; border-right: 0.5rem solid #000; border-bottom: 0.5rem solid #000; content: ""; } @media screen and (min-width: 768px) { .contact input[type=checkbox]:checked:before { top: -0.5rem; left: 1rem; width: 1.5rem; height: 3rem; border-right: 0.3rem solid #000; border-bottom: 0.3rem solid #000; } } .contact textarea { background-color: white; border: 0.205rem solid #C1C1C1; width: 100%; margin-top: 1.639rem; padding: 1.843rem 2.458rem; border-radius: 1rem; font-weight: normal; height: 34.6rem; font-size: 3.6rem; } .contact textarea::-moz-placeholder { color: #ADADAD; } .contact textarea::placeholder { color: #ADADAD; } @media screen and (min-width: 768px) { .contact textarea { padding: 1.2rem 1.6rem; height: 27rem; font-size: 2.2rem; } } .contact .attention { font-weight: normal; font-size: 2.867rem; margin-top: 1.638rem; display: inline-block; } @media screen and (min-width: 768px) { .contact .attention { font-size: 1.6rem; margin-top: 1rem; } } .contact checkbox { background-color: white; } .contact .privacypolicy { font-weight: normal; display: block; } .contact .privacypolicy a { color: #066DFA; text-decoration: underline; } .contact .privacypolicy .wpcf7-list-item-label { font-weight: normal; } .contact .wpcf7-spinner { display: none; } .contact .submit { display: flex; justify-content: center; position: relative; margin: 0 auto; } @media screen and (min-width: 768px) { .contact .submit { width: 48.5rem; } } .contact .submit:after { content: "▶︎"; color: #E5FF1A; position: absolute; right: 5.7rem; top: 50%; transform: translateY(-50%); font-size: 3.277rem; } @media screen and (min-width: 768px) { .contact .submit:after { font-size: 1.8rem; right: 2.6rem; } } .contact__back { display: flex; justify-content: center; position: relative; align-items: center; margin: 0 auto; background-color: #066DFA; color: white; font-size: 3.686rem; font-weight: bold; border-radius: 999px; text-align: center; justify-self: center; position: relative; border: none; text-align: center; margin-top: 0; height: 10.6rem; margin-top: 7.168rem; margin-bottom: 10.24rem; margin-right: 3.891rem; margin-left: 3.891rem; } @media screen and (min-width: 768px) { .contact__back { width: 48.5rem; font-size: 2.2rem; height: 7.4rem; margin-top: 6rem; margin-bottom: 10rem; margin-right: auto; margin-left: auto; } } .contact__back:after { content: "◀︎"; color: #E5FF1A; position: absolute; left: 5.7rem; top: 50%; transform: translateY(-50%); font-size: 3.277rem; } @media screen and (min-width: 768px) { .contact__back:after { font-size: 1.8rem; left: 2.6rem; } } .contact .wpcf7-not-valid-tip { font-size: 2.867rem; color: #FF3939; margin-top: 1.639rem; } @media screen and (min-width: 768px) { .contact .wpcf7-not-valid-tip { font-size: 1.6rem; margin-top: 1rem; } } @media screen and (min-width: 768px) { .thanks .lower__fv-content { padding-top: 21.5rem; height: auto; } } .thanks__description { margin-top: 7.168rem; font-size: 3.277rem; padding: 0 3.891rem; } @media (min-width: 768px) { .thanks__description { padding: 0; font-size: 1.8rem; margin-top: 3.6rem; } } .singular { margin-bottom: 10rem; } @media screen and (min-width: 768px) { .singular { max-width: 110rem; margin: 0 auto 10rem auto; } } .singular .lower__fv-content { height: auto; padding-right: 3.819rem; } @media screen and (min-width: 768px) { .singular .lower__fv-content { padding-left: 0; padding-right: 0; } } .singular__inner { padding: 0 3.891rem; } @media screen and (min-width: 768px) { .singular__inner { padding: 0; } } .singular__inner h1 { font-size: 7.6rem; font-weight: 700; margin-top: 3.2rem; } @media screen and (min-width: 768px) { .singular__inner h1 { font-size: 3.8rem; } } .singular__inner h2 { font-size: 6.8rem; font-weight: 700; margin-top: 2.048rem; } @media screen and (min-width: 768px) { .singular__inner h2 { font-size: 3.4rem; } } .singular__inner h3 { font-size: 6rem; font-weight: 700; margin-top: 2.048rem; } @media screen and (min-width: 768px) { .singular__inner h3 { font-size: 3rem; } } .singular__inner h4 { font-size: 5.2rem; font-weight: 700; margin-top: 2.048rem; } @media screen and (min-width: 768px) { .singular__inner h4 { font-size: 2.6rem; } } .singular__inner h5 { font-size: 4.4rem; font-weight: 700; margin-top: 2.048rem; } @media screen and (min-width: 768px) { .singular__inner h5 { font-size: 2.2rem; } } .singular__inner h6 { font-size: 3.6rem; font-weight: 700; margin-top: 2.048rem; } @media screen and (min-width: 768px) { .singular__inner h6 { font-size: 1.8rem; } } .singular__inner p { font-size: 3.2rem; margin-top: 2.048rem; line-height: 1.8; } @media screen and (min-width: 768px) { .singular__inner p { font-size: 1.6rem; } } .singular__inner hr { margin-top: 2.048rem; } .singular__inner table { width: 100%; margin-top: 2.048rem; border-collapse: collapse; } .singular__inner table th { font-size: 3.2rem; font-weight: 700; text-align: left; padding: 1.6rem 0; border-bottom: 1px solid #E5E5E5; } @media screen and (min-width: 768px) { .singular__inner table th { font-size: 1.6rem; } } .singular__inner table td { font-size: 3.2rem; padding: 1.6rem 0; border-bottom: 1px solid #E5E5E5; } @media screen and (min-width: 768px) { .singular__inner table td { font-size: 1.6rem; } } .singular__inner dl { margin-top: 2.048rem; } .singular__inner dl dt { font-size: 3.2rem; font-weight: 700; margin-top: 1.6rem; } @media screen and (min-width: 768px) { .singular__inner dl dt { font-size: 1.6rem; } } .singular__inner dl dd { font-size: 3.2rem; margin-top: 0.8rem; } @media screen and (min-width: 768px) { .singular__inner dl dd { font-size: 1.6rem; } } .singular__inner ul, .singular__inner ol { margin-left: 1.5em; padding-left: 1.5em; margin-top: 2.048rem; } .singular__inner ul li, .singular__inner ol li { margin-bottom: 0.5em; font-size: 3.2rem; } @media screen and (min-width: 768px) { .singular__inner ul li, .singular__inner ol li { font-size: 1.6rem; } } .singular__inner ul ul, .singular__inner ul ol, .singular__inner ol ul, .singular__inner ol ol { margin-top: 0.5em; margin-left: 1em; } .singular__inner ul { list-style-type: disc; } .singular__inner ul ul { list-style-type: circle; } .singular__inner ul ul ul { list-style-type: square; } .singular__inner ol { list-style-type: decimal; } .singular__inner ol ol { list-style-type: lower-alpha; } .singular__inner ol ol ol { list-style-type: lower-roman; } .singular__inner code { font-size: 3.2rem; margin-top: 2.048rem; padding: 0.4rem 0.8rem; background-color: #f5f5f5; border-radius: 0.4rem; } @media screen and (min-width: 768px) { .singular__inner code { font-size: 1.6rem; } } .singular__inner address { font-style: normal; font-size: 3.2rem; margin-top: 2.048rem; } @media screen and (min-width: 768px) { .singular__inner address { font-size: 1.6rem; } } .singular__inner strong { font-weight: 700; } .singular__inner a { color: #0073aa; text-decoration: underline; } .singular__inner a:hover { text-decoration: none; } .singular__inner abbr { text-decoration: none; border-bottom: 1px dotted #000; } .singular__inner em { font-style: italic; } .singular__inner acronym { font-style: italic; } .singular__inner big { font-size: 3.2rem; } @media screen and (min-width: 768px) { .singular__inner big { font-size: 1.6rem; } } .singular__inner cite { font-style: italic; } .singular__inner pre { font-size: 3.2rem; margin-top: 2.048rem; padding: 1.6rem; background-color: #f5f5f5; border-radius: 0.4rem; white-space: pre-wrap; } @media screen and (min-width: 768px) { .singular__inner pre { font-size: 1.6rem; } } .singular__inner ins { text-decoration: underline; } .singular__inner kbd { font-size: 3.2rem; margin-top: 2.048rem; padding: 0.4rem 0.8rem; background-color: #f5f5f5; border-radius: 0.4rem; } @media screen and (min-width: 768px) { .singular__inner kbd { font-size: 1.6rem; } } .singular__date { font-size: 2.8rem; margin-top: 2rem; } @media screen and (min-width: 768px) { .singular__date { font-size: 1.4rem; } } .singular__content { margin-top: 5rem; } .lower__fv { position: relative; } .lower__fv-content { display: flex; flex-direction: column; padding-left: 3.819rem; padding-top: 24.576rem; } @media screen and (min-width: 768px) { .lower__fv-content { height: 62rem; padding-left: 18.6rem; padding-top: 30rem; } } .lower__fv-title { color: #B6D5FF; font-size: 9.216rem; font-weight: bold; } @media screen and (min-width: 768px) { .lower__fv-title { font-size: 8rem; } } .lower__fv-sub-title { color: #066DFA; font-size: 4.915rem; font-weight: bold; margin-top: 1.8rem; margin-bottom: 3rem; } @media screen and (min-width: 768px) { .lower__fv-sub-title { font-size: 3.4rem; } } .lower__fv-hero { bottom: 0; z-index: -1; overflow: hidden; position: relative; margin-top: 7.168rem; } @media screen and (min-width: 768px) { .lower__fv-hero { position: absolute; right: 0; margin-top: 0; } } .lower__fv-hero-image { width: 100%; height: 41.165rem; -o-object-fit: cover; object-fit: cover; } @media screen and (min-width: 768px) { .lower__fv-hero-image { width: 85rem; height: auto; aspect-ratio: 960/550; border-top-left-radius: 3rem; border-bottom-left-radius: 3rem; } } .fv__cta { background-color: #E5FF1A; font-size: 5.12rem; display: flex; gap: 2.5rem; align-items: center; justify-content: center; padding: 1.6rem; border-radius: 1.638rem; color: #066DFA; font-weight: bold; box-shadow: 1rem 0.8rem 0rem rgba(0, 0, 0, 0.25); } @media (min-width: 768px) { .fv__cta { font-size: 3rem; padding: 2.2rem 3rem 2.2rem 2.4rem; justify-content: flex-start; border-top-left-radius: 1.5rem; border-top-right-radius: 0; border-bottom-left-radius: 1.5rem; border-bottom-right-radius: 0; } } .fv__cta-wrapper-top { position: fixed; bottom: 3.8rem; right: 3.8rem; left: 3.8rem; z-index: 4; } @media (min-width: 768px) { .fv__cta-wrapper-top { position: absolute; left: auto; bottom: 5rem; right: 0; } } .fv__cta-wrapper-lower { position: fixed; bottom: 3.8rem; right: 3.8rem; left: 3.8rem; z-index: 4; } @media screen and (min-width: 768px) { .fv__cta-wrapper-lower { position: absolute; bottom: -20rem; left: auto; right: 0; } } .fv__cta-inner { display: flex; flex-direction: column; align-items: center; } @media (min-width: 768px) { .fv__cta-inner { gap: 0.6rem; } } .fv__cta-jp { font-size: 3.072rem; text-align: center; } @media screen and (min-width: 768px) { .fv__cta-jp { font-size: 1.8rem; } } .fv__cta-jp br { display: none; } @media (min-width: 768px) { .fv__cta-jp br { display: block; } } .fv__cta svg { position: absolute; right: 2.9rem; aspect-ratio: 18/16; width: 1.8rem; height: auto; } @media (min-width: 768px) { .fv__cta svg { position: relative; right: auto; } } .breadcrumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 1.5rem; font-size: 3.2rem; } @media (min-width: 768px) { .breadcrumbs { font-size: 1.6rem; } } .breadcrumbs__separator { margin-right: 1.5rem; width: 3rem; height: auto; aspect-ratio: 12/10; } @media (min-width: 768px) { .breadcrumbs__separator { width: 1.2rem; } } .breadcrumbs__top { text-decoration: underline; } .breadcrumbs__item--current { color: #ADADAD; } body { font-family: "Inter", sans-serif; } body a:hover { opacity: 0.6; } /*# sourceMappingURL=style.css.map */