/*** The new CSS reset - version 1.11.2 (last updated 15.11.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; } /* 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; } /* 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; -moz-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 */ ::-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; } /* Revert Modal native behavior */ :where(dialog:modal) { all: revert; box-sizing: border-box; } /* Remove details summary webkit styles */ ::-webkit-details-marker { display: none; } /* layout */ .ly_header { width: 100%; text-align: left; } .ly_main { text-align: left; width: 100%; } .ly_footer { text-align: left; } .copyright_text { /* 250109 杉山追加コピーライトのテキスト */ text-align: center; font-size: 10px; margin: 10px 10px; color: dimgray; } /* 20250110杉山追加マウスオーバーでボタンを変更 */ .hover-image { transition: transform 0.1s ease, filter 0.1s ease; /* アニメーションを滑らかにする */ } .hover-image:hover { filter: brightness(125%); /* 明度を125%に */ cursor: pointer; /* カーソルをポインターに変更 */ } /* 20250110杉山追加ここまで */ body { font-family: "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif; background-color: #fff !important; } img { width: 100%; } @media screen and (max-width: 960px) { .el_dropshadow { box-shadow: 1.5267175573vw 1.5267175573vw 2.5445292621vw 0px rgba(0, 0, 0, 0.16); } .el_txt { font-size: 3.3078880407vw; line-height: 1.7; letter-spacing: -0.1rem; padding: 0 2.7989821883vw; } .el_txt:nth-of-type(n + 2) { margin-top: 6.3613231552vw; } .el_txt__plus { font-size: 3.0534351145vw; } .el_txt__minus { font-size: 2.7989821883vw; padding: 0 2.7989821883vw; } .el_txt__bold { font-weight: bold; } .el_txt__sky { color: #4595D2; } .el_txt__center { text-align: center; } .el_ttl { font-size: 4.5801526718vw; font-weight: bold; text-align: center; margin-bottom: 5.3435114504vw; } .el_ttl2 { font-size: 4.5801526718vw; font-weight: bold; text-align: center; } .el_logo { width: 31.2977099237vw; margin-left: -1.272264631vw; margin-bottom: -1.272264631vw; } .ly_header_inner { width: 100%; height: 12.4681933842vw; display: flex; align-items: center; } .bl_headerLogo { width: 21.8829516539vw; } .ly_footer { border-top: solid 1px #666666; padding-top: 7.6335877863vw; } .ly_footer_inner { width: 1280px; max-width: calc(100% - 60px); margin: 0 auto; display: flex; justify-content: space-between; align-items: end; } .bl_footerAddress { padding-bottom: 1.272264631vw; font-size: 1.272264631vw; } .bl_footerLogo { width: 21.8829516539vw; } .bl_main_wrapper { background-image: url(../img/bg01_sp.png); background-position: top center; background-repeat: no-repeat; background-size: 100%; width: 100%; height: 127.2264631043vw; padding-top: 3.0534351145vw; } .bl_main_link { width: 94.9109414758vw; margin: 0 auto; transform: translateX(1.272264631vw); } .bl_main_txt2 { margin-top: -10.1781170483vw; } .ly_section2 { margin-top: -10.1781170483vw; padding-top: 10.6870229008vw; padding-bottom: 6.3613231552vw; background-image: url(../img/bg03_sp.png); background-position: top center; background-repeat: no-repeat; background-size: 100%; width: 100%; } .bl_listSp { width: 86.5139949109vw; margin: 0 auto; } .bl_box { position: relative; width: 92.3664122137vw; margin: 17.8117048346vw auto 20px; background-image: url(../img/bg06_sp.png); background-position: top center; background-repeat: repeat-y; background-size: 92.3664122137vw; } .bl_box::before { position: absolute; display: block; content: ""; width: 92.3664122137vw; height: 14.673452078vw; top: -14.673452078vw; background-image: url(../img/bg05_sp.png); background-position: top center; background-repeat: no-repeat; background-size: 92.3664122137vw; } .bl_box::after { position: absolute; display: block; content: ""; width: 92.3664122137vw; height: 2.5445292621vw; background-image: url(../img/bg07_sp.png); background-position: top center; background-repeat: no-repeat; background-size: 92.3664122137vw; } .bl_boxBody { position: relative; top: -6.3613231552vw; margin: 0 35px 0; } .ly_section3 { position: relative; background-image: url(../img/bg04_sp.jpg); background-position: top center; background-repeat: no-repeat; background-size: 100%; padding-top: 8.9058524173vw; padding-bottom: 5.0890585242vw; } .ly_section3::before { position: absolute; content: ""; width: 4.5801526718vw; height: 3.8167938931vw; top: 0; left: 50%; transform: translateX(-50%); background-image: url(../img/bg02_sp.png); background-position: top center; background-repeat: no-repeat; background-size: contain; } .bl_notice { width: 83.7150127226vw; margin: 0 auto; } .bl_link { width: 93.1297709924vw; margin: 0 auto; transform: translateX(1.272264631vw); } .bl_box2 { position: relative; width: 89.8218829517vw; margin: 0 auto; background-color: #fff; padding-top: 5.8524173028vw; padding-bottom: 3.5623409669vw; } .bl_box2__mt30 { margin-top: 6.6157760814vw; } .bl_box2__mt70 { margin-top: 8.1424936387vw; } .bl_box2__icon::before { content: ""; width: 16.7938931298vw; height: 15.5216284987vw; background-image: url(../img/icon_check.png); background-position: top center; background-repeat: no-repeat; background-size: contain; position: absolute; top: -2.0356234097vw; left: 0; z-index: 99; } .bl_box2__icon2::before { content: ""; width: 9.9236641221vw; height: 10.6870229008vw; background-image: url(../img/icon_light.png); background-position: top center; background-repeat: no-repeat; background-size: contain; position: absolute; top: 1.272264631vw; left: 1.5267175573vw; z-index: 99; } .bl_box2__icon3::before { content: ""; width: 9.9236641221vw; height: 8.9058524173vw; background-image: url(../img/icon_pin.png); background-position: top center; background-repeat: no-repeat; background-size: contain; position: absolute; top: 2.7989821883vw; left: 4.0712468193vw; z-index: 99; } .bl_fig01 { width: 84.4783715013vw; margin: 5.0890585242vw auto 0; } .bl_fig02 { width: 86.7684478372vw; margin: 5.0890585242vw auto 0; } .bl_labelLists { display: flex; justify-content: center; flex-wrap: wrap; gap: 1.272264631vw; margin-top: 6.106870229vw; } .bl_labelList { width: 41.9847328244vw; height: 18.320610687vw; border-radius: 18.320610687vw; text-align: center; background-color: #F8F82C; font-size: 3.5623409669vw; font-weight: bold; display: flex; justify-content: center; align-items: center; } .bl_box3 { width: 86.0050890585vw; margin: 4.3256997455vw auto 0; border: solid 1px #666666; padding: 4.0712468193vw 1.5267175573vw 2.0356234097vw; } .bl_label { background-color: #DADADA; border-radius: 200px; padding: 4.0712468193vw 7.1246819338vw; margin-top: 5.0890585242vw; } .bl_fig03 { width: 81.1704834606vw; margin: 6.106870229vw auto 0; } .bl_labelLists2 { margin-top: 6.106870229vw; } .bl_labelList2 { margin-top: 1.272264631vw; background-color: #8FE0F9; text-align: center; font-size: 3.0534351145vw; font-weight: bold; padding: 2.2900763359vw; border-radius: 7.3791348601vw; } .ly_section4 { position: relative; background-image: url(../img/bg04_sp.jpg); background-position: top center; background-repeat: no-repeat; background-size: 100%; padding-top: 8.9058524173vw; padding-bottom: 5.0890585242vw; } .ly_section4::before { position: absolute; content: ""; width: 4.5801526718vw; height: 3.8167938931vw; top: 0; left: 50%; transform: translateX(-50%); background-image: url(../img/bg02_sp.png); background-position: top center; background-repeat: no-repeat; background-size: contain; } .bl_faq { margin-left: 10.6870229008vw; margin-right: 3.8167938931vw; position: relative; } .bl_faq_ttl { position: relative; font-size: 3.0534351145vw; font-weight: bold; line-height: 1.5; } .bl_faq_ttl:nth-of-type(n+2) { margin-top: 6.3613231552vw; } .bl_faq_ttl::before { content: ""; position: absolute; width: 4.5801526718vw; height: 4.5801526718vw; background-image: url(../img/icon_q.png); background-position: top center; background-repeat: no-repeat; background-size: contain; top: 0; left: -6.106870229vw; vertical-align: baseline; } .bl_faq_txt { margin-top: 1.272264631vw; position: relative; font-size: 3.0534351145vw; line-height: 1.5; } .bl_faq_txt::before { content: ""; position: absolute; width: 4.5801526718vw; height: 4.5801526718vw; background-image: url(../img/icon_a.png); background-position: top center; background-repeat: no-repeat; background-size: contain; top: 0; left: -6.106870229vw; vertical-align: baseline; } .ly_section4_sp { position: relative; background-image: url(../img/bg04_sp.jpg); background-position: top center; background-repeat: no-repeat; background-size: 100%; margin-top: 5.8524173028vw; padding-top: 5.8524173028vw; } } @media screen and (min-width: 961px) { .el_dropshadow { box-shadow: 6px 6px 10px 0px rgba(0, 0, 0, 0.16); } .el_txt { font-size: 1.5rem; line-height: 1.7; } .el_txt:nth-of-type(n + 2) { margin-top: 1.625rem; } .el_txt__plus { font-size: 1.625rem; } .el_txt__minus { font-size: 1.375rem; } .el_txt__bold { font-weight: bold; } .el_txt__sky { color: #4595D2; } .el_txt__center, .el_txt__center_pc { text-align: center; } .el_ttl { font-size: 2.125rem; font-weight: bold; text-align: center; margin-bottom: 30px; } .el_ttl2 { font-size: 1.5rem; font-weight: bold; text-align: center; } .el_logo { width: 355px; margin-left: -10px; margin-bottom: -10px; } .ly_header { background-image: url(../img/bg00.png); background-position: bottom center; background-repeat: repeat-x; background-size: 1280px; } .ly_header_inner { width: 1280px; max-width: calc(100% - 60px); margin: 0 auto; } .bl_headerLogo { width: 132px; } .ly_footer { border-top: solid 1px #666666; margin-top: 8px; padding-top: 125px; } .ly_footer_inner { width: 1280px; max-width: calc(100% - 60px); margin: 0 auto; display: flex; justify-content: space-between; align-items: end; } .bl_footerAddress { padding-bottom: 20px; font-size: 1.25rem; } .bl_footerLogo { width: 230px; } .ly_main { width: 100%; overflow: hidden; } .ly_section { background-color: #559fd6; } .ly_section_inner { position: relative; width: 1280px; height: 1113px; max-width: 100%; margin: 0 auto; background-image: url(../img/bg01.png); background-position: top center; background-repeat: no-repeat; background-size: 1280px; padding-top: 10px; overflow: hidden; } .ly_section_inner::before { content: ""; position: absolute; width: 215px; height: 457px; background-image: url(../img/img_person02.png); background-position: bottom center; background-repeat: no-repeat; background-size: contain; bottom: -5px; left: 50%; transform: translateX(-270%); } .ly_section_inner::after { content: ""; position: absolute; width: 239px; height: 292.5px; background-image: url(../img/img_person01.png); background-position: bottom center; background-repeat: no-repeat; background-size: contain; bottom: 118px; right: 50%; transform: translateX(247%); } .bl_main_ttl { position: absolute; width: 1240.5px; max-width: calc(100% - 60px); bottom: 910px; left: 50%; transform: translateX(-50%); } .bl_main_txt { position: absolute; width: 1216.5px; top: 259px; left: 50%; transform: translateX(-50%); } .bl_main_link { position: absolute; width: 487px; top: 534px; right: 25px; } .bl_main_txt2 { position: absolute; width: 711px; bottom: 54px; left: 50%; transform: translateX(-50%); } .ly_section2 { position: relative; } .ly_section2::after { content: ""; position: absolute; bottom: 0; left: 0; width: 100%; height: 40px; background-color: #69a0ce; z-index: 2; } .ly_section2_inner { width: 1280px; max-width: 100%; margin: 0 auto; position: relative; width: 1280px; max-width: 100%; margin: 0 auto; background-image: url(../img/bg02.png); background-position: bottom center; background-repeat: no-repeat; background-size: cover; padding-top: 10px; padding-bottom: 50px; overflow: hidden; } .ly_section2_inner::after { content: ""; position: absolute; width: 278px; height: 495px; background-image: url(../img/img_person03.png); background-position: bottom center; background-repeat: no-repeat; background-size: contain; bottom: -5px; right: 50%; transform: translateX(227%); z-index: 99; } .bl_list { transform: translateX(-60px); } .bl_listItem { width: 954.5px; max-width: calc(100% - 60px); margin: -10px auto 0; } .bl_box { position: relative; width: 812.5px; margin: 100px auto 20px; transform: translateX(-75px); background-image: url(../img/bg05.png); background-position: top center; background-repeat: repeat-y; background-size: 812.5px; } .bl_box::before { position: absolute; display: block; content: ""; width: 812.5px; height: 90px; top: -90px; background-image: url(../img/bg04.png); background-position: top center; background-repeat: no-repeat; background-size: 812.5px; } .bl_box::after { position: absolute; display: block; content: ""; width: 812.5px; height: 16.5px; bottom: -16.5px; background-image: url(../img/bg06.png); background-position: top center; background-repeat: no-repeat; background-size: 812.5px; } .bl_boxBody { position: relative; top: -40px; margin: 0 35px 0; } .ly_section3 { position: relative; background-image: url(../img/bg07.jpg); background-position: bottom center; background-repeat: no-repeat; background-size: 100% 2721px; padding-top: 45px; padding-bottom: 35px; } .ly_section3::before { content: ""; position: absolute; width: 190px; height: 36px; background-image: url(../img/bg03.png); background-position: top center; background-repeat: no-repeat; background-size: 190px; top: 0; left: 50%; transform: translateX(-50%); } .bl_notice { width: 828.5px; margin: 0 auto; } .bl_link { width: 852px; margin: 0 auto; } .bl_box2 { position: relative; width: 818px; margin: 0 auto; background-color: #fff; padding: 45px 30px 60px; } .bl_box2__mt30 { margin-top: 30px; } .bl_box2__mt70 { margin-top: 70px; } .bl_box2__icon::before { content: ""; width: 138px; height: 127px; background-image: url(../img/icon_check.png); background-position: top center; background-repeat: no-repeat; background-size: contain; position: absolute; top: -27px; left: -29px; z-index: 99; } .bl_box2__icon2::before { content: ""; width: 73.5px; height: 80px; background-image: url(../img/icon_light.png); background-position: top center; background-repeat: no-repeat; background-size: contain; position: absolute; top: 12px; left: 10px; z-index: 99; } .bl_box2__icon3::before { content: ""; width: 66px; height: 60px; background-image: url(../img/icon_pin.png); background-position: top center; background-repeat: no-repeat; background-size: contain; position: absolute; top: 14px; left: 22px; z-index: 99; } .bl_fig01 { width: 710px; margin: 40px auto 0; } .bl_fig02 { width: 734px; margin: 40px auto 0; } .bl_labelLists { display: flex; justify-content: center; flex-wrap: wrap; gap: 6px; margin-top: 20px; } .bl_labelList { width: 230px; height: 110px; border-radius: 110px; text-align: center; background-color: #F8F82C; font-size: 1.5rem; font-weight: bold; display: flex; justify-content: center; align-items: center; } .bl_box3 { width: 704px; max-width: 100%; margin: 45px auto 0; padding: 35px 25px 58px; border: solid 1px #666666; } .bl_box3__narrow { padding: 20px 25px; } .bl_label { background-color: #DADADA; border-radius: 200px; padding: 15px 0; margin-top: 20px; } .bl_fig03 { width: 630px; margin: 40px auto 0; } .bl_labelLists2 { margin-top: 30px; } .bl_labelList2 { margin-top: 10px; background-color: #8FE0F9; text-align: center; font-size: 1.25rem; font-weight: bold; padding: 12px; border-radius: 2rem; } .ly_section4 { position: relative; background-image: url(../img/bg07.jpg); background-position: bottom center; background-repeat: no-repeat; background-size: 100% 2721px; padding-top: 80px; padding-bottom: 35px; } .ly_section4::before { content: ""; position: absolute; width: 230px; height: 48px; background-image: url(../img/bg08.png); background-position: top center; background-repeat: no-repeat; background-size: 230px; top: 0; left: 50%; transform: translateX(-50%); } .bl_faq { margin-left: 60px; position: relative; } .bl_faq_ttl { position: relative; font-size: 1.3125rem; font-weight: bold; line-height: 1.5; } .bl_faq_ttl:nth-of-type(n+2) { margin-top: 35px; } .bl_faq_ttl::before { content: ""; position: absolute; width: 35.5px; height: 35.5px; background-image: url(../img/icon_q.png); background-position: top center; background-repeat: no-repeat; background-size: contain; top: 0; left: -45px; vertical-align: baseline; } .bl_faq_txt { margin-top: 10px; position: relative; font-size: 1.3125rem; line-height: 1.5; } .bl_faq_txt::before { content: ""; position: absolute; width: 35.5px; height: 35.5px; background-image: url(../img/icon_a.png); background-position: top center; background-repeat: no-repeat; background-size: contain; top: 0; left: -45px; vertical-align: baseline; } .bl_contentOver { background-color: #fff; margin: 0 calc(50% - 50vw); width: 100vw; padding: 15px; margin-top: 30px; } } @media screen and (min-width: 961px) { .hp_spOnly { display: none !important; } } @media screen and (max-width: 960px) { .hp_pcOnly { display: none !important; } }/*# sourceMappingURL=style.css.map */