@charset "UTF-8"; /*** The new CSS reset - version 1.7.3 (last updated 7.8.2022) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug */ *:where(:not(html, iframe, 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-width: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* 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; } /* 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; } :root { --black: #000; --dark-gray: #b2b2b2; --gray: #ccc; --light-gray: #e1e1e1; --pale-gray: #ededed; --pale-gray-rgb: 237, 237, 237; --common-blue: #007dc3; --common-blue-rgb: 0, 125, 195; --common-red: #972727; --common-yellow: #fdd000; --common-orange: #f5ac31; --common-pink: #f29298; --vivid-pink: #e9546b; --gra-orange: linear-gradient(to bottom, #f3d197 0%, #f3d197 1%, var(--common-orange) 1.5%, #f37f04 100%); --gra-pink: linear-gradient(to bottom, #fdd4d7 0%, #fdd4d7 1%, var(--common-pink) 1.5%, #e93f4a 100%); --noto-sans: "Noto Sans JP", sans-serif; --oswald: "Oswald", sans-serif; --rem-base: 0.0625rem; --lgSpace: clamp(4rem, 2.5rem + 5vw, 5.625rem); --mdSpace: clamp(3.125rem, 1.856rem + 4.23vw, 4.5rem); --easeInSine: cubic-bezier(0.47, 0, 0.745, 0.715); --easeOutSine: cubic-bezier(0.39, 0.575, 0.565, 1); --easeInOutSine: cubic-bezier(0.445, 0.05, 0.55, 0.95); --easeInQuad: cubic-bezier(0.55, 0.085, 0.68, 0.53); --easeOutQuad: cubic-bezier(0.25, 0.46, 0.45, 0.94); --easeInOutQuad: cubic-bezier(0.455, 0.03, 0.515, 0.955); --easeInCubic: cubic-bezier(0.55, 0.055, 0.675, 0.19); --easeOutCubic: cubic-bezier(0.215, 0.61, 0.355, 1); --easeInOutCubic: cubic-bezier(0.645, 0.045, 0.355, 1); --easeInQuart: cubic-bezier(0.895, 0.03, 0.685, 0.22); --easeOutQuart: cubic-bezier(0.165, 0.84, 0.44, 1); --easeInOutQuart: cubic-bezier(0.77, 0, 0.175, 1); --easeInQuint: cubic-bezier(0.755, 0.05, 0.855, 0.06); --easeOutQuint: cubic-bezier(0.23, 1, 0.32, 1); --easeInOutQuint: cubic-bezier(0.86, 0, 0.07, 1); --easeInExpo: cubic-bezier(0.95, 0.05, 0.795, 0.035); --easeOutExpo: cubic-bezier(0.19, 1, 0.22, 1); --easeInOutExpo: cubic-bezier(1, 0, 0, 1); --easeInCirc: cubic-bezier(0.6, 0.04, 0.98, 0.335); --easeOutCirc: cubic-bezier(0.075, 0.82, 0.165, 1); --easeInOutCirc: cubic-bezier(0.785, 0.135, 0.15, 0.86); --easeInBack: cubic-bezier(0.6, -0.28, 0.735, 0.045); --easeOutBack: cubic-bezier(0.175, 0.885, 0.32, 1.275); --easeInOutBack: cubic-bezier(0.68, -0.55, 0.265, 1.55); } * { box-sizing: border-box; } *:focus-visible { outline: 2px solid var(--black); } html { height: 100%; } body { height: 100%; min-height: 100vh; -webkit-text-size-adjust: 100%; font-size: 1rem; line-height: 1.7; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Hiragino Sans", "Noto Sans CJK JP", "Yu Gothic", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Sans Emoji"; } @media screen and (min-resolution: 2dppx), screen and (-webkit-min-device-pixel-ratio: 2) { body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } } body * { scroll-margin-top: 7.5rem; } a { transition: all 0.3s ease; color: var(--common-blue); } a:visited { color: var(--common-blue); } @media (hover: hover) and (pointer: fine) { a:hover { text-decoration: none; } a:hover img { opacity: 0.7; } } a img { transition: all 0.3s ease; vertical-align: bottom; } h1, h2, h3, h4, h5, h6 { font-family: var(--noto-sans); font-weight: 700; } img { max-width: 100%; height: auto; } ul { list-style: none; } .pageHeader { border-top: 4px solid var(--common-blue); margin-bottom: calc(var(--rem-base) * 72); overflow: hidden; } .pageHeader__mainRow { position: relative; } .pageHeader__siteName { margin: 0.75rem 0 0.5rem; } @media (max-width: 67.5rem) { .pageHeader__siteName { padding-left: 3rem; } } @media (max-width: 48rem) { .pageHeader__siteName img { width: 200px; } } @media (max-width: 32.5rem) { .pageHeader__siteName { padding-left: 1rem; } } .pageHeader__content { position: relative; display: flex; flex-direction: column; justify-content: center; } .pageHeader__contentInner { padding-left: calc((100vw - var(--rem-base) * 1000) / 2); } @media (max-width: 67.5rem) { .pageHeader__contentInner { padding: 0; } } .pageHeader__mainWords { position: relative; left: -2.5vw; background: url(../images/bg_header-catcharea.jpg); padding: 1.25rem 0 1.8rem calc((102.5vw - var(--rem-base) * 1000) / 2); rotate: -3deg; width: 105vw; color: #fff; font-family: var(--noto-sans); font-size: calc(var(--rem-base) * 26); font-weight: 700; font-feature-settings: "palt"; line-height: 1.3; } @media (max-width: 67.5rem) { .pageHeader__mainWords { z-index: 1; padding-left: 0; text-align: center; } } @media (max-width: 48rem) { .pageHeader__mainWords { background: url(../images/img_header-photo.png) calc(100% - 1rem) 50%/auto 130% no-repeat scroll, url(../images/bg_header-catcharea.jpg) 0 0/auto repeat scroll; padding: 1.15rem 0 1.15rem 10vw; font-size: calc(var(--rem-base) * 22); text-align: left; } } @media (max-width: 32.5rem) { .pageHeader__mainWords { background-position: calc(100% + 1rem) 50%, 0 0; background-size: auto 100%, auto; padding: 1.15rem calc(1rem + 2.5vw); } } .pageHeader__mainWords > span { display: block; } .pageHeader__mainWardYear { mix-blend-mode: multiply; color: #444; font-size: clamp(100px, var(--rem-base) * 100, 7.3206442167vw); font-weight: 900; line-height: 1; letter-spacing: -0.03em; } @media (max-width: 48rem) { .pageHeader__mainWardYear { font-size: calc(var(--rem-base) * 72); } } @media (max-width: 32.5rem) { .pageHeader__mainWardYear { font-size: calc(var(--rem-base) * 50); } } .pageHeader__establishedYearDiff { display: inline-block; position: relative; top: 0.06em; font-size: 1.25em; } .pageHeader__mainWardBody { margin-top: 0.75em; } .pageHeader__mainWardYellow { display: block; color: var(--common-yellow); font-size: 2.3em; font-feature-settings: "palt"; } @media (max-width: 48rem) { .pageHeader__mainWardYellow { font-size: 1.8em; } } @media (max-width: 32.5rem) { .pageHeader__mainWardYellow { font-size: 1.25em; } } .pageHeader__prodlist { position: relative; z-index: 1; display: flex; gap: calc(var(--rem-base) * 10); margin: 2rem 0 1.5rem; font-size: calc(var(--rem-base) * 14); line-height: 1.5; } .pageHeader__prodlist li { text-align: center; } @media (max-width: 67.5rem) { .pageHeader__prodlist { justify-content: center; background: rgba(255, 255, 255, 0.8); border-radius: 0.5rem; backdrop-filter: blur(4px); padding: 1rem; margin-inline: auto; width: fit-content; } .pageHeader__prodlist li { flex: 1; } } @media (max-width: 32.5rem) { .pageHeader__prodlist { background: none; backdrop-filter: none; padding: 0 calc(var(--rem-base) * 20); margin: 1rem auto 1.5rem; } } .pageHeader__linkBtn { position: absolute; bottom: 2rem; right: calc((100vw - var(--rem-base) * 1000) / 2); z-index: 10; } @media (max-width: 67.5rem) { .pageHeader__linkBtn { position: static; margin: 1rem auto 2rem; } } .pageHeader__mainImg { content: ""; display: block; position: absolute; top: 0; right: 0; background: url(../images/img_header-photo.png) 0 100%/contain no-repeat scroll; width: 50%; height: 100%; } @media (max-width: 73.75rem) { .pageHeader__mainImg { background-size: cover; } } @media (max-width: 67.5rem) { .pageHeader__mainImg { top: unset; bottom: 0; background-position: 0 0; width: 33vw; height: 60%; } } @media (max-width: 48rem) { .pageHeader__mainImg { display: none; } } .pageHeader__lead { position: relative; z-index: 1; padding: calc(var(--rem-base) * 20) 0; background: var(--common-blue); font-family: var(--noto-sans); font-size: calc(var(--rem-base) * 24); font-weight: 700; color: #fff; text-align: center; } @media (max-width: 48rem) { .pageHeader__lead { padding: calc(var(--rem-base) * 20); font-size: calc(var(--rem-base) * 22); } } @media (max-width: 32.5rem) { .pageHeader__lead { font-size: calc(var(--rem-base) * 18); } } .pageFooter { background: var(--pale-gray); } .pageFooter__firstRow { display: flex; align-items: flex-end; justify-content: center; flex-wrap: wrap; gap: calc(var(--rem-base) * 36); padding: 2rem calc(var(--rem-base) * 20); } @media (max-width: 40rem) { .pageFooter__firstRow { flex-direction: column; align-items: center; gap: calc(var(--rem-base) * 32); } } @media (max-width: 40rem) { .pageFooter__logo { width: 220px; } } .pageFooter__officeList { display: flex; align-items: center; flex-wrap: wrap; gap: 1.5rem; font-size: 0.88em; line-height: 1.3; } @media (max-width: 40rem) { .pageFooter__officeList { justify-content: center; } } .pageFooter__officeName { display: flex; align-items: center; justify-content: flex-start; gap: 0.25em; margin: 0 0 0.33em; font-size: 1em; } .pageFooter__officeName::before { --square-size: 0.88em; content: ""; display: inline-block; background: var(--common-blue); width: var(--square-size); height: var(--square-size); } .pageFooter__copyright { display: block; padding: calc(var(--rem-base) * 20) 0 calc(var(--rem-base) * 40); padding-bottom: calc(var(--rem-base) * 150); background: var(--common-blue); width: 100%; color: #fff; font-size: 0.88em; text-align: center; } .pageFooter__copyright.notHasFix { padding-bottom: calc(var(--rem-base) * 30); } [class^=wrapper] { position: relative; margin-inline: auto; padding-inline: calc(var(--rem-base) * 20); } .wrapper { width: min(var(--rem-base) * 1000, 100%); } .wrapper--narrow { width: min(var(--rem-base) * 820, 100%); } .wrapper .wrapper--narrow { padding-inline: 0; } .lgBlock { margin-bottom: var(--lgSpace); } .lgPaddingBlock { padding-block: var(--lgSpace); } .mdBlock { margin-bottom: var(--mdSpace); } .casesSetion__products { display: flex; flex-wrap: wrap; justify-content: flex-start; gap: calc(var(--rem-base) * 42); } @media (max-width: 32.5rem) { .casesSetion__products { flex-direction: column; gap: calc(var(--rem-base) * 54); } } .casesSetion__products > li { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; width: calc((100% - var(--rem-base) * 42) / 2); } @media (max-width: 32.5rem) { .casesSetion__products > li { width: 100%; } } .casesSetion .productSlider { width: calc(var(--rem-base) * 200); } @media (max-width: 55rem) { .casesSetion .productSlider { margin-inline: auto; } } @media (max-width: 32.5rem) { .casesSetion .productSlider { width: 80%; } } .casesSetion { --swiper-theme-color: var(--common-blue); } .casesSetion .swiper-pagination { position: static; padding-block: 0.5rem 0; } @media (max-width: 55rem) { .casesSetion .swiper-pagination { border-top: 1px solid var(--light-gray); padding-block: 0.33rem 2rem; } } .casesSetion .swiper-pagination-bullet { --swiper-pagination-bullet-inactive-color: var(--light-gray); --swiper-pagination-bullet-inactive-opacity: 1; cursor: pointer; } body:after { content: url(../images/loading.svg); } .lightbox { --slider-nav-icon-size: calc( var(--rem-base) * 40 ); } @media (max-width: 32.5rem) { .lightbox { --slider-nav-icon-size: calc( var(--rem-base) * 20 ); } } @keyframes loadingRotate { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .lb-cancel { animation: loadingRotate 4s linear infinite; background-image: url(../images/loading.svg); } .lb-outerContainer { border-radius: 0; } @media (max-width: 32.5rem) { .lb-outerContainer { margin-bottom: calc(var(--slider-nav-icon-size) + 0.5rem); } } @media (max-width: 32.5rem) { .lb-nav { position: relative; left: 0; top: -0.5rem; display: flex; justify-content: center; gap: 1.5rem; background: rgba(0, 0, 0, 0.75); border-radius: 10rem; padding: 0.5rem 1rem; margin-inline: auto; width: fit-content; } } .lb-nav a.lb-next, .lb-nav a.lb-prev { background: none; opacity: 1; width: 50%; } .lb-nav a.lb-next::after, .lb-nav a.lb-prev::after { content: ""; display: block; position: absolute; top: 50%; translate: 0 -50%; width: var(--slider-nav-icon-size); height: var(--slider-nav-icon-size); } @media (max-width: 32.5rem) { .lb-nav a.lb-next, .lb-nav a.lb-prev { position: static; float: none; width: var(--slider-nav-icon-size); } .lb-nav a.lb-next::after, .lb-nav a.lb-prev::after { position: static; translate: none; } } .lb-nav a.lb-prev::after { left: calc(var(--slider-nav-icon-size) * -1); background: url(../images/icon_slider-prev_white.svg) 0 0/contain no-repeat scroll; } .lb-nav a.lb-next::after { right: calc(var(--slider-nav-icon-size) * -1); background: url(../images/icon_slider-next_white.svg) 0 0/contain no-repeat scroll; } @media (max-width: 32.5rem) { .lb-nav a.lb-next::after { margin-inline: auto 0; } } .casesSetion__detail { width: calc(100% - var(--rem-base) * 224); } @media (max-width: 55rem) { .casesSetion__detail { width: 100%; } } .casesSetion__detail h3 { margin: 0 0 0.5em; font-family: var(--noto-sans); font-size: calc(var(--rem-base) * 20); font-weight: 700; line-height: 1.4; } @media (max-width: 48rem) { .casesSetion__detail h3 { font-size: calc(var(--rem-base) * 18); } } .casesSetion__detail dt { border-top: 2px solid var(--gray); border-bottom: 1px solid var(--gray); margin-bottom: calc(var(--rem-base) * 6); padding: 0.3em 0.25em; font-family: var(--noto-sans); } .casesSetion__detail dd:not(:last-child) { margin-bottom: calc(var(--rem-base) * 22); } .casesSetion__detail dd ul { display: flex; align-items: flex-start; flex-direction: column; gap: 0.25em; font-size: 0.88em; } .casesSetion__detail dd li { position: relative; padding-left: 1.3em; } .casesSetion__detail dd li::before { content: ""; --circle-size: 0.9em; display: block; position: absolute; top: 0.38em; left: 0; border-radius: 50%; background: var(--common-orange); width: var(--circle-size); height: var(--circle-size); } dt.casesSetion__solution { border-top-color: var(--common-blue); color: var(--common-blue); } .advantagesSection__points { display: flex; align-items: flex-start; flex-direction: column; gap: calc(var(--rem-base) * 24); } @media (max-width: 48rem) { .advantagesSection__points { margin-inline: auto; width: fit-content; } } .advantagesSection__points li { display: flex; align-items: center; font-weight: 700; width: 100%; } @media (max-width: 48rem) { .advantagesSection__points li { flex-direction: column; align-items: flex-start; } } .advantagesSection__pointsTitle { display: flex; align-items: center; gap: 0.25em; color: var(--common-blue); font-family: var(--noto-sans); font-size: calc(var(--rem-base) * 30); width: 31.7%; } @media (max-width: 55rem) { .advantagesSection__pointsTitle { font-size: calc(var(--rem-base) * 28); } } @media (max-width: 48rem) { .advantagesSection__pointsTitle { width: 100%; } } .advantagesSection__pointsTitle::before { --icon-size: calc(var(--rem-base) * 44); content: ""; background: url(../images/bg_strpoint.svg) 0 50%/contain no-repeat scroll; width: var(--icon-size); height: var(--icon-size); } @media (max-width: 48rem) { .advantagesSection__pointsTitle::before { --icon-size: calc(var(--rem-base) * 38); } } .advantagesSection__pointsContent { padding: 0 0 0 30px; border-left: 2px solid var(--common-blue); font-size: 18px; } @media (max-width: 48rem) { .advantagesSection__pointsContent { border-left: 0; border-top: 2px solid var(--common-blue); padding: 0.25em 0.5em; width: 100%; } } .awardsSection__itemContent { display: flex; flex-wrap: wrap; align-items: center; gap: 1.5rem 0; } @media (max-width: 48rem) { .awardsSection__itemContent { flex-direction: column; } } @media (max-width: 32.5rem) { .awardsSection__itemContent { gap: 0; } } .awardsSection__header { display: flex; flex-direction: column; justify-content: center; border: 1px solid var(--common-blue); border-width: 1px 0 1px 4px; padding: 3rem 0 2.75rem 2rem; width: 60%; } @media (max-width: 48rem) { .awardsSection__header { border-width: 4px 1px 1px 1px; padding: 2rem 1.5rem; width: 100%; } } @media (max-width: 32.5rem) { .awardsSection__header { border-width: 4px 1px 0px 1px; padding: 1rem 1.5rem; margin-inline: auto; width: calc(100% - 2rem); } } .awardsSection__title { position: relative; margin: 0 0 1em; padding: 0 0 0.5em 2.5em; border-bottom: 2px solid var(--gray); color: var(--common-blue); font-size: calc(var(--rem-base) * 22); line-height: 1.3; } @media (max-width: 48rem) { .awardsSection__title { font-size: calc(var(--rem-base) * 20); } } @media (max-width: 32.5rem) { .awardsSection__title { padding: 0 2.5em 0.5em 0; font-size: calc(var(--rem-base) * 18); } } .awardsSection__title::before, .awardsSection__title::after { content: ""; display: block; position: absolute; left: 0; } .awardsSection__title::before { top: calc(50% - 25px - 0.25em); aspect-ratio: 4/5; background: url(../images/icon_awards-badge.png) 0 0/contain no-repeat scroll; height: 50px; } @media (max-width: 32.5rem) { .awardsSection__title::before { top: 0; left: unset; right: 0; height: 40px; } } .awardsSection__title::after { bottom: -2px; background: var(--common-blue); width: 25%; height: 2px; } .awardsSection__awardsData { border-left: 2px solid var(--dark-gray); padding: 0.5em 1.25em; font-weight: 700; line-height: 1.4; } @media (max-width: 32.5rem) { .awardsSection__awardsData { border: 0; padding: 0; font-size: 0.88em; } } .awardsSection__imgArea { position: relative; z-index: 2; width: 40%; } @media (max-width: 48rem) { .awardsSection__imgArea { width: min(100%, 480px); } } @media (max-width: 32.5rem) { .awardsSection__imgArea { margin-bottom: 1.5rem; } } .awardsSection__imgArea::before, .awardsSection__imgArea::after { content: ""; display: block; position: absolute; } .awardsSection__imgArea::before { top: 0.5rem; left: 0.5rem; background: var(--pale-gray); mix-blend-mode: multiply; width: 100%; height: 100%; } .awardsSection__imgArea .productSlider { border: 1px solid var(--gray); } .awardsSection__imgArea .swiper-pagination { left: 0.25rem; background: rgba(255, 255, 255, 0.5); border-radius: 10rem; padding-inline: 0.75em; width: fit-content; } .awardsSection__itemDetail { position: relative; background: var(--pale-gray); padding: 1rem 1.5rem; width: 100%; } @media (max-width: 32.5rem) { .awardsSection__itemDetail { font-size: 0.9em; } } .clientsSection__clientList { display: flex; flex-wrap: wrap; gap: calc(var(--rem-base) * 10) calc(var(--rem-base) * 32); padding-inline: 1rem; font-size: calc(var(--rem-base) * 24); font-weight: 700; } @media (max-width: 48rem) { .clientsSection__clientList { font-size: calc(var(--rem-base) * 22); } } @media (max-width: 32.5rem) { .clientsSection__clientList { gap: 0.75rem; padding-inline: 0; font-size: calc(var(--rem-base) * 20); line-height: 1.5; } } .clientsSection__clientList li { width: calc((100% - 2rem) / 2); } @media (max-width: 32.5rem) { .clientsSection__clientList li { border-bottom: 1px solid var(--gray); padding: 0 0.5rem 0.75rem; width: 100%; } } .flowSection__steps { display: flex; gap: 1.75rem; } @media (max-width: 48rem) { .flowSection__steps { flex-flow: column wrap; gap: 1.5rem; margin-inline: auto; width: min(var(--rem-base) * 480, 100%); } } .flowSection__stepsItem { position: relative; flex: 1; display: flex; align-items: center; flex-flow: column wrap; flex-grow: 1; justify-content: flex-start; background: #006ca6; color: #fff; padding: 1.5rem 0 3rem; font-weight: 700; font-size: calc(var(--rem-base) * 20); line-height: 1; } .flowSection__stepsItem:not([data-step=complete])::after { content: ""; position: absolute; top: 0; right: calc(-3rem + 1px); background: #006ca6; clip-path: polygon(0 0, 0 100%, 100% 50%); width: 3rem; height: 100%; } @media (max-width: 48rem) { .flowSection__stepsItem { flex-direction: row; align-items: center; justify-content: center; gap: 0.25rem; padding: 1.25rem 0 0.5rem; } .flowSection__stepsItem:not([data-step=complete])::after { top: unset; right: 50%; bottom: calc(-2rem + 1px); clip-path: polygon(0 0, 50% 100%, 100% 0); translate: 50% 0; width: 100%; height: 2rem; } } .flowSection__stepsItem[data-step="1"] { z-index: 7; } .flowSection__stepsItem[data-step="2"] { z-index: 6; } .flowSection__stepsItem[data-step="3"] { z-index: 5; } .flowSection__stepsItem[data-step="4"] { z-index: 4; } .flowSection__stepsItem[data-step="5"] { z-index: 3; } .flowSection__stepsItem[data-step="6"] { z-index: 2; } .flowSection__stepsItem[data-step="2"], .flowSection__stepsItem[data-step="2"]::after { background: #007db9; } .flowSection__stepsItem[data-step="3"], .flowSection__stepsItem[data-step="3"]::after { background: #48a2d4; } .flowSection__stepsItem[data-step="4"], .flowSection__stepsItem[data-step="4"]::after { background: #77badf; } .flowSection__stepsItem[data-step="5"], .flowSection__stepsItem[data-step="5"]::after { background: #92c8e5; } .flowSection__stepsItem[data-step="6"], .flowSection__stepsItem[data-step="6"]::after { background: #aacee4; } .flowSection__stepsNumUnit, .flowSection__stepsNumber { display: block; font-family: var(--oswald); font-weight: 400; } .flowSection__stepsNumUnit { padding-left: 0.1em; margin-bottom: 0.33em; font-size: 0.6em; letter-spacing: 0.2em; text-transform: uppercase; } @media (max-width: 48rem) { .flowSection__stepsNumUnit { margin: 0; letter-spacing: 0.06em; font-size: 0.75em; } } .flowSection__stepsNumber { font-size: 1.75em; font-weight: 400; } @media (max-width: 48rem) { .flowSection__stepsNumber { font-size: 1.33em; } } .flowSection__stepsTitle { writing-mode: vertical-rl; padding-inline: 1em 0; font-family: var(--noto-sans); } @media (max-width: 48rem) { .flowSection__stepsTitle { padding: 0.25em 0 0 0.5em; width: 100%; writing-mode: horizontal-tb; text-align: center; } } .flowSection__stepsItem[data-step=complete] { background: var(--common-orange); justify-content: center; font-size: calc(var(--rem-base) * 26); } @media (max-width: 48rem) { .flowSection__stepsItem[data-step=complete] { padding: 1.25rem 0; } } .messageSection { background: var(--light-gray); } .messageSection .lgTitle { top: calc(var(--rem-base) * -20); margin-bottom: 0.5em; } .messageSection__content { display: flex; flex-wrap: wrap; justify-content: center; align-items: flex-end; gap: calc(var(--rem-base) * 50); } @media (max-width: 48rem) { .messageSection__content { flex-direction: column; align-items: center; gap: 2rem; } } .messageSection__imgArea { position: relative; } @media (min-width: 48.0625rem) { .messageSection__imgArea { order: -1; } } .messageSection__person { display: block; width: calc(var(--rem-base) * 200); } .messageSection__balloon { position: absolute; left: -3rem; bottom: 0.5rem; } @media (min-width: 48.0625rem) { .messageSection__text { padding: 0 0 2rem; width: calc(100% - var(--rem-base) * 250); } } .messageSection__btnArea { background: #fff; } .messageSection__btnAreaTitle { background: var(--common-blue); padding: 1em 1rem; color: #fff; font-size: 1.25em; text-align: center; } .messageSection__btnAreaContent { padding: 2rem 1rem; } #sect_contact h2 { padding: 20px 0; background: var(--common-blue); font-size: 24px; font-weight: 700; color: #fff; } #sect_contact table { margin: 0 auto 30px auto; box-sizing: border-box; border: 1px solid #ddd; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); font-size: 15px; width: 770px; } #sect_contact table tr:nth-child(even) { background: #f8f8f8; } #sect_contact table tr:nth-child(5) td { border-bottom: 0; } #sect_contact table tr:nth-child(6) th, #sect_contact table tr:nth-child(6) td { background: #fff; } #sect_contact table tr:nth-child(6) td { border-bottom: 0; padding-top: 5px; padding-bottom: 5px; } #sect_contact table tr:last-child th, #sect_contact table tr:last-child td { border-bottom: 0; } #sect_contact table th, #sect_contact table td { vertical-align: middle; padding: 10px 20px; border-bottom: 1px solid #ddd; } #sect_contact table th { font-weight: normal; text-align: left; width: 10em; } #sect_contact table .address_subtitle { width: 6em; } #sect_contact li { display: inline-block; } #sect_contact li:first-child { margin-right: 10px; } input[type=text], input[type=email], input[type=tel] { border: 1px solid #dbdbdb; border-radius: calc(var(--rem-base) * 6); line-height: 35px; font-size: 16px; width: 100%; height: 35px; } select { font-size: 16px; } textarea { border: 1px solid #dbdbdb; border-radius: calc(var(--rem-base) * 6); font-size: 16px; width: 100%; height: 15em; } button { padding: 0; border: 0; background: transparent; transition: all 0.3s ease; font-size: 2em; } button:hover { opacity: 0.7; } button img { vertical-align: bottom; } div#mfp_phase_confirm_inner h4 { font-size: 20px; line-height: 1.5em; margin-bottom: 20px; } table#mfp_confirm_table { font-size: 15px; } table#mfp_confirm_table tr.mfp_achroma { background: transparent; } table#mfp_confirm_table tr.mfp_colored { background: #f8f8f8; } div.mfp_buttons { margin-top: 15px; } div.mfp_buttons button#mfp_button_send, div.mfp_buttons button#mfp_button_cancel { width: 200px; height: 45px; } div.mfp_buttons button#mfp_button_send { background: url(../images/btn_send.png) 0 0 no-repeat scroll; margin-right: 10px; } div.mfp_buttons button#mfp_button_cancel { background: url(../images/btn_cancel.png) 0 0 no-repeat scroll; } #thankspage { padding-top: 50px; } #thankspage h2 { margin-bottom: 30px; color: var(--common-blue); font-size: 24px; text-align: left; } #thankspage p { margin-bottom: 10px; } #thankspage ul { margin-top: 20px; } #thankspage ul li { margin-bottom: 5px; } body.contact:after { display: none; } .c-button { display: inline-block; padding: 0.25em 1em; color: #fff; font-size: calc(var(--rem-base) * 20); text-align: center; } @media (max-width: 48rem) { .c-button { font-size: calc(var(--rem-base) * 16); } } .c-button.--auto { background: #0068b6; font-size: calc(var(--rem-base) * 16); margin-left: 0.5em; } .c-button.--submit { background: #0068b6; width: min(100%, 250px); } .c-button.--return { background: #828282; width: min(100%, 250px); } .formSection { margin-bottom: calc(var(--rem-base) * 100); } @media (max-width: 48rem) { .formSection { margin-bottom: calc(var(--rem-base) * 50); } } .formSection h1 { margin-bottom: calc(var(--rem-base) * 9); font-size: calc(var(--rem-base) * 24); } @media (max-width: 48rem) { .formSection h1 { font-size: calc(var(--rem-base) * 20); } } .formSection p { margin-bottom: calc(var(--rem-base) * 40); font-size: calc(var(--rem-base) * 16); } @media (max-width: 48rem) { .formSection p { margin-bottom: calc(var(--rem-base) * 30); font-size: calc(var(--rem-base) * 14); } } .formSection .tableWrapper { background: #b4dcff; padding: calc(var(--rem-base) * 12) 0; margin-bottom: calc(var(--rem-base) * 45); } @media (max-width: 48rem) { .formSection .tableWrapper { margin-bottom: calc(var(--rem-base) * 30); } } .formSection table { width: 87%; margin: 0 auto; } .formSection table th, .formSection table td { border-bottom: solid 1px #fff; padding: calc(var(--rem-base) * 18) 0; font-size: calc(var(--rem-base) * 16); } @media (max-width: 32.5rem) { .formSection table th, .formSection table td { display: block; font-size: calc(var(--rem-base) * 14); } } .formSection table tr:last-child th, .formSection table tr:last-child td { border-bottom: none; } .formSection table th { vertical-align: top; } @media (max-width: 32.5rem) { .formSection table th { border-bottom: none; padding-bottom: 0; } } .formSection table th b { color: #ff0048; } .formSection table td { width: 77.5862068966%; } @media (max-width: 32.5rem) { .formSection table td { width: 100%; padding-top: 0; } } @media (max-width: 32.5rem) { .formSection .c-button.--auto { margin-top: 0.5em; } } .formSection input:is(:not([type=radio], [type=checkbox])) { border: none; border-radius: 0; background: #fff; padding: 0.25em 0.5em; } .formSection input:is(:not([type=radio], [type=checkbox]))::placeholder { color: #828282; } .formSection input[type=checkbox] { cursor: pointer; padding-left: 30px; /*label手前にチェックボックス用の余白を開ける*/ vertical-align: middle; position: relative; } .formSection input[type=checkbox]:before, .formSection input[type=checkbox]:after { content: ""; display: block; position: absolute; } .formSection input[type=checkbox]:before { border-radius: 0%; border: 1px solid #666464; width: 20px; /*チェックボックスの横幅*/ height: 20px; /*チェックボックスの縦幅*/ transform: translateY(-50%); top: 50%; left: 0; } .formSection input[type=checkbox]:after { border-bottom: 3px solid #666464; /*チェックの太さ*/ border-left: 3px solid #666464; /*チェックの太さ*/ opacity: 0; /*チェック前は非表示*/ height: 6px; /*チェックの高さ*/ width: 11px; /*チェックの横幅*/ transform: rotate(-45deg); top: -4px; /*チェック時の位置調整*/ left: 5px; /*チェック時の位置調整*/ } .formSection input[type=checkbox]:checked:after { opacity: 1; /*チェック後表示*/ } .formSection textarea { border: none; border-radius: 0; background: #fff; padding: 0.25em 0.5em; height: 5em; } .formSection textarea::placeholder { color: #828282; } .formSection textarea[name=message] { display: inline-block; margin-top: 1em; } .formSection input[name=zip] { width: 14em; margin-left: 1em; } @media (max-width: 32.5rem) { .formSection input[name=zip] { width: 12em; margin-left: 0.5em; } } .formSection .submitButton { width: 87%; margin: 0 auto; } @media (max-width: 32.5rem) { .formSection .submitButton { width: 100%; } } .formSection .submitButton .isAccept { margin-bottom: calc(var(--rem-base) * 48); } @media (max-width: 32.5rem) { .formSection .submitButton .isAccept { font-size: calc(var(--rem-base) * 14); } } .formSection .submitButton ul { display: flex; justify-content: center; width: min(100%, (var(--rem-base)) * 540); margin: 0 auto; } @media (max-width: 32.5rem) { .formSection .submitButton ul { flex-wrap: wrap; } } .formSection .submitButton ul li { width: 46.2962962963%; } @media (max-width: 48rem) { .formSection .submitButton ul li { width: 100%; text-align: center; } } .formSection .submitButton ul li:last-child { margin-left: calc(var(--rem-base) * 34); } @media (max-width: 32.5rem) { .formSection .submitButton ul li:last-child { margin-left: 0; margin-top: calc(var(--rem-base) * 10); } } .formSection.pageThanks h1, .formSection.pageThanks p, .formSection.pageThanks .btn { text-align: center; } .formSection.pageThanks .btn a { color: #fff; } .grayBg { background-color: var(--pale-gray); } .ctaBtn { display: block; border-radius: 0.25rem; padding: 0.75em 3em; box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16); transform: translateY(0) translateZ(0); transition-property: transform; width: fit-content; max-width: 480px; color: #fff; font-family: var(--noto-sans); font-size: calc(var(--rem-base) * 24); font-weight: 700; line-height: 1.3; text-align: center; } .ctaBtn:visited { color: #fff; } @media (hover: hover) and (pointer: fine) { .ctaBtn:hover { transform: translateY(0.125rem) translateZ(0); } } @media (max-width: 48rem) { .ctaBtn { font-size: calc(var(--rem-base) * 22); } } @media (max-width: 32.5rem) { .ctaBtn { font-size: calc(var(--rem-base) * 18); } } .ctaBtn--center { margin-inline: auto; } .ctaBtn--pink { background: var(--gra-pink); } .lgTitle { position: relative; background: url(../images/bg_h2.jpg); margin: 0 auto 2.5em; padding: 0.66em 2em; width: fit-content; max-width: calc(90% - 64px); color: #fff; font-weight: 700; text-align: center; font-size: calc(var(--rem-base) * 24); line-height: 1.3; } @media (max-width: 48rem) { .lgTitle { font-size: calc(var(--rem-base) * 22); } } @media (max-width: 32.5rem) { .lgTitle { padding-inline: 0.25em; margin-bottom: 1.75em; max-width: calc(96% - 64px); font-size: calc(var(--rem-base) * 20); } } .lgTitle::before, .lgTitle::after { content: ""; position: absolute; top: 0; width: 32px; height: 100%; } .lgTitle:before { left: -30px; background: url(../images/bg_h2-before.png) 0 0 repeat-y scroll; } .lgTitle:after { right: -30px; background: url(../images/bg_h2-after.png) 0 0 repeat-y scroll; } .mdTitle { margin: 0 0 1em; border-top: 2px solid var(--common-blue); border-bottom: 2px solid var(--common-blue); color: var(--common-blue); font-size: calc(var(--rem-base) * 20); font-weight: 700; text-align: center; } @media (max-width: 32.5rem) { .mdTitle { font-size: calc(var(--rem-base) * 18); } } .productSlider img { display: block; } @media (max-width: 32.5rem) { .productSlider img { width: 100%; } } .productSlider a[data-lightbox] { display: block; position: relative; } @media (hover: hover) and (pointer: fine) { .productSlider a[data-lightbox]:hover img { opacity: 1; } .productSlider a[data-lightbox]:hover::before { background-color: var(--common-blue); } } .productSlider a[data-lightbox]::before { --cases-roupe-size: calc( var(--rem-base) * 32 ); content: ""; position: absolute; right: 0.5rem; bottom: 0.5rem; background: rgba(0, 0, 0, 0.5) url(../images/icon_roupe_white.svg) center/75% auto no-repeat scroll; border-radius: 0.25rem; transition: background-color 0.3s ease; width: var(--cases-roupe-size); height: var(--cases-roupe-size); } .fixedContactArea { position: fixed; left: 0; bottom: 0; z-index: 100; background: rgba(255, 255, 255, 0.8); backdrop-filter: blur(4px); padding: 1rem 0; width: 100%; } .fixedContactArea .ctaBtn { margin-inline: auto; } .ctaSection { position: relative; display: flex; align-items: flex-end; justify-content: center; flex-wrap: wrap; gap: calc(var(--rem-base) * 32); padding: 0 calc(var(--rem-base) * 20); } @media (max-width: 67.5rem) { .ctaSection { flex-direction: column; align-items: center; justify-content: flex-start; gap: 0; background: var(--common-blue); padding: 2rem calc(var(--rem-base) * 20) 0; } } @media (min-width: 67.5625rem) { .ctaSection::before { content: ""; display: block; position: absolute; left: 0; bottom: 0; background: var(--common-blue); width: 100%; height: calc(100% - var(--rem-base) * 20); } } .ctaSectionBtnArea { position: relative; padding-bottom: calc(var(--rem-base) * 6); } @media (max-width: 48rem) { .ctaSectionBtnArea { margin-bottom: 0; } } @media (max-width: 32.5rem) { .ctaSectionBtnArea { width: 100%; } } .ctaSectionBtnArea .ctaBtn { margin: 0 0 0.125em; width: 100%; max-width: unset; } @media (max-width: 32.5rem) { .ctaSectionBtnArea .ctaBtn { margin-bottom: 1.25rem; } } .ctaSectionTel { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 0.25em; color: #fff; font-weight: 700; font-feature-settings: "palt"; letter-spacing: 0.06em; } @media (max-width: 32.5rem) { .ctaSectionTel { flex-direction: column; line-height: 1.3; } } a.ctaSectionTelNum { position: relative; top: -0.06em; padding-left: 1.15em; background: url(../images/icon_tel_white.svg) 0 calc(50% + 0.03em)/auto calc(100% - 0.66em) no-repeat scroll; color: #fff; font-size: 1.5em; font-family: var(--oswald); } a.ctaSectionTelNum:visited { color: #fff; } @media (max-width: 32.5rem) { a.ctaSectionTelNum { background-size: auto 1em; } } .ctaSectionPerson { position: relative; display: block; vertical-align: bottom; } .clearfix { zoom: 1; } .clearfix:after { content: ""; display: block; clear: both; } .flL { float: left; } .flR { float: right; } .clear { clear: both; } .taL { text-align: left !important; } .taR { text-align: right !important; } .taC { text-align: center !important; } .pinkText { color: var(--vivid-pink) !important; } .redText { color: #c40000; } .subText { font-size: 0.88em; } .largeText { font-size: 1.15em; } .normalWeightText { font-weight: normal; } .boldText { font-weight: 700; } @media (max-width: 32.5rem) { .spbr::after { content: "\a"; display: inline; white-space: pre; } } @media (max-width: 48rem) { .tabbr::after { content: "\a"; display: inline; white-space: pre; } } @media (max-width: 32.5rem) { .tabbr.only::after { display: none; } } @media (min-width: 48.062rem) { .pcbr::after { content: "\a"; display: inline; white-space: pre; } } @media (max-width: 48rem) and (min-width: 32.562rem) { .pcbr.xs::after { content: "\a"; display: inline; white-space: pre; } } .mg_c { margin-inline: auto; } .mgT0 { margin-top: 0 !important; } .mgT5 { margin-top: 0.3125rem !important; } .mgT10 { margin-top: 0.625rem !important; } .mgT15 { margin-top: 0.9375rem !important; } .mgT20 { margin-top: 1.25rem !important; } .mgT25 { margin-top: 1.5625rem !important; } .mgT30 { margin-top: 1.875rem !important; } .mgT35 { margin-top: 2.1875rem !important; } .mgT40 { margin-top: 2.5rem !important; } .mgT45 { margin-top: 2.8125rem !important; } .mgT50 { margin-top: 3.125rem !important; } .mgB0 { margin-bottom: 0 !important; } .mgB5 { margin-bottom: 0.3125rem !important; } .mgB10 { margin-bottom: 0.625rem !important; } .mgB15 { margin-bottom: 0.9375rem !important; } .mgB20 { margin-bottom: 1.25rem !important; } .mgB25 { margin-bottom: 1.5625rem !important; } .mgB30 { margin-bottom: 1.875rem !important; } .mgB35 { margin-bottom: 2.1875rem !important; } .mgB40 { margin-bottom: 2.5rem !important; } .mgB45 { margin-bottom: 2.8125rem !important; } .mgB50 { margin-bottom: 3.125rem !important; } .mgL0 { margin-left: 0 !important; } .mgL5 { margin-left: 0.3125rem !important; } .mgL10 { margin-left: 0.625rem !important; } .mgL15 { margin-left: 0.9375rem !important; } .mgL20 { margin-left: 1.25rem !important; } .mgL25 { margin-left: 1.5625rem !important; } .mgL30 { margin-left: 1.875rem !important; } .mgL35 { margin-left: 2.1875rem !important; } .mgL40 { margin-left: 2.5rem !important; } .mgL45 { margin-left: 2.8125rem !important; } .mgL50 { margin-left: 3.125rem !important; } .mgR0 { margin-right: 0 !important; } .mgR5 { margin-right: 0.3125rem !important; } .mgR10 { margin-right: 0.625rem !important; } .mgR15 { margin-right: 0.9375rem !important; } .mgR20 { margin-right: 1.25rem !important; } .mgR25 { margin-right: 1.5625rem !important; } .mgR30 { margin-right: 1.875rem !important; } .mgR35 { margin-right: 2.1875rem !important; } .mgR40 { margin-right: 2.5rem !important; } .mgR45 { margin-right: 2.8125rem !important; } .mgR50 { margin-right: 3.125rem !important; } @media (max-width: 32.5rem) { .mgT5 { margin-top: 0 !important; } .mgT10 { margin-top: 0.3125rem !important; } .mgT15 { margin-top: 0.625rem !important; } .mgT20 { margin-top: 0.9375rem !important; } .mgT25 { margin-top: 1.25rem !important; } .mgT30 { margin-top: 1.5625rem !important; } .mgT35 { margin-top: 1.875rem !important; } .mgT40 { margin-top: 2.1875rem !important; } .mgT45 { margin-top: 2.5rem !important; } .mgT50 { margin-top: 2.8125rem !important; } .mgB5 { margin-bottom: 0 !important; } .mgB10 { margin-bottom: 0.3125rem !important; } .mgB15 { margin-bottom: 0.625rem !important; } .mgB20 { margin-bottom: 0.9375rem !important; } .mgB25 { margin-bottom: 1.25rem !important; } .mgB30 { margin-bottom: 1.5625rem !important; } .mgB35 { margin-bottom: 1.875rem !important; } .mgB40 { margin-bottom: 2.1875rem !important; } .mgB45 { margin-bottom: 2.5rem !important; } .mgB50 { margin-bottom: 2.8125rem !important; } .mgL5 { margin-left: 0 !important; } .mgL10 { margin-left: 0.3125rem !important; } .mgL15 { margin-left: 0.625rem !important; } .mgL20 { margin-left: 0.9375rem !important; } .mgL25 { margin-left: 1.25rem !important; } .mgL30 { margin-left: 1.5625rem !important; } .mgL35 { margin-left: 1.875rem !important; } .mgL40 { margin-left: 2.1875rem !important; } .mgL45 { margin-left: 2.5rem !important; } .mgL50 { margin-left: 2.8125rem !important; } .mgR5 { margin-right: 0 !important; } .mgR10 { margin-right: 0.3125rem !important; } .mgR15 { margin-right: 0.625rem !important; } .mgR20 { margin-right: 0.9375rem !important; } .mgR25 { margin-right: 1.25rem !important; } .mgR30 { margin-right: 1.5625rem !important; } .mgR35 { margin-right: 1.875rem !important; } .mgR40 { margin-right: 2.1875rem !important; } .mgR45 { margin-right: 2.5rem !important; } .mgR50 { margin-right: 2.8125rem !important; } } .pdT0 { padding-top: 0 !important; } .pdT5 { padding-top: 0.3125rem !important; } .pdT10 { padding-top: 0.625rem !important; } .pdT15 { padding-top: 0.9375rem !important; } .pdT20 { padding-top: 1.25rem !important; } .pdT25 { padding-top: 1.5625rem !important; } .pdT30 { padding-top: 1.875rem !important; } .pdT35 { padding-top: 2.1875rem !important; } .pdT40 { padding-top: 2.5rem !important; } .pdT45 { padding-top: 2.8125rem !important; } .pdT50 { padding-top: 3.125rem !important; } .pdB0 { padding-bottom: 0 !important; } .pdB5 { padding-bottom: 0.3125rem !important; } .pdB10 { padding-bottom: 0.625rem !important; } .pdB15 { padding-bottom: 0.9375rem !important; } .pdB20 { padding-bottom: 1.25rem !important; } .pdB25 { padding-bottom: 1.5625rem !important; } .pdB30 { padding-bottom: 1.875rem !important; } .pdB35 { padding-bottom: 2.1875rem !important; } .pdB40 { padding-bottom: 2.5rem !important; } .pdB45 { padding-bottom: 2.8125rem !important; } .pdB50 { padding-bottom: 3.125rem !important; } .pdL0 { padding-left: 0 !important; } .pdL5 { padding-left: 0.3125rem !important; } .pdL10 { padding-left: 0.625rem !important; } .pdL15 { padding-left: 0.9375rem !important; } .pdL20 { padding-left: 1.25rem !important; } .pdL25 { padding-left: 1.5625rem !important; } .pdL30 { padding-left: 1.875rem !important; } .pdL35 { padding-left: 2.1875rem !important; } .pdL40 { padding-left: 2.5rem !important; } .pdL45 { padding-left: 2.8125rem !important; } .pdL50 { padding-left: 3.125rem !important; } .pdR0 { padding-right: 0 !important; } .pdR5 { padding-right: 0.3125rem !important; } .pdR10 { padding-right: 0.625rem !important; } .pdR15 { padding-right: 0.9375rem !important; } .pdR20 { padding-right: 1.25rem !important; } .pdR25 { padding-right: 1.5625rem !important; } .pdR30 { padding-right: 1.875rem !important; } .pdR35 { padding-right: 2.1875rem !important; } .pdR40 { padding-right: 2.5rem !important; } .pdR45 { padding-right: 2.8125rem !important; } .pdR50 { padding-right: 3.125rem !important; } @media (max-width: 32.5rem) { .pdT5 { padding-top: 0 !important; } .pdT10 { padding-top: 0.3125rem !important; } .pdT15 { padding-top: 0.625rem !important; } .pdT20 { padding-top: 0.9375rem !important; } .pdT25 { padding-top: 1.25rem !important; } .pdT30 { padding-top: 1.5625rem !important; } .pdT35 { padding-top: 1.875rem !important; } .pdT40 { padding-top: 2.1875rem !important; } .pdT45 { padding-top: 2.5rem !important; } .pdT50 { padding-top: 2.8125rem !important; } .pdB5 { padding-bottom: 0 !important; } .pdB10 { padding-bottom: 0.3125rem !important; } .pdB15 { padding-bottom: 0.625rem !important; } .pdB20 { padding-bottom: 0.9375rem !important; } .pdB25 { padding-bottom: 1.25rem !important; } .pdB30 { padding-bottom: 1.5625rem !important; } .pdB35 { padding-bottom: 1.875rem !important; } .pdB40 { padding-bottom: 2.1875rem !important; } .pdB45 { padding-bottom: 2.5rem !important; } .pdB50 { padding-bottom: 2.8125rem !important; } .pdL5 { padding-left: 0 !important; } .pdL10 { padding-left: 0.3125rem !important; } .pdL15 { padding-left: 0.625rem !important; } .pdL20 { padding-left: 0.9375rem !important; } .pdL25 { padding-left: 1.25rem !important; } .pdL30 { padding-left: 1.5625rem !important; } .pdL35 { padding-left: 1.875rem !important; } .pdL40 { padding-left: 2.1875rem !important; } .pdL45 { padding-left: 2.5rem !important; } .pdL50 { padding-left: 2.8125rem !important; } .pdR5 { padding-right: 0 !important; } .pdR10 { padding-right: 0.3125rem !important; } .pdR15 { padding-right: 0.625rem !important; } .pdR20 { padding-right: 0.9375rem !important; } .pdR25 { padding-right: 1.25rem !important; } .pdR30 { padding-right: 1.5625rem !important; } .pdR35 { padding-right: 1.875rem !important; } .pdR40 { padding-right: 2.1875rem !important; } .pdR45 { padding-right: 2.5rem !important; } .pdR50 { padding-right: 2.8125rem !important; } }