@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; -moz-appearance: revert; appearance: revert; } /* reset default text opacity of input placeholder */ ::-moz-placeholder { color: unset; } ::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; } html { font-size: 62.5%; } body { background: #f5f5f5; color: #333; font-family: "Noto Sans JP", "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ Pro W3", "メイリオ", sans-serif; font-size: 1.5rem; letter-spacing: 0; line-height: 2; text-align: justify; min-width: 375px; } @media screen and (min-width: 601px) { body { overflow-y: scroll; min-width: 1140px; } } body.is-fixed { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; } img, svg { display: block; width: 100%; height: auto; max-width: 100%; } @media screen and (min-width: 601px) { img, svg { width: auto; } } .c-svg-sprite { display: none; } a, button { cursor: pointer; } @media screen and (min-width: 601px) { .l-wrapper { min-width: 1080px; } } .l-inner { max-width: 1100px; margin-inline: auto; } @media screen and (max-width: 600px) { .l-inner { padding-inline: 30px; } } .c-loading { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999; background-color: #fff; text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; } .c-loading__text { font-size: 1.6rem; letter-spacing: 0.12em; font-weight: 500; } .c-loading__count { font-size: 3rem; letter-spacing: 0.08em; font-weight: 500; line-height: 1; margin: 8px 0; } .c-loading__indicator { width: 400px; height: 2px; margin: 16px 0 0; background-color: rgba(0, 0, 0, 0.2); } .c-loading__progress { width: 0%; height: 100%; background-color: rgba(0, 0, 0, 0.6); transition: width 0.2s ease; } .-loaded .c-loading { opacity: 0; pointer-events: none; transition: opacity 1.2s ease; } .-loaded .c-loading__grp { transform: translate(0, -30%); transition: transform 2s ease; } .c-svg-sprite { display: none; width: 0; height: 0; opacity: 0; overflow: hidden; } .p-contact-form { padding: 120px 0; } @media screen and (max-width: 600px) { .p-contact-form { padding: 80px 0; } } .p-contact-form__title { font-size: 3.2rem; font-weight: 700; letter-spacing: 0; line-height: 1.5; } @media screen and (max-width: 600px) { .p-contact-form__title { font-size: 2.6rem; } } .p-contact-form__text { margin-top: 4em; font-size: 1.6rem; font-weight: 400; letter-spacing: 0; line-height: 2; } @media screen and (max-width: 600px) { .p-contact-form__text { font-size: 1.5rem; } } .p-contact-form__text a { text-decoration: underline; word-break: break-all; } .p-contact-form__content { margin-top: 4em; box-shadow: 3px 3px 23px 0px rgba(130, 130, 130, 0.12); border-radius: 12px; padding: 100px 80px; background: #fff; } @media screen and (max-width: 600px) { .p-contact-form__content { padding: 24px; } } .p-contact-form__content dl { display: block; padding: 3em 0; border-bottom: 1px solid #dedede; } @media screen and (max-width: 600px) { .p-contact-form__content dl { display: block; } } .p-contact-form__content dl:first-of-type { padding-top: 0; } .p-contact-form__content dl:last-of-type { border: none; } .p-contact-form__content dl.-textarea { display: block; } .p-contact-form__content dt { display: flex; align-items: center; width: 100%; flex: 0 0 auto; margin-top: 1em; font-size: 1.6rem; font-weight: 600; letter-spacing: 0.05em; } @media screen and (max-width: 600px) { .p-contact-form__content dt { font-size: 1.5rem; } } .p-contact-form__content dt:first-of-type { margin: 0; } .p-contact-form__content dl.-textarea dt { width: 100%; } .p-contact-form__content dl.-textarea dt:before { display: none; } .p-contact-form__content dt.-required:after { content: "必須"; flex-shrink: 0; font-size: 1.4rem; font-weight: 400; letter-spacing: 0.05em; color: #fff; border-radius: 3px; background-color: #D61110; padding: 4px 8px; display: inline-block; line-height: 1.4; margin: 0 0 0 0.75em; } @media screen and (max-width: 600px) { .p-contact-form__content dt.-required:after { font-size: 1.3rem; } } .p-contact-form__content dd { width: 100%; margin-top: 1em; font-size: 1.6rem; font-weight: 400; letter-spacing: 0.05em; line-height: 2; } @media screen and (max-width: 600px) { .p-contact-form__content dd { font-size: 1.5rem; } } .p-contact-form__content dd .wpcf7-list-item { margin: 0; } .p-contact-form label { display: flex; align-items: baseline; gap: 0.4em; } .p-contact-form label + label { margin-top: 1em; } .p-contact-form input:not([type=file], [type=submit], [type=checkbox], [type=radio]), .p-contact-form textarea { border-radius: 3px; background-color: rgba(0, 0, 0, 0.025); border: 1px solid #dedede; display: block; padding: 0.5em 1em; width: 100%; color: #555; transition: border 0.3s ease; font-size: 1.6rem; font-weight: 400; letter-spacing: 0.05em; } @media screen and (max-width: 600px) { .p-contact-form input:not([type=file], [type=submit], [type=checkbox], [type=radio]), .p-contact-form textarea { font-size: 1.5rem; } } .p-contact-form input[type=checkbox], .p-contact-form input[type=radio] { -moz-appearance: auto; appearance: auto; -webkit-appearance: auto; accent-color: auto; vertical-align: middle; } .p-contact-form .wpcf7-checkbox, .p-contact-form .wpcf7-radio { display: flex; flex-wrap: wrap; gap: 0 1em; } .p-contact-form .has-free-text { width: 100%; } .p-contact-form__button { margin-top: 2em; } .p-contact-form__button input { width: 100%; border-radius: 3px; background: #475189; text-align: center; color: #fff; font-size: 1.6rem; font-weight: 400; letter-spacing: 0.05em; padding: 10px 0; } @media screen and (max-width: 600px) { .p-contact-form__button input { font-size: 1.5rem; } } .p-contact-form__button span.wpcf7-spinner { display: none; } .p-contact-form__button .wpcf7-submit:disabled { cursor: not-allowed; } .p-contact-form__note { margin-top: 0.5em; font-size: 1.5rem; font-weight: 400; letter-spacing: 0.05em; } @media screen and (max-width: 600px) { .p-contact-form__note { font-size: 1.4rem; } } .p-contact-form .cf7-honeypot { display: none !important; } @media screen and (min-width: 601px) { .u-sp { display: none; } } @media screen and (max-width: 600px) { .u-pc { display: none; } } .u-mt05 { margin-top: 0.5em; } .u-mb05 { margin-bottom: 0.5em; } .u-pt05 { padding-top: 0.5em; } .u-pb05 { padding-bottom: 0.5em; } .u-mt1 { margin-top: 1em; } .u-mb1 { margin-bottom: 1em; } .u-pt1 { padding-top: 1em; } .u-pb1 { padding-bottom: 1em; } .u-mt2 { margin-top: 2em; } .u-mb2 { margin-bottom: 2em; } .u-pt2 { padding-top: 2em; } .u-pb2 { padding-bottom: 2em; } .u-mt3 { margin-top: 3em; } .u-mb3 { margin-bottom: 3em; } .u-pt3 { padding-top: 3em; } .u-pb3 { padding-bottom: 3em; } .u-mt4 { margin-top: 4em; } .u-mb4 { margin-bottom: 4em; } .u-pt4 { padding-top: 4em; } .u-pb4 { padding-bottom: 4em; } .u-mt5 { margin-top: 5em; } .u-mb5 { margin-bottom: 5em; } .u-pt5 { padding-top: 5em; } .u-pb5 { padding-bottom: 5em; } .u-white { color: #fff; fill: #fff; } .u-white * { color: #fff; fill: #fff; } .u-center { text-align: center; margin-left: auto; margin-right: auto; } .u-right { text-align: right; margin-left: auto; } .u-left { text-align: left; margin-right: auto; } @media screen and (min-width: 601px) { .u-sp { display: none !important; } } @media screen and (max-width: 600px) { .u-pc { display: none !important; } }