@charset "UTF-8"; /*** 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 *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { -webkit-box-sizing: border-box; box-sizing: border-box; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu { list-style: none; } /* For images to not be able to exceed their container */ img { max-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; } [type=checkbox] { -webkit-appearance: checkbox; -moz-appearance: checkbox; appearance: checkbox; } [type=radio] { -webkit-appearance: radio; -moz-appearance: radio; appearance: radio; } /* 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; } /* add original reset style */ html { /* iPhone safariで文字サイズが大きくなるバグを回避 */ -webkit-text-size-adjust: 100%; } html { scroll-behavior: smooth; font-size: clamp(50%, 0.9vw, 62.5%); scrollbar-gutter: stable; } @media screen and (max-width: 768px) { html { font-size: 62.5%; } } body { line-height: 1; font-family: "Noto Sans JP", Meiryo, メイリオ, Osaka, sans-serif; color: #000; font-size: clamp(1.2rem, 3.2vw, 1.6rem); font-weight: normal; overflow-x: hidden; } body.fixed { overflow: hidden; } a { text-decoration: none; } img { max-width: 100%; width: 100%; vertical-align: bottom; } _::-webkit-full-page-media, _:future, :root * { -webkit-mask-image: none !important; mask-image: none !important; } input[name=tab-item] { display: none; } area { cursor: pointer; } .c-list li { position: relative; padding-left: 1em; } .c-list li::before { position: absolute; top: 0; left: 0; display: inline-block; } .c-list-disc li { padding-left: 1em; text-indent: -1em; } .c-list-disc li::before { content: "・"; } .c-list-circle li::before { content: "●"; } .c-list-asterisk li::before { content: "※"; } .c-list-decimal li { counter-increment: cnt; } .c-list-decimal li::before { content: "" counter(cnt) "."; } .c-list-arrow li { padding-left: 1.1em; } .c-list-arrow li::before { content: ""; display: inline-block; top: 0.55em; width: 0.9rem; height: 0.9rem; border-top: 0.2rem solid #ee1132; border-right: 0.2rem solid #ee1132; -webkit-transform: rotate(45deg); transform: rotate(45deg); } @media screen and (max-width: 500px) { .c-list-arrow li::before { width: 0.7rem; height: 0.7rem; } } .c-text-indent { text-indent: 1em; } .c-text-underline { text-decoration: underline; } .c-text-light { font-weight: 300; } .c-text-regular { font-weight: 400; } .c-text-semibold { font-weight: 600; } .c-text-bold { font-weight: 700; } .c-text-underline { text-decoration: underline; } .c-text-italic { font-style: italic; } .c-text-caution { color: #de0012; } .c-text-asterisk { text-indent: -1em; padding-left: 1em; display: block; } .c-text-asterisk::before { content: "※"; margin-right: 0.1em; } .c-inner { max-width: 128rem; width: 100%; margin: 0 auto; padding: 0 2rem; } .c-details summary { cursor: pointer; display: block; } .c-details summary::-webkit-details-marker { display: none; } .c-hamburger { width: 5rem; -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; position: relative; text-align: center; cursor: pointer; } @media screen and (max-width: 768px) { .c-hamburger { width: 4rem; } } .c-hamburger:hover { color: #333333; } .c-hamburger:hover .c-hamburger__bar { background-color: #333333; } .c-hamburger p { font-family: "Roboto", sans-serif; font-weight: 700; font-size: 1.6rem; letter-spacing: 0.1em; line-height: 1; -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; } @media screen and (max-width: 768px) { .c-hamburger p { display: none; } } .c-hamburger__bars { position: relative; height: 3.8rem; margin-top: 1rem; } @media screen and (max-width: 768px) { .c-hamburger__bars { margin-top: 0; height: 1.8rem; } } .c-hamburger__bar { display: block; height: 0.3rem; width: 100%; background-color: #000; position: absolute; left: 0; -webkit-transition: 0.3s; transition: 0.3s; } @media screen and (max-width: 768px) { .c-hamburger__bar { height: 0.1rem; } } .c-hamburger__bar.is_top { top: 0; } .c-hamburger__bar.is_middle { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .c-hamburger__bar.is_bottom { bottom: 0; } .c-hamburger__bar:hover { cursor: pointer; } .c-hamburger.is_active .c-hamburger__bar.is_top { top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%) rotate(30deg); transform: translate(-50%, -50%) rotate(30deg); } .c-hamburger.is_active .c-hamburger__bar.is_middle { opacity: 0; } .c-hamburger.is_active .c-hamburger__bar.is_bottom { top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%) rotate(-30deg); transform: translate(-50%, -50%) rotate(-30deg); } .c-submenu { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-column-gap: 1.2em; -moz-column-gap: 1.2em; column-gap: 1.2em; } @media screen and (max-width: 768px) { .c-submenu { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; } } @media screen and (max-width: 768px) { .c-submenu li { width: 40%; } } .c-submenu li a { display: block; color: #fff; font-size: 1.8rem; font-weight: 600; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-radius: 30rem; width: 24rem; height: 6rem; -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; } @media screen and (max-width: 768px) { .c-submenu li a { width: 100%; height: auto; padding: 0.45em 0; font-size: 1.7rem; } } .c-submenu li:first-of-type a { background-color: #000; } @media screen and (max-width: 768px) { .c-submenu li:first-of-type a { background-color: #fff; color: #000; } } .c-submenu li:first-of-type a:hover { background-color: rgb(38.25, 38.25, 38.25); } .c-submenu li:nth-of-type(2) a { background-color: #666; } .c-submenu li:nth-of-type(2) a:hover { background-color: rgb(124.95, 124.95, 124.95); } .c-gnav { position: fixed; inset: 0; z-index: 1; width: 100dvw; height: 100dvh; background-color: #fff; opacity: 0; visibility: hidden; -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; } .c-gnav.is_show { visibility: visible; opacity: 1; } .c-gnav__body { position: relative; width: 100%; height: 100%; } .c-gnav__illust { position: absolute; top: 12rem; left: 50%; z-index: 2; max-width: 85.3rem; width: 100%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } @media screen and (max-width: 768px) { .c-gnav__illust { top: 6rem; } } .c-gnav__contents { position: absolute; top: 30rem; right: 0; bottom: 0; left: 0; z-index: 1; background-color: #333; color: #fff; } @media screen and (max-width: 768px) { .c-gnav__contents { top: 32vw; } } .c-gnav__scroll { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 15rem 5rem 4rem; } @media screen and (max-width: 768px) { .c-gnav__scroll { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding: 6.5rem 3rem 4rem; } } .c-gnav__links { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; max-width: 74rem; width: 100%; -webkit-column-gap: 8rem; -moz-column-gap: 8rem; column-gap: 8rem; } @media screen and (max-width: 768px) { .c-gnav__links { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .c-gnav__list { width: 33.3333333333%; } @media screen and (max-width: 768px) { .c-gnav__list { width: 100%; } } @media screen and (max-width: 768px) { .c-gnav__list + .c-gnav__list { margin-top: 5.5rem; } } .c-gnav__list > a, .c-gnav__list > p { color: #ee1132; font-weight: 700; font-size: 2.2rem; } .c-gnav__list ul li { margin-top: 1.35em; font-weight: 500; font-size: 2rem; } .c-gnav__list ul li a span { margin-right: 1em; color: #ee1132; } .c-gnav__logo { display: none; width: 100%; margin-bottom: 6rem; } @media screen and (max-width: 768px) { .c-gnav__logo { display: block; } } @media screen and (max-width: 500px) { .c-gnav__logo { padding-left: 0; text-align: center; } } .c-gnav__logo img { width: auto; height: 3rem; } .c-gnav__submenu { display: none; margin-top: 7rem; } @media screen and (max-width: 768px) { .c-gnav__submenu { display: -webkit-box; display: -ms-flexbox; display: flex; } } .c-band::after { content: ""; position: absolute; top: 50%; left: 50%; width: 500%; height: 236rem; background: #feffd9; -webkit-transform: translate(-50%, -50%) rotate(-53deg); transform: translate(-50%, -50%) rotate(-53deg); -webkit-transform-origin: center; transform-origin: center; z-index: -1; } .c-heading { text-align: right; } .c-heading h1, .c-heading h2 { font-size: 17rem; font-weight: 700; color: #ee1132; font-family: "Roboto", sans-serif; } @media screen and (max-width: 768px) { .c-heading h1, .c-heading h2 { font-size: 5.5rem; } } .c-heading span { font-size: 2rem; font-weight: 600; display: block; color: #000; line-height: 1.4; } @media screen and (max-width: 768px) { .c-heading span { font-size: 1.5rem; } } .c-profile__position { font-size: 2rem; font-weight: 500; line-height: 1.38; } @media screen and (max-width: 768px) { .c-profile__position { font-size: 1.6rem; } } .c-profile__name { font-size: 4rem; font-weight: 600; margin-top: 0.2em; } @media screen and (max-width: 768px) { .c-profile__name { font-size: 2.4rem; } } .c-profile__name span { font-size: 1.8rem; font-family: "Roboto", sans-serif; color: #ee1132; display: block; font-weight: normal; margin-top: 0.77em; } @media screen and (max-width: 768px) { .c-profile__name span { font-size: 1.6rem; margin-top: 0.4em; } } .c-profile__join { font-size: 1.6rem; margin-top: 1em; } .js-fadein { opacity: 0; -webkit-transform: translateY(2rem); transform: translateY(2rem); -webkit-transition: opacity 1.5s ease, -webkit-transform 1.5s ease; transition: opacity 1.5s ease, -webkit-transform 1.5s ease; transition: opacity 1.5s ease, transform 1.5s ease; transition: opacity 1.5s ease, transform 1.5s ease, -webkit-transform 1.5s ease; } .js-fadein.show { opacity: 1; -webkit-transform: translateY(0); transform: translateY(0); } .l-header { position: fixed; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; top: 0; left: 0; padding: 2rem 3rem 0; z-index: 10; -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; } .l-header.is_hidden { -webkit-transform: translateY(-100%); transform: translateY(-100%); } @media screen and (max-width: 768px) { .l-header { background-color: #fff; padding: 1.5rem; } } .l-header__body { display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; z-index: 2; -webkit-column-gap: 2rem; -moz-column-gap: 2rem; column-gap: 2rem; width: 100%; } .l-header__logo img { width: auto; height: 5.9rem; } @media screen and (max-width: 768px) { .l-header__logo img { height: 3.8rem; } } .l-header__submenu { margin-left: auto; } @media screen and (max-width: 768px) { .l-header__submenu { display: none; } } .l-header__hamburger { margin-left: 5rem; } @media screen and (max-width: 768px) { .l-header__hamburger { margin-left: auto; } } .l-footer__careers { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } .l-footer__careers li { width: 32.8%; } @media screen and (max-width: 768px) { .l-footer__careers li { width: 100%; margin-top: 1rem; } } .l-footer__careers li a { 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; aspect-ratio: 420/191; color: #fff; font-size: 2.6rem; font-weight: 600; -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; } @media screen and (max-width: 768px) { .l-footer__careers li a { aspect-ratio: 335/80; font-size: 1.8rem; } } .l-footer__careers li:first-of-type a { background-color: #ee1132; } .l-footer__careers li:first-of-type a:hover { background-color: rgb(241.4, 64.6, 91); } .l-footer__careers li:nth-of-type(2) a { background-color: #ffaa01; } .l-footer__careers li:nth-of-type(2) a:hover { background-color: rgb(255, 187, 51.8); } .l-footer__careers li:nth-of-type(3) a { background-color: #997b60; } .l-footer__careers li:nth-of-type(3) a:hover { background-color: rgb(174.4987951807, 149.3421686747, 126.7012048193); } .l-footer__body { background-color: #333333; position: relative; color: #fff; padding-top: 11rem; padding-bottom: 4rem; margin-top: 23rem; } @media screen and (max-width: 768px) { .l-footer__body { margin-top: 14rem; padding-top: 6rem; } } .l-footer__illust { position: absolute; top: 0; left: 50%; -webkit-transform: translate(-50%, -80%); transform: translate(-50%, -80%); width: 100%; max-width: 85.3rem; } .l-footer__links { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-column-gap: 8rem; -moz-column-gap: 8rem; column-gap: 8rem; max-width: 65rem; width: 50%; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media screen and (max-width: 768px) { .l-footer__links { width: 82%; margin: 0 auto; } } @media screen and (max-width: 768px) { .l-footer__list { width: 100%; } } .l-footer__list:last-of-type { margin-left: auto; } @media screen and (max-width: 768px) { .l-footer__list + .l-footer__list { margin-top: 5.5rem; } } .l-footer__list > a, .l-footer__list > p { color: #ee1132; font-size: 2.2rem; font-weight: 700; } @media screen and (max-width: 768px) { .l-footer__list > a, .l-footer__list > p { font-size: 2rem; } } @media screen and (max-width: 768px) { .l-footer__list ul { margin-top: 2em; } } .l-footer__list ul li { font-weight: 500; font-size: 2rem; margin-top: 1.35em; } @media screen and (max-width: 768px) { .l-footer__list ul li { margin-top: 0.8em; } } .l-footer__list ul li a span { color: #ee1132; margin-right: 1em; } .l-footer__flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; -ms-flex-wrap: wrap; flex-wrap: wrap; } .l-footer__banner { width: 39%; } @media screen and (max-width: 768px) { .l-footer__banner { width: 100%; margin-top: 3rem; } } .l-footer__copyright { text-align: right; font-size: 1.4rem; font-weight: 500; margin-top: 1.78em; } @media screen and (max-width: 768px) { .l-footer__copyright { font-size: 1.2rem; text-align: center; margin-top: 1.33em; font-weight: 400; } } .l-footer__logo { display: none; margin-bottom: 6rem; } @media screen and (max-width: 768px) { .l-footer__logo { display: block; padding-left: 9%; } } @media screen and (max-width: 500px) { .l-footer__logo { text-align: center; padding-left: 0; } } .l-footer__logo img { width: auto; height: 3rem; } .l-footer__submenu { margin-top: 7rem; display: none; } @media screen and (max-width: 768px) { .l-footer__submenu { display: -webkit-box; display: -ms-flexbox; display: flex; } } .l-main { position: relative; } .p-top { background-color: #feffd9; background-image: url(../images/common/bg-band.png); background-position: 0 150vw; background-size: 100%; background-repeat: repeat; } .p-top-mainview { position: relative; } .p-top-mainview img { width: 100dvw; height: 100dvh; -o-object-fit: cover; object-fit: cover; -o-object-position: 30% center; object-position: 30% center; } .p-top-mainview__careers { display: -webkit-box; display: -ms-flexbox; display: flex; position: absolute; bottom: 0; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); -webkit-column-gap: 0.5rem; -moz-column-gap: 0.5rem; column-gap: 0.5rem; } @media screen and (max-width: 768px) { .p-top-mainview__careers { display: none; } } .p-top-mainview__careers li { width: 23rem; } .p-top-mainview__careers li a { 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; color: #fff; font-weight: 600; font-size: 1.6rem; -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; aspect-ratio: 420/191; } .p-top-mainview__careers li:first-of-type a { background-color: #ee1132; } .p-top-mainview__careers li:first-of-type a:hover { background-color: rgb(241.4, 64.6, 91); } .p-top-mainview__careers li:nth-of-type(2) a { background-color: #ffaa01; } .p-top-mainview__careers li:nth-of-type(2) a:hover { background-color: rgb(255, 187, 51.8); } .p-top-mainview__careers li:nth-of-type(3) a { background-color: #997b60; } .p-top-mainview__careers li:nth-of-type(3) a:hover { background-color: rgb(174.4987951807, 149.3421686747, 126.7012048193); } .p-top-mainview .p-mv-copy { position: relative; position: absolute; top: 33%; left: 50%; z-index: 2; width: min(92vw, 72rem); -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } .p-top-mainview .p-mv-copy__stage { position: relative; overflow: hidden; width: 100%; aspect-ratio: 1200/260; } .p-top-mainview .p-mv-copy__item { display: block; position: absolute; visibility: hidden; width: 100%; height: 100%; text-align: center; opacity: 0; -webkit-filter: blur(0.6rem); filter: blur(0.6rem); -webkit-transform: translate3d(-3rem, 0, 0); transform: translate3d(-3rem, 0, 0); pointer-events: none; inset: 0; -o-object-fit: contain; object-fit: contain; -o-object-position: left center; object-position: left center; will-change: transform, opacity, filter; } .p-top-mainview .p-mv-copy__item img { width: auto; height: 13.7rem; } @media screen and (max-width: 768px) { .p-top-mainview .p-mv-copy__item img { height: auto; } } .p-top-mainview .p-mv-copy__item.is-enter, .p-top-mainview .p-mv-copy__item.is-active, .p-top-mainview .p-mv-copy__item.is-leave { visibility: visible; } .p-top-mainview .p-mv-copy__item.is-enter { -webkit-animation: mvCopyIn 1s cubic-bezier(0.22, 0.61, 0.36, 1) forwards; animation: mvCopyIn 1s cubic-bezier(0.22, 0.61, 0.36, 1) forwards; } .p-top-mainview .p-mv-copy__item.is-active { visibility: visible; opacity: 1; -webkit-filter: blur(0); filter: blur(0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .p-top-mainview .p-mv-copy__item.is-leave { -webkit-animation: mvCopyOut 0.8s cubic-bezier(0.55, 0.06, 0.68, 0.19) forwards; animation: mvCopyOut 0.8s cubic-bezier(0.55, 0.06, 0.68, 0.19) forwards; } @-webkit-keyframes mvCopyIn { 0% { opacity: 0; -webkit-filter: blur(0.6rem); filter: blur(0.6rem); -webkit-transform: translate3d(-3rem, 0, 0); transform: translate3d(-3rem, 0, 0); } 100% { opacity: 1; -webkit-filter: blur(0); filter: blur(0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @keyframes mvCopyIn { 0% { opacity: 0; -webkit-filter: blur(0.6rem); filter: blur(0.6rem); -webkit-transform: translate3d(-3rem, 0, 0); transform: translate3d(-3rem, 0, 0); } 100% { opacity: 1; -webkit-filter: blur(0); filter: blur(0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } } @-webkit-keyframes mvCopyOut { 0% { opacity: 1; -webkit-filter: blur(0); filter: blur(0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 100% { opacity: 0; -webkit-filter: blur(0.35rem); filter: blur(0.35rem); -webkit-transform: translate3d(1.6rem, 0, 0); transform: translate3d(1.6rem, 0, 0); } } @keyframes mvCopyOut { 0% { opacity: 1; -webkit-filter: blur(0); filter: blur(0); -webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } 100% { opacity: 0; -webkit-filter: blur(0.35rem); filter: blur(0.35rem); -webkit-transform: translate3d(1.6rem, 0, 0); transform: translate3d(1.6rem, 0, 0); } } @media (min-width: 768px) { .p-top-mainview .p-mv-copy { width: min(100vw, 96rem); } } @media (max-width: 767px) { .p-top-mainview .p-mv-copy { width: min(90vw, 48rem); } .p-top-mainview .p-mv-copy__stage { aspect-ratio: 1200/340; } .p-top-mainview .p-mv-copy__item { -o-object-position: center center; object-position: center center; } } @media (prefers-reduced-motion: reduce) { .p-top-mainview .p-mv-copy__item, .p-top-mainview .p-mv-copy__item.is-enter, .p-top-mainview .p-mv-copy__item.is-leave { -webkit-filter: none !important; filter: none !important; -webkit-transition: none !important; transition: none !important; -webkit-transform: none !important; transform: none !important; -webkit-animation: none !important; animation: none !important; } .p-top-mainview .p-mv-copy__item { visibility: hidden; opacity: 0; } .p-top-mainview .p-mv-copy__item.is-active { visibility: visible; opacity: 1; } } .p-top-message { padding-top: 25rem; } @media screen and (max-width: 768px) { .p-top-message { padding-top: 10rem; } } .p-top-message__profile { display: -webkit-box; display: -ms-flexbox; display: flex; position: relative; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; margin-top: 6rem; margin-right: calc(50% - 50vw); -webkit-column-gap: 8rem; -moz-column-gap: 8rem; column-gap: 8rem; } @media screen and (max-width: 768px) { .p-top-message__profile { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; margin-left: calc(50% - 50vw); } } @media screen and (max-width: 768px) { .p-top-message__profile .c-profile { text-align: center; } } .p-top-message__texts { z-index: 1; width: 17.5rem; padding-bottom: 3.7rem; text-align: right; } @media screen and (max-width: 768px) { .p-top-message__texts { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; width: calc(100% - 4rem); margin: 0 auto; margin-top: -35%; padding-top: 4rem; background-color: rgba(255, 255, 255, 0.9); } } .p-top-message__copy { display: block; top: 0; left: 0; margin-bottom: 3.5rem; text-align: center; } .p-top-message__copy img { max-width: none; width: auto; height: 19.4rem; padding: 2rem; padding-left: 0; background-color: rgba(255, 255, 255, 0.9); } @media screen and (max-width: 768px) { .p-top-message__copy img { height: 7.9rem; padding: 0; background-color: transparent; } } .p-top-message__image { width: calc(100% - 25.5rem); } @media screen and (max-width: 768px) { .p-top-message__image { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; width: 100%; } } .p-top-message__button { 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; width: 6.2rem; height: 4.7rem; margin-top: 2.8rem; margin-left: auto; background-color: #ee1132; cursor: pointer; -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; } @media screen and (max-width: 768px) { .p-top-message__button { margin: 0 auto; margin-top: 3rem; } } .p-top-message__button span::after { display: block; width: 9rem; height: 1.8rem; background-image: url(../images/common/icon-chev-down.svg); background-position: center; background-size: contain; background-repeat: no-repeat; content: ""; -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; } .p-top-message__button:hover { background-color: rgb(241.4, 64.6, 91); } .p-top-message__button.is_active span::after { -webkit-transform: rotate(180deg); transform: rotate(180deg); } .p-top-message__body { max-width: 102rem; margin: 0 auto; padding: 4rem 8.8% 4rem; background-color: #ee1132; color: #fff; font-weight: 600; } @media screen and (max-width: 768px) { .p-top-message__body { margin-right: calc(50% - 50vw); margin-left: calc(50% - 50vw); padding: 2rem; } } .p-top-message__accordion { display: none; width: 100%; padding: 4rem 0 2rem; } .p-top-message__accordion > p { font-size: 1.6rem; line-height: 2.5; } @media screen and (max-width: 768px) { .p-top-message__accordion > p { line-height: 1.88; } } .p-top-message__accordion > p + p { margin-top: 2em; } .p-top-message__sign { margin-top: 2rem; text-align: right; } @media screen and (max-width: 768px) { .p-top-message__sign { margin-top: 4rem; margin-top: 4rem; text-align: center; } } .p-top-message__sign .c-profile__name span { color: #fff; } .p-top-interview { padding-top: 21rem; } @media screen and (max-width: 768px) { .p-top-interview { padding-top: 9rem; } } .p-top-interview-slide { overflow: hidden; margin-top: 4.5rem; margin-right: calc(50% - 50vw); } @media screen and (max-width: 768px) { .p-top-interview-slide { display: none; } } .p-top-interview-slide__num { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-weight: 600; font-size: 2.5rem; line-height: 1.4; } .p-top-interview-slide__num span { display: inline-block; margin-right: 0.2em; padding-right: 0.1em; border-right: 0.2rem solid #ee1132; color: #ee1132; font-size: 13rem; font-family: "Roboto", sans-serif; line-height: 0.8; } .p-top-interview-slide__copy { display: inline-block; margin-top: 1.8rem; padding: 2rem; padding-left: 0; background-color: rgba(255, 255, 255, 0.9); } .p-top-interview-slide__copy img { width: auto; height: 21rem; } .p-top-interview-slide__item { position: relative; } .p-top-interview-slide__item a { display: block; -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; } .p-top-interview-slide__item a:hover { opacity: 0.8; } .p-top-interview-slide__texts { position: relative; z-index: 1; aspect-ratio: 1340/495; } .p-top-interview-slide__image { position: absolute; right: 0; bottom: 0; width: 67.4%; aspect-ratio: 928/500; } .p-top-interview-slide__image img { -o-object-fit: cover; object-fit: cover; } .p-top-interview-slide__join { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-top: 1rem; white-space: nowrap; font-weight: 600; -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; -webkit-column-gap: 1rem; -moz-column-gap: 1rem; column-gap: 1rem; } @media screen and (max-width: 768px) { .p-top-interview-slide__join { font-size: 1.6rem; } } .p-top-interview-slide__join:hover { opacity: 0.7; } .p-top-interview-subslide { margin-top: 0.5rem; } @media screen and (max-width: 768px) { .p-top-interview-subslide { display: none; } } .p-top-interview-subslide__item { position: relative; overflow: hidden; width: 22rem; cursor: pointer; } .p-top-interview-subslide__item img { -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; } .p-top-interview-subslide__item:hover, .p-top-interview-subslide__item.swiper-slide-thumb-active { opacity: 0.8; } .p-top-interview-subslide__item:hover img, .p-top-interview-subslide__item.swiper-slide-thumb-active img { scale: 1.1; } .p-top-interview-subslide__num { position: absolute; bottom: 1rem; left: 1rem; color: #ee1132; font-size: 4.9rem; font-family: "Roboto", sans-serif; } .p-top-interview__sp { display: none; } @media screen and (max-width: 768px) { .p-top-interview__sp { display: block; } } .p-top-interview-list { margin-top: 6rem; } .p-top-interview-list:first-of-type { margin-top: 2rem; } .p-top-interview-list__image { position: relative; margin-right: calc(50% - 50vw); margin-left: calc(50% - 50vw); } .p-top-interview-list__num { display: -webkit-box; display: -ms-flexbox; display: flex; position: absolute; top: -14vw; left: 8%; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; color: #ee1132; } .p-top-interview-list__num .body { margin-bottom: 0.1em; padding-bottom: 0.05em; border-bottom: 0.2rem solid #ee1132; font-size: 8.7rem; } .p-top-interview-list__num .vertical { letter-spacing: 0.2em; font-weight: bold; font-size: 1.6rem; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; } .p-top-interview-list__copy { position: absolute; bottom: 0; left: 50%; z-index: 1; width: calc(100% - 4rem); padding: 2rem; background-color: rgba(255, 255, 255, 0.9); text-align: center; -webkit-transform: translateX(-50%); transform: translateX(-50%); } @media screen and (max-width: 768px) { .p-top-interview-list__copy img { width: auto; height: 9.2rem; } } .p-top-interview-list__profile { margin-top: 0; text-align: center; background-color: #fff; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); padding-top: 0.5em; padding-bottom: 1.5em; } .p-top-faq { padding-top: 21rem; } @media screen and (max-width: 768px) { .p-top-faq { padding-top: 10rem; padding-bottom: 15rem; } } .p-top-faq .c-heading h2 { color: #d0f0ff; } .p-top-faq__body { margin-top: 4.5rem; padding: 10rem 0; background-color: #d0f0ff; } @media screen and (max-width: 768px) { .p-top-faq__body { margin-top: 1rem; padding: 0; background-color: transparent; } } .p-top-faq__inner { max-width: 106rem; margin: 0 auto; padding: 0 2rem; } .p-top-faq__flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-right: calc(50% - 50vw); } @media screen and (max-width: 768px) { .p-top-faq__flex { margin-right: auto; } } .p-top-faq__text { width: 45.3%; } @media screen and (max-width: 768px) { .p-top-faq__text { width: 100%; } } .p-top-faq__text p { font-weight: 500; font-size: 1.6rem; line-height: 1.88; } .p-top-faq__link { display: block; position: relative; width: 54.7%; } @media screen and (max-width: 768px) { .p-top-faq__link { width: 100%; margin-top: 2rem; } } .p-top-faq__link span { display: -webkit-box; display: -ms-flexbox; display: flex; position: absolute; top: 50%; left: 50%; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; max-width: 13.2rem; aspect-ratio: 132/58; border-radius: 20rem; background-color: #ee1132; color: #fff; font-weight: 700; font-size: 2.8rem; font-family: "Roboto", sans-serif; -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); } @media screen and (max-width: 768px) { .p-top-faq__link span { font-size: 2rem; width: 10rem; } } .p-top-faq__link:hover span { background-color: rgb(242.25, 76.5, 101.25); } .p-top-info { padding-top: 6rem; padding-bottom: 17rem; background-color: #dee4e6; } @media screen and (max-width: 768px) { .p-top-info { padding-top: 4rem; padding-bottom: 12rem; } } .p-top-info .c-heading h2 { color: #fff; line-height: 0.8; } .p-top-info h3 { margin-top: 2.2em; font-weight: 600; font-size: 2rem; } @media screen and (max-width: 768px) { .p-top-info h3 { font-size: 1.8rem; } } .p-top-info__text { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; margin-top: 2em; font-size: 1.6rem; -webkit-column-gap: 2rem; -moz-column-gap: 2rem; column-gap: 2rem; } @media screen and (max-width: 768px) { .p-top-info__text { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } } .p-top-info__text p { font-weight: 500; line-height: 1.87; } .p-top-info__text a { 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; width: 12.7rem; height: 4.2rem; border-radius: 20rem; background-color: #ee1132; color: #fff; font-weight: 700; font-size: 1.8rem; font-family: "Roboto", sans-serif; -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; } @media screen and (max-width: 768px) { .p-top-info__text a { margin: 0 auto; margin-top: 1.5rem; } } .p-top-info__text a:hover { background-color: rgb(241.4, 64.6, 91); } .p-top .l-footer { background-color: #dee4e6; } fade-tilt animation { opacity: 0.134322; -webkit-mask-image: linear-gradient(135deg, rgb(0, 0, 0) 30%, rgba(0, 0, 0, 0.4) 45%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, 0) 100%); mask-image: linear-gradient(135deg, rgb(0, 0, 0) 30%, rgba(0, 0, 0, 0.4) 45%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, 0) 100%); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 250% 250% 250%; mask-size: 250% 250% 250%; -webkit-mask-position-x: 112.538%; -webkit-mask-position-y: 112.538%; } .p-top-hero__text__main { display: block; width: 41.3rem; -webkit-animation: fade-tilt 1.5s var(--easing-slow) both; animation: fade-tilt 1.5s var(--easing-slow) both; aspect-ratio: 135/52; } .p-interview { position: relative; padding-top: 16rem; background-color: #feffd9; background-image: url(../images/common/bg-band.png); background-position: 0 103vw; background-size: 100%; background-repeat: repeat; } @media screen and (max-width: 768px) { .p-interview { padding-top: 7.5rem; } } .p-interview-mainview { position: relative; overflow: hidden; margin-top: 1rem; margin-right: calc(50% - 50vw); } @media screen and (max-width: 768px) { .p-interview-mainview { margin-top: 1.8rem; overflow: visible; margin-right: auto; } } .p-interview-mainview__num { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; white-space: nowrap; font-weight: 600; font-size: 2.5rem; line-height: 1.4; background-color: rgba(255, 255, 255, 0.9); padding: 2rem; font-weight: 500; } @media screen and (max-width: 768px) { .p-interview-mainview__num { position: absolute; top: -5.5%; left: 2rem; -webkit-writing-mode: vertical-rl; -ms-writing-mode: tb-rl; writing-mode: vertical-rl; color: #ee1132; font-size: 1.6rem; text-align: left; letter-spacing: 0.2em; background-color: transparent; } } .p-interview-mainview__num .lg { display: inline-block; margin-right: 0.2em; padding-right: 0.1em; border-right: 0.2rem solid #ee1132; color: #ee1132; font-size: 13rem; font-family: "Roboto", sans-serif; line-height: 0.8; } @media screen and (max-width: 768px) { .p-interview-mainview__num .lg { font-size: 8.7rem; font-weight: 400; border-right: 0; border-bottom: 0.2rem solid #ee1132; padding-bottom: 0.2em; margin-bottom: 0.2em; -webkit-writing-mode: initial; -ms-writing-mode: initial; writing-mode: initial; padding-right: 0; margin-right: 0; letter-spacing: normal; } } .p-interview-mainview__copy { margin-top: 6rem; background-color: rgba(255, 255, 255, 0.9); padding: 2rem; padding-left: 0; display: inline-block; } @media screen and (max-width: 1300px) { .p-interview-mainview__copy { margin-top: 2rem; } } @media screen and (max-width: 768px) { .p-interview-mainview__copy { background-color: transparent; } } .p-interview-mainview__copy img { width: auto; height: 17.5rem; max-width: none; } @media screen and (max-width: 768px) { .p-interview-mainview__copy img { height: 9.2rem; } } .p-interview-mainview__overview { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; } @media screen and (max-width: 768px) { .p-interview-mainview__overview { -ms-flex-wrap: wrap; flex-wrap: wrap; } } .p-interview-mainview__overview::after { display: block; width: 67.4%; padding-top: 34vw; content: ""; } @media screen and (max-width: 768px) { .p-interview-mainview__overview::after { display: none; } } @media screen and (max-width: 768px) { .p-interview-mainview__profile { margin-top: 3rem; } } .p-interview-mainview__texts { position: relative; z-index: 1; padding-bottom: 1rem; } @media screen and (max-width: 768px) { .p-interview-mainview__texts { width: 100%; -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; position: static; background-color: rgba(255, 255, 255, 0.9); margin-top: -42%; padding: 2rem; text-align: center; } } .p-interview-mainview__image { position: absolute; right: 0; bottom: 0; width: calc(67.4% + 50vw - 50%); margin-right: calc(50% - 50vw); aspect-ratio: 928/452; } @media screen and (max-width: 768px) { .p-interview-mainview__image { position: relative; width: 100%; -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; aspect-ratio: 371/411; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); width: auto; } } .p-interview-mainview__image img { -o-object-fit: cover; object-fit: cover; } .p-interview-mainview__join { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-top: 1rem; white-space: nowrap; font-weight: 600; -webkit-column-gap: 1rem; -moz-column-gap: 1rem; column-gap: 1rem; } @media screen and (max-width: 768px) { .p-interview-mainview__join { font-size: 1.6rem; } } .p-interview-mainview__bottom { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; min-width: 94rem; width: 60vw; margin-right: calc(50% - 50vw); margin-left: auto; padding: 5rem; padding-right: calc(50vw - 50%); background-color: #ee1132; color: #fff; line-height: 1.8; -webkit-column-gap: 6.5rem; -moz-column-gap: 6.5rem; column-gap: 6.5rem; } @media screen and (max-width: 768px) { .p-interview-mainview__bottom { display: block; min-width: initial; width: auto; padding: 2rem; margin-left: calc(50% - 50vw); } } .p-interview-mainview__bottom dt { font-weight: 700; font-size: 3.8rem; font-family: "Roboto", sans-serif; } @media screen and (max-width: 768px) { .p-interview-mainview__bottom dt { font-size: 2.5rem; text-align: center; } } .p-interview-mainview__bottom dd { font-weight: 600; font-size: 1.6rem; } @media screen and (max-width: 768px) { .p-interview-mainview__bottom dd { margin-top: 1.5em; } } .p-interview-section__copy img { width: auto; height: 9.2rem; } @media screen and (max-width: 768px) { .p-interview-section__copy img { height: 5.1rem; } } .p-interview-section__copy.is_row3 img { height: 14.2rem; } @media screen and (max-width: 768px) { .p-interview-section__copy.is_row3 img { height: 7.8rem; } } .p-interview-section__texts { margin-top: 5em; font-size: 1.6rem; } .p-interview-section__texts p { line-height: 1.87; } .p-interview-section1 { position: relative; padding-top: 30rem; } @media screen and (max-width: 768px) { .p-interview-section1 { padding-top: 21rem; } } .p-interview-section1__wrapper { position: relative; max-width: 97rem; margin-left: auto; } .p-interview-section1__illust { position: absolute; top: -25rem; right: 0; width: 44.8rem; } @media screen and (max-width: 768px) { .p-interview-section1__illust { width: 26.3rem; } } .p-interview-section1__image { position: relative; width: calc(68% + 50vw - 50%); margin-top: 11rem; margin-left: calc(50% - 50vw); } @media screen and (max-width: 768px) { .p-interview-section1__image { width: calc(97% + 50vw - 50%); margin-top: 6rem; } } .p-interview-section1__image::before { display: block; position: absolute; right: -1.5rem; bottom: -1.5rem; z-index: -1; width: 76.8%; height: 53.8%; background-color: #ee1132; content: ""; } @media screen and (max-width: 768px) { .p-interview-section1__image::before { right: -1rem; width: 73%; height: 69%; bottom: initial; top: -1rem; } } .p-interview-section1__image.is_right { margin-right: calc(50% - 50vw); margin-left: auto; } .p-interview-section1__image.is_right::before { top: -1.5rem; right: 0; bottom: 0; left: -1.5rem; } @media screen and (max-width: 768px) { .p-interview-section1__image.is_right::before { top: -1rem; left: -1rem; } } .p-interview-section2 { padding-top: 31.6rem; } .p-interview-section2 .c-inner { position: relative; } .p-interview-section2__wrapper { max-width: 97rem; margin-left: auto; } .p-interview-section2__illust { position: absolute; bottom: 45%; left: 0; width: 44.4rem; } @media screen and (max-width: 768px) { .p-interview-section2__illust { width: 21.9rem; bottom: initial; left: initial; top: -12%; right: 0; } } .p-interview-section2__image { position: relative; width: 51.8%; margin-top: 14rem; margin-left: auto; } @media screen and (max-width: 768px) { .p-interview-section2__image { width: 88%; margin-right: calc(50% - 50vw); margin-top: 6rem; } } .p-interview-section2__image::before { display: block; position: absolute; right: -1.5rem; bottom: -1.5rem; z-index: -1; width: 52.9%; height: 76.6%; background-color: #ee1132; content: ""; } @media screen and (max-width: 768px) { .p-interview-section2__image::before { width: 96%; height: 52%; right: initial; left: -0.9rem; bottom: -0.9rem; } } .p-interview-section3 { padding-top: 33rem; padding-bottom: 15rem; } @media screen and (max-width: 768px) { .p-interview-section3 { padding-top: 30rem; } } .p-interview-section3__wrapper { position: relative; max-width: 97rem; } .p-interview-section3__illust { position: absolute; top: -40%; right: 0; width: 44.4rem; } @media screen and (max-width: 768px) { .p-interview-section3__illust { width: 21.7rem; top: -30%; } } .p-interview-recommend { padding: 9rem 0; background-color: #ee1132; color: #fff; } @media screen and (max-width: 768px) { .p-interview-recommend { padding: 4rem 0; } } .p-interview-recommend__inner { max-width: 112rem; margin: 0 auto; padding: 0 2rem; } .p-interview-recommend__tit { text-align: center; } @media screen and (max-width: 768px) { .p-interview-recommend__tit img { height: 6.7rem; width: auto; } } .p-interview-recommend__texts { margin-top: 3em; font-weight: 600; font-size: 1.6rem; line-height: 1.88; } .p-interview-myiwate { padding-top: 15rem; } .p-interview-myiwate__tit { width: calc(8.8em + 50vw - 50%); margin-left: calc(50% - 50vw); padding: 0.5em 0; padding-left: calc(50vw - 50%); border-top-right-radius: 20rem; border-bottom-right-radius: 20rem; background-color: #ee1132; color: #fff; font-weight: 700; font-size: 4rem; font-family: "Roboto", sans-serif; position: relative; z-index: 1; } @media screen and (max-width: 768px) { .p-interview-myiwate__tit { 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; width: 16rem; height: 3.6rem; margin: 0 auto; padding-left: 0; border-radius: 20rem; font-size: 1.8rem; } } .p-interview-myiwate__contents { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: -4rem; padding: 5rem; border: 0.1rem solid #ee1132; } @media screen and (max-width: 768px) { .p-interview-myiwate__contents { padding: 5rem 1em; margin-top: -1.8rem; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } } .p-interview-myiwate__contents + .p-interview-myiwate__contents { margin-top: 2.5rem; } .p-interview-myiwate__contents.is_vertical .p-interview-myiwate__texts { width: 66%; } @media screen and (max-width: 768px) { .p-interview-myiwate__contents.is_vertical .p-interview-myiwate__texts { width: 100%; } } .p-interview-myiwate__contents.is_vertical .p-interview-myiwate__image { width: 28.5%; } @media screen and (max-width: 768px) { .p-interview-myiwate__contents.is_vertical .p-interview-myiwate__image { width: 100%; } } .p-interview-myiwate__texts { width: 44%; color: #333; font-size: 1.6rem; line-height: 1.88; } @media screen and (max-width: 768px) { .p-interview-myiwate__texts { width: 100%; } } .p-interview-myiwate__image { width: 51.4%; } @media screen and (max-width: 768px) { .p-interview-myiwate__image { width: 100%; margin-top: 3rem; } .p-interview-myiwate__image img { -o-object-fit: cover; object-fit: cover; aspect-ratio: 1; } } @media screen and (max-width: 768px) { .p-interview-myiwate__image.is_interview01 img { -o-object-position: right; object-position: right; } } .p-interview-other { padding-top: 20rem; padding-bottom: 17.6rem; } @media screen and (max-width: 500px) { .p-interview-other { padding-top: 15rem; } } .p-interview-other h2 { color: #ee1132; text-align: right; font-weight: 700; font-size: 5rem; } @media screen and (max-width: 500px) { .p-interview-other h2 { text-align: center; font-size: 2.5rem; } } .p-interview-other__list { display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 4rem; -webkit-column-gap: 0.8rem; -moz-column-gap: 0.8rem; column-gap: 0.8rem; } @media screen and (max-width: 500px) { .p-interview-other__list { -ms-flex-wrap: wrap; flex-wrap: wrap; margin-top: 7rem; } } .p-interview-other__list li { position: relative; } @media screen and (max-width: 500px) { .p-interview-other__list li { width: 100%; } } @media screen and (max-width: 500px) { .p-interview-other__list li + li { margin-top: 1.2rem; } } .p-interview-other__list p { 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; margin-top: 0.5rem; color: #ee1132; font-weight: 500; font-size: 1.6rem; line-height: 3.43; } @media screen and (max-width: 768px) { .p-interview-other__list p { font-size: 1.4rem; } } @media screen and (max-width: 500px) { .p-interview-other__list p { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; position: absolute; right: 0; bottom: 1.5rem; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; min-height: 3.8rem; padding: 0.37em 0.81em; background-color: #fff; color: #ee1132; font-weight: 500; font-size: 1.6rem; line-height: 1; } } .p-interview-other__list p span { position: relative; margin-left: 1em; padding-left: 1em; color: #000; font-weight: 600; font-size: 2rem; line-height: 1; } @media screen and (max-width: 768px) { .p-interview-other__list p span { font-size: 1.7rem; } } @media screen and (max-width: 500px) { .p-interview-other__list p span { color: #000; font-weight: 600; line-height: 1.44; font-size: 1.8rem; } } .p-interview-other__list p span::before { position: absolute; top: 50%; left: 0; width: 0.1rem; height: 5.5rem; background-color: #ee1132; content: ""; -webkit-transform: translateY(-50%); transform: translateY(-50%); } @media screen and (max-width: 768px) { .p-interview-other__list p span::before { height: 3rem; } } @media screen and (max-width: 500px) { .p-interview-other__list p span::before { height: 2.6rem; } } .p-interview4__inner { max-width: 88.8rem; margin: 0 auto; padding: 0 2rem; } .p-interview4__illust { position: absolute; top: -10rem; right: -25%; width: 40.8rem; } @media screen and (max-width: 1300px) { .p-interview4__illust { right: -10%; } } @media screen and (max-width: 768px) { .p-interview4__illust { width: 18.2rem; right: initial; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); top: -16rem; } } .p-interview4 .p-interview-mainview__bottom { width: auto; margin-right: auto; margin-left: calc(50% - 50vw); padding-right: 0; padding-left: calc(50vw - 50% + 20%); } @media screen and (max-width: 768px) { .p-interview4 .p-interview-mainview__bottom { margin-right: calc(50% - 50vw); padding: 2rem; } } @media screen and (max-width: 768px) { .p-interview4 .p-interview-mainview__bottom dd { margin-top: 0; } } .p-interview4-profile { margin-top: 13.6rem; } @media screen and (max-width: 768px) { .p-interview4-profile { margin-top: 7rem; } } .p-interview4-profile__flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media screen and (max-width: 768px) { .p-interview4-profile__flex { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } } .p-interview4-profile__item { width: 45%; } @media screen and (max-width: 768px) { .p-interview4-profile__item { width: 77.5%; } } @media screen and (max-width: 768px) { .p-interview4-profile__item:nth-of-type(2) { margin-top: 6rem; } } .p-interview4-profile__item:nth-of-type(2) .p-interview4-profile__image::before { top: -1.2rem; right: -1.2rem; bottom: initial; left: initial; width: 26.9%; padding-top: 96%; } @media screen and (max-width: 768px) { .p-interview4-profile__item:nth-of-type(2) .p-interview4-profile__image::before { top: -0.8rem; right: -0.8rem; } } .p-interview4-profile__image { position: relative; } .p-interview4-profile__image::before { display: block; position: absolute; bottom: -1.2rem; left: -1.2rem; z-index: -1; width: 68.5%; padding-top: 57.9%; background-color: #ee1132; content: ""; } @media screen and (max-width: 768px) { .p-interview4-profile__image::before { bottom: -0.8rem; left: -0.8rem; } } .p-interview4-profile .c-profile { margin-top: 6rem; padding-left: 2rem; } @media screen and (max-width: 768px) { .p-interview4-profile .c-profile { margin-top: 3rem; text-align: center; } } .p-interview4-profile .c-profile__name { margin-top: 0.5em; } .p-interview4-profile .c-profile__position { margin-top: 0.8em; } .p-interview4-profile__cat { font-size: 1.6rem; font-weight: 600; } .p-interview4-talk__unit { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-top: 3rem; } @media screen and (max-width: 768px) { .p-interview4-talk__unit { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; margin-top: 5rem; } } .p-interview4-talk__unit:first-of-type { margin-top: 7.5rem; } @media screen and (max-width: 768px) { .p-interview4-talk__unit:first-of-type { margin-top: 4.5rem; } } .p-interview4-talk__photo { width: 13%; text-align: center; } @media screen and (max-width: 768px) { .p-interview4-talk__photo { width: 6rem; } } .p-interview4-talk__photo img { border: 0.5rem solid #ee1132; border-radius: 50%; } .p-interview4-talk__photo figcaption { margin-top: 0.5em; color: #ee1132; font-weight: 600; font-size: 1.6rem; } @media screen and (max-width: 768px) { .p-interview4-talk__photo figcaption { font-size: 1.5rem; } } .p-interview4-talk__text { width: 87%; padding-left: 2em; font-weight: 500; font-size: 1.6rem; line-height: 1.88; } @media screen and (max-width: 768px) { .p-interview4-talk__text { width: calc(100% - 6rem); padding-left: 0.625em; } } .p-interview4-message { padding-top: min(28.4%, 41rem); } @media screen and (max-width: 768px) { .p-interview4-message { background-color: #ee1132; padding-top: 2rem; margin-top: 17.3rem; } } .p-interview4-message h2 { color: #ee1132; text-align: center; font-weight: bold; font-size: 8rem; } @media screen and (max-width: 768px) { .p-interview4-message h2 { font-size: 2.5rem; color: #fff; } } .p-interview4-message__flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; margin-top: 3rem; } @media screen and (max-width: 768px) { .p-interview4-message__flex { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } } @media screen and (max-width: 768px) { .p-interview4-message__photo { text-align: center; } } .p-interview4-message__photo img { width: 69.5%; } @media screen and (max-width: 768px) { .p-interview4-message__photo img { width: 30rem; } } .p-interview4-message__item { position: relative; padding-bottom: 3rem; color: #fff; } .p-interview4-message__item.is_left { margin-top: -10rem; margin-right: -3rem; margin-right: -2%; margin-left: calc(50% - 50vw); padding-left: calc(50vw - 50%); } @media screen and (max-width: 1400px) { .p-interview4-message__item.is_left { margin-top: -3rem; } } @media screen and (max-width: 768px) { .p-interview4-message__item.is_left { margin-top: 0; margin-right: calc(50% - 50vw); padding-right: 2rem; } } .p-interview4-message__item.is_left .p-interview4-message__texts { padding-right: 12%; } @media screen and (max-width: 768px) { .p-interview4-message__item.is_left .p-interview4-message__texts { padding: 0; } } .p-interview4-message__item.is_right { margin-right: calc(50% - 50vw); margin-left: -3rem; margin-left: -2%; padding-right: calc(50vw - 50%); } @media screen and (max-width: 768px) { .p-interview4-message__item.is_right { margin-left: calc(50% - 50vw); padding-left: 2rem; margin-top: 6rem; } } .p-interview4-message__item.is_right .p-interview4-message__photo { text-align: right; } @media screen and (max-width: 768px) { .p-interview4-message__item.is_right .p-interview4-message__photo { text-align: center; } } .p-interview4-message__item.is_right .p-interview4-message__texts { padding-left: 14%; } @media screen and (max-width: 768px) { .p-interview4-message__item.is_right .p-interview4-message__texts { padding: 0; } } .p-interview4-message__item::before { display: block; position: absolute; bottom: 0; left: 0; z-index: -1; width: 100%; height: 70%; background-color: #ee1132; content: ""; mix-blend-mode: multiply; } @media screen and (max-width: 768px) { .p-interview4-message__item::before { height: 100%; } } .p-interview4-message__copy { margin-top: 1.66em; font-weight: 600; font-size: 2.7rem; line-height: 1.25; } @media screen and (max-width: 768px) { .p-interview4-message__copy { font-size: 2rem; line-height: 1.5; text-align: center; } } .p-interview4-message__text { margin-top: 2.8em; font-weight: 600; font-size: 1.6rem; line-height: 1.88; } @media screen and (max-width: 768px) { .p-interview4-message__text { margin-top: 1.8em; } } .p-interview4-myiwate .p-interview-myiwate__contents { padding: 3rem; } @media screen and (max-width: 768px) { .p-interview4-myiwate .p-interview-myiwate__contents { padding: 2rem; padding-top: 5rem; } } .p-interview4-myiwate .p-interview-myiwate__circle { width: 15.4%; } @media screen and (max-width: 768px) { .p-interview4-myiwate .p-interview-myiwate__circle { width: 13.1rem; -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } } .p-interview4-myiwate .p-interview-myiwate__circle img { border: 0.5rem solid #ee1132; border-radius: 50%; } .p-interview4-myiwate .p-interview-myiwate__circle figcaption { color: #ee1132; font-size: 1.8rem; font-weight: 600; text-align: center; margin-top: 0.5em; } .p-interview4-myiwate .p-interview-myiwate__texts { width: 46.4%; } @media screen and (max-width: 768px) { .p-interview4-myiwate .p-interview-myiwate__texts { width: 100%; -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; margin-top: 2em; } } .p-interview4-myiwate .p-interview-myiwate__image { width: 29.2%; } @media screen and (max-width: 768px) { .p-interview4-myiwate .p-interview-myiwate__image { width: 100%; -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; } } .p-faq { padding-top: 16rem; background-color: #d0f0ff; position: relative; background-image: url(../images/common/bg-band.png); background-size: 100%; background-repeat: repeat; background-position: 0 -70vw; } @media screen and (max-width: 768px) { .p-faq { padding-top: 7.5rem; } } .p-faq-heading h1 { color: #d0f0ff; } .p-faq-heading__image { position: relative; margin-top: 4rem; } @media screen and (max-width: 768px) { .p-faq-heading__image { margin-top: 2rem; } } .p-faq-heading__image::before { position: absolute; display: block; content: ""; background-color: #ee1132; width: 98%; height: 2rem; bottom: -2rem; right: 0; z-index: -1; } @media screen and (max-width: 768px) { .p-faq-heading__image::before { width: 94.6%; height: 1.2rem; bottom: -1.2rem; } } .p-faq__contents { max-width: 97rem; margin: 0 auto; padding-top: 17rem; } @media screen and (max-width: 768px) { .p-faq__contents { padding-top: 10rem; } } .p-faq__photos { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-column-gap: 1.2rem; -moz-column-gap: 1.2rem; column-gap: 1.2rem; margin-top: 1.2rem; row-gap: 1.3rem; } @media screen and (max-width: 768px) { .p-faq__photos { -ms-flex-wrap: wrap; flex-wrap: wrap; margin-top: 2.6rem; } } .p-faq__photos li { width: 33.3333333333%; } @media screen and (max-width: 768px) { .p-faq__photos li { width: 100%; } } .p-faq__unit:not(:first-of-type) { margin-top: 7rem; } .p-faq__unit > dt { font-size: 1.8rem; font-weight: 600; padding-left: 2.3em; text-indent: -2.3em; line-height: 1.38; } .p-faq__unit > dt span { font-size: 3rem; font-weight: 700; margin-right: 0.4em; } .p-faq__unit > dd { background-color: #d0f0ff; font-size: 1.6rem; font-weight: 500; line-height: 1.88; padding: 2em 2.5em; margin-top: 1.5em; } @media screen and (max-width: 768px) { .p-faq__unit > dd { padding: 1em 0.7em; } } .p-faq__unit > dd p:not(:first-of-type) { margin-top: 1.5em; } .p-faq__unit > dd p a { border-bottom: 0.1rem solid #ee1132; -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; } .p-faq__unit > dd p a:hover { opacity: 0.7; } .p-faq__dl { font-weight: 700; font-size: 1.6rem; margin-top: 0.5em; } .p-faq__greetings { margin-top: 18.6rem; padding-bottom: 18rem; } @media screen and (max-width: 768px) { .p-faq__greetings { margin-top: 10rem; padding-bottom: 16rem; } } .p-faq__greetings p { text-align: center; font-weight: bold; font-size: 2.4rem; line-height: 1.66; } @media screen and (max-width: 768px) { .p-faq__greetings p { font-size: 1.9rem; line-height: 2; } } .p-faq__greetings figure { position: relative; margin-top: 5rem; } @media screen and (max-width: 500px) { .p-faq__greetings figure { margin-left: calc(50% - 50vw); width: 103%; } } .p-faq__greetings figure::before { display: block; position: absolute; right: -1.5rem; bottom: -1.5rem; z-index: -1; width: 76.8%; height: 53.8%; background-color: #ee1132; content: ""; } @media screen and (max-width: 768px) { .p-faq__greetings figure::before { right: -1rem; bottom: -1rem; width: 73%; height: 69%; } } .p-info { padding-top: 16rem; background-color: #d6dde0; position: relative; background-image: url(../images/common/bg-band.png); background-size: 100%; background-repeat: repeat; background-position: 0 0; } @media screen and (max-width: 1860px) { .p-info { background-position: 0 38vw; } } @media screen and (max-width: 768px) { .p-info { padding-top: 7.5rem; background-position: 0 60vw; } } .p-info-heading h1 { color: #fff; } .p-info-heading__ankers { display: -webkit-box; display: -ms-flexbox; display: flex; font-size: 1.8rem; -webkit-column-gap: 2.4em; -moz-column-gap: 2.4em; column-gap: 2.4em; font-weight: 600; margin-top: -4rem; } @media screen and (max-width: 768px) { .p-info-heading__ankers { font-size: 1.6rem; margin-top: 0; margin-top: 1.37em; line-height: 1.13; text-align: center; } } @media screen and (max-width: 500px) { .p-info-heading__ankers { -webkit-column-gap: 1rem; -moz-column-gap: 1rem; column-gap: 1rem; } } .p-info-heading__ankers li a { -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; } .p-info-heading__ankers li a.career:hover { color: #ee1132; } .p-info-heading__ankers li a.second:hover { color: #ffaa01; } .p-info-heading__ankers li a.recareer:hover { color: #997b60; } .p-info__inner { max-width: 110rem; padding: 0 2rem; margin: 0 auto; } .p-info__h2 { font-size: 2rem; font-weight: 600; color: #fff; background-color: #ee1132; padding: 1em 0; padding-left: 1.7em; margin-right: calc(50% - 50vw); } @media screen and (max-width: 768px) { .p-info__h2 { margin-left: calc(50% - 50vw); text-align: center; padding-left: 0; } } .p-info__text { padding-left: 20rem; font-size: 1.6rem; line-height: 1.88; font-weight: 600; margin-top: 3em; } @media screen and (max-width: 768px) { .p-info__text { padding: 0; margin-top: 1.5em; font-weight: 500; } } .p-info__table th { font-size: 1.8rem; text-align: right; width: 18rem; font-weight: 600; padding-top: 6rem; } @media screen and (max-width: 768px) { .p-info__table th { display: block; width: auto; text-align: left; padding-top: 4rem; } } .p-info__table th span { display: inline-block; width: 4em; text-align: left; } .p-info__table td { width: calc(100% - 18rem); font-size: 1.6rem; font-weight: 500; line-height: 1.88; padding-left: 2rem; padding-top: 6rem; } @media screen and (max-width: 768px) { .p-info__table td { display: block; padding: 0; width: auto; padding-top: 0.8em; font-weight: normal; } } .p-info__link { display: -webkit-box; display: -ms-flexbox; display: flex; margin: 0 auto; margin-top: 9rem; aspect-ratio: 420/190; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; font-size: 2.6rem; max-width: 42rem; font-weight: 600; -webkit-transition: 0.15s ease-in-out; transition: 0.15s ease-in-out; } @media screen and (max-width: 768px) { .p-info__link { aspect-ratio: 335/120; font-size: 1.8rem; margin-top: 4rem; } } .p-info__link span { font-weight: 700; font-size: 4rem; line-height: 1.6; } @media screen and (max-width: 768px) { .p-info__link span { font-size: 3rem; } } .p-info-career { margin-top: 14rem; } @media screen and (max-width: 768px) { .p-info-career { margin-top: 8rem; } } .p-info-career .p-info__h2 { background-color: #ee1132; } .p-info-career .p-info__table th { color: #ee1132; } .p-info-career .p-info__link { background-color: #ee1132; } .p-info-career .p-info__link:hover { background-color: rgb(241.4, 64.6, 91); } .p-info-second { margin-top: 13rem; } @media screen and (max-width: 768px) { .p-info-second { margin-top: 10rem; } } .p-info-second .p-info__h2 { background-color: #ffaa01; } .p-info-second .p-info__table th { color: #ffaa01; } .p-info-second .p-info__link { background-color: #ffaa01; } .p-info-second .p-info__link:hover { background-color: rgb(255, 187, 51.8); } .p-info-recareer { margin-top: 13rem; padding-bottom: 4rem; } @media screen and (max-width: 768px) { .p-info-recareer { margin-top: 10rem; padding-bottom: 0; } } .p-info-recareer .p-info__h2 { background-color: #997b60; } .p-info-recareer .p-info__table th { color: #997b60; } .p-info-recareer .p-info__link { background-color: #997b60; } .p-info-recareer .p-info__link:hover { background-color: rgb(174.4987951807, 149.3421686747, 126.7012048193); } .u-d-none { display: none; } .u-d-block { display: block; } .u-d-inline-block { display: inline-block; } .u-d-flex { display: -webkit-box; display: -ms-flexbox; display: flex; } .u-d-inline { display: inline; } @media screen and (max-width: 500px) { .u-d-sp-none { display: none; } .u-d-sp-block { display: block; } .u-d-sp-inline-block { display: inline-block; } .u-d-sp-flex { display: -webkit-box; display: -ms-flexbox; display: flex; } .u-d-sp-inline { display: inline; } } @media screen and (max-width: 768px) { .u-d-tb-none { display: none; } .u-d-tb-block { display: block; } .u-d-tb-inline-block { display: inline-block; } .u-d-tb-flex { display: -webkit-box; display: -ms-flexbox; display: flex; } .u-d-tb-inline { display: inline; } } @media screen and (max-width: 960px) { .u-d-pc-none { display: none; } .u-d-pc-block { display: block; } .u-d-pc-inline-block { display: inline-block; } .u-d-pc-flex { display: -webkit-box; display: -ms-flexbox; display: flex; } .u-d-pc-inline { display: inline; } } .u-m-0auto { margin: 0 auto !important; } .u-mt-0 { margin-top: 0 !important; } .u-mt-1em { margin-top: 1em !important; } .u-mt-2em { margin-top: 2em !important; } .u-mt-3em { margin-top: 3em !important; } .u-mb-0 { margin-bottom: 0 !important; } .u-mb-1em { margin-bottom: 1em !important; } .u-mb-2em { margin-bottom: 2em !important; } .u-mb-3em { margin-bottom: 3em !important; } .u-ml-0 { margin-left: 0 !important; } .u-ml-1em { margin-left: 1em !important; } .u-ml-2em { margin-left: 2em !important; } .u-ml-3em { margin-left: 3em !important; } .u-mr-0 { margin-right: 0 !important; } .u-mr-1em { margin-right: 1em !important; } .u-mr-2em { margin-right: 2em !important; } .u-mr-3em { margin-right: 3em !important; } .u-align-left { text-align: left; } .u-align-center { text-align: center; } .u-align-right { text-align: right; } .u-align-justify { text-align: justify; } @media screen and (max-width: 500px) { .u-align-sp-left { text-align: left; } .u-align-sp-center { text-align: center; } .u-align-sp-right { text-align: right; } .u-align-sp-justify { text-align: justify; } } @media screen and (max-width: 768px) { .u-align-tb-left { text-align: left; } .u-align-tb-center { text-align: center; } .u-align-tb-right { text-align: right; } .u-align-tb-justify { text-align: justify; } } @media screen and (max-width: 960px) { .u-align-pc-left { text-align: left; } .u-align-pc-center { text-align: center; } .u-align-pc-right { text-align: right; } .u-align-pc-justify { text-align: justify; } } .u-flex-start-start, .u-flex-start-center, .u-flex-start-end, .u-flex-start-stretch, .u-flex-start-baseline, .u-flex-center-start, .u-flex-center-center, .u-flex-center-end, .u-flex-center-stretch, .u-flex-center-baseline, .u-flex-end-start, .u-flex-end-center, .u-flex-end-end, .u-flex-end-stretch, .u-flex-end-baseline, .u-flex-between-start, .u-flex-between-center, .u-flex-between-end, .u-flex-between-stretch, .u-flex-between-baseline, .u-flex-around-start, .u-flex-around-center, .u-flex-around-end, .u-flex-around-stretch, .u-flex-around-baseline, .u-flex-evenly-start, .u-flex-evenly-center, .u-flex-evenly-end, .u-flex-evenly-stretch, .u-flex-evenly-baseline { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; } .u-flex-start-start.u-flex-wrap, .u-flex-start-center.u-flex-wrap, .u-flex-start-end.u-flex-wrap, .u-flex-start-stretch.u-flex-wrap, .u-flex-start-baseline.u-flex-wrap, .u-flex-center-start.u-flex-wrap, .u-flex-center-center.u-flex-wrap, .u-flex-center-end.u-flex-wrap, .u-flex-center-stretch.u-flex-wrap, .u-flex-center-baseline.u-flex-wrap, .u-flex-end-start.u-flex-wrap, .u-flex-end-center.u-flex-wrap, .u-flex-end-end.u-flex-wrap, .u-flex-end-stretch.u-flex-wrap, .u-flex-end-baseline.u-flex-wrap, .u-flex-between-start.u-flex-wrap, .u-flex-between-center.u-flex-wrap, .u-flex-between-end.u-flex-wrap, .u-flex-between-stretch.u-flex-wrap, .u-flex-between-baseline.u-flex-wrap, .u-flex-around-start.u-flex-wrap, .u-flex-around-center.u-flex-wrap, .u-flex-around-end.u-flex-wrap, .u-flex-around-stretch.u-flex-wrap, .u-flex-around-baseline.u-flex-wrap, .u-flex-evenly-start.u-flex-wrap, .u-flex-evenly-center.u-flex-wrap, .u-flex-evenly-end.u-flex-wrap, .u-flex-evenly-stretch.u-flex-wrap, .u-flex-evenly-baseline.u-flex-wrap { -ms-flex-wrap: wrap; flex-wrap: wrap; } .u-flex-start-start.u-flex-column, .u-flex-start-center.u-flex-column, .u-flex-start-end.u-flex-column, .u-flex-start-stretch.u-flex-column, .u-flex-start-baseline.u-flex-column, .u-flex-center-start.u-flex-column, .u-flex-center-center.u-flex-column, .u-flex-center-end.u-flex-column, .u-flex-center-stretch.u-flex-column, .u-flex-center-baseline.u-flex-column, .u-flex-end-start.u-flex-column, .u-flex-end-center.u-flex-column, .u-flex-end-end.u-flex-column, .u-flex-end-stretch.u-flex-column, .u-flex-end-baseline.u-flex-column, .u-flex-between-start.u-flex-column, .u-flex-between-center.u-flex-column, .u-flex-between-end.u-flex-column, .u-flex-between-stretch.u-flex-column, .u-flex-between-baseline.u-flex-column, .u-flex-around-start.u-flex-column, .u-flex-around-center.u-flex-column, .u-flex-around-end.u-flex-column, .u-flex-around-stretch.u-flex-column, .u-flex-around-baseline.u-flex-column, .u-flex-evenly-start.u-flex-column, .u-flex-evenly-center.u-flex-column, .u-flex-evenly-end.u-flex-column, .u-flex-evenly-stretch.u-flex-column, .u-flex-evenly-baseline.u-flex-column { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .u-flex-start-start.u-flex-row-reverse, .u-flex-start-center.u-flex-row-reverse, .u-flex-start-end.u-flex-row-reverse, .u-flex-start-stretch.u-flex-row-reverse, .u-flex-start-baseline.u-flex-row-reverse, .u-flex-center-start.u-flex-row-reverse, .u-flex-center-center.u-flex-row-reverse, .u-flex-center-end.u-flex-row-reverse, .u-flex-center-stretch.u-flex-row-reverse, .u-flex-center-baseline.u-flex-row-reverse, .u-flex-end-start.u-flex-row-reverse, .u-flex-end-center.u-flex-row-reverse, .u-flex-end-end.u-flex-row-reverse, .u-flex-end-stretch.u-flex-row-reverse, .u-flex-end-baseline.u-flex-row-reverse, .u-flex-between-start.u-flex-row-reverse, .u-flex-between-center.u-flex-row-reverse, .u-flex-between-end.u-flex-row-reverse, .u-flex-between-stretch.u-flex-row-reverse, .u-flex-between-baseline.u-flex-row-reverse, .u-flex-around-start.u-flex-row-reverse, .u-flex-around-center.u-flex-row-reverse, .u-flex-around-end.u-flex-row-reverse, .u-flex-around-stretch.u-flex-row-reverse, .u-flex-around-baseline.u-flex-row-reverse, .u-flex-evenly-start.u-flex-row-reverse, .u-flex-evenly-center.u-flex-row-reverse, .u-flex-evenly-end.u-flex-row-reverse, .u-flex-evenly-stretch.u-flex-row-reverse, .u-flex-evenly-baseline.u-flex-row-reverse { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; } .u-flex-start-start.u-flex-column-reverse, .u-flex-start-center.u-flex-column-reverse, .u-flex-start-end.u-flex-column-reverse, .u-flex-start-stretch.u-flex-column-reverse, .u-flex-start-baseline.u-flex-column-reverse, .u-flex-center-start.u-flex-column-reverse, .u-flex-center-center.u-flex-column-reverse, .u-flex-center-end.u-flex-column-reverse, .u-flex-center-stretch.u-flex-column-reverse, .u-flex-center-baseline.u-flex-column-reverse, .u-flex-end-start.u-flex-column-reverse, .u-flex-end-center.u-flex-column-reverse, .u-flex-end-end.u-flex-column-reverse, .u-flex-end-stretch.u-flex-column-reverse, .u-flex-end-baseline.u-flex-column-reverse, .u-flex-between-start.u-flex-column-reverse, .u-flex-between-center.u-flex-column-reverse, .u-flex-between-end.u-flex-column-reverse, .u-flex-between-stretch.u-flex-column-reverse, .u-flex-between-baseline.u-flex-column-reverse, .u-flex-around-start.u-flex-column-reverse, .u-flex-around-center.u-flex-column-reverse, .u-flex-around-end.u-flex-column-reverse, .u-flex-around-stretch.u-flex-column-reverse, .u-flex-around-baseline.u-flex-column-reverse, .u-flex-evenly-start.u-flex-column-reverse, .u-flex-evenly-center.u-flex-column-reverse, .u-flex-evenly-end.u-flex-column-reverse, .u-flex-evenly-stretch.u-flex-column-reverse, .u-flex-evenly-baseline.u-flex-column-reverse { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; } .u-flex-start-start.u-flex-grow-1, .u-flex-start-center.u-flex-grow-1, .u-flex-start-end.u-flex-grow-1, .u-flex-start-stretch.u-flex-grow-1, .u-flex-start-baseline.u-flex-grow-1, .u-flex-center-start.u-flex-grow-1, .u-flex-center-center.u-flex-grow-1, .u-flex-center-end.u-flex-grow-1, .u-flex-center-stretch.u-flex-grow-1, .u-flex-center-baseline.u-flex-grow-1, .u-flex-end-start.u-flex-grow-1, .u-flex-end-center.u-flex-grow-1, .u-flex-end-end.u-flex-grow-1, .u-flex-end-stretch.u-flex-grow-1, .u-flex-end-baseline.u-flex-grow-1, .u-flex-between-start.u-flex-grow-1, .u-flex-between-center.u-flex-grow-1, .u-flex-between-end.u-flex-grow-1, .u-flex-between-stretch.u-flex-grow-1, .u-flex-between-baseline.u-flex-grow-1, .u-flex-around-start.u-flex-grow-1, .u-flex-around-center.u-flex-grow-1, .u-flex-around-end.u-flex-grow-1, .u-flex-around-stretch.u-flex-grow-1, .u-flex-around-baseline.u-flex-grow-1, .u-flex-evenly-start.u-flex-grow-1, .u-flex-evenly-center.u-flex-grow-1, .u-flex-evenly-end.u-flex-grow-1, .u-flex-evenly-stretch.u-flex-grow-1, .u-flex-evenly-baseline.u-flex-grow-1 { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; } .u-flex-start-start.u-flex-grow-0, .u-flex-start-center.u-flex-grow-0, .u-flex-start-end.u-flex-grow-0, .u-flex-start-stretch.u-flex-grow-0, .u-flex-start-baseline.u-flex-grow-0, .u-flex-center-start.u-flex-grow-0, .u-flex-center-center.u-flex-grow-0, .u-flex-center-end.u-flex-grow-0, .u-flex-center-stretch.u-flex-grow-0, .u-flex-center-baseline.u-flex-grow-0, .u-flex-end-start.u-flex-grow-0, .u-flex-end-center.u-flex-grow-0, .u-flex-end-end.u-flex-grow-0, .u-flex-end-stretch.u-flex-grow-0, .u-flex-end-baseline.u-flex-grow-0, .u-flex-between-start.u-flex-grow-0, .u-flex-between-center.u-flex-grow-0, .u-flex-between-end.u-flex-grow-0, .u-flex-between-stretch.u-flex-grow-0, .u-flex-between-baseline.u-flex-grow-0, .u-flex-around-start.u-flex-grow-0, .u-flex-around-center.u-flex-grow-0, .u-flex-around-end.u-flex-grow-0, .u-flex-around-stretch.u-flex-grow-0, .u-flex-around-baseline.u-flex-grow-0, .u-flex-evenly-start.u-flex-grow-0, .u-flex-evenly-center.u-flex-grow-0, .u-flex-evenly-end.u-flex-grow-0, .u-flex-evenly-stretch.u-flex-grow-0, .u-flex-evenly-baseline.u-flex-grow-0 { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; } .u-flex-start-start.u-flex-shrink-1, .u-flex-start-center.u-flex-shrink-1, .u-flex-start-end.u-flex-shrink-1, .u-flex-start-stretch.u-flex-shrink-1, .u-flex-start-baseline.u-flex-shrink-1, .u-flex-center-start.u-flex-shrink-1, .u-flex-center-center.u-flex-shrink-1, .u-flex-center-end.u-flex-shrink-1, .u-flex-center-stretch.u-flex-shrink-1, .u-flex-center-baseline.u-flex-shrink-1, .u-flex-end-start.u-flex-shrink-1, .u-flex-end-center.u-flex-shrink-1, .u-flex-end-end.u-flex-shrink-1, .u-flex-end-stretch.u-flex-shrink-1, .u-flex-end-baseline.u-flex-shrink-1, .u-flex-between-start.u-flex-shrink-1, .u-flex-between-center.u-flex-shrink-1, .u-flex-between-end.u-flex-shrink-1, .u-flex-between-stretch.u-flex-shrink-1, .u-flex-between-baseline.u-flex-shrink-1, .u-flex-around-start.u-flex-shrink-1, .u-flex-around-center.u-flex-shrink-1, .u-flex-around-end.u-flex-shrink-1, .u-flex-around-stretch.u-flex-shrink-1, .u-flex-around-baseline.u-flex-shrink-1, .u-flex-evenly-start.u-flex-shrink-1, .u-flex-evenly-center.u-flex-shrink-1, .u-flex-evenly-end.u-flex-shrink-1, .u-flex-evenly-stretch.u-flex-shrink-1, .u-flex-evenly-baseline.u-flex-shrink-1 { -ms-flex-negative: 1; flex-shrink: 1; } .u-flex-start-start.u-flex-shrink-o, .u-flex-start-center.u-flex-shrink-o, .u-flex-start-end.u-flex-shrink-o, .u-flex-start-stretch.u-flex-shrink-o, .u-flex-start-baseline.u-flex-shrink-o, .u-flex-center-start.u-flex-shrink-o, .u-flex-center-center.u-flex-shrink-o, .u-flex-center-end.u-flex-shrink-o, .u-flex-center-stretch.u-flex-shrink-o, .u-flex-center-baseline.u-flex-shrink-o, .u-flex-end-start.u-flex-shrink-o, .u-flex-end-center.u-flex-shrink-o, .u-flex-end-end.u-flex-shrink-o, .u-flex-end-stretch.u-flex-shrink-o, .u-flex-end-baseline.u-flex-shrink-o, .u-flex-between-start.u-flex-shrink-o, .u-flex-between-center.u-flex-shrink-o, .u-flex-between-end.u-flex-shrink-o, .u-flex-between-stretch.u-flex-shrink-o, .u-flex-between-baseline.u-flex-shrink-o, .u-flex-around-start.u-flex-shrink-o, .u-flex-around-center.u-flex-shrink-o, .u-flex-around-end.u-flex-shrink-o, .u-flex-around-stretch.u-flex-shrink-o, .u-flex-around-baseline.u-flex-shrink-o, .u-flex-evenly-start.u-flex-shrink-o, .u-flex-evenly-center.u-flex-shrink-o, .u-flex-evenly-end.u-flex-shrink-o, .u-flex-evenly-stretch.u-flex-shrink-o, .u-flex-evenly-baseline.u-flex-shrink-o { -ms-flex-negative: 0; flex-shrink: 0; } .u-flex-start-start, .u-flex-start-center, .u-flex-start-end, .u-flex-start-stretch, .u-flex-start-baseline { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; } .u-flex-center-start, .u-flex-center-center, .u-flex-center-end, .u-flex-center-stretch, .u-flex-center-baseline { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .u-flex-end-start, .u-flex-end-center, .u-flex-end-end, .u-flex-end-stretch, .u-flex-end-baseline { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; } .u-flex-between-start, .u-flex-between-center, .u-flex-between-end, .u-flex-between-stretch, .u-flex-between-baseline { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; } .u-flex-around-start, .u-flex-around-center, .u-flex-around-end, .u-flex-around-stretch, .u-flex-around-baseline { -ms-flex-pack: distribute; justify-content: space-around; } .u-flex-evenly-start, .u-flex-evenly-center, .u-flex-evenly-end, .u-flex-evenly-stretch, .u-flex-evenly-baseline { -webkit-box-pack: space-evenly; -ms-flex-pack: space-evenly; justify-content: space-evenly; } .u-flex-start-start, .u-flex-center-start, .u-flex-end-start, .u-flex-between-start, .u-flex-around-start, .u-flex-evenly-start { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .u-flex-start-center, .u-flex-center-center, .u-flex-end-center, .u-flex-between-center, .u-flex-around-center, .u-flex-evenly-center { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .u-flex-start-end, .u-flex-center-end, .u-flex-end-end, .u-flex-between-end, .u-flex-around-end, .u-flex-evenly-end { -webkit-box-align: end; -ms-flex-align: end; align-items: end; } .u-flex-start-stretch, .u-flex-center-stretch, .u-flex-end-stretch, .u-flex-between-stretch, .u-flex-around-stretch, .u-flex-evenly-stretch { -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; } .u-flex-start-baseline, .u-flex-center-baseline, .u-flex-end-baseline, .u-flex-between-baseline, .u-flex-around-baseline, .u-flex-evenly-baseline { -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } /*# sourceMappingURL=style.css.map */