@charset "UTF-8"; @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;700&display=swap"); @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 400; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Regular.woff2) format("woff2"), url(/fonts/LIFULLFONT-Regular.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 700; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Bold.woff2) format("woff2"), url(/fonts/LIFULLFONT-Bold.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 900; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Heavy.woff2) format("woff2"), url(/fonts/LIFULLFONT-Heavy.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } /*** The new CSS reset - version 1.8.4 (last updated 14.2.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 */ *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *, .no-unset *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { -webkit-box-sizing: border-box; box-sizing: border-box; } :root { font-size: calc(100vw * 10 / 375) } @media (min-width: 768px) { :root { font-size: calc(100vw * 10 / 1440) } } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu { list-style: none; } /* For images to not be able to exceed their container */ img { max-inline-size: 100%; max-block-size: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ 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; } /* reset default text opacity of input placeholder */ ::-webkit-input-placeholder { color: unset; } ::-moz-placeholder { color: unset; } :-ms-input-placeholder { color: unset; } ::-ms-input-placeholder { color: unset; } ::placeholder { color: unset; } /* remove default dot (•) sign */ ::marker { content: initial; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable=false])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -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; } html { font-size: 62.5%; font-family: "Montserrat", sans-serif; font-weight: 400; } body { font-size: 1.6rem; line-height: 1.7; color: #1f1f1f; } body img { width: 100%; height: auto; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 400; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Regular.woff2) format("woff2"), url(/fonts/LIFULLFONT-Regular.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 700; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Bold.woff2) format("woff2"), url(/fonts/LIFULLFONT-Bold.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 900; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Heavy.woff2) format("woff2"), url(/fonts/LIFULLFONT-Heavy.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 400; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Regular.woff2) format("woff2"), url(/fonts/LIFULLFONT-Regular.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 700; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Bold.woff2) format("woff2"), url(/fonts/LIFULLFONT-Bold.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 900; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Heavy.woff2) format("woff2"), url(/fonts/LIFULLFONT-Heavy.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } header { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 2.6666666667vw 0 2.6666666667vw 1.3333333333vw; position: fixed; top: 0; left: 0; min-height: 17.3333333333vw; z-index: 5; background: #FFF; } header .HeaderLogo { width: 66.6666666667vw; } header .HeaderLogo a { display: block; line-height: 0; } header .HeaderNav { width: 100vw; overflow: hidden; z-index: 10; } header .HeaderNav::before { content: ""; background: #FFAB00; width: 40vw; height: 40vw; border-radius: 20vw; position: fixed; top: -20vw; right: -20vw; z-index: 0; opacity: 0; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: all 0.5s ease-in; transition: all 0.5s ease-in; } header .HeaderNav__Btn { width: 3.2rem; height: 3.2rem; background: url('/assets/img/icons/menuOpen.svg'); background-size: 100% 100%; position: absolute; top: 50%; right: 1.6rem; z-index: 20; margin-top: -1.6rem; transition: all 0.3s ease } header .HeaderNav__Inner { opacity: 0; height: 0; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 24vw 0; -webkit-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } header .HeaderNav__Inner--logo { display: none; width: 84vw; } header .HeaderNav__Nav { display: none; } header .HeaderNav.nav-open::before { -webkit-transform: scale(15); transform: scale(15); background: #fff; position: fixed; right: 0; bottom: 0; overflow: hidden; opacity: 1; -webkit-transition: all 0.5s ease-in; transition: all 0.5s ease-in; z-index: 10; } header .HeaderNav.nav-open .HeaderNav__Btn { background: url('/assets/img/icons/menuClose.svg'); } header .HeaderNav.nav-open .HeaderNav__Wrap { width: 100vw; height: 100vh; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 15; } header .HeaderNav.nav-open .HeaderNav__Inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; opacity: 1; -webkit-transition: all 0.3s ease-in; transition: all 0.3s ease-in; z-index: 15; width: 100vw; height: 100vw; } header .HeaderNav.nav-open .HeaderNav__Inner--logo { display: block; } header .HeaderNav.nav-open .HeaderNav__Nav { position: relative; font-family: LIFULLFONT, sans-serif; font-weight: 700; text-align: center; display: block; } header .HeaderNav.nav-open .HeaderNav__Nav::before { content: ""; width: 84vw; height: 84vw; border-radius: 42.6666666667vw; background-image: url(../img/common/bg_dot_orange.svg); background-position: left top; background-size: 3.2vw 3.2vw; background-repeat: repeat; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } header .HeaderNav.nav-open .HeaderNav__Nav ul { position: relative; } header .HeaderNav.nav-open .HeaderNav__Nav a { display: block; padding: 5.3333333333vw; font-size: 30px; font-size: 8vw; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 400; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Regular.woff2) format("woff2"), url(/fonts/LIFULLFONT-Regular.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 700; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Bold.woff2) format("woff2"), url(/fonts/LIFULLFONT-Bold.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 900; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Heavy.woff2) format("woff2"), url(/fonts/LIFULLFONT-Heavy.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } footer { background: #ED6103; color: #fff; position: fixed; bottom: 0; left: 0; width: 100vw; z-index: 1; } .FooterInner { padding: 0 8vw; color: #fff; } .FooterInner__Top { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 5.3333333333vw 0; border-bottom: 1px solid #fff; padding: 8vw 0; } .FooterInner__Top--logo { width: 72vw; margin: 0 auto; } .FooterInner__Top--link { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } .FooterInner__Top--link a { font-family: LIFULLFONT, sans-serif; font-weight: 700; font-size: 20px; font-size: 5.3333333333vw; display: block; padding: 10px 0; } .FooterInner__Top--link li:last-child img { width: 8vw; } .FooterInner__Bottom { padding: 8vw 0 5.3333333333vw; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10.6666666667vw 0; } .FooterInner__Bottom--info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2.6666666667vw 0; font-size: 14px; font-size: 3.7333333333vw; } .FooterInner__Bottom--copy { text-align: center; font-size: 11px; font-size: 2.9333333333vw; } main { z-index: 2; background: #fff; position: relative; } section h1, section h2, section h3 { font-family: LIFULLFONT, sans-serif; font-weight: 900; line-height: 1.1; color: #ED6103; } section h1 { font-size: 80px; font-size: 21.3333333333vw; } section h2 { font-size: 48px; font-size: 12.8vw; line-height: 1.2; margin-bottom: 5.3333333333vw; } section h3 { font-size: 30px; font-size: 8vw; } section .rounded, section .rounded img { border-radius: 5.3333333333vw; } section .text-wrap p { font-size: 14px; font-size: 3.7333333333vw; } section .btn-item .btn, section .btn-item a { /* width: 46.6666666667vw; */ height: 6.4rem; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: #ED6103; color: #fff; font-family: LIFULLFONT, sans-serif; font-weight: 900; font-size: 1.6rem; line-height: 3.2rem; text-align: right; padding: 1.6rem 3.2rem; margin-left: auto; border-radius: 0.8rem; gap: 0.8rem; -webkit-gap: 0.8rem; } section .btn-item .btn::after section .btn-item a::after { content: ""; display: block; width: 2.4rem; height: 2.4rem; background: url(/assets/img/icons/arrow_right.svg) center center/contain no-repeat; } section .btn-item .btn:hover, section .btn-item a:hover { background-color: #D24E00; } section .btn-item .btn:focus, section .btn-item a:focus { box-shadow: 0 0 0 2px #fff, 0 0 0 4px #236DDA } section .img-inn { position: relative; overflow: hidden; } section .img-inn::after { content: ""; display: block; width: 100%; height: 100%; background: #ED6103; position: absolute; top: 0; left: 0; bottom: 0; right: 0; z-index: 1; -webkit-transition: all 0.5s ease-out; transition: all 0.5s ease-out; } section .img-inn.show::after { -webkit-transform: translateX(-100%); transform: translateX(-100%); } section .img-inn.left-to-right.show::after { -webkit-transform: translateX(100%); transform: translateX(100%); } section .img-inn.top-to-bottom::after { background: #F7F7F7; } section .img-inn.top-to-bottom.show { -webkit-transform: translateY(-100%); transform: translateY(-100%); } .LoadingArea { width: 100vw; height: 100vh; background: #fff; text-align: center; position: fixed; left: 0; top: 0; z-index: 99; } .LoadingArea__Bar { width: 100vw; height: 0%; background: #ED6103; border-radius: 50vw 50vw 0 0; position: absolute; bottom: 0; left: 0; z-index: 1; } .LoadingArea__Inn { position: relative; width: 100vw; height: 100%; padding: 0 8vw; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; z-index: 10; } .LoadingArea.appear .LoadingArea__Bar { -webkit-animation: forwards 1s ease-in-out; animation: forwards 1s ease-in-out; -webkit-animation-name: pageAnime-sp; animation-name: pageAnime-sp; } @-webkit-keyframes pageAnime-sp { 0% { -webkit-transform-origin: bottom; transform-origin: bottom; -webkit-transform: scaleY(0); transform: scaleY(0); } 50% { -webkit-transform-origin: bottom; transform-origin: bottom; -webkit-transform: scaleY(1); transform: scaleY(1); } 50.001% { -webkit-transform-origin: top; transform-origin: top; } 100% { -webkit-transform-origin: top; transform-origin: top; -webkit-transform: scaleY(0); transform: scaleY(0); } } @keyframes pageAnime-sp { 0% { -webkit-transform-origin: bottom; transform-origin: bottom; -webkit-transform: scaleY(0); transform: scaleY(0); } 50% { -webkit-transform-origin: bottom; transform-origin: bottom; -webkit-transform: scaleY(1); transform: scaleY(1); } 50.001% { -webkit-transform-origin: top; transform-origin: top; } 100% { -webkit-transform-origin: top; transform-origin: top; -webkit-transform: scaleY(0); transform: scaleY(0); } } .LoadingArea.appear .LoadingArea__Inn { display: none; } .PageKeyVisual__Heading { position: relative; } .PageKeyVisual__Heading h1 { position: relative; z-index: 5; } .PageKeyVisual__Heading--bg { width: 80vw; height: 80vw; border-radius: 40vw; position: absolute; background-image: url(../img/common/bg_dot_orange.svg); background-position: left top; background-size: 3.2vw 3.2vw; background-repeat: repeat; z-index: 1; } .PageKeyVisual__Img { position: relative; z-index: 1; } .PageKeyVisual__Img--img01 { width: 81.3333333333vw; } .PageKeyVisual__Img--img02 { width: 57.3333333333vw; margin-top: -9.3333333333vw; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 400; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Regular.woff2) format("woff2"), url(/fonts/LIFULLFONT-Regular.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 700; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Bold.woff2) format("woff2"), url(/fonts/LIFULLFONT-Bold.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 900; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Heavy.woff2) format("woff2"), url(/fonts/LIFULLFONT-Heavy.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 400; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Regular.woff2) format("woff2"), url(/fonts/LIFULLFONT-Regular.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 700; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Bold.woff2) format("woff2"), url(/fonts/LIFULLFONT-Bold.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 900; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Heavy.woff2) format("woff2"), url(/fonts/LIFULLFONT-Heavy.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } .policy-content { min-height: calc(100vh - 140px); text-align: left !important; } .policy-content ol { padding-left: 1.6rem; } .policy-content > ol { list-style-type: decimal; } .policy-content > ol > li > ol { list-style-type: lower-latin; } .policy-content > ol > li > ol > li > ol { list-style-type: lower-roman; } .form__checkbox a{ color: #ED6103 } @media (min-width: 768px) { header { padding: 1.8055555556vw 4.1666666667vw; width: 100vw; max-width: 100vw; min-height: 8.6805555556vw; overflow-x: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } header .HeaderLogo { width: 29.1666666667vw; } header .HeaderNav { width: auto; margin-left: auto; } header .HeaderNav::before { content: none; } header .HeaderNav__Btn { display: none; } header .HeaderNav__Inner { opacity: 1; position: static; -webkit-transform: none; transform: none; height: auto; } header .HeaderNav__Inner--logo { display: none; } header .HeaderNav__Nav { margin-left: auto; display: block; font-family: 'LIFULLFONT' } header .HeaderNav__Nav ul { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; gap: 0 4.1666666667vw; } header .HeaderNav__Nav a { font-size: 18px; font-size: 1.25vw; font-weight: 700; padding: 0; -webkit-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } header .HeaderNav__Nav a:hover { color: #ED6103; -webkit-transition: all 0.3s ease-in; transition: all 0.3s ease-in; } } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 400; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Regular.woff2) format("woff2"), url(/fonts/LIFULLFONT-Regular.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 700; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Bold.woff2) format("woff2"), url(/fonts/LIFULLFONT-Bold.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @font-face { font-family: "LIFULLFONT"; font-style: normal; font-weight: 900; font-display: swap; src: local("LIFULLFONT"), url(/assets/fonts/LIFULLFONT-Heavy.woff2) format("woff2"), url(/fonts/LIFULLFONT-Heavy.woff) format("woff"); unicode-range: U+21-3B, U+3D, U+3F-5B, U+5D, U+5F, U+61-7B, U+7D, U+AB, U+F7, U+2260, U+2264, U+2265; } @media (min-width: 768px) { .FooterInner { padding: 0 8.3333333333vw; } .FooterInner__Top { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; gap: 0; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 4.1666666667vw 0 1.5277777778vw; } .FooterInner__Top--logo { width: 44.8611111111vw; margin: 0; } .FooterInner__Top--link { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; gap: 0 4.1666666667vw; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .FooterInner__Top--link a { font-size: 20px; font-size: 1.3888888889vw; padding: 0; } .FooterInner__Top--link li:last-child a { line-height: 0; } .FooterInner__Top--link li:last-child img { width: 2.0833333333vw; } .FooterInner__Bottom { padding: 4.1666666667vw 0; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; gap: 0; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } .FooterInner__Bottom--info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0.2083333333vw 0; font-size: 16px; font-size: 1.1111111111vw; } .FooterInner__Bottom--copy { text-align: right; font-size: 12px; font-size: 0.8333333333vw; } } @media (min-width: 768px) { section h1 { font-size: 140px; font-size: 7.6vw; } section h2 { font-size: 90px; font-size: 6.25vw; margin-bottom: 2.0833333333vw; } section h3 { font-size: 60px; font-size: 4.1666666667vw; } section .rounded, section .rounded img { border-radius: 2.7777777778vw; } section .text-wrap p { font-size: 16px; font-size: 1.1111111111vw; } section .btn-item .btn, section .btn-item a { height: 6.4rem; display: -webkit-box; display: -ms-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 0.8rem; -webkit-gap: 0.8rem; font-size: 1.6rem; line-height: 3.2rem; border-radius: 0.8rem; padding: 1.6rem 3.2rem 1.6rem 4rem; -webkit-transition: all 0.3s ease-in; transition: all 0.3s ease-in; position: relative; } section .btn-item .btn::after, section .btn-item a::after { content: ""; display: block; width: 2.4rem; height: 2.4rem; background: url(/assets/img/icons/arrow_right.svg) center center/contain no-repeat; } section .btn-item .btn:hover, section .btn-item a:hover { background-color: #D24E00; } section .btn-item .btn:focus, section .btn-item a:focus { box-shadow: 0 0 0 2px #fff, 0 0 0 4px #236DDA } .LoadingArea__Bar { width: 0; height: 100vh; border-radius: 0 50vw 50vw 0; } .LoadingArea__Inn { padding: 0; } .LoadingArea__Inn img { max-width: 30vw; } .LoadingArea.appear .LoadingArea__Bar { -webkit-animation: forwards 1s ease-in-out; animation: forwards 1s ease-in-out; -webkit-animation-name: pageAnime-pc; animation-name: pageAnime-pc; } @-webkit-keyframes pageAnime-pc { 0% { -webkit-transform-origin: left; transform-origin: left; -webkit-transform: scaleX(0); transform: scaleX(0); } 50% { -webkit-transform-origin: left; transform-origin: left; -webkit-transform: scaleX(1); transform: scaleX(1); } 50.001% { -webkit-transform-origin: right; transform-origin: right; } 100% { -webkit-transform-origin: right; transform-origin: right; -webkit-transform: scaleX(0); transform: scaleX(0); } } @keyframes pageAnime-pc { 0% { -webkit-transform-origin: left; transform-origin: left; -webkit-transform: scaleX(0); transform: scaleX(0); } 50% { -webkit-transform-origin: left; transform-origin: left; -webkit-transform: scaleX(1); transform: scaleX(1); } 50.001% { -webkit-transform-origin: right; transform-origin: right; } 100% { -webkit-transform-origin: right; transform-origin: right; -webkit-transform: scaleX(0); transform: scaleX(0); } } .PageKeyVisual { width: 100vw; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; } .PageKeyVisual__Heading { position: absolute; top: 25vw; left: 8.3333333333vw; padding: 0; } .PageKeyVisual__Heading--bg { width: 20.8333333333vw; height: 20.8333333333vw; background-size: 1.0416666667vw 1.0416666667vw; } .PageKeyVisual__Img { margin-left: auto; position: relative; } .PageKeyVisual__Img--img01 { width: 37.5vw; } .PageKeyVisual__Img--img02 { width: 25vw; } }