@charset "UTF-8"; @import url("https://use.fontawesome.com/releases/v5.14.0/css/all.css"); :root { --accent: 124, 58, 237; --accent-gradient: linear-gradient(45deg, rgb(var(--accent)), #da62c4 30%, white 60%); } html { -webkit-text-size-adjust: none; background-color: #fff2e4; scroll-behavior: smooth; } code { font-family: Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace; } body { position: relative; font-family: "Noto Sans JP", serif; font-size: clamp(16px, 3.5vw, 20px); font-weight: 400; letter-spacing: 1.5px; color: #333; zoom: 1; word-wrap: break-word; overflow-wrap: break-word; overflow-x: hidden; min-height: 100vh; } img { vertical-align: top; width: 100%; height: auto; } sub { font-size: clamp(10px, 3.5vw, 16px); } .wrapper { width: clamp(350px, 100%, 1220px); margin-inline: auto; padding-inline: 0.625rem; } .wrapper-02 { width: clamp(350px, 100%, 800px); margin-inline: auto; padding-inline: 0.625rem; } /*** The new CSS reset - version 1.9 (last updated 19.6.2023) 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; } /* 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 */ 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 */ /* 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; } /* reset default text opacity of input placeholder */ ::placeholder { color: unset; } /* remove default dot (•) sign */ ::marker { content: initial; } /* 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; } /* 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; } .l-header { position: fixed; width: 100%; height: 100px; background-color: #fff; z-index: 10; } .l-header__inner { height: 100%; display: flex; column-gap: 70px; justify-content: space-between; align-items: center; margin-inline-start: 20px; } .l-header__container { display: flex; align-items: center; height: 100%; } .l-header__nav { margin-inline-end: 1.875rem; } .l-header__nav ul { display: flex; gap: 1.875rem; } .l-header__nav ul li { font-size: clamp(0.75rem, 0.65rem + 0.5vw, 1.25rem); } .l-header__logo { width: clamp(11.25rem, 10.693rem + 2.55vw, 13.75rem); } .l-header__tel { height: 100%; padding-inline: 1.875rem; background-color: #f5aa00; transition: all 0.3s; } .l-header__tel:hover { background-color: #8dc21f; padding-inline: 2.5rem; height: 120%; } .l-header__tel span { font-size: clamp(1.25rem, 1.194rem + 0.25vw, 1.5rem); min-height: 0; color: #fff; display: flex; align-items: center; gap: 1rem; height: 100%; } .l-header__tel span::before { display: inline-block; content: ""; width: 40px; height: 40px; mask-image: url("../img/icon/icon-tel.svg"); mask-size: contain; mask-repeat: no-repeat; mask-position: center; background-color: #fff; } .l-footer { width: 100%; padding-block-start: 6.25rem; padding-block-end: 0.625rem; background-color: #fff; } .l-footer__logo { width: clamp(11.25rem, 10.693rem + 2.55vw, 13.75rem); margin-inline: auto; padding-block-end: 6.25rem; } .l-footer__copy { text-align: center; font-size: clamp(10px, 3.5vw, 14px); font-weight: 400; line-height: 1; } .fv-top { background-image: url("../img/top/mv-top.jpg"); background-position: 50%; background-repeat: no-repeat; background-size: cover; width: 100vw; height: 100vh; position: relative; } .fv-top__text { position: absolute; display: inline-block; left: 5%; bottom: 20%; padding: 30px; background-color: #fff; border-radius: 30px; } @media only screen and (max-width: 1279px) { .fv-top__text { width: 75vw; } } .fv-top__text span { display: inline-block; font-family: "Zen Maru Gothic", sans-serif; font-weight: 400; font-size: clamp(20px, 3.5vw, 40px); color: #f5aa00; line-height: 1.5; margin-block: calc((1em - 1lh) / 2); } .fv-top__topics { width: 100%; position: absolute; bottom: 0; padding-block: 1.25rem; background-color: #8dc21f; text-align: center; } .fv-top__topics p { font-size: clamp(16px, 3.5vw, 24px); color: #fff; font-weight: 400; } .fv-subpage { background-image: url("../img/news/mv-news.jpg"); background-position: 0 21%; background-repeat: no-repeat; background-size: cover; width: 100vw; height: 50vh; padding-block-start: 100px; padding-inline: 20px; position: relative; display: flex; align-items: center; } .fv-subpage__text { font-size: clamp(32px, 3.5vw, 64px); color: #fff; } .p-top-section { padding-block: 6.25rem; } .p-top-section:last-of-type { padding-block: 6.25rem 12.5rem; } .p-top-section__title { text-align: center; margin-block-end: 6.25rem; } .p-top-intro { padding-block: 12.5rem 6.25rem; scroll-margin-top: 150px; } @media only screen and (max-width: 767px) { .p-top-intro { padding-block: 6.25rem 3.125rem; } } .p-top-intro__container { padding-inline-end: 3.75rem; padding-block-end: 6.25rem; border-radius: 0 0 50px 0; background-color: #fff2e4; position: relative; z-index: 5; } @media only screen and (max-width: 1279px) { .p-top-intro__container { padding-inline-end: unset; } } .p-top-intro__title { margin-block-end: 4.375rem; } @media only screen and (max-width: 767px) { .p-top-intro__title { margin-block-end: 2.1875rem; } } .p-top-intro__title h2 { font-family: "Zen Maru Gothic", sans-serif; font-size: clamp(32px, 3.5vw, 64px); font-weight: 500; line-height: 1.5; margin-block: calc((1em - 1lh) / 2); } .p-top-intro__title h2 span { display: inline-block; background: linear-gradient(90deg, #f5aa00 0%, #f56600 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .p-top-intro__text p { line-height: 2; margin-block: calc((1em - 1lh) / 2); } .p-top-intro__img { border-radius: 0 0 0 50px; overflow: hidden; margin-block-start: -300px; margin-inline-start: calc(-20vw + 50%); margin-inline-end: calc(-50vw + 50%); } @media only screen and (max-width: 1279px) { .p-top-intro__img { margin-block-start: unset; margin-inline-start: calc(-50vw + 50%); border-radius: unset; } } .p-top-service { padding-block: 6.25rem; scroll-margin-top: 150px; } @media only screen and (max-width: 767px) { .p-top-service { padding-block: 4.6875rem; } } .p-top-service__container { height: 100%; padding-inline: 2.5rem; } .p-top-service__container:nth-of-type(n + 2) { margin-block-start: 4.375rem; } .p-top-service__title { text-align: center; margin-block-end: 3.125rem; } .p-top-service__intro { margin-block-end: 5rem; } .p-top-service__intro p { text-align: center; line-height: 2; margin-block: calc((1em - 1lh) / 2); } .p-top-service__grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 2.5rem; } .p-top-service__grid-3 { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 1.875rem; } .p-top-flow, .p-top-flow--leftImg { padding-block: 6.25rem; scroll-margin-top: 150px; } @media only screen and (max-width: 767px) { .p-top-flow, .p-top-flow--leftImg { padding-block: 4.6875rem; } } .p-top-flow__title { text-align: center; margin-block-end: 6.25rem; } @media only screen and (max-width: 767px) { .p-top-flow__title { margin-block-end: 3.125rem; } } .p-top-flow__content { width: 50%; margin-inline-start: auto; } @media only screen and (max-width: 1279px) { .p-top-flow__content { width: 80%; margin-inline: auto; } } @media only screen and (max-width: 767px) { .p-top-flow__content { width: 100%; } } .p-top-flow__content ul li:not(:last-of-type) { margin-bottom: 2.5rem; position: relative; } .p-top-flow__content ul li:not(:last-of-type)::after { content: ""; position: absolute; border: 27px solid transparent; width: 50px; height: 50px; bottom: -53px; left: 50%; transform: translateX(-50%); -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); border-top-color: #fff; } .p-top-flow--leftImg { position: relative; } .p-top-flow--leftImg::before { position: absolute; content: ""; width: clamp(450px, 25%, 560px); height: 400px; background-image: url("../img/top/img-02.jpg"); background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 0 50px 50px 0; z-index: -20; } @media only screen and (max-width: 1279px) { .p-top-flow--leftImg::before { display: none; } } .p-top-flow--leftImg::after { position: absolute; left: 10%; top: 320px; content: ""; width: clamp(450px, 25%, 560px); height: 400px; background-image: url("../img/top/img-03.jpg"); background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 50px; z-index: -10; } @media only screen and (max-width: 1279px) { .p-top-flow--leftImg::after { display: none; } } .p-top-info { padding-block: 6.25rem; background-color: #fff; } @media only screen and (max-width: 767px) { .p-top-info { padding-block: 4.6875rem; } } .p-top-info__content { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2.5rem; margin-block-start: 6.25rem; } @media only screen and (max-width: 1279px) { .p-top-info__content { padding-inline: 2.5rem; } } @media only screen and (max-width: 767px) { .p-top-info__content { margin-block-start: 3.125rem; } } .p-top-info__list dl { line-height: 1.5; margin-block: calc((1em - 1lh) / 2); } .p-top-info__list dl dt { font-weight: 600; } .p-top-info__list dl dt:not(:first-of-type) { margin-block-start: 2.5rem; } .p-top-info__list dl dd { margin-block-start: 0.9375rem; } .p-top-info__img { width: 50%; } .p-top-info__map { width: 100%; margin-block-start: 0.625rem; } @media only screen and (max-width: 1279px) { .p-top-info__map { margin-inline-end: unset; } } .p-top-info__map iframe { width: 100%; aspect-ratio: 1/1; } .p-top-news { padding-block: 6.25rem; } @media only screen and (max-width: 767px) { .p-top-news { padding-block: 4.6875rem; } } .p-top-news__title { text-align: center; margin-block-end: 6.25rem; } @media only screen and (max-width: 767px) { .p-top-news__title { margin-block-end: 3.125rem; } } .p-top-news__content ul li { padding-block: 1.875rem; border-block-end: solid 1px #f5aa00; } .p-top-news__content ul li:first-of-type { border-block-start: solid 1px #f5aa00; } .p-top-news__content ul li a { display: flex; line-height: 1.5; margin-block: calc((1em - 1lh) / 2); transition: all 0.25s; } @media only screen and (max-width: 767px) { .p-top-news__content ul li a { flex-direction: column; row-gap: 0.5rem; } } .p-top-news__content ul li a:hover { color: #8dc21f; } .p-top-news__content ul li a span { padding-inline-end: 7.5rem; font-weight: 600; } .p-top-news__btn { width: 12.5rem; margin-inline: auto; margin-block-start: 3.125rem; } .p-top-contact { padding-block: 6.25rem 12.5rem; scroll-margin-top: 150px; } @media only screen and (max-width: 767px) { .p-top-contact { padding-block: 4.6875rem; } } .p-top-contact__title { text-align: center; margin-block-end: 6.25rem; } @media only screen and (max-width: 767px) { .p-top-contact__title { margin-block-end: 3.125rem; } } .p-top-contact__text, .p-top-contact__text--bold { text-align: center; margin-block-end: 1.875rem; } .p-top-contact__text--bold { font-weight: 600; } .p-top-contact__text--bold span { display: inline-block; } .p-top-contact__telArea { text-align: center; margin-block: 3.125rem 6.25rem; } @media only screen and (max-width: 767px) { .p-top-contact__telArea { margin-block: 1.5625rem 3.125rem; } } .p-top-contact__tel:not(:first-of-type) { margin-block-start: 1.875rem; } .p-top-contact__tel p { line-height: 1; } .p-top-contact__tel span { font-size: clamp(24px, 3.5vw, 40px); color: #f5aa00; font-weight: 600; } .p-top-visit { padding-block: 6.25rem; scroll-margin-top: 150px; } @media only screen and (max-width: 767px) { .p-top-visit { padding-block: 4.6875rem; } } .p-top-visit__title { text-align: center; margin-block-end: 6.25rem; } @media only screen and (max-width: 767px) { .p-top-visit__title { margin-block-end: 3.125rem; } } .p-top-visit__content { display: flex; align-items: center; gap: 2.5rem; } @media only screen and (max-width: 1279px) { .p-top-visit__content { flex-direction: column; } } .p-top-visit__img { margin-inline-start: calc(-50vw + 50%); } @media only screen and (max-width: 1279px) { .p-top-visit__img { margin-inline-end: calc(-50vw + 50%); } } .p-top-visit__img img { border-radius: 0 50px 50px 0; } @media only screen and (max-width: 1279px) { .p-top-visit__img img { border-radius: unset; } } .p-top-visit__text { width: 100%; line-height: 2; margin-block: calc((1em - 1lh) / 2); } .p-news { padding-block: 12.5rem; } .p-news__pagination { margin-block-start: 6.25rem; text-align: center; } .p-news__date { margin-block-start: 1.875rem; } .p-news__date span { font-size: clamp(14px, 3.5vw, 16px); font-weight: 600; } .p-news__img { margin-block-start: 3.125rem; } .p-news__text { margin-block-start: 2.5rem; } .p-news__text p { line-height: 2; margin-block: calc((1em - 1lh) / 2); } .p-news__text p:not(:first-of-type) { margin-block-start: 2rem; } .table-form { width: 100%; } @media only screen and (max-width: 767px) { .table-form tr { display: grid; } } .table-form tr th { width: 35%; color: #8dc21f; font-weight: 600; vertical-align: middle; } .table-form tr td { padding-block: 1.25rem; } .table-form tr td input { width: 100%; background-color: #fff; padding: 0.3125rem; } .table-form tr td textarea { width: 100%; background-color: #fff; padding: 0.3125rem; height: 200px; } .form__checkArea { text-align: center; background-color: #fff; padding: 1.25rem; } .form__checkArea label input { all: revert; } .form__checkArea label span { color: #8dc21f; } .form__policy { padding: 1.25rem; text-align: left; font-size: clamp(14px, 3.5vw, 16px); border: solid 1px #8dc21f; border-radius: 10px; margin-block-end: 1.25rem; } .form__btn { width: 12.5rem; margin-inline: auto; margin-block-start: 3.125rem; } .l-header { z-index: 1000; } .l-header .l-header__inner { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; background: #fff; } .l-header .l-header__logo { flex-shrink: 0; } .l-header .l-header__logo img { width: 220px; height: auto; } .l-header .l-header__container { display: flex; align-items: center; } .l-header .l-header__nav ul { display: flex; gap: 1.5rem; list-style: none; margin: 0; padding: 0; } .l-header .l-header__nav ul li a { text-decoration: none; color: #333; font-weight: 500; transition: all 0.3s; } .l-header .l-header__nav ul li a:hover { color: #f5aa00; } .l-header .l-header__tel a { text-decoration: none; color: #333; font-weight: bold; } .l-header .hamburger { display: none; flex-direction: column; justify-content: space-between; width: 30px; height: 20px; background: transparent; border: none; cursor: pointer; padding: 0; z-index: 1100; margin-inline-end: 1.25rem; position: relative; } .l-header .hamburger::after { position: absolute; content: "Menu"; font-size: 9.5px; font-weight: 600; color: #f5aa00; bottom: -15px; } .l-header .hamburger span { display: block; width: 100%; height: 3px; background-color: #f5aa00; transition: 0.3s; } .l-header .hamburger.active span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); } .l-header .hamburger.active span:nth-child(2) { opacity: 0; } .l-header .hamburger.active span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); } .l-header .mobile-menu { position: fixed; top: 0; right: 0; height: 100vh; width: 80%; max-width: 300px; background: #fff; transform: translateX(100%); transition: transform 0.3s ease-in-out; z-index: 1050; padding: 2rem 1.5rem; box-shadow: -2px 0 10px rgba(0, 0, 0, 0.1); } .l-header .mobile-menu.is-open { transform: translateX(0); } .l-header .mobile-menu .mobile-nav ul { list-style: none; padding: 0; margin: 0; } .l-header .mobile-menu .mobile-nav ul li { margin-bottom: 1.5rem; } .l-header .mobile-menu .mobile-nav ul li a { text-decoration: none; color: #333; font-size: 1.2rem; } .l-header .mobile-menu .mobile-tel { margin-top: 2rem; padding-block: 1.25rem; text-align: center; background-color: #f5aa00; } .l-header .mobile-menu .mobile-tel a { font-weight: bold; color: #fff; text-decoration: none; font-size: 1.2rem; } @media (max-width: 1250px) { .l-header .l-header__container { display: none; } .l-header .hamburger { display: flex; } .l-header .mobile-menu { display: block; } } @media (min-width: 1360px) { .l-header .mobile-menu { display: none !important; } } .headline-01 { display: inline-flex; flex-direction: column; align-items: center; } .headline-01 span { line-height: 1; } .headline-01 span:first-of-type { font-size: clamp(24px, 3.5vw, 32px); font-weight: 500; position: relative; z-index: 5; } .headline-01 span:first-of-type::before { position: absolute; top: -5px; left: -10px; content: ""; display: block; width: 30px; height: 30px; background-color: #f5aa00; border-radius: 50px; -ms-filter: blur(6px); filter: blur(6px); z-index: -5; } .headline-01 span:last-of-type { font-size: clamp(14px, 3.5vw, 20px); color: #f5aa00; font-weight: 700; margin-block-start: 0.3125rem; } .headline-02 { font-size: clamp(18px, 3.5vw, 22px); font-weight: 600; padding-block-end: 0.625rem; border-block-end: dotted 2px #333; } .headline-03 { font-size: clamp(16px, 3.5vw, 24px); font-weight: 600; color: #8dc21f; } .headline-04 { font-size: clamp(24px, 3.5vw, 32px); color: #f5aa00; } .headline-05 { font-size: clamp(24px, 3.5vw, 32px); font-weight: 600; } .card-01 { width: 100%; padding-block: 5rem; border-radius: 10px; display: grid; justify-content: center; align-items: center; min-width: 0; } .card-01:first-of-type { background-color: #8dc21f; } .card-01:last-of-type { background-color: #f5aa00; } .card-01__inner { width: 100%; min-width: 0; align-items: center; gap: 1.25rem; } .card-01__icon { height: 50px; width: auto; object-fit: contain; display: block; } .card-01__text { margin-block-start: 1.25rem; } .card-01__text span { font-size: clamp(20px, 3.5vw, 48px); color: #fff; line-height: 1; display: block; text-align: center; } .card-02 { width: 100%; padding: 1.875rem; background-color: #fff; border-radius: 10px; } .card-02__icon { text-align: center; margin-block-start: 3.125rem; } .card-02__icon img { width: 6.25rem; height: 6.25rem; } .card-02__text { margin-block-start: 1.875rem; } .card-03__inner { display: flex; position: relative; } @media only screen and (max-width: 575px) { .card-03__inner { display: block; } } .card-03__num { position: absolute; top: -20px; left: 0; width: 40px; height: 40px; border-radius: 50px; background-color: #8dc21f; display: grid; place-items: center; } .card-03__num span { font-family: "Quicksand", sans-serif; font-size: clamp(16px, 3.5vw, 20px); color: #fff; font-weight: 600; } .card-03__contents { width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 1.25rem; background-color: #fff; margin-inline-start: 20px; padding-inline: 1.25rem; line-height: 1.5; margin-block: calc((1em - 1lh) / 2); } @media only screen and (max-width: 575px) { .card-03__contents { flex-direction: column; padding-block: 0.625rem; width: calc(100% - 20px); } } .card-03__container { width: 75%; padding-block: 1.25rem; } @media only screen and (max-width: 767px) { .card-03__container { width: 100%; } } .card-03__icon { height: 80px; } @media only screen and (max-width: 575px) { .card-03__icon { margin-block-start: -30px; } } .card-03__title { margin-block-end: 0.625rem; } /* safari */ _::-webkit-full-page-media-01, _:future-01, :root .card-01 { width: 100%; padding-block: 5rem; border-radius: 10px; display: grid; justify-content: center; align-items: center; min-width: 0; } _::-webkit-full-page-media-01:first-of-type, _:future-01:first-of-type, :root .card-01:first-of-type { background-color: #8dc21f; } _::-webkit-full-page-media-01:last-of-type, _:future-01:last-of-type, :root .card-01:last-of-type { background-color: #f5aa00; } _::-webkit-full-page-media-01__inner, _:future-01__inner, :root .card-01__inner { width: 100%; min-width: 0; display: flex; justify-content: center; align-items: center; gap: 1.25rem; } @media only screen and (max-width: 767px) { _::-webkit-full-page-media-01__inner, _:future-01__inner, :root .card-01__inner { flex-direction: column; } } _::-webkit-full-page-media-01__icon, _:future-01__icon, :root .card-01__icon { height: 50px; width: auto; object-fit: contain; display: block; } _::-webkit-full-page-media-01__text span, _:future-01__text span, :root .card-01__text span { font-size: clamp(20px, 3.5vw, 48px); color: #fff; line-height: 1; display: block; text-align: center; } .btn-01, .btn-01--green { display: block; width: 100%; text-align: center; padding-block: 1.25rem; background-color: #f5aa00; border: solid 2px #f5aa00; border-radius: 50px; transition: all 0.25s; position: relative; color: #fff; font-weight: 600; line-height: 1; } .btn-01::after, .btn-01--green::after { position: absolute; content: "→"; color: #fff; width: 10px; height: 10px; right: 30px; transition: all 0.25s; } .btn-01:hover, .btn-01--green:hover { color: #f5aa00; background-color: #fff; } .btn-01:hover::after, .btn-01--green:hover::after { color: #f5aa00; right: 20px; } .btn-01--green { background-color: #8dc21f; border: solid 2px #8dc21f; } .btn-01--green:hover { color: #8dc21f; background-color: #fff; } .btn-01--green:hover::after { color: #8dc21f; right: 20px; } .text--orange, .text--orange-bold { color: #f5aa00; } .text--orange-bold { font-weight: 600; } .text--green { color: #8dc21f; } .text--bold { font-weight: 600; } .navigation.pagination .page-numbers { font-size: clamp(14px, 3.5vw, 16px); display: inline-grid; place-items: center; background-color: #fff; width: 50px; height: 50px; padding: 5px; border-radius: 50px; } .navigation.pagination .page-numbers.dots { background-color: unset; } .navigation.pagination .page-numbers.current { background-color: #f5aa00; } .mb--0 { margin-block-end: 0 !important; } .mb--10 { margin-block-end: 0.625rem !important; } .mb--20 { margin-block-end: 1.25rem !important; } .mb--30 { margin-block-end: 1.875rem !important; } .mb--40 { margin-block-end: 2.5rem !important; } .mb--50 { margin-block-end: 3.125rem !important; } .mt--0 { margin-block-start: 0 !important; } .mt--10 { margin-block-start: 0.625rem !important; } .mt--20 { margin-block-start: 1.25rem !important; } .mt--30 { margin-block-start: 1.875rem !important; } .mt--40 { margin-block-start: 2.5rem !important; } .mt--50 { margin-block-start: 3.125rem !important; } .pb--0 { padding-block-end: 0 !important; } .pb--10 { padding-block-end: 0.625rem !important; } .pb--20 { padding-block-end: 1.25rem !important; } .pb--30 { padding-block-end: 1.875rem !important; } .pb--40 { padding-block-end: 2.5rem !important; } .pb--50 { padding-block-end: 3.125rem !important; } .pt--0 { padding-block-start: 0 !important; } .pt--10 { padding-block-start: 0.625rem !important; } .pt--20 { padding-block-start: 1.25rem !important; } .pt--30 { padding-block-start: 1.875rem !important; } .pt--40 { padding-block-start: 2.5rem !important; } .pt--50 { padding-block-start: 3.125rem !important; }