@charset "UTF-8"; @import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Poppins:wght@400;500;600&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap"); /*** The new CSS reset - version 1.11.3 (last updated 25.08.2024) 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 - The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36) */ *: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; } /* Fix mobile Safari increase font-size on landscape mode */ html { -moz-text-size-adjust: none; -webkit-text-size-adjust: none; text-size-adjust: none; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu, summary { list-style: none; } /* Firefox: solve issue where nested ordered lists continue numbering from parent (https://bugzilla.mozilla.org/show_bug.cgi?id=1881517) */ ol { counter-reset: revert; } /* For images to not be able to exceed their container */ img { max-inline-size: 100%; max-block-size: 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; } /* 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; appearance: revert; } /* preformatted text - use only for this feature */ :where(pre) { all: revert; box-sizing: border-box; } /* reset default text opacity of input placeholder */ ::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; -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; box-sizing: border-box; } /* Remove details summary webkit styles */ ::-webkit-details-marker { display: none; } /** * 375px基準でvwスケールし、 * 500px以上では500px時点のサイズで固定 * * 例: padding: spf(24); */ :root { --content-max: 500px; --bp-header: 890px; } html { background: #fff; } html.is-menu-open { overflow: hidden; } body { color: #262626; font-family: "Noto Sans JP", sans-serif; font-weight: 400; } img, svg { height: auto; } .l-wrap { overflow: hidden; } .l-header { padding: 50px; position: fixed; top: 0; left: 0; z-index: 205; width: 100%; transition: padding 0.3s ease, transform 0.3s ease, opacity 0.3s ease; } .l-header[data-state=scrolled] { padding: 20px 50px; } @media (max-width: 767px) { .l-header[data-state=scrolled] { padding: calc(20 / 375 * 100vw) calc(30 / 375 * 100vw); } } .l-header.is-hidden { opacity: 0; transform: translateY(-50%); } @media (max-width: 767px) { .l-header { padding: calc(45 / 375 * 100vw) calc(30 / 375 * 100vw); } .l-header.menu-open .l-header__logo { color: #fff; } .l-header.menu-open .l-header__logo .logo-text { color: #fff; } } .l-header__inner { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; max-width: 1200px; margin: 0 auto; } .l-header__logo { line-height: 0; z-index: 205; position: relative; transition: color 0.3s ease; } .l-header__logo .logo-text { transition: color 0.3s ease; } @media (max-width: 767px) { .l-header__logo .logo-text { color: transparent; } } .l-header__logo svg { width: 193px; } @media (max-width: 767px) { .l-header__logo svg { width: calc(178 / 375 * 100vw); } } .l-header__nav__list { display: flex; gap: 50px; } .l-header__nav__list a { display: inline-block; font-size: 18px; font-family: "Roboto", sans-serif; } /* Hamburger */ .l-header__hamburger { width: calc(30 / 375 * 100vw); height: calc(24 / 375 * 100vw); display: grid; align-content: space-between; position: relative; z-index: 500; } .l-header__hamburger[aria-expanded=true] .l-header__hamburger__bar { background: #fff; } .l-header__hamburger[aria-expanded=true] .l-header__hamburger__bar--top { rotate: 38deg; top: calc(12 / 375 * 100vw); } .l-header__hamburger[aria-expanded=true] .l-header__hamburger__bar--bottom { rotate: -38deg; top: calc(-12 / 375 * 100vw); } .l-header__hamburger[aria-expanded=true] .l-header__hamburger__bar--center { opacity: 0; } .l-header__hamburger__bar { width: 100%; height: 1px; background: #262626; position: relative; transition: rotate 0.3s ease, top 0.3s ease, background-color 0.3s ease, opacity 0.3s ease; } /* Menu overlay */ .l-header__menu { position: absolute; inset: 0; z-index: 200; pointer-events: none; opacity: 0; transition: opacity 0.3s ease; } .l-header__menu[data-open=true] { pointer-events: auto; opacity: 1; } .l-header__menu__panel { position: absolute; top: 0; right: 0; width: 100vw; height: 100vh; background: linear-gradient(90deg, #eb4002 0%, #ffc800 100%); color: #fff; padding: calc(160 / 375 * 100vw) calc(30 / 375 * 100vw) calc(100 / 375 * 100vw); overflow: auto; } .l-header__menu__list { display: grid; gap: calc(16 / 375 * 100vw); margin-bottom: calc(80 / 375 * 100vw); } .l-header__menu__list a { font-size: calc(27 / 375 * 100vw); display: inline-block; font-family: "Roboto", sans-serif; } .l-header__menu__address { font-size: calc(16 / 375 * 100vw); line-height: 1.875; } .l-header__menu__address a { text-decoration: underline; } .l-footer { background: linear-gradient(90deg, #eb4002 0%, #ffc800 100%); color: #fff; } .l-footer__body { display: grid; justify-content: space-between; grid-template-columns: auto 30.5%; padding: 47px 0 162px; } @media (max-width: 767px) { .l-footer__body { grid-template-columns: 1fr; padding: calc(40 / 375 * 100vw) 0 calc(48 / 375 * 100vw); } } .l-footer__company { font-size: 16px; line-height: 2; } @media (max-width: 767px) { .l-footer__company { order: 2; margin-top: calc(36 / 375 * 100vw); font-size: calc(16 / 375 * 100vw); line-height: 1.875; } } .l-footer__company p + p { margin-top: 32px; } @media (max-width: 767px) { .l-footer__company p + p { margin-top: 0; } } .l-footer__company a { text-decoration: underline; } .l-footer__navi { font-size: 21px; font-family: "Roboto", sans-serif; display: grid; gap: 17px; } @media (max-width: 767px) { .l-footer__navi { font-size: calc(18 / 375 * 100vw); gap: calc(13 / 375 * 100vw); } } .l-footer__logo svg { width: 100%; } .l-footer__contact { position: fixed; top: 50vh; translate: 0 -50%; right: 0; z-index: 100; width: 80px; height: 200px; color: #fff; background: linear-gradient(180deg, #eb4002 0%, #ffc800 100%); display: flex; align-items: center; justify-content: center; font-size: 21px; border-radius: 10px 0 0 10px; writing-mode: vertical-rl; letter-spacing: 0.1em; overflow: hidden; transition: opacity 0.3s ease; } @media (min-width: 768px) { .l-footer__contact:hover::after { opacity: 0.15; } .l-footer__contact::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #fff; opacity: 0; transition: opacity 0.3s ease; } } @media (max-width: 767px) { .l-footer__contact { letter-spacing: 0; font-size: calc(21 / 375 * 100vw); width: 100%; height: calc(60 / 375 * 100vw); border-radius: 0; top: auto; bottom: 0; translate: 0 0; writing-mode: horizontal-tb; } } .l-footer__contact.is-hide { opacity: 0; pointer-events: none; } .l-footer__copyright { padding: 28px 0; font-family: "Roboto", sans-serif; } @media (max-width: 767px) { .l-footer__copyright { font-size: calc(12 / 375 * 100vw); padding: calc(14 / 375 * 100vw) 0 calc(30 / 375 * 100vw); } } .p-main { background: #F0F0F0; padding: 277px 0 0; } @media (max-width: 767px) { .p-main { padding: calc(150 / 375 * 100vw) 0 0; } } .p-main__title { text-align: center; } .p-main__title svg { width: 100%; max-width: 1920px; } .p-main__body { margin: 170px 0 144px; } @media (max-width: 767px) { .p-main__body { margin: calc(58 / 375 * 100vw) 0 calc(57 / 375 * 100vw); } } .p-main__copy { margin-bottom: 74px; } @media (max-width: 767px) { .p-main__copy { margin-bottom: calc(32 / 375 * 100vw); } } .p-main__copy img { width: 355px; } @media (max-width: 767px) { .p-main__copy img { width: calc(225 / 375 * 100vw); } } .p-main__text { font-weight: 600; font-size: 21px; line-height: 2; } @media (max-width: 767px) { .p-main__text { line-height: 1.875; font-size: calc(16 / 375 * 100vw); } } .p-main__text p + p { margin-top: 42px; } @media (max-width: 767px) { .p-main__text p + p { margin-top: calc(30 / 375 * 100vw); } } .p-vision { padding: 166px 0 145px; } @media (max-width: 767px) { .p-vision { padding: calc(42 / 375 * 100vw) 0 calc(56 / 375 * 100vw); } } .p-vision__picture { display: block; margin: 62px auto 0; width: 794px; } @media (max-width: 767px) { .p-vision__picture { width: 100%; margin-top: calc(32 / 375 * 100vw); } } .p-what { padding: 166px 0 0; background: #969696; color: #fff; } @media (max-width: 767px) { .p-what { padding: calc(70 / 375 * 100vw) 0 0; } } .p-what__picture { display: block; margin: 74px auto 0; width: 825px; } @media (max-width: 767px) { .p-what__picture { width: 100%; margin-top: calc(32 / 375 * 100vw); } } .p-what__gallery { margin-top: 145px; line-height: 0; } @media (max-width: 767px) { .p-what__gallery { margin-top: calc(57 / 375 * 100vw); } } .p-what__gallery img { width: 100%; } .p-project { background: linear-gradient(90deg, #eb4002 0%, #ffc800 100%); color: #fff; padding-top: 166px; } @media (max-width: 767px) { .p-project { padding-top: calc(70 / 375 * 100vw); } } .p-project__block { position: relative; min-height: 679px; padding: 50px 0; margin-bottom: 1px; } @media (max-width: 767px) { .p-project__block { padding: 0 0 calc(50 / 375 * 100vw); } } .p-project__block::after { content: ""; position: absolute; bottom: -1px; left: calc(50% - 50vw); width: 100vw; height: 1px; background: linear-gradient(90deg, #dcdcdc 0%, #262626 100%); } .p-project__block:last-child { margin-bottom: 0; } .p-project__block:last-child::after { content: none; } .p-project__img { position: absolute; top: 0; left: 416px; height: 100%; width: calc(50vw + 184px); } @media (max-width: 767px) { .p-project__img { width: 100vw; left: calc(-30 / 375 * 100vw); height: calc(223 / 375 * 100vw); position: relative; } } .p-project__img img { width: 100%; height: 100%; object-fit: cover; } .p-project__img::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-repeat: no-repeat; background-size: auto 100%; mix-blend-mode: multiply; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='679' height='679' viewBox='0 0 679 679'%3E%3Cpath d='M0,0V679L679,0Z' fill='%23c8c8c8' style='mix-blend-mode:multiply;isolation:isolate'/%3E%3C/svg%3E"); } .p-project__title { font-size: 21px; font-weight: 600; margin-bottom: 36px; } @media (max-width: 767px) { .p-project__title { font-size: calc(18 / 375 * 100vw); margin: calc(30 / 375 * 100vw) 0 calc(18 / 375 * 100vw); } } .p-project__text { font-size: 16px; line-height: 2; max-width: 366px; } @media (max-width: 767px) { .p-project__text { line-height: 1.875; max-width: 100%; font-size: calc(16 / 375 * 100vw); } } .p-project__button { margin-top: 46px; font-size: 16px; font-weight: 600; } @media (max-width: 767px) { .p-project__button { text-align: center; font-size: calc(16 / 375 * 100vw); margin-top: calc(28 / 375 * 100vw); } } .p-project__button p { margin-bottom: 15px; } @media (max-width: 767px) { .p-project__button p { margin-bottom: calc(-5 / 375 * 100vw); } } .p-project__button a { color: #262626; display: flex; align-items: center; justify-content: center; border-radius: 5px; width: 180px; height: 50px; background: #fff; margin-top: 15px; position: relative; overflow: hidden; } @media (min-width: 768px) { .p-project__button a:hover::after { opacity: 0.4; } .p-project__button a::after { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: #fff; opacity: 0; transition: opacity 0.3s ease; } } @media (max-width: 767px) { .p-project__button a { width: calc(180 / 375 * 100vw); height: calc(50 / 375 * 100vw); margin: calc(15 / 375 * 100vw) auto 0; } } .p-project__button a + p { margin-top: 32px; } @media (max-width: 767px) { .p-project__button a + p { margin-top: calc(20 / 375 * 100vw); } } .p-project__button .peatix { width: 109px; } @media (max-width: 767px) { .p-project__button .peatix { width: calc(109 / 375 * 100vw); } } .p-project__button .note { width: 83px; } @media (max-width: 767px) { .p-project__button .note { width: calc(83 / 375 * 100vw); } } .p-project__button .spotify { width: 101px; } @media (max-width: 767px) { .p-project__button .spotify { width: calc(101 / 375 * 100vw); } } .p-member { background: #F0F0F0; padding-top: 166px; } @media (max-width: 767px) { .p-member { padding-top: calc(70 / 375 * 100vw); } } .p-member__block { position: relative; padding: 50px 0 49px; display: grid; justify-content: space-between; grid-template-columns: 185px auto; gap: 50px; } @media (max-width: 767px) { .p-member__block { padding: calc(30 / 375 * 100vw) 0 calc(47 / 375 * 100vw); grid-template-columns: 1fr; gap: calc(16 / 375 * 100vw); } } .p-member__block::after { content: ""; position: absolute; bottom: -1px; left: calc(50% - 50vw); width: 100vw; height: 1px; background: linear-gradient(90deg, #262626 0%, #dcdcdc 100%); } @media (max-width: 767px) { .p-member__img { width: calc(157 / 375 * 100vw); } } .p-member__detail { max-width: 784px; } .p-member__name { font-size: 21px; line-height: 1.5; font-weight: 600; margin-bottom: 5px; } @media (max-width: 767px) { .p-member__name { font-size: calc(16 / 375 * 100vw); margin-bottom: calc(9 / 375 * 100vw); } } .p-member__position { font-size: 16px; line-height: 2; font-weight: 600; } @media (max-width: 767px) { .p-member__position { line-height: 1.7; font-size: calc(14 / 375 * 100vw); } } .p-member__text { font-size: 16px; line-height: 2; margin-top: 22px; } @media (max-width: 767px) { .p-member__text { line-height: 1.875; font-size: calc(16 / 375 * 100vw); margin-top: calc(14 / 375 * 100vw); } } .p-member__text a { text-decoration: underline; } .p-news { padding-top: 166px; } @media (max-width: 767px) { .p-news { padding-top: calc(70 / 375 * 100vw); } } .p-news__item { position: relative; display: grid; grid-template-columns: 90px auto; justify-content: space-between; padding: 52px 0 46px; gap: 50px; } @media (max-width: 767px) { .p-news__item { gap: 0; padding: calc(32 / 375 * 100vw) 0 calc(26 / 375 * 100vw); grid-template-columns: 1fr; } } .p-news__item::after { content: ""; position: absolute; bottom: -1px; left: calc(50% - 50vw); width: 100vw; height: 1px; background: linear-gradient(90deg, #262626 0%, #dcdcdc 100%); } .p-news__date { font-family: "Roboto", sans-serif; font-size: 16px; font-weight: 600; padding: 9px 0; } @media (max-width: 767px) { .p-news__date { font-size: calc(14 / 375 * 100vw); padding: 0; margin-bottom: 10px; } } .p-news__title { font-family: "Roboto", sans-serif; font-size: 21px; line-height: 1.52; font-weight: 600; } @media (max-width: 767px) { .p-news__title { font-size: calc(18 / 375 * 100vw); } } .p-news__content { font-size: 16px; line-height: 2; margin-top: 22px; } @media (max-width: 767px) { .p-news__content { line-height: 1.875; font-size: calc(16 / 375 * 100vw); margin-top: calc(15 / 375 * 100vw); } } .p-news__body { max-width: 784px; } .p-contact { background: #F0F0F0; padding-top: 166px; padding-bottom: 150px; } @media (max-width: 767px) { .p-contact { padding-top: calc(70 / 375 * 100vw); padding-bottom: calc(100 / 375 * 100vw); } } .p-contact__body { display: grid; grid-template-columns: auto 784px; gap: 50px; } @media (max-width: 767px) { .p-contact__body { grid-template-columns: 1fr; } } .p-contact__company { line-height: 2; } @media (max-width: 767px) { .p-contact__company { display: none; } } .p-contact__company p + p { margin-top: 32px; } .p-contact__company a { color: #EB3C00; text-decoration: underline; } .p-contact__body p { line-height: 2; } @media (max-width: 767px) { .p-contact__form { font-size: calc(16 / 375 * 100vw); } } .p-contact__form form[data-screen=confirm] .smf-item__controls { background: #C8C8C8; padding: 12px 15px; min-height: 50px; display: flex; align-items: center; } @media (max-width: 767px) { .p-contact__form form[data-screen=confirm] .smf-item__controls { padding: calc(12 / 375 * 100vw) calc(15 / 375 * 100vw); min-height: calc(50 / 375 * 100vw); } } .p-contact__form input[type=text], .p-contact__form input[type=tel], .p-contact__form input[type=email], .p-contact__form textarea { padding: 12px 15px; width: 100%; display: block; background: #fff; border: 1px solid #262626; } .p-contact__form input[type=text][data-invalid="1"], .p-contact__form input[type=tel][data-invalid="1"], .p-contact__form input[type=email][data-invalid="1"], .p-contact__form textarea[data-invalid="1"] { border-color: #EB3C00; } .p-contact__form .wp-block-snow-monkey-forms-item { display: grid; align-items: center; min-height: 50px; grid-template-columns: auto 600px; margin-bottom: 51px; } @media (max-width: 767px) { .p-contact__form .wp-block-snow-monkey-forms-item { grid-template-columns: 1fr; min-height: auto; gap: 0; margin-bottom: calc(30 / 375 * 100vw); } } .p-contact__form .wp-block-snow-monkey-forms-item.message { align-items: flex-start; } .p-contact__form .wp-block-snow-monkey-forms-item.message .smf-item__label { padding-top: 14px; } @media (max-width: 767px) { .p-contact__form .wp-block-snow-monkey-forms-item.message .smf-item__label { padding-top: 0; } } .p-contact__form .smf-error-messages { font-size: 14px; color: #EB3C00; } @media (max-width: 767px) { .p-contact__form .smf-error-messages { font-size: calc(14 / 375 * 100vw); } } .p-contact__form .smf-radio-buttons-control__control { display: flex; flex-wrap: wrap; gap: 30px; } @media (max-width: 767px) { .p-contact__form .smf-radio-buttons-control__control { margin-top: calc(12 / 375 * 100vw); gap: calc(20 / 375 * 100vw) calc(28 / 375 * 100vw); } } .p-contact__form .smf-radio-button-control__control:checked + .smf-radio-button-control__label::after { transform: scale(1); } .p-contact__form .smf-radio-button-control__label { position: relative; cursor: pointer; padding-left: 27px; } @media (max-width: 767px) { .p-contact__form .smf-radio-button-control__label { padding-left: calc(27 / 375 * 100vw); } } .p-contact__form .smf-radio-button-control__label::before { content: ""; position: absolute; left: 0; top: 2px; width: 20px; height: 20px; border: 1px solid #262626; } @media (max-width: 767px) { .p-contact__form .smf-radio-button-control__label::before { top: calc(2 / 375 * 100vw); width: calc(20 / 375 * 100vw); height: calc(20 / 375 * 100vw); } } .p-contact__form .smf-radio-button-control__label::after { content: ""; position: absolute; left: 5px; top: 7px; transform: scale(0); width: 10px; height: 10px; background: #262626; border-radius: 50%; transition: transform 0.2s; } @media (max-width: 767px) { .p-contact__form .smf-radio-button-control__label::after { left: calc(5 / 375 * 100vw); top: calc(7 / 375 * 100vw); width: calc(10 / 375 * 100vw); height: calc(10 / 375 * 100vw); } } @media (max-width: 767px) { .p-contact__form .smf-item__label { margin-bottom: calc(12 / 375 * 100vw); } } .p-contact__form .smf-action { width: 600px; margin: 0 0 0 auto; display: flex; flex-wrap: wrap; gap: 30px; } @media (max-width: 767px) { .p-contact__form .smf-action { width: 100%; gap: calc(20 / 375 * 100vw); justify-content: center; } } .p-contact__form .smf-action button { border: 1px solid #262626; background: #fff; border-radius: 5px; width: 180px; height: 50px; display: flex; align-items: center; justify-content: center; } @media (min-width: 768px) { .p-contact__form .smf-action button { transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease; } .p-contact__form .smf-action button:hover { background-color: #EB3C00 !important; border-color: #EB3C00; color: #fff; } } @media (max-width: 767px) { .p-contact__form .smf-action button { width: calc(180 / 375 * 100vw); height: calc(50 / 375 * 100vw); } } .p-contact__form .smf-action button[data-action=back] { background: transparent; } .p-contact__form .smf-action .smf-button-control + .smf-button-control { margin-left: 0; } .p-contact__form .wp-block-button__link { border: 1px solid #262626; color: #262626; background: #fff; border-radius: 5px; width: 180px; height: 50px; display: flex; align-items: center; justify-content: center; margin-top: 200px; } @media (min-width: 768px) { .p-contact__form .wp-block-button__link { transition: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease; } .p-contact__form .wp-block-button__link:hover { background-color: #EB3C00 !important; border-color: #EB3C00; color: #fff; } } @media (max-width: 767px) { .p-contact__form .wp-block-button__link { width: calc(180 / 375 * 100vw); height: calc(50 / 375 * 100vw); margin: calc(67 / 375 * 100vw) auto 0; } } .p-contact__form .guide { margin-bottom: 58px; } @media (max-width: 767px) { .p-contact__form .guide { margin-bottom: calc(26 / 375 * 100vw); } } .c-container { max-width: 1300px; padding: 0 50px; margin: 0 auto; } @media (max-width: 767px) { .c-container { padding: 0 calc(30 / 375 * 100vw); } } .c-heading { font-family: "Poppins", sans-serif; font-size: 72px; padding-bottom: 44px; margin-bottom: 45px; line-height: 1; font-weight: 500; position: relative; } .c-heading::after { content: ""; position: absolute; bottom: 0; left: calc(50% - 50vw); width: 100vw; height: 1px; background: linear-gradient(90deg, #262626 0%, #dcdcdc 100%); } .c-heading.c-heading--reverse::after { background: linear-gradient(90deg, #dcdcdc 0%, #262626 100%); } .c-heading.c-heading--mb0 { margin-bottom: 0; } @media (max-width: 767px) { .c-heading { font-size: calc(45 / 375 * 100vw); padding-bottom: calc(29 / 375 * 100vw); margin-bottom: calc(25 / 375 * 100vw); } } .c-lead { font-weight: 600; font-size: 21px; line-height: 2; } @media (max-width: 767px) { .c-lead { font-size: calc(18 / 375 * 100vw); line-height: 1.89; } } @media (max-width: 767px) { .u-hide-sp { display: none !important; } } @media (min-width: 768px) { .u-hide-pc { display: none !important; } } .c-flow { font-size: 48px; padding: 24px 0; font-weight: 600; overflow: hidden; pointer-events: none; white-space: nowrap; color: #EB3C00; border-top: 1px solid #EB3C00; border-bottom: 1px solid #EB3C00; } .c-flow.c-flow--white { border-bottom: 1px solid #fff; border-top: 1px solid transparent; color: #fff; } @media (max-width: 767px) { .c-flow.c-flow--white { padding: calc(10 / 375 * 100vw) 0; } } .c-flow .swiper-wrapper { transition-timing-function: linear !important; } .c-flow .swiper-slide { width: auto !important; flex-shrink: 0; } @media (max-width: 767px) { .c-flow { font-size: calc(24 / 375 * 100vw); padding: calc(24 / 375 * 100vw) 0; } } /*# sourceMappingURL=style.css.map */