@import url(https://fonts.googleapis.com/css2?family=PT+Mono&family=Zen+Kurenaido&display=swap); @import url(https://fonts.googleapis.com/css2?family=Outfit:wght@100..900&family=PT+Mono&family=Zen+Kurenaido&display=swap); @charset "UTF-8"; /*** 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; } /* Size */ /* Color */ /* Animation */ @media screen and (min-width: 769px) { .hide-pc { display: none !important; } } @media screen and (max-width: 768px) { .hide-sp { display: none !important; } } .rollover { transition-property: opacity; transition-duration: 300ms; } .rollover:hover { opacity: 0.7; } .m0 { margin: 0px !important; } .m5 { margin: 5px !important; } .m10 { margin: 10px !important; } .m15 { margin: 15px !important; } .m20 { margin: 20px !important; } .m25 { margin: 25px !important; } .m30 { margin: 30px !important; } .m35 { margin: 35px !important; } .m40 { margin: 40px !important; } .m45 { margin: 45px !important; } .m50 { margin: 50px !important; } .m55 { margin: 55px !important; } .m60 { margin: 60px !important; } .m65 { margin: 65px !important; } .m70 { margin: 70px !important; } .m75 { margin: 75px !important; } .m80 { margin: 80px !important; } .m85 { margin: 85px !important; } .m90 { margin: 90px !important; } .m95 { margin: 95px !important; } .m100 { margin: 100px !important; } .mt0 { margin-top: 0px !important; } .mt5 { margin-top: 5px !important; } .mt10 { margin-top: 10px !important; } .mt15 { margin-top: 15px !important; } .mt20 { margin-top: 20px !important; } .mt25 { margin-top: 25px !important; } .mt30 { margin-top: 30px !important; } .mt35 { margin-top: 35px !important; } .mt40 { margin-top: 40px !important; } .mt45 { margin-top: 45px !important; } .mt50 { margin-top: 50px !important; } .mt55 { margin-top: 55px !important; } .mt60 { margin-top: 60px !important; } .mt65 { margin-top: 65px !important; } .mt70 { margin-top: 70px !important; } .mt75 { margin-top: 75px !important; } .mt80 { margin-top: 80px !important; } .mt85 { margin-top: 85px !important; } .mt90 { margin-top: 90px !important; } .mt95 { margin-top: 95px !important; } .mt100 { margin-top: 100px !important; } .ml0 { margin-left: 0px !important; } .ml5 { margin-left: 5px !important; } .ml10 { margin-left: 10px !important; } .ml15 { margin-left: 15px !important; } .ml20 { margin-left: 20px !important; } .ml25 { margin-left: 25px !important; } .ml30 { margin-left: 30px !important; } .ml35 { margin-left: 35px !important; } .ml40 { margin-left: 40px !important; } .ml45 { margin-left: 45px !important; } .ml50 { margin-left: 50px !important; } .ml55 { margin-left: 55px !important; } .ml60 { margin-left: 60px !important; } .ml65 { margin-left: 65px !important; } .ml70 { margin-left: 70px !important; } .ml75 { margin-left: 75px !important; } .ml80 { margin-left: 80px !important; } .ml85 { margin-left: 85px !important; } .ml90 { margin-left: 90px !important; } .ml95 { margin-left: 95px !important; } .ml100 { margin-left: 100px !important; } .mr0 { margin-right: 0px !important; } .mr5 { margin-right: 5px !important; } .mr10 { margin-right: 10px !important; } .mr15 { margin-right: 15px !important; } .mr20 { margin-right: 20px !important; } .mr25 { margin-right: 25px !important; } .mr30 { margin-right: 30px !important; } .mr35 { margin-right: 35px !important; } .mr40 { margin-right: 40px !important; } .mr45 { margin-right: 45px !important; } .mr50 { margin-right: 50px !important; } .mr55 { margin-right: 55px !important; } .mr60 { margin-right: 60px !important; } .mr65 { margin-right: 65px !important; } .mr70 { margin-right: 70px !important; } .mr75 { margin-right: 75px !important; } .mr80 { margin-right: 80px !important; } .mr85 { margin-right: 85px !important; } .mr90 { margin-right: 90px !important; } .mr95 { margin-right: 95px !important; } .mr100 { margin-right: 100px !important; } .mb0 { margin-bottom: 0px !important; } .mb5 { margin-bottom: 5px !important; } .mb10 { margin-bottom: 10px !important; } .mb15 { margin-bottom: 15px !important; } .mb20 { margin-bottom: 20px !important; } .mb25 { margin-bottom: 25px !important; } .mb30 { margin-bottom: 30px !important; } .mb35 { margin-bottom: 35px !important; } .mb40 { margin-bottom: 40px !important; } .mb45 { margin-bottom: 45px !important; } .mb50 { margin-bottom: 50px !important; } .mb55 { margin-bottom: 55px !important; } .mb60 { margin-bottom: 60px !important; } .mb65 { margin-bottom: 65px !important; } .mb70 { margin-bottom: 70px !important; } .mb75 { margin-bottom: 75px !important; } .mb80 { margin-bottom: 80px !important; } .mb85 { margin-bottom: 85px !important; } .mb90 { margin-bottom: 90px !important; } .mb95 { margin-bottom: 95px !important; } .mb100 { margin-bottom: 100px !important; } .m-5 { margin: -5px !important; } .m-10 { margin: -10px !important; } .m-15 { margin: -15px !important; } .m-20 { margin: -20px !important; } .m-25 { margin: -25px !important; } .m-30 { margin: -30px !important; } .m-35 { margin: -35px !important; } .m-40 { margin: -40px !important; } .m-45 { margin: -45px !important; } .m-50 { margin: -50px !important; } .m-55 { margin: -55px !important; } .m-60 { margin: -60px !important; } .m-65 { margin: -65px !important; } .m-70 { margin: -70px !important; } .m-75 { margin: -75px !important; } .m-80 { margin: -80px !important; } .m-85 { margin: -85px !important; } .m-90 { margin: -90px !important; } .m-95 { margin: -95px !important; } .m-100 { margin: -100px !important; } .mt-5 { margin-top: -5px !important; } .mt-10 { margin-top: -10px !important; } .mt-15 { margin-top: -15px !important; } .mt-20 { margin-top: -20px !important; } .mt-25 { margin-top: -25px !important; } .mt-30 { margin-top: -30px !important; } .mt-35 { margin-top: -35px !important; } .mt-40 { margin-top: -40px !important; } .mt-45 { margin-top: -45px !important; } .mt-50 { margin-top: -50px !important; } .mt-55 { margin-top: -55px !important; } .mt-60 { margin-top: -60px !important; } .mt-65 { margin-top: -65px !important; } .mt-70 { margin-top: -70px !important; } .mt-75 { margin-top: -75px !important; } .mt-80 { margin-top: -80px !important; } .mt-85 { margin-top: -85px !important; } .mt-90 { margin-top: -90px !important; } .mt-95 { margin-top: -95px !important; } .mt-100 { margin-top: -100px !important; } .ml-5 { margin-left: -5px !important; } .ml-10 { margin-left: -10px !important; } .ml-15 { margin-left: -15px !important; } .ml-20 { margin-left: -20px !important; } .ml-25 { margin-left: -25px !important; } .ml-30 { margin-left: -30px !important; } .ml-35 { margin-left: -35px !important; } .ml-40 { margin-left: -40px !important; } .ml-45 { margin-left: -45px !important; } .ml-50 { margin-left: -50px !important; } .ml-55 { margin-left: -55px !important; } .ml-60 { margin-left: -60px !important; } .ml-65 { margin-left: -65px !important; } .ml-70 { margin-left: -70px !important; } .ml-75 { margin-left: -75px !important; } .ml-80 { margin-left: -80px !important; } .ml-85 { margin-left: -85px !important; } .ml-90 { margin-left: -90px !important; } .ml-95 { margin-left: -95px !important; } .ml-100 { margin-left: -100px !important; } .mr-5 { margin-right: -5px !important; } .mr-10 { margin-right: -10px !important; } .mr-15 { margin-right: -15px !important; } .mr-20 { margin-right: -20px !important; } .mr-25 { margin-right: -25px !important; } .mr-30 { margin-right: -30px !important; } .mr-35 { margin-right: -35px !important; } .mr-40 { margin-right: -40px !important; } .mr-45 { margin-right: -45px !important; } .mr-50 { margin-right: -50px !important; } .mr-55 { margin-right: -55px !important; } .mr-60 { margin-right: -60px !important; } .mr-65 { margin-right: -65px !important; } .mr-70 { margin-right: -70px !important; } .mr-75 { margin-right: -75px !important; } .mr-80 { margin-right: -80px !important; } .mr-85 { margin-right: -85px !important; } .mr-90 { margin-right: -90px !important; } .mr-95 { margin-right: -95px !important; } .mr-100 { margin-right: -100px !important; } .mb-5 { margin-bottom: -5px !important; } .mb-10 { margin-bottom: -10px !important; } .mb-15 { margin-bottom: -15px !important; } .mb-20 { margin-bottom: -20px !important; } .mb-25 { margin-bottom: -25px !important; } .mb-30 { margin-bottom: -30px !important; } .mb-35 { margin-bottom: -35px !important; } .mb-40 { margin-bottom: -40px !important; } .mb-45 { margin-bottom: -45px !important; } .mb-50 { margin-bottom: -50px !important; } .mb-55 { margin-bottom: -55px !important; } .mb-60 { margin-bottom: -60px !important; } .mb-65 { margin-bottom: -65px !important; } .mb-70 { margin-bottom: -70px !important; } .mb-75 { margin-bottom: -75px !important; } .mb-80 { margin-bottom: -80px !important; } .mb-85 { margin-bottom: -85px !important; } .mb-90 { margin-bottom: -90px !important; } .mb-95 { margin-bottom: -95px !important; } .mb-100 { margin-bottom: -100px !important; } .p0 { padding: 0px !important; } .p5 { padding: 5px !important; } .p10 { padding: 10px !important; } .p15 { padding: 15px !important; } .p20 { padding: 20px !important; } .p25 { padding: 25px !important; } .p30 { padding: 30px !important; } .p35 { padding: 35px !important; } .p40 { padding: 40px !important; } .p45 { padding: 45px !important; } .p50 { padding: 50px !important; } .p55 { padding: 55px !important; } .p60 { padding: 60px !important; } .p65 { padding: 65px !important; } .p70 { padding: 70px !important; } .p75 { padding: 75px !important; } .p80 { padding: 80px !important; } .p85 { padding: 85px !important; } .p90 { padding: 90px !important; } .p95 { padding: 95px !important; } .p100 { padding: 100px !important; } .pt0 { padding-top: 0px !important; } .pt5 { padding-top: 5px !important; } .pt10 { padding-top: 10px !important; } .pt15 { padding-top: 15px !important; } .pt20 { padding-top: 20px !important; } .pt25 { padding-top: 25px !important; } .pt30 { padding-top: 30px !important; } .pt35 { padding-top: 35px !important; } .pt40 { padding-top: 40px !important; } .pt45 { padding-top: 45px !important; } .pt50 { padding-top: 50px !important; } .pt55 { padding-top: 55px !important; } .pt60 { padding-top: 60px !important; } .pt65 { padding-top: 65px !important; } .pt70 { padding-top: 70px !important; } .pt75 { padding-top: 75px !important; } .pt80 { padding-top: 80px !important; } .pt85 { padding-top: 85px !important; } .pt90 { padding-top: 90px !important; } .pt95 { padding-top: 95px !important; } .pt100 { padding-top: 100px !important; } .pl0 { padding-left: 0px !important; } .pl5 { padding-left: 5px !important; } .pl10 { padding-left: 10px !important; } .pl15 { padding-left: 15px !important; } .pl20 { padding-left: 20px !important; } .pl25 { padding-left: 25px !important; } .pl30 { padding-left: 30px !important; } .pl35 { padding-left: 35px !important; } .pl40 { padding-left: 40px !important; } .pl45 { padding-left: 45px !important; } .pl50 { padding-left: 50px !important; } .pl55 { padding-left: 55px !important; } .pl60 { padding-left: 60px !important; } .pl65 { padding-left: 65px !important; } .pl70 { padding-left: 70px !important; } .pl75 { padding-left: 75px !important; } .pl80 { padding-left: 80px !important; } .pl85 { padding-left: 85px !important; } .pl90 { padding-left: 90px !important; } .pl95 { padding-left: 95px !important; } .pl100 { padding-left: 100px !important; } .pr0 { padding-right: 0px !important; } .pr5 { padding-right: 5px !important; } .pr10 { padding-right: 10px !important; } .pr15 { padding-right: 15px !important; } .pr20 { padding-right: 20px !important; } .pr25 { padding-right: 25px !important; } .pr30 { padding-right: 30px !important; } .pr35 { padding-right: 35px !important; } .pr40 { padding-right: 40px !important; } .pr45 { padding-right: 45px !important; } .pr50 { padding-right: 50px !important; } .pr55 { padding-right: 55px !important; } .pr60 { padding-right: 60px !important; } .pr65 { padding-right: 65px !important; } .pr70 { padding-right: 70px !important; } .pr75 { padding-right: 75px !important; } .pr80 { padding-right: 80px !important; } .pr85 { padding-right: 85px !important; } .pr90 { padding-right: 90px !important; } .pr95 { padding-right: 95px !important; } .pr100 { padding-right: 100px !important; } .pb0 { padding-bottom: 0px !important; } .pb5 { padding-bottom: 5px !important; } .pb10 { padding-bottom: 10px !important; } .pb15 { padding-bottom: 15px !important; } .pb20 { padding-bottom: 20px !important; } .pb25 { padding-bottom: 25px !important; } .pb30 { padding-bottom: 30px !important; } .pb35 { padding-bottom: 35px !important; } .pb40 { padding-bottom: 40px !important; } .pb45 { padding-bottom: 45px !important; } .pb50 { padding-bottom: 50px !important; } .pb55 { padding-bottom: 55px !important; } .pb60 { padding-bottom: 60px !important; } .pb65 { padding-bottom: 65px !important; } .pb70 { padding-bottom: 70px !important; } .pb75 { padding-bottom: 75px !important; } .pb80 { padding-bottom: 80px !important; } .pb85 { padding-bottom: 85px !important; } .pb90 { padding-bottom: 90px !important; } .pb95 { padding-bottom: 95px !important; } .pb100 { padding-bottom: 100px !important; } .p-5 { padding: -5px !important; } .p-10 { padding: -10px !important; } .p-15 { padding: -15px !important; } .p-20 { padding: -20px !important; } .p-25 { padding: -25px !important; } .p-30 { padding: -30px !important; } .p-35 { padding: -35px !important; } .p-40 { padding: -40px !important; } .p-45 { padding: -45px !important; } .p-50 { padding: -50px !important; } .p-55 { padding: -55px !important; } .p-60 { padding: -60px !important; } .p-65 { padding: -65px !important; } .p-70 { padding: -70px !important; } .p-75 { padding: -75px !important; } .p-80 { padding: -80px !important; } .p-85 { padding: -85px !important; } .p-90 { padding: -90px !important; } .p-95 { padding: -95px !important; } .p-100 { padding: -100px !important; } .pt-5 { padding-top: -5px !important; } .pt-10 { padding-top: -10px !important; } .pt-15 { padding-top: -15px !important; } .pt-20 { padding-top: -20px !important; } .pt-25 { padding-top: -25px !important; } .pt-30 { padding-top: -30px !important; } .pt-35 { padding-top: -35px !important; } .pt-40 { padding-top: -40px !important; } .pt-45 { padding-top: -45px !important; } .pt-50 { padding-top: -50px !important; } .pt-55 { padding-top: -55px !important; } .pt-60 { padding-top: -60px !important; } .pt-65 { padding-top: -65px !important; } .pt-70 { padding-top: -70px !important; } .pt-75 { padding-top: -75px !important; } .pt-80 { padding-top: -80px !important; } .pt-85 { padding-top: -85px !important; } .pt-90 { padding-top: -90px !important; } .pt-95 { padding-top: -95px !important; } .pt-100 { padding-top: -100px !important; } .pl-5 { padding-left: -5px !important; } .pl-10 { padding-left: -10px !important; } .pl-15 { padding-left: -15px !important; } .pl-20 { padding-left: -20px !important; } .pl-25 { padding-left: -25px !important; } .pl-30 { padding-left: -30px !important; } .pl-35 { padding-left: -35px !important; } .pl-40 { padding-left: -40px !important; } .pl-45 { padding-left: -45px !important; } .pl-50 { padding-left: -50px !important; } .pl-55 { padding-left: -55px !important; } .pl-60 { padding-left: -60px !important; } .pl-65 { padding-left: -65px !important; } .pl-70 { padding-left: -70px !important; } .pl-75 { padding-left: -75px !important; } .pl-80 { padding-left: -80px !important; } .pl-85 { padding-left: -85px !important; } .pl-90 { padding-left: -90px !important; } .pl-95 { padding-left: -95px !important; } .pl-100 { padding-left: -100px !important; } .pr-5 { padding-right: -5px !important; } .pr-10 { padding-right: -10px !important; } .pr-15 { padding-right: -15px !important; } .pr-20 { padding-right: -20px !important; } .pr-25 { padding-right: -25px !important; } .pr-30 { padding-right: -30px !important; } .pr-35 { padding-right: -35px !important; } .pr-40 { padding-right: -40px !important; } .pr-45 { padding-right: -45px !important; } .pr-50 { padding-right: -50px !important; } .pr-55 { padding-right: -55px !important; } .pr-60 { padding-right: -60px !important; } .pr-65 { padding-right: -65px !important; } .pr-70 { padding-right: -70px !important; } .pr-75 { padding-right: -75px !important; } .pr-80 { padding-right: -80px !important; } .pr-85 { padding-right: -85px !important; } .pr-90 { padding-right: -90px !important; } .pr-95 { padding-right: -95px !important; } .pr-100 { padding-right: -100px !important; } .pb-5 { padding-bottom: -5px !important; } .pb-10 { padding-bottom: -10px !important; } .pb-15 { padding-bottom: -15px !important; } .pb-20 { padding-bottom: -20px !important; } .pb-25 { padding-bottom: -25px !important; } .pb-30 { padding-bottom: -30px !important; } .pb-35 { padding-bottom: -35px !important; } .pb-40 { padding-bottom: -40px !important; } .pb-45 { padding-bottom: -45px !important; } .pb-50 { padding-bottom: -50px !important; } .pb-55 { padding-bottom: -55px !important; } .pb-60 { padding-bottom: -60px !important; } .pb-65 { padding-bottom: -65px !important; } .pb-70 { padding-bottom: -70px !important; } .pb-75 { padding-bottom: -75px !important; } .pb-80 { padding-bottom: -80px !important; } .pb-85 { padding-bottom: -85px !important; } .pb-90 { padding-bottom: -90px !important; } .pb-95 { padding-bottom: -95px !important; } .pb-100 { padding-bottom: -100px !important; } @media screen and (min-width: 769px) { .m0_pc { margin: 0px !important; } .m5_pc { margin: 5px !important; } .m10_pc { margin: 10px !important; } .m15_pc { margin: 15px !important; } .m20_pc { margin: 20px !important; } .m25_pc { margin: 25px !important; } .m30_pc { margin: 30px !important; } .m35_pc { margin: 35px !important; } .m40_pc { margin: 40px !important; } .m45_pc { margin: 45px !important; } .m50_pc { margin: 50px !important; } .m55_pc { margin: 55px !important; } .m60_pc { margin: 60px !important; } .m65_pc { margin: 65px !important; } .m70_pc { margin: 70px !important; } .m75_pc { margin: 75px !important; } .m80_pc { margin: 80px !important; } .m85_pc { margin: 85px !important; } .m90_pc { margin: 90px !important; } .m95_pc { margin: 95px !important; } .m100_pc { margin: 100px !important; } .mt0_pc { margin-top: 0px !important; } .mt5_pc { margin-top: 5px !important; } .mt10_pc { margin-top: 10px !important; } .mt15_pc { margin-top: 15px !important; } .mt20_pc { margin-top: 20px !important; } .mt25_pc { margin-top: 25px !important; } .mt30_pc { margin-top: 30px !important; } .mt35_pc { margin-top: 35px !important; } .mt40_pc { margin-top: 40px !important; } .mt45_pc { margin-top: 45px !important; } .mt50_pc { margin-top: 50px !important; } .mt55_pc { margin-top: 55px !important; } .mt60_pc { margin-top: 60px !important; } .mt65_pc { margin-top: 65px !important; } .mt70_pc { margin-top: 70px !important; } .mt75_pc { margin-top: 75px !important; } .mt80_pc { margin-top: 80px !important; } .mt85_pc { margin-top: 85px !important; } .mt90_pc { margin-top: 90px !important; } .mt95_pc { margin-top: 95px !important; } .mt100_pc { margin-top: 100px !important; } .ml0_pc { margin-left: 0px !important; } .ml5_pc { margin-left: 5px !important; } .ml10_pc { margin-left: 10px !important; } .ml15_pc { margin-left: 15px !important; } .ml20_pc { margin-left: 20px !important; } .ml25_pc { margin-left: 25px !important; } .ml30_pc { margin-left: 30px !important; } .ml35_pc { margin-left: 35px !important; } .ml40_pc { margin-left: 40px !important; } .ml45_pc { margin-left: 45px !important; } .ml50_pc { margin-left: 50px !important; } .ml55_pc { margin-left: 55px !important; } .ml60_pc { margin-left: 60px !important; } .ml65_pc { margin-left: 65px !important; } .ml70_pc { margin-left: 70px !important; } .ml75_pc { margin-left: 75px !important; } .ml80_pc { margin-left: 80px !important; } .ml85_pc { margin-left: 85px !important; } .ml90_pc { margin-left: 90px !important; } .ml95_pc { margin-left: 95px !important; } .ml100_pc { margin-left: 100px !important; } .mr0_pc { margin-right: 0px !important; } .mr5_pc { margin-right: 5px !important; } .mr10_pc { margin-right: 10px !important; } .mr15_pc { margin-right: 15px !important; } .mr20_pc { margin-right: 20px !important; } .mr25_pc { margin-right: 25px !important; } .mr30_pc { margin-right: 30px !important; } .mr35_pc { margin-right: 35px !important; } .mr40_pc { margin-right: 40px !important; } .mr45_pc { margin-right: 45px !important; } .mr50_pc { margin-right: 50px !important; } .mr55_pc { margin-right: 55px !important; } .mr60_pc { margin-right: 60px !important; } .mr65_pc { margin-right: 65px !important; } .mr70_pc { margin-right: 70px !important; } .mr75_pc { margin-right: 75px !important; } .mr80_pc { margin-right: 80px !important; } .mr85_pc { margin-right: 85px !important; } .mr90_pc { margin-right: 90px !important; } .mr95_pc { margin-right: 95px !important; } .mr100_pc { margin-right: 100px !important; } .mb0_pc { margin-bottom: 0px !important; } .mb5_pc { margin-bottom: 5px !important; } .mb10_pc { margin-bottom: 10px !important; } .mb15_pc { margin-bottom: 15px !important; } .mb20_pc { margin-bottom: 20px !important; } .mb25_pc { margin-bottom: 25px !important; } .mb30_pc { margin-bottom: 30px !important; } .mb35_pc { margin-bottom: 35px !important; } .mb40_pc { margin-bottom: 40px !important; } .mb45_pc { margin-bottom: 45px !important; } .mb50_pc { margin-bottom: 50px !important; } .mb55_pc { margin-bottom: 55px !important; } .mb60_pc { margin-bottom: 60px !important; } .mb65_pc { margin-bottom: 65px !important; } .mb70_pc { margin-bottom: 70px !important; } .mb75_pc { margin-bottom: 75px !important; } .mb80_pc { margin-bottom: 80px !important; } .mb85_pc { margin-bottom: 85px !important; } .mb90_pc { margin-bottom: 90px !important; } .mb95_pc { margin-bottom: 95px !important; } .mb100_pc { margin-bottom: 100px !important; } .m-5_pc { margin: -5px !important; } .m-10_pc { margin: -10px !important; } .m-15_pc { margin: -15px !important; } .m-20_pc { margin: -20px !important; } .m-25_pc { margin: -25px !important; } .m-30_pc { margin: -30px !important; } .m-35_pc { margin: -35px !important; } .m-40_pc { margin: -40px !important; } .m-45_pc { margin: -45px !important; } .m-50_pc { margin: -50px !important; } .m-55_pc { margin: -55px !important; } .m-60_pc { margin: -60px !important; } .m-65_pc { margin: -65px !important; } .m-70_pc { margin: -70px !important; } .m-75_pc { margin: -75px !important; } .m-80_pc { margin: -80px !important; } .m-85_pc { margin: -85px !important; } .m-90_pc { margin: -90px !important; } .m-95_pc { margin: -95px !important; } .m-100_pc { margin: -100px !important; } .mt-5_pc { margin-top: -5px !important; } .mt-10_pc { margin-top: -10px !important; } .mt-15_pc { margin-top: -15px !important; } .mt-20_pc { margin-top: -20px !important; } .mt-25_pc { margin-top: -25px !important; } .mt-30_pc { margin-top: -30px !important; } .mt-35_pc { margin-top: -35px !important; } .mt-40_pc { margin-top: -40px !important; } .mt-45_pc { margin-top: -45px !important; } .mt-50_pc { margin-top: -50px !important; } .mt-55_pc { margin-top: -55px !important; } .mt-60_pc { margin-top: -60px !important; } .mt-65_pc { margin-top: -65px !important; } .mt-70_pc { margin-top: -70px !important; } .mt-75_pc { margin-top: -75px !important; } .mt-80_pc { margin-top: -80px !important; } .mt-85_pc { margin-top: -85px !important; } .mt-90_pc { margin-top: -90px !important; } .mt-95_pc { margin-top: -95px !important; } .mt-100_pc { margin-top: -100px !important; } .ml-5_pc { margin-left: -5px !important; } .ml-10_pc { margin-left: -10px !important; } .ml-15_pc { margin-left: -15px !important; } .ml-20_pc { margin-left: -20px !important; } .ml-25_pc { margin-left: -25px !important; } .ml-30_pc { margin-left: -30px !important; } .ml-35_pc { margin-left: -35px !important; } .ml-40_pc { margin-left: -40px !important; } .ml-45_pc { margin-left: -45px !important; } .ml-50_pc { margin-left: -50px !important; } .ml-55_pc { margin-left: -55px !important; } .ml-60_pc { margin-left: -60px !important; } .ml-65_pc { margin-left: -65px !important; } .ml-70_pc { margin-left: -70px !important; } .ml-75_pc { margin-left: -75px !important; } .ml-80_pc { margin-left: -80px !important; } .ml-85_pc { margin-left: -85px !important; } .ml-90_pc { margin-left: -90px !important; } .ml-95_pc { margin-left: -95px !important; } .ml-100_pc { margin-left: -100px !important; } .mr-5_pc { margin-right: -5px !important; } .mr-10_pc { margin-right: -10px !important; } .mr-15_pc { margin-right: -15px !important; } .mr-20_pc { margin-right: -20px !important; } .mr-25_pc { margin-right: -25px !important; } .mr-30_pc { margin-right: -30px !important; } .mr-35_pc { margin-right: -35px !important; } .mr-40_pc { margin-right: -40px !important; } .mr-45_pc { margin-right: -45px !important; } .mr-50_pc { margin-right: -50px !important; } .mr-55_pc { margin-right: -55px !important; } .mr-60_pc { margin-right: -60px !important; } .mr-65_pc { margin-right: -65px !important; } .mr-70_pc { margin-right: -70px !important; } .mr-75_pc { margin-right: -75px !important; } .mr-80_pc { margin-right: -80px !important; } .mr-85_pc { margin-right: -85px !important; } .mr-90_pc { margin-right: -90px !important; } .mr-95_pc { margin-right: -95px !important; } .mr-100_pc { margin-right: -100px !important; } .mb-5_pc { margin-bottom: -5px !important; } .mb-10_pc { margin-bottom: -10px !important; } .mb-15_pc { margin-bottom: -15px !important; } .mb-20_pc { margin-bottom: -20px !important; } .mb-25_pc { margin-bottom: -25px !important; } .mb-30_pc { margin-bottom: -30px !important; } .mb-35_pc { margin-bottom: -35px !important; } .mb-40_pc { margin-bottom: -40px !important; } .mb-45_pc { margin-bottom: -45px !important; } .mb-50_pc { margin-bottom: -50px !important; } .mb-55_pc { margin-bottom: -55px !important; } .mb-60_pc { margin-bottom: -60px !important; } .mb-65_pc { margin-bottom: -65px !important; } .mb-70_pc { margin-bottom: -70px !important; } .mb-75_pc { margin-bottom: -75px !important; } .mb-80_pc { margin-bottom: -80px !important; } .mb-85_pc { margin-bottom: -85px !important; } .mb-90_pc { margin-bottom: -90px !important; } .mb-95_pc { margin-bottom: -95px !important; } .mb-100_pc { margin-bottom: -100px !important; } .p0_pc { padding: 0px !important; } .p5_pc { padding: 5px !important; } .p10_pc { padding: 10px !important; } .p15_pc { padding: 15px !important; } .p20_pc { padding: 20px !important; } .p25_pc { padding: 25px !important; } .p30_pc { padding: 30px !important; } .p35_pc { padding: 35px !important; } .p40_pc { padding: 40px !important; } .p45_pc { padding: 45px !important; } .p50_pc { padding: 50px !important; } .p55_pc { padding: 55px !important; } .p60_pc { padding: 60px !important; } .p65_pc { padding: 65px !important; } .p70_pc { padding: 70px !important; } .p75_pc { padding: 75px !important; } .p80_pc { padding: 80px !important; } .p85_pc { padding: 85px !important; } .p90_pc { padding: 90px !important; } .p95_pc { padding: 95px !important; } .p100_pc { padding: 100px !important; } .pt0_pc { padding-top: 0px !important; } .pt5_pc { padding-top: 5px !important; } .pt10_pc { padding-top: 10px !important; } .pt15_pc { padding-top: 15px !important; } .pt20_pc { padding-top: 20px !important; } .pt25_pc { padding-top: 25px !important; } .pt30_pc { padding-top: 30px !important; } .pt35_pc { padding-top: 35px !important; } .pt40_pc { padding-top: 40px !important; } .pt45_pc { padding-top: 45px !important; } .pt50_pc { padding-top: 50px !important; } .pt55_pc { padding-top: 55px !important; } .pt60_pc { padding-top: 60px !important; } .pt65_pc { padding-top: 65px !important; } .pt70_pc { padding-top: 70px !important; } .pt75_pc { padding-top: 75px !important; } .pt80_pc { padding-top: 80px !important; } .pt85_pc { padding-top: 85px !important; } .pt90_pc { padding-top: 90px !important; } .pt95_pc { padding-top: 95px !important; } .pt100_pc { padding-top: 100px !important; } .pl0_pc { padding-left: 0px !important; } .pl5_pc { padding-left: 5px !important; } .pl10_pc { padding-left: 10px !important; } .pl15_pc { padding-left: 15px !important; } .pl20_pc { padding-left: 20px !important; } .pl25_pc { padding-left: 25px !important; } .pl30_pc { padding-left: 30px !important; } .pl35_pc { padding-left: 35px !important; } .pl40_pc { padding-left: 40px !important; } .pl45_pc { padding-left: 45px !important; } .pl50_pc { padding-left: 50px !important; } .pl55_pc { padding-left: 55px !important; } .pl60_pc { padding-left: 60px !important; } .pl65_pc { padding-left: 65px !important; } .pl70_pc { padding-left: 70px !important; } .pl75_pc { padding-left: 75px !important; } .pl80_pc { padding-left: 80px !important; } .pl85_pc { padding-left: 85px !important; } .pl90_pc { padding-left: 90px !important; } .pl95_pc { padding-left: 95px !important; } .pl100_pc { padding-left: 100px !important; } .pr0_pc { padding-right: 0px !important; } .pr5_pc { padding-right: 5px !important; } .pr10_pc { padding-right: 10px !important; } .pr15_pc { padding-right: 15px !important; } .pr20_pc { padding-right: 20px !important; } .pr25_pc { padding-right: 25px !important; } .pr30_pc { padding-right: 30px !important; } .pr35_pc { padding-right: 35px !important; } .pr40_pc { padding-right: 40px !important; } .pr45_pc { padding-right: 45px !important; } .pr50_pc { padding-right: 50px !important; } .pr55_pc { padding-right: 55px !important; } .pr60_pc { padding-right: 60px !important; } .pr65_pc { padding-right: 65px !important; } .pr70_pc { padding-right: 70px !important; } .pr75_pc { padding-right: 75px !important; } .pr80_pc { padding-right: 80px !important; } .pr85_pc { padding-right: 85px !important; } .pr90_pc { padding-right: 90px !important; } .pr95_pc { padding-right: 95px !important; } .pr100_pc { padding-right: 100px !important; } .pb0_pc { padding-bottom: 0px !important; } .pb5_pc { padding-bottom: 5px !important; } .pb10_pc { padding-bottom: 10px !important; } .pb15_pc { padding-bottom: 15px !important; } .pb20_pc { padding-bottom: 20px !important; } .pb25_pc { padding-bottom: 25px !important; } .pb30_pc { padding-bottom: 30px !important; } .pb35_pc { padding-bottom: 35px !important; } .pb40_pc { padding-bottom: 40px !important; } .pb45_pc { padding-bottom: 45px !important; } .pb50_pc { padding-bottom: 50px !important; } .pb55_pc { padding-bottom: 55px !important; } .pb60_pc { padding-bottom: 60px !important; } .pb65_pc { padding-bottom: 65px !important; } .pb70_pc { padding-bottom: 70px !important; } .pb75_pc { padding-bottom: 75px !important; } .pb80_pc { padding-bottom: 80px !important; } .pb85_pc { padding-bottom: 85px !important; } .pb90_pc { padding-bottom: 90px !important; } .pb95_pc { padding-bottom: 95px !important; } .pb100_pc { padding-bottom: 100px !important; } .p-5_pc { padding: -5px !important; } .p-10_pc { padding: -10px !important; } .p-15_pc { padding: -15px !important; } .p-20_pc { padding: -20px !important; } .p-25_pc { padding: -25px !important; } .p-30_pc { padding: -30px !important; } .p-35_pc { padding: -35px !important; } .p-40_pc { padding: -40px !important; } .p-45_pc { padding: -45px !important; } .p-50_pc { padding: -50px !important; } .p-55_pc { padding: -55px !important; } .p-60_pc { padding: -60px !important; } .p-65_pc { padding: -65px !important; } .p-70_pc { padding: -70px !important; } .p-75_pc { padding: -75px !important; } .p-80_pc { padding: -80px !important; } .p-85_pc { padding: -85px !important; } .p-90_pc { padding: -90px !important; } .p-95_pc { padding: -95px !important; } .p-100_pc { padding: -100px !important; } .pt-5_pc { padding-top: -5px !important; } .pt-10_pc { padding-top: -10px !important; } .pt-15_pc { padding-top: -15px !important; } .pt-20_pc { padding-top: -20px !important; } .pt-25_pc { padding-top: -25px !important; } .pt-30_pc { padding-top: -30px !important; } .pt-35_pc { padding-top: -35px !important; } .pt-40_pc { padding-top: -40px !important; } .pt-45_pc { padding-top: -45px !important; } .pt-50_pc { padding-top: -50px !important; } .pt-55_pc { padding-top: -55px !important; } .pt-60_pc { padding-top: -60px !important; } .pt-65_pc { padding-top: -65px !important; } .pt-70_pc { padding-top: -70px !important; } .pt-75_pc { padding-top: -75px !important; } .pt-80_pc { padding-top: -80px !important; } .pt-85_pc { padding-top: -85px !important; } .pt-90_pc { padding-top: -90px !important; } .pt-95_pc { padding-top: -95px !important; } .pt-100_pc { padding-top: -100px !important; } .pl-5_pc { padding-left: -5px !important; } .pl-10_pc { padding-left: -10px !important; } .pl-15_pc { padding-left: -15px !important; } .pl-20_pc { padding-left: -20px !important; } .pl-25_pc { padding-left: -25px !important; } .pl-30_pc { padding-left: -30px !important; } .pl-35_pc { padding-left: -35px !important; } .pl-40_pc { padding-left: -40px !important; } .pl-45_pc { padding-left: -45px !important; } .pl-50_pc { padding-left: -50px !important; } .pl-55_pc { padding-left: -55px !important; } .pl-60_pc { padding-left: -60px !important; } .pl-65_pc { padding-left: -65px !important; } .pl-70_pc { padding-left: -70px !important; } .pl-75_pc { padding-left: -75px !important; } .pl-80_pc { padding-left: -80px !important; } .pl-85_pc { padding-left: -85px !important; } .pl-90_pc { padding-left: -90px !important; } .pl-95_pc { padding-left: -95px !important; } .pl-100_pc { padding-left: -100px !important; } .pr-5_pc { padding-right: -5px !important; } .pr-10_pc { padding-right: -10px !important; } .pr-15_pc { padding-right: -15px !important; } .pr-20_pc { padding-right: -20px !important; } .pr-25_pc { padding-right: -25px !important; } .pr-30_pc { padding-right: -30px !important; } .pr-35_pc { padding-right: -35px !important; } .pr-40_pc { padding-right: -40px !important; } .pr-45_pc { padding-right: -45px !important; } .pr-50_pc { padding-right: -50px !important; } .pr-55_pc { padding-right: -55px !important; } .pr-60_pc { padding-right: -60px !important; } .pr-65_pc { padding-right: -65px !important; } .pr-70_pc { padding-right: -70px !important; } .pr-75_pc { padding-right: -75px !important; } .pr-80_pc { padding-right: -80px !important; } .pr-85_pc { padding-right: -85px !important; } .pr-90_pc { padding-right: -90px !important; } .pr-95_pc { padding-right: -95px !important; } .pr-100_pc { padding-right: -100px !important; } .pb-5_pc { padding-bottom: -5px !important; } .pb-10_pc { padding-bottom: -10px !important; } .pb-15_pc { padding-bottom: -15px !important; } .pb-20_pc { padding-bottom: -20px !important; } .pb-25_pc { padding-bottom: -25px !important; } .pb-30_pc { padding-bottom: -30px !important; } .pb-35_pc { padding-bottom: -35px !important; } .pb-40_pc { padding-bottom: -40px !important; } .pb-45_pc { padding-bottom: -45px !important; } .pb-50_pc { padding-bottom: -50px !important; } .pb-55_pc { padding-bottom: -55px !important; } .pb-60_pc { padding-bottom: -60px !important; } .pb-65_pc { padding-bottom: -65px !important; } .pb-70_pc { padding-bottom: -70px !important; } .pb-75_pc { padding-bottom: -75px !important; } .pb-80_pc { padding-bottom: -80px !important; } .pb-85_pc { padding-bottom: -85px !important; } .pb-90_pc { padding-bottom: -90px !important; } .pb-95_pc { padding-bottom: -95px !important; } .pb-100_pc { padding-bottom: -100px !important; } } @media screen and (max-width: 768px) { .m0_sp { margin: 0px !important; } .m5_sp { margin: 5px !important; } .m10_sp { margin: 10px !important; } .m15_sp { margin: 15px !important; } .m20_sp { margin: 20px !important; } .m25_sp { margin: 25px !important; } .m30_sp { margin: 30px !important; } .m35_sp { margin: 35px !important; } .m40_sp { margin: 40px !important; } .m45_sp { margin: 45px !important; } .m50_sp { margin: 50px !important; } .m55_sp { margin: 55px !important; } .m60_sp { margin: 60px !important; } .m65_sp { margin: 65px !important; } .m70_sp { margin: 70px !important; } .m75_sp { margin: 75px !important; } .m80_sp { margin: 80px !important; } .m85_sp { margin: 85px !important; } .m90_sp { margin: 90px !important; } .m95_sp { margin: 95px !important; } .m100_sp { margin: 100px !important; } .mt0_sp { margin-top: 0px !important; } .mt5_sp { margin-top: 5px !important; } .mt10_sp { margin-top: 10px !important; } .mt15_sp { margin-top: 15px !important; } .mt20_sp { margin-top: 20px !important; } .mt25_sp { margin-top: 25px !important; } .mt30_sp { margin-top: 30px !important; } .mt35_sp { margin-top: 35px !important; } .mt40_sp { margin-top: 40px !important; } .mt45_sp { margin-top: 45px !important; } .mt50_sp { margin-top: 50px !important; } .mt55_sp { margin-top: 55px !important; } .mt60_sp { margin-top: 60px !important; } .mt65_sp { margin-top: 65px !important; } .mt70_sp { margin-top: 70px !important; } .mt75_sp { margin-top: 75px !important; } .mt80_sp { margin-top: 80px !important; } .mt85_sp { margin-top: 85px !important; } .mt90_sp { margin-top: 90px !important; } .mt95_sp { margin-top: 95px !important; } .mt100_sp { margin-top: 100px !important; } .ml0_sp { margin-left: 0px !important; } .ml5_sp { margin-left: 5px !important; } .ml10_sp { margin-left: 10px !important; } .ml15_sp { margin-left: 15px !important; } .ml20_sp { margin-left: 20px !important; } .ml25_sp { margin-left: 25px !important; } .ml30_sp { margin-left: 30px !important; } .ml35_sp { margin-left: 35px !important; } .ml40_sp { margin-left: 40px !important; } .ml45_sp { margin-left: 45px !important; } .ml50_sp { margin-left: 50px !important; } .ml55_sp { margin-left: 55px !important; } .ml60_sp { margin-left: 60px !important; } .ml65_sp { margin-left: 65px !important; } .ml70_sp { margin-left: 70px !important; } .ml75_sp { margin-left: 75px !important; } .ml80_sp { margin-left: 80px !important; } .ml85_sp { margin-left: 85px !important; } .ml90_sp { margin-left: 90px !important; } .ml95_sp { margin-left: 95px !important; } .ml100_sp { margin-left: 100px !important; } .mr0_sp { margin-right: 0px !important; } .mr5_sp { margin-right: 5px !important; } .mr10_sp { margin-right: 10px !important; } .mr15_sp { margin-right: 15px !important; } .mr20_sp { margin-right: 20px !important; } .mr25_sp { margin-right: 25px !important; } .mr30_sp { margin-right: 30px !important; } .mr35_sp { margin-right: 35px !important; } .mr40_sp { margin-right: 40px !important; } .mr45_sp { margin-right: 45px !important; } .mr50_sp { margin-right: 50px !important; } .mr55_sp { margin-right: 55px !important; } .mr60_sp { margin-right: 60px !important; } .mr65_sp { margin-right: 65px !important; } .mr70_sp { margin-right: 70px !important; } .mr75_sp { margin-right: 75px !important; } .mr80_sp { margin-right: 80px !important; } .mr85_sp { margin-right: 85px !important; } .mr90_sp { margin-right: 90px !important; } .mr95_sp { margin-right: 95px !important; } .mr100_sp { margin-right: 100px !important; } .mb0_sp { margin-bottom: 0px !important; } .mb5_sp { margin-bottom: 5px !important; } .mb10_sp { margin-bottom: 10px !important; } .mb15_sp { margin-bottom: 15px !important; } .mb20_sp { margin-bottom: 20px !important; } .mb25_sp { margin-bottom: 25px !important; } .mb30_sp { margin-bottom: 30px !important; } .mb35_sp { margin-bottom: 35px !important; } .mb40_sp { margin-bottom: 40px !important; } .mb45_sp { margin-bottom: 45px !important; } .mb50_sp { margin-bottom: 50px !important; } .mb55_sp { margin-bottom: 55px !important; } .mb60_sp { margin-bottom: 60px !important; } .mb65_sp { margin-bottom: 65px !important; } .mb70_sp { margin-bottom: 70px !important; } .mb75_sp { margin-bottom: 75px !important; } .mb80_sp { margin-bottom: 80px !important; } .mb85_sp { margin-bottom: 85px !important; } .mb90_sp { margin-bottom: 90px !important; } .mb95_sp { margin-bottom: 95px !important; } .mb100_sp { margin-bottom: 100px !important; } .m-5_sp { margin: -5px !important; } .m-10_sp { margin: -10px !important; } .m-15_sp { margin: -15px !important; } .m-20_sp { margin: -20px !important; } .m-25_sp { margin: -25px !important; } .m-30_sp { margin: -30px !important; } .m-35_sp { margin: -35px !important; } .m-40_sp { margin: -40px !important; } .m-45_sp { margin: -45px !important; } .m-50_sp { margin: -50px !important; } .m-55_sp { margin: -55px !important; } .m-60_sp { margin: -60px !important; } .m-65_sp { margin: -65px !important; } .m-70_sp { margin: -70px !important; } .m-75_sp { margin: -75px !important; } .m-80_sp { margin: -80px !important; } .m-85_sp { margin: -85px !important; } .m-90_sp { margin: -90px !important; } .m-95_sp { margin: -95px !important; } .m-100_sp { margin: -100px !important; } .mt-5_sp { margin-top: -5px !important; } .mt-10_sp { margin-top: -10px !important; } .mt-15_sp { margin-top: -15px !important; } .mt-20_sp { margin-top: -20px !important; } .mt-25_sp { margin-top: -25px !important; } .mt-30_sp { margin-top: -30px !important; } .mt-35_sp { margin-top: -35px !important; } .mt-40_sp { margin-top: -40px !important; } .mt-45_sp { margin-top: -45px !important; } .mt-50_sp { margin-top: -50px !important; } .mt-55_sp { margin-top: -55px !important; } .mt-60_sp { margin-top: -60px !important; } .mt-65_sp { margin-top: -65px !important; } .mt-70_sp { margin-top: -70px !important; } .mt-75_sp { margin-top: -75px !important; } .mt-80_sp { margin-top: -80px !important; } .mt-85_sp { margin-top: -85px !important; } .mt-90_sp { margin-top: -90px !important; } .mt-95_sp { margin-top: -95px !important; } .mt-100_sp { margin-top: -100px !important; } .ml-5_sp { margin-left: -5px !important; } .ml-10_sp { margin-left: -10px !important; } .ml-15_sp { margin-left: -15px !important; } .ml-20_sp { margin-left: -20px !important; } .ml-25_sp { margin-left: -25px !important; } .ml-30_sp { margin-left: -30px !important; } .ml-35_sp { margin-left: -35px !important; } .ml-40_sp { margin-left: -40px !important; } .ml-45_sp { margin-left: -45px !important; } .ml-50_sp { margin-left: -50px !important; } .ml-55_sp { margin-left: -55px !important; } .ml-60_sp { margin-left: -60px !important; } .ml-65_sp { margin-left: -65px !important; } .ml-70_sp { margin-left: -70px !important; } .ml-75_sp { margin-left: -75px !important; } .ml-80_sp { margin-left: -80px !important; } .ml-85_sp { margin-left: -85px !important; } .ml-90_sp { margin-left: -90px !important; } .ml-95_sp { margin-left: -95px !important; } .ml-100_sp { margin-left: -100px !important; } .mr-5_sp { margin-right: -5px !important; } .mr-10_sp { margin-right: -10px !important; } .mr-15_sp { margin-right: -15px !important; } .mr-20_sp { margin-right: -20px !important; } .mr-25_sp { margin-right: -25px !important; } .mr-30_sp { margin-right: -30px !important; } .mr-35_sp { margin-right: -35px !important; } .mr-40_sp { margin-right: -40px !important; } .mr-45_sp { margin-right: -45px !important; } .mr-50_sp { margin-right: -50px !important; } .mr-55_sp { margin-right: -55px !important; } .mr-60_sp { margin-right: -60px !important; } .mr-65_sp { margin-right: -65px !important; } .mr-70_sp { margin-right: -70px !important; } .mr-75_sp { margin-right: -75px !important; } .mr-80_sp { margin-right: -80px !important; } .mr-85_sp { margin-right: -85px !important; } .mr-90_sp { margin-right: -90px !important; } .mr-95_sp { margin-right: -95px !important; } .mr-100_sp { margin-right: -100px !important; } .mb-5_sp { margin-bottom: -5px !important; } .mb-10_sp { margin-bottom: -10px !important; } .mb-15_sp { margin-bottom: -15px !important; } .mb-20_sp { margin-bottom: -20px !important; } .mb-25_sp { margin-bottom: -25px !important; } .mb-30_sp { margin-bottom: -30px !important; } .mb-35_sp { margin-bottom: -35px !important; } .mb-40_sp { margin-bottom: -40px !important; } .mb-45_sp { margin-bottom: -45px !important; } .mb-50_sp { margin-bottom: -50px !important; } .mb-55_sp { margin-bottom: -55px !important; } .mb-60_sp { margin-bottom: -60px !important; } .mb-65_sp { margin-bottom: -65px !important; } .mb-70_sp { margin-bottom: -70px !important; } .mb-75_sp { margin-bottom: -75px !important; } .mb-80_sp { margin-bottom: -80px !important; } .mb-85_sp { margin-bottom: -85px !important; } .mb-90_sp { margin-bottom: -90px !important; } .mb-95_sp { margin-bottom: -95px !important; } .mb-100_sp { margin-bottom: -100px !important; } .p0_sp { padding: 0px !important; } .p5_sp { padding: 5px !important; } .p10_sp { padding: 10px !important; } .p15_sp { padding: 15px !important; } .p20_sp { padding: 20px !important; } .p25_sp { padding: 25px !important; } .p30_sp { padding: 30px !important; } .p35_sp { padding: 35px !important; } .p40_sp { padding: 40px !important; } .p45_sp { padding: 45px !important; } .p50_sp { padding: 50px !important; } .p55_sp { padding: 55px !important; } .p60_sp { padding: 60px !important; } .p65_sp { padding: 65px !important; } .p70_sp { padding: 70px !important; } .p75_sp { padding: 75px !important; } .p80_sp { padding: 80px !important; } .p85_sp { padding: 85px !important; } .p90_sp { padding: 90px !important; } .p95_sp { padding: 95px !important; } .p100_sp { padding: 100px !important; } .pt0_sp { padding-top: 0px !important; } .pt5_sp { padding-top: 5px !important; } .pt10_sp { padding-top: 10px !important; } .pt15_sp { padding-top: 15px !important; } .pt20_sp { padding-top: 20px !important; } .pt25_sp { padding-top: 25px !important; } .pt30_sp { padding-top: 30px !important; } .pt35_sp { padding-top: 35px !important; } .pt40_sp { padding-top: 40px !important; } .pt45_sp { padding-top: 45px !important; } .pt50_sp { padding-top: 50px !important; } .pt55_sp { padding-top: 55px !important; } .pt60_sp { padding-top: 60px !important; } .pt65_sp { padding-top: 65px !important; } .pt70_sp { padding-top: 70px !important; } .pt75_sp { padding-top: 75px !important; } .pt80_sp { padding-top: 80px !important; } .pt85_sp { padding-top: 85px !important; } .pt90_sp { padding-top: 90px !important; } .pt95_sp { padding-top: 95px !important; } .pt100_sp { padding-top: 100px !important; } .pl0_sp { padding-left: 0px !important; } .pl5_sp { padding-left: 5px !important; } .pl10_sp { padding-left: 10px !important; } .pl15_sp { padding-left: 15px !important; } .pl20_sp { padding-left: 20px !important; } .pl25_sp { padding-left: 25px !important; } .pl30_sp { padding-left: 30px !important; } .pl35_sp { padding-left: 35px !important; } .pl40_sp { padding-left: 40px !important; } .pl45_sp { padding-left: 45px !important; } .pl50_sp { padding-left: 50px !important; } .pl55_sp { padding-left: 55px !important; } .pl60_sp { padding-left: 60px !important; } .pl65_sp { padding-left: 65px !important; } .pl70_sp { padding-left: 70px !important; } .pl75_sp { padding-left: 75px !important; } .pl80_sp { padding-left: 80px !important; } .pl85_sp { padding-left: 85px !important; } .pl90_sp { padding-left: 90px !important; } .pl95_sp { padding-left: 95px !important; } .pl100_sp { padding-left: 100px !important; } .pr0_sp { padding-right: 0px !important; } .pr5_sp { padding-right: 5px !important; } .pr10_sp { padding-right: 10px !important; } .pr15_sp { padding-right: 15px !important; } .pr20_sp { padding-right: 20px !important; } .pr25_sp { padding-right: 25px !important; } .pr30_sp { padding-right: 30px !important; } .pr35_sp { padding-right: 35px !important; } .pr40_sp { padding-right: 40px !important; } .pr45_sp { padding-right: 45px !important; } .pr50_sp { padding-right: 50px !important; } .pr55_sp { padding-right: 55px !important; } .pr60_sp { padding-right: 60px !important; } .pr65_sp { padding-right: 65px !important; } .pr70_sp { padding-right: 70px !important; } .pr75_sp { padding-right: 75px !important; } .pr80_sp { padding-right: 80px !important; } .pr85_sp { padding-right: 85px !important; } .pr90_sp { padding-right: 90px !important; } .pr95_sp { padding-right: 95px !important; } .pr100_sp { padding-right: 100px !important; } .pb0_sp { padding-bottom: 0px !important; } .pb5_sp { padding-bottom: 5px !important; } .pb10_sp { padding-bottom: 10px !important; } .pb15_sp { padding-bottom: 15px !important; } .pb20_sp { padding-bottom: 20px !important; } .pb25_sp { padding-bottom: 25px !important; } .pb30_sp { padding-bottom: 30px !important; } .pb35_sp { padding-bottom: 35px !important; } .pb40_sp { padding-bottom: 40px !important; } .pb45_sp { padding-bottom: 45px !important; } .pb50_sp { padding-bottom: 50px !important; } .pb55_sp { padding-bottom: 55px !important; } .pb60_sp { padding-bottom: 60px !important; } .pb65_sp { padding-bottom: 65px !important; } .pb70_sp { padding-bottom: 70px !important; } .pb75_sp { padding-bottom: 75px !important; } .pb80_sp { padding-bottom: 80px !important; } .pb85_sp { padding-bottom: 85px !important; } .pb90_sp { padding-bottom: 90px !important; } .pb95_sp { padding-bottom: 95px !important; } .pb100_sp { padding-bottom: 100px !important; } .p-5_sp { padding: -5px !important; } .p-10_sp { padding: -10px !important; } .p-15_sp { padding: -15px !important; } .p-20_sp { padding: -20px !important; } .p-25_sp { padding: -25px !important; } .p-30_sp { padding: -30px !important; } .p-35_sp { padding: -35px !important; } .p-40_sp { padding: -40px !important; } .p-45_sp { padding: -45px !important; } .p-50_sp { padding: -50px !important; } .p-55_sp { padding: -55px !important; } .p-60_sp { padding: -60px !important; } .p-65_sp { padding: -65px !important; } .p-70_sp { padding: -70px !important; } .p-75_sp { padding: -75px !important; } .p-80_sp { padding: -80px !important; } .p-85_sp { padding: -85px !important; } .p-90_sp { padding: -90px !important; } .p-95_sp { padding: -95px !important; } .p-100_sp { padding: -100px !important; } .pt-5_sp { padding-top: -5px !important; } .pt-10_sp { padding-top: -10px !important; } .pt-15_sp { padding-top: -15px !important; } .pt-20_sp { padding-top: -20px !important; } .pt-25_sp { padding-top: -25px !important; } .pt-30_sp { padding-top: -30px !important; } .pt-35_sp { padding-top: -35px !important; } .pt-40_sp { padding-top: -40px !important; } .pt-45_sp { padding-top: -45px !important; } .pt-50_sp { padding-top: -50px !important; } .pt-55_sp { padding-top: -55px !important; } .pt-60_sp { padding-top: -60px !important; } .pt-65_sp { padding-top: -65px !important; } .pt-70_sp { padding-top: -70px !important; } .pt-75_sp { padding-top: -75px !important; } .pt-80_sp { padding-top: -80px !important; } .pt-85_sp { padding-top: -85px !important; } .pt-90_sp { padding-top: -90px !important; } .pt-95_sp { padding-top: -95px !important; } .pt-100_sp { padding-top: -100px !important; } .pl-5_sp { padding-left: -5px !important; } .pl-10_sp { padding-left: -10px !important; } .pl-15_sp { padding-left: -15px !important; } .pl-20_sp { padding-left: -20px !important; } .pl-25_sp { padding-left: -25px !important; } .pl-30_sp { padding-left: -30px !important; } .pl-35_sp { padding-left: -35px !important; } .pl-40_sp { padding-left: -40px !important; } .pl-45_sp { padding-left: -45px !important; } .pl-50_sp { padding-left: -50px !important; } .pl-55_sp { padding-left: -55px !important; } .pl-60_sp { padding-left: -60px !important; } .pl-65_sp { padding-left: -65px !important; } .pl-70_sp { padding-left: -70px !important; } .pl-75_sp { padding-left: -75px !important; } .pl-80_sp { padding-left: -80px !important; } .pl-85_sp { padding-left: -85px !important; } .pl-90_sp { padding-left: -90px !important; } .pl-95_sp { padding-left: -95px !important; } .pl-100_sp { padding-left: -100px !important; } .pr-5_sp { padding-right: -5px !important; } .pr-10_sp { padding-right: -10px !important; } .pr-15_sp { padding-right: -15px !important; } .pr-20_sp { padding-right: -20px !important; } .pr-25_sp { padding-right: -25px !important; } .pr-30_sp { padding-right: -30px !important; } .pr-35_sp { padding-right: -35px !important; } .pr-40_sp { padding-right: -40px !important; } .pr-45_sp { padding-right: -45px !important; } .pr-50_sp { padding-right: -50px !important; } .pr-55_sp { padding-right: -55px !important; } .pr-60_sp { padding-right: -60px !important; } .pr-65_sp { padding-right: -65px !important; } .pr-70_sp { padding-right: -70px !important; } .pr-75_sp { padding-right: -75px !important; } .pr-80_sp { padding-right: -80px !important; } .pr-85_sp { padding-right: -85px !important; } .pr-90_sp { padding-right: -90px !important; } .pr-95_sp { padding-right: -95px !important; } .pr-100_sp { padding-right: -100px !important; } .pb-5_sp { padding-bottom: -5px !important; } .pb-10_sp { padding-bottom: -10px !important; } .pb-15_sp { padding-bottom: -15px !important; } .pb-20_sp { padding-bottom: -20px !important; } .pb-25_sp { padding-bottom: -25px !important; } .pb-30_sp { padding-bottom: -30px !important; } .pb-35_sp { padding-bottom: -35px !important; } .pb-40_sp { padding-bottom: -40px !important; } .pb-45_sp { padding-bottom: -45px !important; } .pb-50_sp { padding-bottom: -50px !important; } .pb-55_sp { padding-bottom: -55px !important; } .pb-60_sp { padding-bottom: -60px !important; } .pb-65_sp { padding-bottom: -65px !important; } .pb-70_sp { padding-bottom: -70px !important; } .pb-75_sp { padding-bottom: -75px !important; } .pb-80_sp { padding-bottom: -80px !important; } .pb-85_sp { padding-bottom: -85px !important; } .pb-90_sp { padding-bottom: -90px !important; } .pb-95_sp { padding-bottom: -95px !important; } .pb-100_sp { padding-bottom: -100px !important; } } .menu-button__text { font-family: "PT Mono", monospace; font-weight: 400; font-style: normal; } .job .block__title__en, .recruit-info .title__en, .nav[data-type=recruit] div span, .title--section__en, .title--section-detail__en { font-family: "Outfit", sans-serif; font-optical-sizing: auto; font-style: normal; } html { font-family: "yu-gothic-pr6n", sans-serif; font-weight: 400; font-style: normal; } html { color: #333; font-size: 62.5%; line-height: 1; } @media screen and (max-width: 768px) { body { min-width: 375px; padding-top: 5rem; padding-bottom: 4.5rem; position: relative; } } @media screen and (min-width: 769px) { body { min-width: 1240px; padding-top: 10.5rem; } } body[data-fixed=true] { position: fixed; width: 100%; height: 100%; left: 0; } main { overflow: hidden; } * { max-width: 100%; } @media screen and (max-width: 768px) { .about-us, .company .title--section, .company .lead, .company .links { padding-left: 3rem; padding-right: 3rem; } } .link--yellow, .nav__button, .header__link, .recruit-info__link { display: flex; align-items: center; justify-content: center; width: 13.3rem; height: 4.1rem; background: #ffd700; border-radius: 4.1rem; } @media screen and (min-width: 769px) { .link--yellow, .nav__button, .header__link, .recruit-info__link { transition-duration: 300ms; } } .link--yellow span, .nav__button span, .header__link span, .recruit-info__link span { color: #049943; font-size: 1.4rem; font-weight: bold; } .link--yellow svg, .nav__button svg, .header__link svg, .recruit-info__link svg { fill: #049943; height: 1rem; margin-left: 1.1rem; } @media screen and (min-width: 769px) { .link--yellow:hover, .nav__button:hover, .header__link:hover, .recruit-info__link:hover { background: #ff7a39; } .link--yellow:hover span, .nav__button:hover span, .header__link:hover span, .recruit-info__link:hover span { color: #fff; } .link--yellow:hover svg, .nav__button:hover svg, .header__link:hover svg, .recruit-info__link:hover svg { fill: #fff; } } .link--top, .about-us .block__link, .company .links a, .recruit-top .block__link, .job .block__link, .q-and-a .link { display: flex; align-items: center; justify-content: space-between; border-bottom: 0.2rem solid #ff7a39; } @media screen and (max-width: 768px) { .link--top, .about-us .block__link, .company .links a, .recruit-top .block__link, .job .block__link, .q-and-a .link { padding-top: 1rem; padding-left: 1rem; padding-right: 0.5rem; padding-bottom: 1rem; } } @media screen and (min-width: 769px) { .link--top, .about-us .block__link, .company .links a, .recruit-top .block__link, .job .block__link, .q-and-a .link { padding: 1rem; transition-duration: 300ms; } .link--top:hover, .about-us .block__link:hover, .company .links a:hover, .recruit-top .block__link:hover, .job .block__link:hover, .q-and-a .link:hover { color: #ff7a39; } } .link--top span, .about-us .block__link span, .company .links a span, .recruit-top .block__link span, .job .block__link span, .q-and-a .link span { font-weight: bold; } @media screen and (max-width: 768px) { .link--top span, .about-us .block__link span, .company .links a span, .recruit-top .block__link span, .job .block__link span, .q-and-a .link span { font-size: 1.4rem; } } @media screen and (min-width: 769px) { .link--top span, .about-us .block__link span, .company .links a span, .recruit-top .block__link span, .job .block__link span, .q-and-a .link span { font-size: 1.6rem; } } .link--top svg, .about-us .block__link svg, .company .links a svg, .recruit-top .block__link svg, .job .block__link svg, .q-and-a .link svg { fill: #ff7a39; } @media screen and (max-width: 768px) { .link--top svg, .about-us .block__link svg, .company .links a svg, .recruit-top .block__link svg, .job .block__link svg, .q-and-a .link svg { height: 1rem; } } @media screen and (min-width: 769px) { .link--top svg, .about-us .block__link svg, .company .links a svg, .recruit-top .block__link svg, .job .block__link svg, .q-and-a .link svg { height: 1rem; } } .title--section { display: flex; flex-direction: column; } @media screen and (max-width: 768px) { .title--section { align-items: center; gap: 1rem; } } @media screen and (min-width: 769px) { .title--section { gap: 3rem; } } .title--section__en { font-weight: 600; position: relative; } @media screen and (max-width: 768px) { .title--section__en { font-size: 4.7em; } } @media screen and (min-width: 769px) { .title--section__en { font-size: 8em; } } .title--section__en span { position: relative; } .title--section__en:before { content: url("/assets/image/icons/flag.svg"); position: absolute; top: -2rem; left: -3rem; } @media screen and (max-width: 768px) { .title--section__en:before { width: 5rem; } } @media screen and (min-width: 769px) { .title--section__en:before { width: 7.7rem; } } .title--section__jp { color: #049943; font-weight: bold; } @media screen and (max-width: 768px) { .title--section__jp { font-size: 1.5rem; letter-spacing: 0.06em; } } @media screen and (min-width: 769px) { .title--section__jp { font-size: 1.8rem; letter-spacing: 0.06em; } } .title--section-detail { display: flex; } @media screen and (max-width: 768px) { .title--section-detail { align-items: center; gap: 2rem; } } @media screen and (min-width: 769px) { .title--section-detail { flex-direction: column; gap: 1rem; } } .title--section-detail__jp { color: #049943; font-weight: bold; } @media screen and (max-width: 768px) { .title--section-detail__jp { font-size: 2.1rem; letter-spacing: 0.06em; } } @media screen and (min-width: 769px) { .title--section-detail__jp { font-size: 2.6rem; letter-spacing: 0.12em; } } @media screen and (max-width: 768px) { .title--section-detail__en { font-size: 1.4rem; } } @media screen and (min-width: 769px) { .title--section-detail__en { font-size: 1.6rem; } } @media screen and (max-width: 768px) { .recruit-info { margin-top: 5rem; margin-bottom: 4.5rem; } } @media screen and (min-width: 769px) { .recruit-info { margin-top: 13rem; margin-bottom: 4rem; position: relative; } .recruit-info:after { content: ""; display: block; width: 3.3rem; height: 100%; background: #adadad; position: absolute; top: 0; left: calc(50% - 37.7rem); } } .recruit-info .title { display: flex; flex-direction: column; align-items: center; } @media screen and (max-width: 768px) { .recruit-info .title { gap: 1.5rem; margin-bottom: 2.5rem; } } @media screen and (min-width: 769px) { .recruit-info .title { gap: 2rem; position: absolute; top: -4.5rem; left: calc(50% - 55rem); z-index: 1; } } .recruit-info .title__en, .recruit-info .title__jp { display: flex; align-items: center; justify-content: center; color: #049943; border: solid #d6d6d6; position: relative; } @media screen and (max-width: 768px) { .recruit-info .title__en, .recruit-info .title__jp { border-width: 0.5rem; border-radius: 1rem; } } @media screen and (min-width: 769px) { .recruit-info .title__en, .recruit-info .title__jp { border-width: 0.6rem; border-radius: 1.2rem; } } .recruit-info .title__en:after, .recruit-info .title__jp:after { content: ""; display: block; background: #adadad; position: absolute; border-top: solid #545454; } @media screen and (max-width: 768px) { .recruit-info .title__en:after, .recruit-info .title__jp:after { width: 2.8rem; border-top-width: 0.75rem; top: calc(100% + 0.5rem); } } @media screen and (min-width: 769px) { .recruit-info .title__en:after, .recruit-info .title__jp:after { width: 3.3rem; border-top-width: 0.9rem; top: calc(100% + 0.6rem); } } .recruit-info .title__en { background: #ffd700; } @media screen and (max-width: 768px) { .recruit-info .title__en { width: 31.5rem; height: 7.7rem; font-size: 4.7rem; } } @media screen and (min-width: 769px) { .recruit-info .title__en { width: 37.8rem; height: 9.2rem; font-size: 5.6rem; } } @media screen and (max-width: 768px) { .recruit-info .title__en:after { height: 1.5rem; } } @media screen and (min-width: 769px) { .recruit-info .title__en:after { height: 2rem; } } .recruit-info .title__jp { background: #fff; letter-spacing: 0.06em; } @media screen and (max-width: 768px) { .recruit-info .title__jp { width: 19rem; height: 6rem; font-size: 1.5rem; } } @media screen and (min-width: 769px) { .recruit-info .title__jp { width: 22.8rem; height: 7.2rem; font-size: 1.8rem; } } @media screen and (max-width: 768px) { .recruit-info .title__jp:after { height: 2.5rem; } } @media screen and (min-width: 769px) { .recruit-info .title__jp:after { height: 100%; } } .recruit-info .body { background: #049943; } @media screen and (max-width: 768px) { .recruit-info .body { padding: 5.5rem 4.5rem 0 5rem; border-top-left-radius: 7rem; margin-left: 3rem; } } @media screen and (min-width: 769px) { .recruit-info .body { width: calc(50% + 55rem); height: 40rem; padding-top: 8rem; padding-left: 72rem; border-top-left-radius: 14rem; margin-left: auto; position: relative; } } .recruit-info .lead { color: #fff; } @media screen and (max-width: 768px) { .recruit-info .lead { font-size: 1.4rem; line-height: 1.6428571429; } } @media screen and (min-width: 769px) { .recruit-info .lead { width: 34rem; font-size: 1.6rem; line-height: 1.875; } } .recruit-info__link { justify-content: space-between; } @media screen and (max-width: 768px) { .recruit-info__link { width: 19.2rem; height: 5rem; padding-left: 2.5rem; padding-right: 2rem; margin-top: 2rem; margin-left: auto; margin-bottom: 2rem; } } @media screen and (min-width: 769px) { .recruit-info__link { width: 23rem; height: 6rem; padding-left: 3rem; padding-right: 2.5rem; margin-top: 3rem; } } @media screen and (min-width: 769px) { .recruit-info__link span { font-size: 1.68rem; } } .recruit-info picture { display: block; max-width: unset; } @media screen and (max-width: 768px) { .recruit-info picture { margin-right: -3.5rem; transform: translateY(0.1rem); } } @media screen and (min-width: 769px) { .recruit-info picture { position: absolute; left: 21.5rem; bottom: -0.2rem; z-index: 10; } } .header { width: 100%; position: fixed; top: 0; left: 0; z-index: 10; } @media screen and (max-width: 768px) { .header { height: 50px; } } @media screen and (min-width: 769px) { .header { display: flex; height: 105px; background: #fff; } } .header__inner { display: flex; align-items: center; height: 100%; } @media screen and (max-width: 768px) { .header__inner { background: #fff; padding-left: 0.8rem; position: relative; z-index: 1; } } @media screen and (min-width: 769px) { .header__inner { padding-left: 4.5rem; } } .header__logo { display: flex; align-items: center; } @media screen and (max-width: 768px) { .header__logo { gap: 0.75rem; } } @media screen and (min-width: 769px) { .header__logo { gap: 1.5rem; transition-duration: 300ms; } .header__logo:hover { opacity: 0.7; } } @media screen and (max-width: 768px) { .header__logo img { height: 4rem; } } @media screen and (min-width: 769px) { .header__logo img { height: 6rem; } } .header__logo span { color: #060302; font-weight: bold; } @media screen and (max-width: 768px) { .header__logo span { font-size: 1.25rem; line-height: 1.36; } } @media screen and (min-width: 769px) { .header__logo span { font-size: 2rem; line-height: 1.35; } } .header__link { margin-left: auto; } @media screen and (min-width: 769px) { .header__link { display: none; } } @media screen and (max-width: 768px) { .header__nav { width: 100%; height: 100dvh; background: #dcf1e5; position: absolute; left: 0; transition-duration: 300ms; } .header__nav[data-expanded=false] { top: -100dvh; } .header__nav[data-expanded=true] { top: 5rem; } } @media screen and (min-width: 769px) { .header__nav { display: flex; align-items: flex-end; margin-left: auto; margin-bottom: 2.4rem; } } @media screen and (min-width: 769px) { .header__nav .nav ul { display: flex; align-items: center; gap: 3rem; } } @media screen and (min-width: 769px) { .header__nav .nav ul li > a { display: flex; align-items: center; gap: 0.8rem; } .header__nav .nav ul li:has(ul) { position: relative; } .header__nav .nav ul li:has(ul) > a:after { content: ""; display: block; width: 1rem; height: 1rem; border-left: 1px solid #049943; border-bottom: 1px solid #049943; transform: rotate(-45deg); margin-bottom: 0.5rem; } .header__nav .nav ul li:has(ul):hover ul { opacity: 1; pointer-events: all; } .header__nav .nav ul li > a { padding-bottom: 0.6rem; border-bottom: 1px solid transparent; transition-duration: 300ms; } .header__nav .nav ul li > a:hover { border-color: #049943; } } @media screen and (min-width: 769px) { .header__nav .nav ul li a[data-type=cat] svg { display: none; } } @media screen and (min-width: 769px) { .header__nav .nav ul li a[data-type=cat] span { color: #333; } } @media screen and (min-width: 769px) { .header__nav .nav ul li a[data-type=detail] { font-size: 1.4rem; } } @media screen and (min-width: 769px) { .header__nav .nav ul li ul { gap: unset; max-width: unset; padding-top: 1.5rem; margin: auto; position: absolute; top: 100%; left: 0; opacity: 0; pointer-events: none; transition-duration: 300ms; } .header__nav .nav ul li ul:before { content: ""; display: block; width: 1.2rem; height: 0.8rem; background: #049943; clip-path: polygon(50% 0, 100% 100%, 0 100%); position: absolute; top: 0.7rem; left: 1.8rem; } .header__nav .nav ul li ul li { width: 100%; background: #049943; padding: 2rem 2.5rem 2rem 2rem; } .header__nav .nav ul li ul li:not(:first-child) { padding-top: 0; } .header__nav .nav ul li ul li a { color: #fff; display: block; transition-duration: 300ms; } .header__nav .nav ul li ul li a:hover { opacity: 0.7; } } @media screen and (min-width: 769px) { .header__nav .nav[data-type=main] > ul > li:last-child li a { width: 6.5em; } } @media screen and (min-width: 769px) { .header__nav .nav[data-type=recruit] { position: static; margin-left: 3rem; margin-right: 4.5rem; } } @media screen and (min-width: 769px) { .header__nav .nav[data-type=recruit] div { display: none; } } @media screen and (min-width: 769px) { .header__nav .nav[data-type=recruit] > ul > li:first-child li a { width: 6.5em; } .header__nav .nav[data-type=recruit] > ul > li:nth-child(2) li a { width: 11.8em; } .header__nav .nav[data-type=recruit] > ul > li:nth-child(3) li a { width: 14em; } } @media screen and (min-width: 769px) { .header__nav .nav__button { width: 16rem; height: 4.5rem; border-radius: unset; border-bottom-left-radius: 2.25rem; margin-top: unset; position: absolute; top: 0; right: 0; } } @media screen and (min-width: 769px) { .header__nav .nav__button span { letter-spacing: 0.06em; } } @media screen and (min-width: 769px) { .header__nav .nav__button svg { margin-left: 2rem; } } .menu-button { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 5rem; height: 100%; background: #333; margin-left: 1.1rem; } @media screen and (min-width: 769px) { .menu-button { display: none; } } .menu-button__decorator { display: flex; align-items: center; justify-content: center; width: 3rem; height: 1.7rem; position: relative; } .menu-button__decorator div { width: 100%; height: 0.15rem; background: #fff; transition-duration: 300ms; } .menu-button__decorator div:first-child, .menu-button__decorator div:last-child { position: absolute; left: 0; } .menu-button__decorator div:first-child { top: 0; } .menu-button__decorator div:last-child { bottom: 0; } .menu-button__text { color: #fff; font-weight: bold; letter-spacing: 0.14em; margin-top: 0.7rem; } .menu-button[data-expanded=true] .menu-button__decorator div { width: 0; } .menu-button[data-expanded=true] .menu-button__decorator div:first-child, .menu-button[data-expanded=true] .menu-button__decorator div:last-child { width: 100%; } .menu-button[data-expanded=true] .menu-button__decorator div:first-child { top: calc(50% - 0.075rem); transform: rotate(45deg); } .menu-button[data-expanded=true] .menu-button__decorator div:last-child { bottom: calc(50% - 0.075rem); transform: rotate(-45deg); } .footer__info { display: flex; align-items: center; } @media screen and (max-width: 768px) { .footer__info { flex-direction: column; gap: 2.5rem; } } @media screen and (min-width: 769px) { .footer__info { justify-content: center; gap: 3.5rem; } } .footer__info .logo { display: flex; align-items: flex-start; } @media screen and (max-width: 768px) { .footer__info .logo { gap: 1.5rem; } } @media screen and (min-width: 769px) { .footer__info .logo { gap: 1rem; } } @media screen and (max-width: 768px) { .footer__info .logo img { height: 4rem; } } @media screen and (min-width: 769px) { .footer__info .logo img { height: 4.5rem; } } .footer__info .logo span { font-weight: bold; padding-top: 1em; } @media screen and (max-width: 768px) { .footer__info .logo span { font-size: 1.6rem; } } @media screen and (min-width: 769px) { .footer__info .logo span { font-size: 1.7rem; } } .footer__info .address { line-height: 1.6; } @media screen and (max-width: 768px) { .footer__info .address { font-size: 1.4rem; text-align: center; } } @media screen and (min-width: 769px) { .footer__info .address { font-size: 1.68rem; } } @media screen and (min-width: 769px) { .footer__info .address br { display: none; } } @media screen and (max-width: 768px) { .footer__info .address span span { display: none; } } .footer__info .address a { display: inline-block; vertical-align: middle; line-height: 0; } @media screen and (max-width: 768px) { .footer__info .address a { margin-left: 1em; } } @media screen and (min-width: 769px) { .footer__info .address a { margin-left: 1.5em; transition-duration: 300ms; } .footer__info .address a:hover { opacity: 0.7; } } @media screen and (max-width: 768px) { .footer__info .address img { width: 1.1rem; } } @media screen and (min-width: 769px) { .footer__info .address img { width: 1.5rem; } } .footer__nav { border-top: 2px dashed #049943; border-bottom: 2px dashed #049943; margin-top: 3rem; } @media screen and (min-width: 769px) { .footer__nav { display: flex; justify-content: center; background: linear-gradient(90deg, #fff 0%, #fff 50%, #dcf1e5 50%, #dcf1e5 100%); } } @media screen and (min-width: 769px) { .footer__nav .nav > ul { display: flex; flex-direction: column; flex-wrap: wrap; align-content: flex-start; height: 30rem; padding-top: 7.5rem; padding-bottom: 3.5rem; } .footer__nav .nav > ul li a { transition-duration: 300ms; } .footer__nav .nav > ul li a[data-type=cat] span { font-size: 1.6rem; } .footer__nav .nav > ul li a[data-type=detail] { font-size: 1.4rem; } .footer__nav .nav > ul li a:hover { opacity: 0.7; } } @media screen and (min-width: 769px) { .footer__nav .nav[data-type=main] > ul { row-gap: 3.5rem; } .footer__nav .nav[data-type=main] > ul > li { width: 15rem; } .footer__nav .nav[data-type=main] > ul > li:nth-child(2) { width: 22.5rem; } } .footer__nav .nav[data-type=recruit] { background: #dcf1e5; } @media screen and (min-width: 769px) { .footer__nav .nav[data-type=recruit] { flex-basis: 68rem; } .footer__nav .nav[data-type=recruit] div { top: 3rem; left: 6rem; } .footer__nav .nav[data-type=recruit] > ul { padding-left: 6rem; } .footer__nav .nav[data-type=recruit] > ul > li { width: 21.5rem; } } @media screen and (min-width: 769px) { .footer__nav .nav__button { margin-top: unset; position: absolute; top: 6rem; right: 0; } } @media screen and (max-width: 768px) { .footer__content { padding: 3.5rem 3rem 2.5rem; } } @media screen and (min-width: 769px) { .footer__content { display: flex; align-items: center; justify-content: center; max-width: 100rem; padding-top: 5rem; padding-bottom: 4.5rem; margin: auto; } } .footer__content .head { font-size: 1.4rem; font-weight: bold; } .footer__content ul { display: flex; } @media screen and (max-width: 768px) { .footer__content ul { flex-wrap: wrap; gap: 1.5rem 2rem; margin-top: 2rem; margin-bottom: 2rem; } } @media screen and (min-width: 769px) { .footer__content ul { gap: 2.5rem; margin-left: 3rem; } } .footer__content ul li a { display: flex; align-items: center; } @media screen and (max-width: 768px) { .footer__content ul li a { gap: 1rem; font-size: 1.25rem; } } @media screen and (min-width: 769px) { .footer__content ul li a { gap: 0.5rem; font-size: 1.4rem; transition-duration: 300ms; } .footer__content ul li a:hover { opacity: 0.7; } } .footer__content ul li a:after { content: ""; display: block; width: 1.2rem; height: 1.2rem; background: url(/assets/image/icons/blank.svg) no-repeat center center; background-size: contain; } @media screen and (min-width: 769px) { .policy { margin-left: auto; } } .policy a { text-decoration: underline; } @media screen and (max-width: 768px) { .policy a { font-size: 1.25rem; } } @media screen and (min-width: 769px) { .policy a { font-size: 1.4rem; transition-duration: 300ms; } .policy a:hover { opacity: 0.7; } } @media screen and (max-width: 768px) { .copyright { margin-top: 1.5rem; } } @media screen and (min-width: 769px) { .copyright { margin-left: 3rem; } } .copyright small { color: #049943; } @media screen and (max-width: 768px) { .copyright small { font-size: 1.3rem; } } @media screen and (min-width: 769px) { .copyright small { font-size: 1.4rem; } } /* Return To Top */ .rtt { display: flex; align-items: center; justify-content: center; color: #fff; background: #333; position: fixed; right: 0; z-index: 1; } @media screen and (max-width: 768px) { .rtt { width: 9rem; height: 4rem; font-size: 1.25rem; border-top-left-radius: 1rem; bottom: 4.5rem; } } @media screen and (min-width: 769px) { .rtt { width: 13rem; height: 6rem; font-size: 1.6rem; border-top-left-radius: 2rem; bottom: 0; } } .fixed-banner { display: flex; width: 100%; height: 45px; position: fixed; left: 0; bottom: 0; z-index: 1000; } @media screen and (min-width: 769px) { .fixed-banner { display: none; } } .fixed-banner a { flex-basis: 50%; display: flex; align-items: center; justify-content: center; } .fixed-banner a span { font-size: 1.4rem; font-weight: bold; } .fixed-banner a svg { width: 1.3rem; margin-left: 1.5rem; } .fixed-banner a.recruit { background: #ffd700; } .fixed-banner a.recruit img { width: 1.6rem; margin-right: 1.8rem; } .fixed-banner a.recruit span { color: #049943; } .fixed-banner a.recruit svg { fill: #049943; } .fixed-banner a.tel { background: #049943; } .fixed-banner a.tel img { width: 1.8rem; margin-right: 1.4rem; } .fixed-banner a.tel span { color: #fff; } .fixed-banner a.tel svg { fill: #fff; } @media screen and (max-width: 768px) { .nav { padding: 3rem 3rem 3.5rem; } } .nav ul { display: grid; grid-template-columns: 1fr 1fr; grid-row-gap: 3rem; font-weight: bold; } .nav ul li a[data-type=cat] svg { fill: #049943; height: 1rem; margin-right: 0.5rem; } .nav ul li a[data-type=cat] span { font-size: 1.4rem; color: #049943; } .nav ul li a[data-type=detail] { font-size: 1.25rem; } .nav ul li ul { display: flex; flex-direction: column; gap: 1.25rem; margin-top: 1.5rem; } .nav[data-type=main] { background: #fff; } .nav[data-type=main] > ul { grid-row-gap: 2rem; } .nav[data-type=main] > ul > li:first-child { grid-column: 1/span 2; } .nav[data-type=recruit] { position: relative; } .nav[data-type=recruit] div { position: absolute; top: -1.35rem; left: 3rem; } .nav[data-type=recruit] div span { color: #049943; font-size: 2.7rem; font-weight: 600; } .nav__button { margin-top: 3rem; } /* メインビジュアル */ .main-visual { position: relative; } @media screen and (max-width: 768px) { .main-visual { height: calc(100dvh - 5rem - 4.5rem); } } @media screen and (min-width: 769px) { .main-visual { height: calc(100dvh - 10.5rem); } } .main-visual:after { display: block; position: absolute; right: 0; z-index: -1; } @media screen and (max-width: 768px) { .main-visual:after { content: ""; display: block; width: 100%; height: calc(100% - 2rem - 2rem); background: url("/assets/image/decoration/road_mv_sp.svg") no-repeat center center; background-size: cover; top: 2rem; } } @media screen and (min-width: 769px) { .main-visual:after { content: url("/assets/image/decoration/road_mv_pc.svg"); width: 30rem; top: -8rem; } } .main-visual__item { position: absolute; opacity: 0; pointer-events: none; transition-duration: 600ms; } @media screen and (max-width: 768px) { .main-visual__item { display: flex; flex-direction: column; gap: 2.5rem; width: 100%; height: 100%; padding-left: calc((100% - 31.5rem) / 2); margin: auto; top: 0; bottom: 0; } } @media screen and (min-width: 769px) { .main-visual__item { width: 100%; height: 100%; overflow: hidden; } } .main-visual__item[data-visible=true] { opacity: 1; pointer-events: all; } .main-visual__text { display: flex; font-weight: bold; } @media screen and (max-width: 768px) { .main-visual__text { flex-direction: column; justify-content: flex-end; gap: 1rem; height: 20rem; } } @media screen and (min-width: 769px) { .main-visual__text { flex-direction: column; justify-content: center; gap: 3rem; width: 50rem; writing-mode: vertical-rl; position: absolute; top: 5.5rem; right: calc(50% + 5rem); transform: translateX(-2rem); } } @media screen and (max-width: 768px) { .main-visual__head { font-size: 3.2rem; line-height: 1.328125; letter-spacing: 0.06em; } } @media screen and (min-width: 769px) { .main-visual__head { font-size: 5.5rem; line-height: 1.3636363636; letter-spacing: 0.1em; } } .main-visual__head span { color: #049943; } @media screen and (max-width: 768px) { .main-visual__body { font-size: 1.3rem; line-height: 1.6923076923; } } @media screen and (min-width: 769px) { .main-visual__body { font-size: 2.5rem; line-height: 1.6; letter-spacing: 0.1em; } } .main-visual__image { display: block; } @media screen and (max-width: 768px) { .main-visual__image { height: 32.5rem; margin-left: auto; } } @media screen and (min-width: 769px) { .main-visual__image { width: 54%; position: absolute; left: calc(50% - 5rem); bottom: 0; } } @media screen and (max-width: 768px) { .main-visual__image img { -o-object-position: 0 50%; object-position: 0 50%; border-top-left-radius: 7rem; } } @media screen and (min-width: 769px) { .main-visual__image img { width: 100%; height: 100%; border-top-left-radius: 14rem; } } /* ナゴヤクリーンとは */ @media screen and (max-width: 768px) { .about-us { padding-bottom: 10rem; margin-top: 5.5rem; } } @media screen and (min-width: 769px) { .about-us { margin-top: 13rem; position: relative; } } @media screen and (min-width: 769px) { .about-us .inner { width: 48rem; margin-left: calc(50% + 3rem); } } .about-us .lead { font-weight: bold; } @media screen and (max-width: 768px) { .about-us .lead { font-size: 1.4rem; line-height: 1.9642857143; margin-top: 3rem; } } @media screen and (min-width: 769px) { .about-us .lead { font-size: 1.6rem; line-height: 1.875; margin-top: 3rem; } } @media screen and (max-width: 768px) { .about-us .body { margin-top: 2rem; } } @media screen and (min-width: 769px) { .about-us .body { margin-top: 6rem; } } .about-us .block { border-top: solid #e2e2e2; } @media screen and (max-width: 768px) { .about-us .block { padding-top: 3rem; border-top-width: 0.1rem; } .about-us .block:not(:last-child) { padding-bottom: 3rem; } } @media screen and (min-width: 769px) { .about-us .block { display: flex; flex-wrap: wrap; justify-content: space-between; padding-top: 4rem; padding-bottom: 4rem; border-top-width: 0.2rem; } .about-us .block:last-child { border-bottom: solid #e2e2e2; } } @media screen and (max-width: 768px) { .about-us .block__text { font-size: 1.4rem; line-height: 1.6428571429; margin-top: 1.5rem; margin-bottom: 2rem; } } @media screen and (min-width: 769px) { .about-us .block__text { width: 34rem; font-size: 1.5rem; line-height: 1.875; } } .about-us .block__link { margin-left: auto; } @media screen and (max-width: 768px) { .about-us .block__link { width: 19rem; } } @media screen and (min-width: 769px) { .about-us .block__link { width: 21rem; margin-top: 3rem; } } .about-us .images { display: flex; flex-direction: column; } @media screen and (max-width: 768px) { .about-us .images { gap: 0.4rem; width: calc(100% + 3rem); max-width: unset; margin-top: 5rem; position: relative; left: -3rem; } } @media screen and (min-width: 769px) { .about-us .images { gap: 0.8rem; width: 57rem; max-width: unset; position: absolute; top: -12rem; left: 0; } } .about-us .images:after { position: absolute; z-index: -1; } @media screen and (max-width: 768px) { .about-us .images:after { content: url("/assets/image/decoration/road_aboutus_sp.svg"); display: block; width: 33rem; height: 32.5rem; left: 50%; bottom: -9.5rem; transform: translateX(7rem); } } @media screen and (min-width: 769px) { .about-us .images:after { content: url("/assets/image/decoration/road_aboutus_pc.svg"); width: 100.5rem; height: 124rem; right: 18rem; bottom: -18rem; } } @media screen and (max-width: 768px) { .about-us .images img:first-child { border-top-right-radius: 7rem; } } @media screen and (min-width: 769px) { .about-us .images img:first-child { border-top-right-radius: 14rem; } } /* 会社情報 */ .company { margin-bottom: -0.2rem; } @media screen and (min-width: 769px) { .company { margin-top: 16rem; position: relative; } } @media screen and (min-width: 769px) { .company .inner { width: 51rem; background: #fff; padding-right: 11rem; padding-bottom: 9.5rem; position: absolute; top: 0; right: 50%; } } @media screen and (max-width: 768px) { .company .title--section { align-items: unset; } } .company .title--section__en { z-index: 1; } .company .title--section__en:before { left: -2rem; } .company .lead { font-weight: bold; } @media screen and (max-width: 768px) { .company .lead { font-size: 1.4rem; line-height: 1.6428571429; margin-top: 2.5rem; margin-bottom: 2.5rem; } } @media screen and (min-width: 769px) { .company .lead { font-size: 1.6rem; line-height: 1.875; margin-top: 5rem; margin-bottom: 4rem; } } @media screen and (max-width: 768px) { .company .links { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1rem; margin-bottom: 4.5rem; } } @media screen and (min-width: 769px) { .company .links { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4.5rem 4rem; } } @media screen and (max-width: 768px) { .company .links a { flex-basis: 15rem; } } @media screen and (min-width: 769px) { .company .links a { flex-basis: 18rem; } } @media screen and (min-width: 769px) { .company picture { display: flex; justify-content: flex-end; } } @media screen and (max-width: 768px) { .company picture img { width: 100%; border-top-left-radius: 7rem; } } @media screen and (min-width: 769px) { .company picture img { width: 75vw; } } /* 採用情報 */ .recruit-top { position: relative; } .recruit-top .head { display: flex; background: #049943; width: 100%; position: relative; } @media screen and (max-width: 768px) { .recruit-top .head { flex-direction: column; align-items: center; padding: 9.5rem 12rem 3rem 3rem; } } @media screen and (min-width: 769px) { .recruit-top .head { align-items: flex-end; justify-content: center; gap: 5rem; padding-top: 13rem; padding-bottom: 6rem; } } .recruit-top .head:before, .recruit-top .head:after { content: ""; display: block; background: no-repeat 0 0; background-size: 100%; position: absolute; } @media screen and (max-width: 768px) { .recruit-top .head:before { width: 58.9rem; height: 126rem; background-image: url("/assets/image/decoration/road_recruit_sp.svg"); top: 13rem; left: calc(50% - 41.6rem); } } @media screen and (min-width: 769px) { .recruit-top .head:before { width: 220.55rem; height: 109rem; background-image: url("/assets/image/decoration/road_recruit_pc.svg"); top: 15rem; left: calc(50% - 164.6rem); } } .recruit-top .head:after { background-image: url("/assets/image/top/recruit_bar.svg"); } @media screen and (max-width: 768px) { .recruit-top .head:after { width: 23.8rem; height: 0.7rem; top: 5.5rem; left: 0; } } @media screen and (min-width: 769px) { .recruit-top .head:after { width: 47.6rem; height: 14rem; top: -0.7rem; left: 0; } } .recruit-top .title { background: url("/assets/image/top/recruit_title_bg.png") no-repeat 0 0; background-size: 100%; position: relative; } @media screen and (max-width: 768px) { .recruit-top .title { width: 21.9rem; height: 17.4rem; } } @media screen and (min-width: 769px) { .recruit-top .title { width: 37.8rem; height: 30rem; } } .recruit-top .title:before, .recruit-top .title:after { content: ""; display: block; position: absolute; } .recruit-top .title:before { width: 50vw; border-right: solid #545454; background: #959595; } @media screen and (max-width: 768px) { .recruit-top .title:before { height: 5rem; border-right-width: 1.3rem; top: calc(50% - 2.5rem); right: 100%; } } @media screen and (min-width: 769px) { .recruit-top .title:before { height: 8.8rem; border-right-width: 3.5rem; top: calc(50% - 4.4rem); right: 100%; } } .recruit-top .title:after { background: #ffd700; border-radius: 100%; animation: lamp 0.75s infinite; } @keyframes lamp { 0% { opacity: 0; } 49% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 1; } } @media screen and (max-width: 768px) { .recruit-top .title:after { width: 1.85rem; height: 1.85rem; top: 0.6rem; left: 4.3rem; } } @media screen and (min-width: 769px) { .recruit-top .title:after { width: 3.2rem; height: 3.2rem; top: 1rem; left: 7.5rem; } } .recruit-top .title img { position: absolute; top: 0; left: 0; opacity: 0; pointer-events: none; } .recruit-top .title img[data-visible=true] { opacity: 1; pointer-events: all; } .recruit-top .lead { color: #fff; position: relative; } @media screen and (max-width: 768px) { .recruit-top .lead { width: 22rem; font-size: 1.4rem; line-height: 1.7142857143; margin-top: 2.5rem; } } @media screen and (min-width: 769px) { .recruit-top .lead { width: 57.2rem; font-size: 1.6rem; line-height: 1.875; padding-right: 20rem; padding-bottom: 3rem; } } .recruit-top .body { display: flex; gap: 5rem; margin-left: auto; margin-right: auto; position: relative; } @media screen and (max-width: 768px) { .recruit-top .body { flex-direction: column; width: 31.5rem; padding-top: 4rem; padding-right: 9.5rem; } } @media screen and (min-width: 769px) { .recruit-top .body { width: 81rem; padding-top: 6rem; transform: translateX(-9.5rem); } } .recruit-top .block { display: flex; flex-direction: column; } @media screen and (max-width: 768px) { .recruit-top .block { gap: 1.5rem; } } @media screen and (min-width: 769px) { .recruit-top .block { flex-basis: 38rem; gap: 2rem; } } @media screen and (min-width: 769px) { .recruit-top .block__head > img { height: 26rem; -o-object-fit: cover; object-fit: cover; } } @media screen and (min-width: 769px) { .recruit-top .block .title--section-detail { flex-direction: unset; align-items: flex-end; } } @media screen and (min-width: 769px) { .recruit-top .block .title--section-detail__jp { letter-spacing: 0.06em; } } @media screen and (max-width: 768px) { .recruit-top .block__body { font-size: 1.4rem; line-height: 1.6428571429; } } @media screen and (min-width: 769px) { .recruit-top .block__body { font-size: 1.6rem; line-height: 1.875; } } @media screen and (max-width: 768px) { .recruit-top .block__link { width: 20rem; } } @media screen and (min-width: 769px) { .recruit-top .block__link { width: 24rem; } } @media screen and (max-width: 768px) { .recruit-top .block__link span { font-size: 1.3rem; } } @media screen and (min-width: 769px) { .recruit-top .block:last-child .block__link { margin-top: auto; } } .recruit-top .list { display: flex; flex-direction: column; background: #fff9d6; } @media screen and (max-width: 768px) { .recruit-top .list { gap: 1.5rem; padding-top: 2rem; padding-left: 2rem; padding-bottom: 2rem; } } @media screen and (min-width: 769px) { .recruit-top .list { justify-content: center; gap: 3rem; height: 26rem; padding-left: 4rem; padding-right: 4rem; } } .recruit-top .list__item { display: flex; align-items: center; } @media screen and (max-width: 768px) { .recruit-top .list__item { gap: 1rem; } } @media screen and (min-width: 769px) { .recruit-top .list__item { gap: 2rem; } } @media screen and (max-width: 768px) { .recruit-top .list__item img { width: 2.3rem; } } @media screen and (min-width: 769px) { .recruit-top .list__item img { width: 4.2rem; } } .recruit-top .list__item span { font-weight: bold; } @media screen and (max-width: 768px) { .recruit-top .list__item span { font-size: 1.25rem; } } @media screen and (min-width: 769px) { .recruit-top .list__item span { font-size: 2rem; } } @media screen and (max-width: 768px) { .recruit-top .list__item:nth-child(3) img { width: 2rem; } } @media screen and (min-width: 769px) { .recruit-top .list__item:nth-child(3) img { width: 3.7rem; } } .recruit-top .sign { position: absolute; } .recruit-top .sign:after { content: ""; display: block; width: 50vw; background: #858585; border-color: #545454; position: absolute; } @media screen and (max-width: 768px) { .recruit-top .sign:after { height: 1.35rem; border-width: 3rem; top: calc(50% - 0.675rem); } } @media screen and (min-width: 769px) { .recruit-top .sign:after { height: 1.8rem; border-width: 3.9rem; top: calc(50% - 0.9rem); } } @media screen and (max-width: 768px) { .recruit-top .sign[data-type=sign1] { width: 6rem; top: 12.5rem; left: calc(50% + 10.25rem); } } @media screen and (min-width: 769px) { .recruit-top .sign[data-type=sign1] { width: 8rem; top: 12rem; left: calc(50% + 47.5rem); } } .recruit-top .sign[data-type=sign1]:after { border-left-style: solid; } @media screen and (max-width: 768px) { .recruit-top .sign[data-type=sign1]:after { left: calc(50% + 0.7rem); } } @media screen and (min-width: 769px) { .recruit-top .sign[data-type=sign1]:after { left: calc(50% + 1rem); } } @media screen and (max-width: 768px) { .recruit-top .sign[data-type=sign2] { width: 4.6rem; left: calc(50% + 11.25rem); bottom: 31.5rem; } } @media screen and (min-width: 769px) { .recruit-top .sign[data-type=sign2] { width: 6.2rem; left: calc(50% + 49rem); bottom: 11rem; } } .recruit-top .sign[data-type=sign2]:after { border-left-style: solid; } @media screen and (max-width: 768px) { .recruit-top .sign[data-type=sign2]:after { border-left-width: 2.3rem; left: calc(50% + 0.9rem); } } @media screen and (min-width: 769px) { .recruit-top .sign[data-type=sign2]:after { left: calc(50% + 1.2rem); } } @media screen and (max-width: 768px) { .recruit-top .sign[data-type=sign3] { width: 8.9rem; left: calc(50% + 8.25rem); bottom: 14.3rem; } } @media screen and (min-width: 769px) { .recruit-top .sign[data-type=sign3] { width: 10.3rem; left: calc(50% + 46.4rem); bottom: -1.5rem; } } @media screen and (max-width: 768px) { .recruit-top .sign[data-type=sign3]:after { border-left-style: solid; border-left-width: 0.6rem; left: 100%; } } @media screen and (min-width: 769px) { .recruit-top .sign[data-type=sign3]:after { border-left-style: solid; border-left-width: 0.8rem; left: 100%; z-index: -1; } } .recruit-top .sign img { position: relative; z-index: 1; } /* 選べる働き方 */ .workstyle { background: #fff9d6; border: solid #ffd700; position: relative; } @media screen and (max-width: 768px) { .workstyle { border-width: 1rem; border-radius: 7rem; padding-top: 7rem; margin-top: 10rem; } } @media screen and (min-width: 769px) { .workstyle { border-width: 2rem; border-radius: 14rem; padding-top: 10rem; margin-top: 13rem; } } @media screen and (min-width: 769px) { .workstyle .title--section { align-items: center; } } @media screen and (max-width: 768px) { .workstyle .body { margin-top: 2.5rem; } } @media screen and (min-width: 769px) { .workstyle .body { margin-top: 4rem; } } .workstyle .block__inner { display: flex; flex-direction: column; align-items: center; position: relative; } @media screen and (max-width: 768px) { .workstyle .block__inner { gap: 1.5rem; height: 44.5rem; } } @media screen and (min-width: 769px) { .workstyle .block__inner { gap: 2rem; height: 53rem; } } .workstyle .block__inner:before { content: ""; display: block; height: 100%; background: #adadad; position: absolute; top: 0; } @media screen and (max-width: 768px) { .workstyle .block__inner:before { width: 2.75rem; left: calc(50% - 1.375rem); } } @media screen and (min-width: 769px) { .workstyle .block__inner:before { width: 3.3rem; left: calc(50% - 1.65rem); } } .workstyle .block__link { display: block; border: solid #d6d6d6; background: #049943; position: relative; } @media screen and (max-width: 768px) { .workstyle .block__link { width: 30rem; height: 22.4rem; border-width: 0.5rem; border-radius: 1rem; } } @media screen and (min-width: 769px) { .workstyle .block__link { width: 36rem; height: 27rem; border-width: 0.6rem; border-radius: 0.6rem; transition-duration: 300ms; } } .workstyle .block__link:after { content: ""; display: block; background: #545454; position: absolute; } @media screen and (max-width: 768px) { .workstyle .block__link:after { width: 2.75rem; height: 0.7rem; top: calc(100% + 0.5rem); left: calc(50% - 1.375rem); } } @media screen and (min-width: 769px) { .workstyle .block__link:after { width: 3.3rem; height: 0.5rem; top: calc(100% + 0.6rem); left: calc(50% - 1.65rem); } } .workstyle .block__link .image { position: absolute; left: 0; bottom: 0; z-index: 1; } .workstyle .block__link .text-image { position: absolute; } @media screen and (max-width: 768px) { .workstyle .block__link .text-image { top: 2rem; right: 1rem; } } @media screen and (min-width: 769px) { .workstyle .block__link .text-image { top: 2.5rem; right: 1.5rem; } } .workstyle .block__link .icon { display: flex; align-items: center; justify-content: center; background: #ff7a39; border-radius: 100%; position: absolute; right: 1.5rem; bottom: 1.5rem; } @media screen and (max-width: 768px) { .workstyle .block__link .icon { width: 4.2rem; height: 4.2rem; } } @media screen and (min-width: 769px) { .workstyle .block__link .icon { width: 5rem; height: 5rem; transition-duration: 300ms; } } .workstyle .block__link .icon svg { fill: #fff; } @media screen and (max-width: 768px) { .workstyle .block__link .icon svg { height: 1.25rem; } } @media screen and (min-width: 769px) { .workstyle .block__link .icon svg { height: 1.5rem; transition-duration: 300ms; } } @media screen and (min-width: 769px) { .workstyle .block__link:hover { background: #ff7a39; } .workstyle .block__link:hover .icon { background: #fff; } .workstyle .block__link:hover .icon svg { fill: #ff7a39; } } .workstyle .block__title, .workstyle .block__body { display: flex; align-items: center; justify-content: center; color: #049943; font-weight: bold; border: solid #d6d6d6; position: relative; } @media screen and (max-width: 768px) { .workstyle .block__title, .workstyle .block__body { border-width: 0.5rem; border-radius: 1rem; } } @media screen and (min-width: 769px) { .workstyle .block__title, .workstyle .block__body { border-width: 0.6rem; border-radius: 1.2rem; } } .workstyle .block__title:after, .workstyle .block__body:after { content: ""; display: block; background: #545454; position: absolute; } @media screen and (max-width: 768px) { .workstyle .block__title:after, .workstyle .block__body:after { width: 2.75rem; height: 0.7rem; top: calc(100% + 0.5rem); left: calc(50% - 1.375rem); } } @media screen and (min-width: 769px) { .workstyle .block__title:after, .workstyle .block__body:after { width: 3.3rem; height: 0.5rem; top: calc(100% + 0.6rem); left: calc(50% - 1.65rem); } } .workstyle .block__title { letter-spacing: 0.06em; background: #ffd700; } @media screen and (max-width: 768px) { .workstyle .block__title { width: 25rem; height: 5.4rem; font-size: 2rem; } } @media screen and (min-width: 769px) { .workstyle .block__title { width: 30rem; height: 6.5rem; font-size: 2.4rem; } } .workstyle .block__body { display: flex; align-items: center; justify-content: space-between; width: 100%; background: #fff; } @media screen and (max-width: 768px) { .workstyle .block__body { max-width: 30rem; padding: 1rem 2rem; } } @media screen and (min-width: 769px) { .workstyle .block__body { min-width: 20rem; padding: 2rem 2rem 1.5rem; } } .workstyle .block__body .text:not(:first-child)::before { content: ""; display: block; height: 70%; background: #049943; margin: auto; position: absolute; top: 0; left: 0; right: 0; bottom: 0; transform: rotate(20deg); } @media screen and (max-width: 768px) { .workstyle .block__body .text:not(:first-child)::before { width: 0.1rem; } } @media screen and (min-width: 769px) { .workstyle .block__body .text:not(:first-child)::before { width: 0.2rem; } } @media screen and (max-width: 768px) { .workstyle .block__body .text .name { font-size: 1.4rem; line-height: 1.5; } } @media screen and (min-width: 769px) { .workstyle .block__body .text .name { font-size: 1.7rem; line-height: 1.4705882353; } } @media screen and (max-width: 768px) { .workstyle .block__body .text .role { font-size: 1.2rem; line-height: 1.5; } } @media screen and (min-width: 769px) { .workstyle .block__body .text .role { font-size: 1.4rem; line-height: 1.5; } } @media screen and (max-width: 768px) { .workstyle .block[data-index="1"] .text-image { width: 8.5rem; } } @media screen and (min-width: 769px) { .workstyle .block[data-index="1"] .text-image { width: 10rem; } } @media screen and (max-width: 768px) { .workstyle .block[data-index="2"] .text-image { width: 8.5rem; } } @media screen and (min-width: 769px) { .workstyle .block[data-index="2"] .text-image { width: 10rem; } } .workstyle .block[data-index="2"] .block__body { justify-content: center; } @media screen and (max-width: 768px) { .workstyle .block[data-index="2"] .block__body { max-width: 17rem; } } @media screen and (min-width: 769px) { .workstyle .block[data-index="2"] .block__body { width: unset; } } @media screen and (max-width: 768px) { .workstyle .block[data-index="3"] .text-image { width: 9.5rem; } } @media screen and (min-width: 769px) { .workstyle .block[data-index="3"] .text-image { width: 11.5rem; } } .workstyle .slick-arrow { width: 2rem; height: 5.2rem; font-size: 0; background: #333; margin: auto; position: absolute; top: 0; bottom: 0; z-index: 1; } .workstyle .slick-arrow:after { content: ""; display: block; width: 0.8rem; height: 1.4rem; background: url("/assets/image/icons/arrow.svg") no-repeat center center; margin: auto; position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .workstyle .slick-prev { border-top-right-radius: 0.5rem; border-bottom-right-radius: 0.5rem; left: -1rem; } .workstyle .slick-prev:after { transform: translateX(-0.25rem) rotate(180deg); } .workstyle .slick-next { border-top-left-radius: 0.5rem; border-bottom-left-radius: 0.5rem; right: -1rem; } .workstyle .slick-next:after { transform: translateX(0.25rem); } .workstyle .slick-track { max-width: unset; } @media screen and (min-width: 769px) { .workstyle .slick-track { display: flex; justify-content: center; gap: 3rem; } } @media screen and (min-width: 769px) { .workstyle .slick-slide { width: 36rem !important; } } /* 仕事紹介 */ .job { padding-top: 7rem; position: relative; } @media screen and (min-width: 769px) { .job { margin-bottom: 25rem; } } .job:before { content: ""; position: absolute; z-index: -1; } @media screen and (max-width: 768px) { .job:before { width: 171.9rem; height: 173rem; background-image: url("/assets/image/top/job_bg_sp.png"); background-size: 100%; top: -11.5rem; left: calc(50% - 89.2rem); } } @media screen and (min-width: 769px) { .job:before { width: 214.6rem; height: 203.6rem; background-image: url("/assets/image/top/job_bg_pc.png"); background-size: 100%; top: -38rem; right: calc(50% - 46.5rem); } } .job .head { margin-left: auto; margin-right: auto; } @media screen and (max-width: 768px) { .job .head { width: 23.5rem; transform: translateX(4rem); } } @media screen and (min-width: 769px) { .job .head { display: flex; align-items: center; justify-content: center; gap: 8rem; } } @media screen and (max-width: 768px) { .job .lead { font-size: 1.4rem; line-height: 1.6428571429; margin-top: 2.5rem; } } @media screen and (min-width: 769px) { .job .lead { font-size: 1.6rem; line-height: 1.875; } } .job .body { display: flex; justify-content: space-between; margin-left: auto; margin-right: auto; } @media screen and (max-width: 768px) { .job .body { flex-direction: column; width: 31.5rem; height: 123.4rem; margin-top: 18rem; } } @media screen and (min-width: 769px) { .job .body { flex-direction: row-reverse; align-items: flex-start; width: 102.4rem; height: 94rem; margin-top: 6rem; } } .job .block { background: #d7efe1; } @media screen and (max-width: 768px) { .job .block { width: 23.75rem; } } @media screen and (min-width: 769px) { .job .block { width: 42rem; } } .job .block:last-child { position: relative; align-self: flex-end; } .job .block:last-child:before { content: ""; display: block; background: url("/assets/image/top/job_sign04.png"); background-size: contain; position: absolute; } @media screen and (max-width: 768px) { .job .block:last-child:before { width: 6rem; height: 14.2rem; top: -14.2rem; left: 1rem; } } @media screen and (min-width: 769px) { .job .block:last-child:before { width: 7rem; height: 16.6rem; top: -16rem; right: 3.2rem; z-index: -1; } } @media screen and (max-width: 768px) { .job .block__body { padding: 1.5rem 2.5rem 3rem; } } @media screen and (min-width: 769px) { .job .block__body { padding: 3rem 5rem 4rem; } } .job .block__title { display: flex; flex-direction: column; align-items: center; } @media screen and (max-width: 768px) { .job .block__title { gap: 0.5rem; } } @media screen and (min-width: 769px) { .job .block__title { gap: 1rem; max-width: unset; margin-left: -5rem; margin-right: -5rem; } } .job .block__title__jp { font-weight: bold; } @media screen and (max-width: 768px) { .job .block__title__jp { font-size: 1.8rem; text-align: center; line-height: 1.3611111111; letter-spacing: 0.06em; } } @media screen and (min-width: 769px) { .job .block__title__jp { font-size: 2.4rem; letter-spacing: 0.06em; } } .job .block__title__en { color: #049943; font-weight: bold; } @media screen and (max-width: 768px) { .job .block__title__en { font-size: 1.25rem; } } @media screen and (min-width: 769px) { .job .block__title__en { font-size: 1.6rem; } } @media screen and (max-width: 768px) { .job .block__text { font-size: 1.35rem; line-height: 1.7037037037; margin-top: 2rem; } } @media screen and (min-width: 769px) { .job .block__text { font-size: 1.6rem; line-height: 1.875; margin-top: 3rem; } } .job .block__link { margin-left: auto; } @media screen and (max-width: 768px) { .job .block__link { width: 11.5rem; margin-top: 1rem; } } @media screen and (min-width: 769px) { .job .block__link { width: 13.8rem; margin-top: 2rem; } } .job .sign { position: absolute; } .job .sign:after { content: ""; display: block; width: 50vw; background: #858585; border-color: #545454; position: absolute; } @media screen and (max-width: 768px) { .job .sign:after { height: 1.35rem; border-width: 3rem; top: calc(50% - 0.675rem); } } @media screen and (min-width: 769px) { .job .sign:after { height: 1.8rem; border-width: 3.9rem; top: calc(50% - 0.9rem); } } @media screen and (max-width: 768px) { .job .sign[data-type=sign1] { width: 6rem; top: 25rem; right: calc(50% + 9.75rem); } } @media screen and (min-width: 769px) { .job .sign[data-type=sign1] { width: 7.8rem; top: 42rem; right: calc(50% + 53rem); } } .job .sign[data-type=sign1]:after { border-right-style: solid; } @media screen and (max-width: 768px) { .job .sign[data-type=sign1]:after { right: calc(50% + 0.7rem); } } @media screen and (min-width: 769px) { .job .sign[data-type=sign1]:after { right: calc(50% + 1rem); } } @media screen and (max-width: 768px) { .job .sign[data-type=sign2] { width: 6rem; right: calc(50% + 9.75rem); bottom: 36.5rem; } } @media screen and (min-width: 769px) { .job .sign[data-type=sign2] { width: 7.8rem; right: calc(50% + 53rem); bottom: -3.5rem; } } .job .sign[data-type=sign2]:after { border-right-style: solid; } @media screen and (max-width: 768px) { .job .sign[data-type=sign2]:after { right: calc(50% + 0.7rem); } } @media screen and (min-width: 769px) { .job .sign[data-type=sign2]:after { right: calc(50% + 1rem); } } @media screen and (max-width: 768px) { .job .sign[data-type=sign3] { width: 8.9rem; left: calc(50% + 4.25rem); bottom: 62.5rem; } } @media screen and (min-width: 769px) { .job .sign[data-type=sign3] { width: 11.6rem; left: calc(50% - 6rem); bottom: 10rem; } } @media screen and (max-width: 768px) { .job .sign[data-type=sign3]:after { border-left-style: solid; border-left-width: 0.8rem; left: 100%; } } @media screen and (min-width: 769px) { .job .sign[data-type=sign3]:after { width: 100%; border-right-style: solid; border-right-width: 0.6rem; right: 100%; z-index: -1; } } .job .sign img { position: relative; z-index: 1; } /* Q&A */ .q-and-a { width: calc(100% - 3rem - 3rem); max-width: 102.4rem; background: #fff9d6; margin-left: auto; margin-right: auto; position: relative; } @media screen and (max-width: 768px) { .q-and-a { padding: 7rem 3.5rem 3.5rem 4.5rem; margin-top: 5.5rem; } } @media screen and (min-width: 769px) { .q-and-a { display: grid; grid-template-columns: 16rem auto; grid-column-gap: 10rem; padding-top: 10rem; padding-left: 17rem; padding-bottom: 8rem; } } @media screen and (min-width: 769px) { .q-and-a .title--section { grid-row: 1/span 3; } .q-and-a .title--section__en { font-size: 5.7rem; } .q-and-a .title--section__en:before { width: 6rem; top: -2rem; left: -2rem; } } @media screen and (max-width: 768px) { .q-and-a .lead { font-size: 1.4rem; line-height: 1.6428571429; margin-top: 2.5rem; } } @media screen and (min-width: 769px) { .q-and-a .lead { font-size: 1.6rem; line-height: 1.875; } } @media screen and (max-width: 768px) { .q-and-a .link { width: 12rem; margin-top: 2rem; margin-left: auto; margin-right: auto; } } @media screen and (min-width: 769px) { .q-and-a .link { width: 13.8rem; margin-top: 4rem; } } .q-and-a .image { position: absolute; } @media screen and (max-width: 768px) { .q-and-a .image { width: 6rem; right: -0.4rem; bottom: -0.8rem; } } @media screen and (min-width: 769px) { .q-and-a .image { width: 7.8rem; right: 3.3rem; bottom: 4.8rem; } } .q-and-a .image img { position: relative; z-index: 1; } .q-and-a .image:after { content: ""; display: block; background: #858585; border-left: solid #545454; position: absolute; } @media screen and (max-width: 768px) { .q-and-a .image:after { width: 100%; height: 1.4rem; border-left-width: 3rem; top: calc(50% - 0.7rem); left: calc(50% + 0.5rem); } } @media screen and (min-width: 769px) { .q-and-a .image:after { width: 1000%; height: 1.8rem; border-left-width: 3.9rem; top: calc(50% - 0.9rem); left: calc(50% + 0.7rem); } }