@charset "UTF-8"; /*** The new CSS reset - version 1.7.3 (last updated 7.8.2022) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug */ *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu { list-style: none; } /* For images to not be able to exceed their container */ img { max-width: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; -moz-appearance: revert; appearance: revert; } /* reset default text opacity of input placeholder */ ::-moz-placeholder { color: unset; } ::placeholder { color: unset; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable=false])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable=true]) { -webkit-user-drag: element; } [data-scroll-view=scaleIn] img { transform: scale(1.2); transition: all 2s cubic-bezier(0.25, 1, 0.5, 1); } .-animated[data-scroll-view=scaleIn] img { transform: scale(1); } html { font-size: 62.5%; } body { background: #F7F6F2; color: #33383D; font-family: "Shippori Mincho", serif; font-size: 1.5rem; letter-spacing: 0; line-height: 2; text-align: justify; min-width: 375px; } @media screen and (min-width: 961px) { body { overflow-y: scroll; min-width: 1140px; } } body.is-fixed { position: fixed; top: 0; left: 0; width: 100%; height: 100vh; } img, svg { display: block; width: 100%; height: auto; max-width: 100%; } @media screen and (min-width: 961px) { img, svg { width: auto; } } .c-svg-sprite { display: none; } a, button { cursor: pointer; } @media screen and (min-width: 961px) { .l-wrapper { min-width: 1080px; } } .l-inner { max-width: 1100px; margin-inline: auto; padding-inline: 30px; } @media screen and (max-width: 960px) { .l-inner { padding-inline: 8.8vw; } } .c-loading { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999; background-color: #F7F6F2; text-align: center; display: flex; flex-direction: column; justify-content: center; align-items: center; } .c-loading__logo { width: 135px; height: 117px; } .c-loading__logo img { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } .-loaded .c-loading { opacity: 0; pointer-events: none; transition: opacity 1.2s ease; } .c-svg-sprite { display: none; width: 0; height: 0; opacity: 0; overflow: hidden; } .c-title { display: block; } .c-title__jp { font-size: 1.4rem; font-weight: 700; letter-spacing: -0.07em; line-height: 1; } .c-title__en { display: inline-block; margin-top: 12px; font-family: "Hurricane"; font-size: 9.8rem; font-weight: 400; letter-spacing: 0; line-height: 0.6122; width: auto; height: auto; } @media screen and (max-width: 960px) { .c-title__en { margin-top: 7px; max-width: 100%; font-size: 6rem; letter-spacing: -0.04em; line-height: 0.75; } } .p-top-concept .c-title__en { width: 230px; } @media screen and (max-width: 960px) { .p-top-concept .c-title__en { width: 142px; } } .p-top-features .c-title__en { width: 211px; } @media screen and (max-width: 960px) { .p-top-features .c-title__en { width: 131px; } } .p-top-facility .c-title__en { width: 591px; } @media screen and (max-width: 960px) { .p-top-facility .c-title__en { width: 366px; } } .p-top-news .c-title__en { width: 479px; } @media screen and (max-width: 960px) { .p-top-news .c-title__en { width: 297px; } } .pagination { margin-top: 20px; } .nav-links { display: flex; align-items: center; gap: 9px; } .page-numbers:not(.prev):not(.next) { display: flex; justify-content: center; align-items: center; width: 43px; height: 43px; border-radius: 3px; font-family: "EB Garamond", serif; font-size: 2.4rem; font-weight: 700; letter-spacing: 0; line-height: 1; } a.page-numbers { transition: all 0.4s linear; } a.page-numbers:hover { opacity: 0.6; } .page-numbers.current { background: #CFCAB9; } .page-numbers.dots { background: transparent; -webkit-backdrop-filter: 0; backdrop-filter: 0; letter-spacing: -0.04em; } .page-numbers.prev svg, .page-numbers.next svg { width: 19px; height: 15px; } .page-numbers.prev { transform: scale(-1, 1); } .c-modal { position: fixed; top: 0; left: 0; z-index: 9999; width: 100vw; height: 100dvh; display: none; animation: fade-In 0.3s linear; } .c-modal.is-open { display: block; } @keyframes fade-In { from { opacity: 0; } to { opacity: 1; } } .c-modal__overlay { display: grid; place-items: center; width: 100%; height: 100%; background: rgba(217, 217, 217, 0.6); } .c-modal__close { position: absolute; z-index: 1; top: 20px; right: 20px; display: grid; place-items: center; width: 24px; height: 24px; transition: all 0.4s linear; } @media screen and (max-width: 960px) { .c-modal__close { top: 10px; right: 10px; } } .c-modal__close a:hover { opacity: 0.6; } .c-modal__close::before { content: ""; position: absolute; width: 100%; height: 1px; background: #33383D; transform: rotate(45deg); } .c-modal__close::after { content: ""; position: absolute; width: 100%; height: 1px; background: #33383D; transform: rotate(-45deg); } .c-modal__container { position: relative; z-index: 0; display: flex; width: 800px; max-height: 90vh; border-radius: 8px; background-color: #fff; padding: 20px; overflow: hidden; text-align: left; box-shadow: 0px 4px 4px -1px rgba(12, 12, 13, 0.1), 0px 4px 4px -1px rgba(12, 12, 13, 0.05); } @media screen and (max-width: 960px) { .c-modal__container { width: 85%; max-width: 400px; display: block; overflow-y: auto; padding: 34px 20px; } } .c-modal__main { position: relative; display: flex; align-items: center; gap: 54px; } @media screen and (max-width: 960px) { .c-modal__main { flex-direction: column; gap: 20px; } } .c-modal__title { position: absolute; top: 26px; left: 33px; max-width: 37%; color: #fff; font-size: 2.9rem; font-weight: 700; letter-spacing: 0.03em; line-height: 1.17; } @media screen and (max-width: 960px) { .c-modal__title { max-width: 75%; } } .c-modal__title span { font-size: 1.8rem; } .c-modal__image { flex-shrink: 0; width: 345px; height: auto; aspect-ratio: 1/1; border-radius: 14px; overflow: hidden; } @media screen and (max-width: 960px) { .c-modal__image { width: 100%; } } .c-modal__image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .c-modal__content { width: 100%; } .c-modal__text { margin-top: 2px; font-size: 1.5rem; font-weight: 600; letter-spacing: 0; line-height: 1.4666; } @media screen and (max-width: 960px) { .c-modal__text { font-size: 1.4rem; } } .c-modal__text span { font-size: 2.4rem; font-weight: 700; letter-spacing: 0.01em; line-height: 1.8; } @media screen and (max-width: 960px) { .c-modal__text span { font-size: 1.8rem; } } .c-modal__list { display: grid; grid-template-columns: repeat(2, auto); gap: 10px; margin-top: 30px; } @media screen and (max-width: 960px) { .c-modal__list { margin-top: 20px; } } .c-modal__button a { display: flex; align-items: center; justify-content: center; width: 164px; height: 52px; border-radius: 57px; background: #1D668F; padding: 0 16px; color: #fff; font-size: 1.6rem; font-weight: 500; letter-spacing: 0.03em; line-height: 1; text-decoration: underline; transition: all 0.4s linear; } @media screen and (max-width: 960px) { .c-modal__button a { width: auto; height: 46px; font-size: 1.3rem; } } .c-modal__button a:hover { opacity: 0.6; } .p-top-first { position: relative; overflow: hidden; } .p-top-first__scroll { position: absolute; z-index: 2; right: -34vw; width: 100%; white-space: nowrap; transform: rotate(90deg); } @media screen and (max-width: 960px) { .p-top-first__scroll { right: -28vw; } } .p-top-first__scroll-track { display: inline-block; animation: scroll-left linear infinite; animation-duration: var(--scroll-duration, 40s); } .p-top-first__scroll-text { display: inline-block; padding-right: 0.2em; color: #fff; font-family: "EB Garamond", serif; font-size: 25vw; font-weight: 700; letter-spacing: -0.02em; line-height: 1; white-space: nowrap; } @media screen and (max-width: 960px) { .p-top-first__scroll-text { font-size: 53.33vw; } } .p-top-mv { position: relative; z-index: 3; width: 100%; height: 100vh; overflow: hidden; } @media screen and (max-width: 960px) { .p-top-mv { height: auto; } } .p-top-mv__first { position: relative; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; transition: all 2.5s cubic-bezier(0.25, 1, 0.5, 1); } @media screen and (max-width: 960px) { .p-top-mv__first { height: auto; aspect-ratio: 1/1; } } .p-top-mv__first.is-active { width: 60%; padding: 110px 42px 42px; } @media screen and (max-width: 960px) { .p-top-mv__first.is-active { width: 100%; padding: 15px; } } .p-top-mv__poster { width: 100%; height: 100%; overflow: hidden; transition: all 3s cubic-bezier(0.25, 1, 0.5, 1); } .p-top-mv__poster.is-active { border-radius: 23px; } .p-top-mv__poster img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .p-top-mv__video { display: none; width: 100%; height: 100%; overflow: hidden; border-radius: 23px; } .p-top-mv__video video { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .p-top-mv__title { position: absolute; width: 403px; } @media screen and (max-width: 960px) { .p-top-mv__title { width: 221px; } } .p-top-mv__title.is-fadeIn { opacity: 1; } .p-top-mv__text-area { position: absolute; bottom: 68px; right: 9vw; opacity: 0; transition: all 2s cubic-bezier(0.25, 1, 0.5, 1); } @media screen and (max-width: 960px) { .p-top-mv__text-area { position: static; margin-top: 25px; padding-inline: 8.8vw; } } .p-top-mv__text-area.is-fadeIn { opacity: 1; } .p-top-mv__text-en { font-family: "EB Garamond", serif; font-size: 1.25vw; font-weight: 700; letter-spacing: 0.01em; line-height: 1.8; } @media screen and (max-width: 960px) { .p-top-mv__text-en { font-size: 1.2rem; } } .p-top-mv__text-jp { margin-top: 25px; font-size: 3.84vw; font-weight: 600; letter-spacing: -0.1em; line-height: 1.3; } @media screen and (max-width: 960px) { .p-top-mv__text-jp { margin-top: 20px; font-size: 3.8rem; } } .p-top-concept { position: relative; z-index: 3; margin-top: 88px; } @media screen and (max-width: 960px) { .p-top-concept { margin-top: 80px; } } .p-top-concept__wrapper { display: flex; justify-content: space-between; } @media screen and (max-width: 960px) { .p-top-concept__wrapper { flex-direction: column-reverse; } } .p-top-concept__text-area { flex-shrink: 0; } @media screen and (max-width: 960px) { .p-top-concept__text-area { position: relative; margin-top: 12px; } } .p-top-concept__text-area::before { content: ""; position: absolute; top: 157px; left: 0; z-index: -1; width: 100%; height: 226px; background-color: #F7F6F2; background-image: url(../images/top/top_border01.webp); background-repeat: no-repeat; background-size: 100% 100%; background-position: center top; opacity: 0.2; } @media screen and (max-width: 960px) { .p-top-concept__text-area::before { top: 132px; left: -8.8vw; width: 100vw; height: 147px; background-size: auto 100%; background-position: -50px top; } } .p-top-concept__catch { margin-top: 104px; width: 392px; } @media screen and (max-width: 960px) { .p-top-concept__catch { margin-top: 30px; width: 309px; } } .p-top-concept__catch span { font-family: "EB Garamond", serif; font-size: 4rem; font-weight: 600; letter-spacing: 0.05em; line-height: 1.06; } .p-top-concept__text { margin-top: 82px; font-size: 1.6rem; font-weight: 700; letter-spacing: 0.05em; line-height: 2; } @media screen and (max-width: 960px) { .p-top-concept__text { margin-top: 40px; } } .p-top-concept__picture { width: 552px; height: auto; aspect-ratio: 552/350; margin-top: -20px; margin-left: -16px; } @media screen and (max-width: 960px) { .p-top-concept__picture { width: 105vw; margin-top: 54px; margin-left: -17.8vw; } } .p-top-concept__image-area { margin-top: 58px; } @media screen and (max-width: 960px) { .p-top-concept__image-area { margin-top: 0; } } .p-top-concept__image { height: auto; aspect-ratio: 1/1; border-radius: 23px; overflow: hidden; } .p-top-concept__image:nth-of-type(1) { width: 450px; margin-right: 60px; } @media screen and (max-width: 960px) { .p-top-concept__image:nth-of-type(1) { width: 100%; margin: 0; } } .p-top-concept__image:nth-of-type(2) { width: 280px; margin-top: 30px; margin-left: auto; } @media screen and (max-width: 960px) { .p-top-concept__image:nth-of-type(2) { width: 32.8vw; margin-right: -8.8vw; margin-top: -20vw; } } .p-top-concept__image video { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .p-top-features { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; margin-top: -45px; } @media screen and (max-width: 960px) { .p-top-features { margin-top: 38px; } } .p-top-features::before { content: ""; position: absolute; top: -400px; z-index: 2; width: 100%; height: 1740px; background: url(../images/top/bg_obj01.webp) top center/cover; } .p-top-features__wrapper { position: relative; z-index: 3; overflow: hidden; width: 100%; } .p-top-features__head { align-self: flex-end; max-width: 1100px; width: 100%; margin-inline: auto; padding: 0 30px; display: flex; } .p-top-features .c-title { margin-left: auto; } @media screen and (max-width: 960px) { .p-top-features .c-title { margin-left: 0; } } .p-top-features__slider { position: relative; left: 50%; width: 1700px; margin-top: 88px; padding: 0 95px; overflow: hidden; transform: translate(-50%); } @media screen and (max-width: 960px) { .p-top-features__slider { width: 100%; margin-top: 45px; } } .p-top-features__slider .swiper { overflow: visible; padding-bottom: 83px; } @media screen and (max-width: 960px) { .p-top-features__slider .swiper { padding-bottom: 44px; } } .swiper-slide { position: relative; } .p-top-features__item { position: relative; width: 488px; margin-top: 28px; background: #fff; border-radius: 8px; border-top-right-radius: 47px; padding: 14px; opacity: 0; pointer-events: none; transition: all 0.4s ease; } @media screen and (max-width: 960px) { .p-top-features__item { display: flex; flex-direction: column; width: 256px; height: auto; border-radius: 4px; border-top-right-radius: 15px; margin-top: 20px; padding: 7px; } } .p-top-features__item.swiper-slide-active { opacity: 1; pointer-events: visible; } .p-top-features__item.swiper-slide-duplicate-next, .p-top-features__item.swiper-slide-next { opacity: 1; pointer-events: visible; } .p-top-features__item.swiper-slide-duplicate-prev, .p-top-features__item.swiper-slide-prev { opacity: 1; pointer-events: visible; } .p-top-features__num { position: absolute; top: -28px; right: 43px; font-family: "EB Garamond", serif; font-size: 7rem; font-weight: 700; letter-spacing: -0.03em; line-height: 1; } @media screen and (max-width: 960px) { .p-top-features__num { top: -20px; right: 17px; font-size: 4rem; } } .p-top-features__num.-color01 { color: #1D668F; } .p-top-features__num.-color02 { color: #B2A989; } .p-top-features__num.-color03 { color: #1D8F3D; } .p-top-features__num.-color04 { color: #363732; } .p-top-features__title-en { position: absolute; top: 30px; left: 30px; font-family: "EB Garamond", serif; font-size: 1.4rem; font-weight: 700; letter-spacing: 0.01em; line-height: 1.8; } @media screen and (max-width: 960px) { .p-top-features__title-en { top: 16px; left: 16px; font-size: 1.2rem; } } .p-top-features__text-area { margin-top: 176px; padding: 0 43px; } @media screen and (max-width: 960px) { .p-top-features__text-area { margin-top: 90px; padding: 0 20px; } } .p-top-features__title-jp { font-size: 3.2rem; font-weight: 700; letter-spacing: 0.05em; line-height: 1; } @media screen and (max-width: 960px) { .p-top-features__title-jp { font-size: 1.7rem; } } .p-top-features__text { padding-bottom: 46px; margin-top: 14px; font-size: 1.6rem; font-weight: 700; letter-spacing: -0.05em; line-height: 1.68; } @media screen and (max-width: 960px) { .p-top-features__text { padding-bottom: 20px; margin-top: 7px; font-size: 1.2rem; } } .p-top-features__image { margin-top: auto; width: 100%; height: auto; aspect-ratio: 460/252; border-radius: 23px; overflow: hidden; } @media screen and (max-width: 960px) { .p-top-features__image { border-radius: 5px; } } .p-top-features__image image, .p-top-features__image video { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .p-top-features__slider-button-wrap { position: relative; z-index: 1; display: flex; justify-content: center; gap: 27px; margin-top: -42px; } @media screen and (max-width: 960px) { .p-top-features__slider-button-wrap { margin-top: 0; gap: 14px; } } .p-top-features__slider-button { width: 58px; height: 58px; } .p-top-features__slider-button.-prev { transform: scale(-1, 1); } .p-top-features__slider-button img { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } .p-top-workation { position: relative; z-index: 4; width: 100%; height: 100svh; margin-top: 113px; color: #fff; } @media screen and (max-width: 960px) { .p-top-workation { margin-top: 95px; } } .p-top-workation__wrapper { width: 100%; height: 100%; } .p-top-workation__inner { position: relative; width: 100%; height: 100%; max-width: 1100px; margin-inline: auto; padding: 0 30px; } @media screen and (max-width: 960px) { .p-top-workation__inner { padding: 0 8.8vw; } } .p-top-workation__title { position: absolute; z-index: 1; top: 120px; left: 30px; } @media screen and (max-width: 960px) { .p-top-workation__title { top: 100px; left: 8.8vw; } } .p-top-workation__title-jp { font-size: 2.4rem; font-weight: 700; letter-spacing: -0.07em; line-height: 1; } @media screen and (max-width: 960px) { .p-top-workation__title-jp { font-size: 1.5rem; } } .p-top-workation__title-en { display: inline-block; margin-top: 8px; font-family: "EB Garamond", serif; font-size: 8rem; font-weight: 600; letter-spacing: 0.06em; line-height: 1; } @media screen and (max-width: 960px) { .p-top-workation__title-en { font-size: 5.6rem; } } .p-top-workation__bg-wrap { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .p-top-workation__bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .p-top-workation__bg::before { content: ""; position: absolute; width: 100%; height: 100%; background: linear-gradient(0deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)); } .p-top-workation__bg img, .p-top-workation__bg video { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .p-top-workation__text-area { position: absolute; bottom: 120px; right: 30px; width: 368px; height: auto; } @media screen and (max-width: 960px) { .p-top-workation__text-area { bottom: 50px; left: 0; width: 100%; } } .p-top-workation__text-item { position: absolute; bottom: 0; left: 0; } @media screen and (max-width: 960px) { .p-top-workation__text-item { padding: 0 8.8vw; } } .p-top-workation__text-item { opacity: 0; } .p-top-workation__read { font-size: 3rem; font-weight: 700; letter-spacing: 0; line-height: 1.3; } @media screen and (max-width: 960px) { .p-top-workation__read { font-size: 1.6rem; } } .p-top-workation__text { margin-top: 32px; font-size: 1.5rem; font-weight: 500; letter-spacing: 0; line-height: 2; } @media screen and (max-width: 960px) { .p-top-workation__text { margin-top: 10px; font-size: 1.2rem; } } .p-top-facility { position: relative; margin-top: 140px; overflow: hidden; } @media screen and (max-width: 960px) { .p-top-facility { margin-top: 60px; } } .p-top-facility::before { content: ""; position: absolute; top: 200px; z-index: 0; width: 100%; height: 1740px; background: url(../images/top/bg_obj01.webp) top center/cover; } .p-top-facility__head { display: flex; align-items: flex-end; justify-content: space-between; } @media screen and (max-width: 960px) { .p-top-facility__head { display: block; } } .p-top-facility__category { display: flex; flex-wrap: wrap; gap: 23px; margin-bottom: 20px; } @media screen and (max-width: 960px) { .p-top-facility__category { margin-top: 30px; } } .p-top-facility__category-item { font-size: 1.8rem; font-weight: 500; letter-spacing: 0.03em; line-height: 1.65; text-decoration: underline; } .p-top-facility__category-item.is-current { color: #1D668F; font-weight: 700; } @media screen and (min-width: 961px) { .p-top-facility__category-item button { transition: opacity 0.4s linear; } .p-top-facility__category-item button:focus { opacity: 0.6; } .p-top-facility__category-item button:hover { opacity: 0.6; } } .p-top-facility__region { display: flex; gap: 14px; margin-top: 40px; } @media screen and (max-width: 960px) { .p-top-facility__region { margin-top: 26px; } } .p-top-facility__region-item { min-width: 146px; width: auto; height: 52px; padding: 0 19px; border-radius: 5px; border: 1px solid #33383D; } .p-top-facility__region-item.is-current { background: #1D668F; color: #fff; } .p-top-facility__region-item button { display: flex; justify-content: center; align-items: center; gap: 10px; width: auto; height: 100%; } @media screen and (min-width: 961px) { .p-top-facility__region-item button { transition: opacity 0.4s linear; } .p-top-facility__region-item button:focus { opacity: 0.6; } .p-top-facility__region-item button:hover { opacity: 0.6; } } .p-top-facility__region-item p { font-size: 1.5rem; font-weight: 500; letter-spacing: 0.03em; line-height: 1; text-decoration: underline; } .p-top-facility__region-item span { display: inline-block; font-family: "EB Garamond", serif; font-size: 1.2rem; font-weight: 400; line-height: 1; text-decoration: none; } .p-top-facility__slider { position: relative; margin-top: 70px; } @media screen and (max-width: 960px) { .p-top-facility__slider { margin-top: 60px; } } .p-top-facility__slider .swiper { overflow: visible; } .p-top-facility__item { width: 416px; border-radius: 19px; background: #fff; padding: 38px; border: 1px solid #CFCAB9; } @media screen and (max-width: 960px) { .p-top-facility__item { width: 315px; padding: 29px; border-radius: 14px; } } .p-top-facility__item.is-hidden { display: none; } .p-top-facility__image { width: 100%; height: auto; aspect-ratio: 1/1; border-radius: 14px; overflow: hidden; } @media screen and (max-width: 960px) { .p-top-facility__image { border-radius: 9px; } } .p-top-facility__image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .p-top-facility__info-area { margin-top: 22px; } @media screen and (max-width: 960px) { .p-top-facility__info-area { margin-top: 28px; } } .p-top-facility__place { color: #1D668F; font-size: 1.6rem; font-weight: 700; letter-spacing: 0.03em; line-height: 1.5; } .p-top-facility__name { font-size: 1.5rem; font-weight: 700; letter-spacing: 0.03em; line-height: 1.65; } .p-top-facility__text { margin-top: 10px; font-size: 1.2rem; font-weight: 500; letter-spacing: 0.03em; line-height: 1.4166; } .p-top-facility__button-area { display: grid; grid-template-columns: repeat(2, 1fr); gap: 9px; margin-top: 18px; } .p-top-facility__button { display: flex; align-items: center; justify-content: center; height: 52px; border-radius: 38px; border: 1px solid #33383D; font-size: 1.5rem; font-weight: 500; letter-spacing: 0.03em; line-height: 1; text-decoration: underline; transition: all 0.4s linear; } @media screen and (max-width: 960px) { .p-top-facility__button { height: 39px; font-size: 1.3rem; } } .p-top-facility__button:hover { background: #1D668F; border: 1px solid #1D668F; color: #fff; } .p-top-facility__slider-button { position: absolute; z-index: 1; top: 176px; width: 58px; height: 58px; } @media screen and (max-width: 960px) { .p-top-facility__slider-button { top: 120px; } } .p-top-facility__slider-button.-prev { transform: translateX(-50%) scale(-1, 1); } @media screen and (max-width: 960px) { .p-top-facility__slider-button.-prev { transform: translateX(-12px) scale(-1, 1); } } .p-top-facility__slider-button.-next { right: 0; transform: translateX(50%); } @media screen and (max-width: 960px) { .p-top-facility__slider-button.-next { transform: translateX(12px); } } .p-top-facility__slider-button img { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } .p-top-recruit { display: flex; align-items: center; background: #F1F0EB; } .p-top-recruit__scroll { position: absolute; width: 100%; overflow: hidden; white-space: nowrap; } .p-top-recruit__scroll-track { display: inline-block; animation: scroll-left linear infinite; animation-duration: var(--scroll-duration, 40s); } @keyframes scroll-left { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } } .p-top-recruit__scroll-text { display: inline-block; padding-right: 0.2em; color: #fff; font-family: "EB Garamond", serif; font-size: 32rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1; white-space: nowrap; } @media screen and (max-width: 960px) { .p-top-recruit__scroll-text { font-size: 15.5rem; } } .p-top-recruit__wrapper { width: 100%; height: 100svh; background: url(../images/top/recruit_bg.webp) center center/cover; margin: 0 auto; text-align: center; color: #fff; will-change: clip-path; clip-path: circle(80% at 50% 50%); } .p-top-recruit__text-area { padding-top: 12.5vh; opacity: 0; } @media screen and (max-width: 960px) { .p-top-recruit__text-area { padding: 0; } } .p-top-recruit__text-en { font-family: "EB Garamond", serif; font-size: 1.4rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.44; } .p-top-recruit__title { margin-top: 16.25vh; font-family: "EB Garamond", serif; font-size: 16rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.44; } @media screen and (max-width: 960px) { .p-top-recruit__title { margin-top: 35.77vh; font-size: 5rem; } } .p-top-recruit__text-jp { margin-top: -40px; font-size: 2rem; font-weight: 700; letter-spacing: -0.07em; line-height: 1; } @media screen and (max-width: 960px) { .p-top-recruit__text-jp { margin-top: -10px; font-size: 1.4rem; } } .p-top-recruit__button { width: 138px; height: 52px; margin: 7vh auto 0; } @media screen and (max-width: 960px) { .p-top-recruit__button { margin-top: 12.84vh; } } .p-top-recruit__button a { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; border-radius: 57px; border: 1px solid #fff; font-size: 1.5rem; font-weight: 500; letter-spacing: 0.03em; line-height: 1; text-decoration: underline; } .p-top-news { position: relative; margin-top: 140px; } @media screen and (max-width: 960px) { .p-top-news { margin-top: 60px; } } .p-top-news::before { content: ""; position: absolute; top: -70px; left: 0; z-index: -1; width: 100%; height: 226px; background-color: #F7F6F2; background-image: url(../images/top/top_border01.webp); background-repeat: no-repeat; background-size: 100% 100%; background-position: center top; opacity: 0.2; transform: scale(-1, 1); } @media screen and (max-width: 960px) { .p-top-news::before { top: 10px; left: 0; width: 100vw; height: 106px; background-size: auto 100%; background-position: -26px top; } } .p-top-news__head { display: flex; justify-content: space-between; align-items: flex-end; } @media screen and (max-width: 960px) { .p-top-news__head { display: block; } } .p-top-news__link { margin-bottom: 20px; } @media screen and (max-width: 960px) { .p-top-news__link { margin: 0; } } .p-top-news__link a { font-size: 1.5rem; font-weight: 500; letter-spacing: 0.03em; line-height: 1.65; text-decoration: underline; } .p-top-news__list { margin-top: 90px; } @media screen and (max-width: 960px) { .p-top-news__list { margin-top: 60px; } } .p-top-news__item { border: 1px solid #CFCAB9; border-bottom: none; overflow: hidden; } .p-top-news__item:first-of-type { border-top-left-radius: 15px; border-top-right-radius: 15px; } .p-top-news__item:last-of-type { border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; border-bottom: 1px solid #CFCAB9; } .p-top-news__item a { display: flex; transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); } .p-top-news__item a:hover { background: #1D668F; color: #fff; } .p-top-news__item a:hover .p-top-news__image { margin-left: 0; } .p-top-news__image { width: 22.59%; margin-left: -22.6%; transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); } @media screen and (max-width: 960px) { .p-top-news__image { display: none; } } .p-top-news__image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .p-top-news__text-area { padding: 40px 50px; } @media screen and (max-width: 960px) { .p-top-news__text-area { padding: 32px 30px; } } .p-top-news__date { font-size: 1.6rem; font-weight: 500; letter-spacing: 0.05em; line-height: 1; } .p-top-news__title { margin-top: 8px; font-size: 2.4rem; font-weight: 500; letter-spacing: 0.05em; line-height: 1; text-decoration: underline; } @media screen and (max-width: 960px) { .p-top-news__title { font-size: 1.5rem; } } .p-top-contact { position: relative; margin-top: 140px; padding-bottom: 30px; } @media screen and (max-width: 960px) { .p-top-contact { margin-top: 80px; padding: 0 8.8vw 33px; } } .p-top-contact__wrapper { max-width: 1220px; margin: 0 auto; padding: 80px 120px; background: #33383D; border-radius: 10px; color: #fff; } @media screen and (max-width: 960px) { .p-top-contact__wrapper { text-align: center; padding: 40px 30px; } } .p-top-contact__head { display: flex; align-items: center; justify-content: space-between; } @media screen and (max-width: 960px) { .p-top-contact__head { display: block; } } .p-top-contact__title { display: flex; align-items: center; gap: 10px; } @media screen and (max-width: 960px) { .p-top-contact__title { display: block; } } .p-top-contact__title-en { font-family: "EB Garamond", serif; font-size: 4rem; font-weight: 700; letter-spacing: 0; line-height: 1; } .p-top-contact__title-jp { font-size: 1.4rem; font-weight: 400; letter-spacing: 0.02em; line-height: 1; } .p-top-contact__read { font-size: 2rem; font-weight: 700; letter-spacing: 0; line-height: 1.45; } @media screen and (max-width: 960px) { .p-top-contact__read { margin-top: 20px; font-size: 1.4rem; } } .p-top-contact__content { display: grid; grid-template-columns: repeat(2, 1fr); border: 1px solid rgba(255, 255, 255, 0.84); border-radius: 4px; margin-top: 40px; padding: 30px 0; } @media screen and (max-width: 960px) { .p-top-contact__content { grid-template-columns: 1fr; padding: 4px 24px; } } .p-top-contact__info { position: relative; display: flex; flex-direction: column; align-items: center; } @media screen and (max-width: 960px) { .p-top-contact__info { padding: 20px 0; } } .p-top-contact__info + .p-top-contact__info::before { content: ""; position: absolute; top: 50%; left: 0; width: 1px; height: 42px; border-left: 1px dashed #FFFFFF; transform: translateY(-50%); } @media screen and (max-width: 960px) { .p-top-contact__info + .p-top-contact__info::before { top: 0; left: 50%; width: 100%; height: 1px; border-left: none; border-top: 1px dashed #FFFFFF; transform: translate(-50%, 0); } } .p-top-contact__text { margin-top: 7px; font-family: "EB Garamond", serif; font-size: 3rem; font-weight: 700; letter-spacing: 0.01em; line-height: 1.2; } @media screen and (max-width: 960px) { .p-top-contact__text { margin-top: 12px; font-size: 2rem; } } @media screen and (min-width: 961px) { .p-top-contact__text.-tel { pointer-events: none; } } .p-facility { margin-top: 130px; } @media screen and (max-width: 960px) { .p-facility { margin-top: 100px; } } .p-facility-mv { position: relative; padding: 0 3.2813vw; } @media screen and (max-width: 960px) { .p-facility-mv { padding: 0 4vw; } } .p-facility-mv__wrapper { position: relative; max-width: 1196px; margin: 0 auto; } .p-facility-mv__image { position: relative; width: 100%; height: auto; aspect-ratio: 1196/716; border-radius: 23px; overflow: hidden; } @media screen and (max-width: 960px) { .p-facility-mv__image { aspect-ratio: 1/1; border-radius: 14px; } } .p-facility-mv__image::before { content: ""; position: absolute; width: 100%; height: 100%; background: radial-gradient(56% 56% at 48% 44%, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0.35) 100%); } .p-facility-mv__image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .p-facility-mv__place { position: absolute; z-index: 1; top: 60px; left: 60px; color: #fff; font-size: 6rem; font-weight: 700; letter-spacing: 0.03em; line-height: 1.17; } .p-facility-mv__title { position: absolute; z-index: 1; top: 18px; left: 60px; color: #fff; font-size: 6rem; font-weight: 700; letter-spacing: 0.03em; line-height: 1.17; text-align: left; } @media screen and (max-width: 960px) { .p-facility-mv__title { top: 26px; left: 33px; max-width: 80%; font-size: 2.9rem; } } .p-facility-mv__title span { font-size: 2.4rem; } @media screen and (max-width: 960px) { .p-facility-mv__title span { font-size: 1.8rem; } } .p-facility-nav { position: absolute; bottom: 60px; right: 60px; } @media screen and (max-width: 960px) { .p-facility-nav { position: static; margin-top: 40px; } } @media screen and (max-width: 960px) { .p-facility-nav__list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; padding: 0 18px; } } .p-facility-nav__item { text-align: right; } @media screen and (max-width: 960px) { .p-facility-nav__item { text-align: center; background: #E6E3D8; border-radius: 3px; } } .p-facility-nav__item a { display: block; color: #fff; font-size: 1.8rem; font-weight: 800; letter-spacing: 900; line-height: 1.8; text-decoration: underline; } @media screen and (max-width: 960px) { .p-facility-nav__item a { padding: 13px 0; color: #33383D; font-size: 1.3rem; } } .p-facility-nav__button { display: flex; align-items: center; justify-content: center; width: 163px; height: 52px; margin-top: 30px; background: #fff; border-radius: 57px; font-size: 1.5rem; font-weight: 700; letter-spacing: 0.03em; line-height: 1; text-decoration: underline; transition: all 0.4s linear; } @media screen and (max-width: 960px) { .p-facility-nav__button { width: 100%; } } .p-facility-nav__button:hover { background: #1D668F; border: 1px solid #1D668F; color: #fff; } .p-facility-intro { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 130px 0; overflow: hidden; } @media screen and (max-width: 960px) { .p-facility-intro { text-align: left; padding: 65px 8.8vw; } } .p-facility-intro__scroll { position: absolute; z-index: -1; left: 0; width: 100%; white-space: nowrap; } .p-facility-intro__scroll-track { display: inline-block; animation: scroll-left linear infinite; animation-duration: var(--scroll-duration, 40s); } .p-facility-intro__scroll-text { display: inline-block; padding-right: 0.2em; color: #fff; font-family: "EB Garamond", serif; font-size: 32rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1; white-space: nowrap; } @media screen and (max-width: 960px) { .p-facility-intro__scroll-text { font-size: 19.3rem; } } .p-facility-intro__read { color: #1D668F; font-size: 3rem; font-weight: 700; letter-spacing: 0.05em; line-height: 1.4; } @media screen and (max-width: 960px) { .p-facility-intro__read { font-size: 2.4rem; } } .p-facility-intro__text { margin-top: 32px; font-size: 1.6rem; font-weight: 700; letter-spacing: 0.05em; line-height: 2; } @media screen and (max-width: 960px) { .p-facility-intro__read br, .p-facility-intro__text br { display: none; } } .p-facility-feature { padding: 130px 0; background: #F1F0EB; } @media screen and (max-width: 960px) { .p-facility-feature { padding: 60px 0; } } .p-facility-feature__list { margin-top: 100px; counter-reset: number 0; } @media screen and (max-width: 960px) { .p-facility-feature__list { margin-top: 55px; } } .p-facility-feature__item { position: relative; display: flex; align-items: center; justify-content: space-between; background: #fff; border-radius: 8px; padding: 20px; counter-increment: number 1; } @media screen and (max-width: 960px) { .p-facility-feature__item { flex-direction: column-reverse; } } .p-facility-feature__item::before { content: counter(number, decimal-leading-zero); position: absolute; top: -40px; color: #1D668F; font-family: "EB Garamond", serif; font-size: 8.5rem; font-weight: 700; letter-spacing: -0.05em; line-height: 1; } @media screen and (max-width: 960px) { .p-facility-feature__item::before { top: -36px; font-size: 5.2rem; } } .p-facility-feature__item + .p-facility-feature__item { margin-top: 40px; } @media screen and (max-width: 960px) { .p-facility-feature__item + .p-facility-feature__item { margin-top: 50px; } } .p-facility-feature__item:nth-of-type(odd)::before { left: 27px; } @media screen and (max-width: 960px) { .p-facility-feature__item:nth-of-type(odd)::before { left: 12px; } } .p-facility-feature__item:nth-of-type(even) { flex-direction: row-reverse; } @media screen and (max-width: 960px) { .p-facility-feature__item:nth-of-type(even) { flex-direction: column-reverse; } } .p-facility-feature__item:nth-of-type(even)::before { right: 27px; } @media screen and (max-width: 960px) { .p-facility-feature__item:nth-of-type(even)::before { right: auto; left: 12px; } } .p-facility-feature__text-area { flex-shrink: 0; width: 435px; padding: 0 60px; } @media screen and (max-width: 960px) { .p-facility-feature__text-area { width: 100%; margin-top: 30px; padding: 0 14px; } } .p-facility-feature__title { font-size: 3.2rem; font-weight: 700; letter-spacing: 0; line-height: 1; } @media screen and (max-width: 960px) { .p-facility-feature__title { font-size: 2.4rem; } } .p-facility-feature__text { margin-top: 13px; font-size: 1.6rem; font-weight: 700; letter-spacing: 0; line-height: 1.68; } .p-facility-feature__image { max-width: 540px; height: 100%; border-radius: 23px; overflow: hidden; } @media screen and (max-width: 960px) { .p-facility-feature__image { border-radius: 10px; } } .p-facility-feature__image { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .p-facility-equipment { padding: 130px 0; } @media screen and (max-width: 960px) { .p-facility-equipment { padding: 60px 0; } } .p-facility-equipment__list { margin-top: 120px; border-radius: 15px; border: 1px solid #CFCAB9; } @media screen and (max-width: 960px) { .p-facility-equipment__list { margin-top: 55px; } } .p-facility-equipment__item { display: flex; align-items: center; gap: 24px; padding: 40px 43px; } @media screen and (max-width: 960px) { .p-facility-equipment__item { align-items: flex-start; padding: 30px; } } .p-facility-equipment__item:not(:last-of-type) { border-bottom: 1px solid #CFCAB9; } .p-facility-equipment__icon { flex-shrink: 0; width: 54px; height: 54px; } .p-facility-equipment__info { text-align: left; } .p-facility-equipment__title { color: #1D668F; font-size: 2rem; font-weight: 700; letter-spacing: 0.05em; line-height: 1; } @media screen and (max-width: 960px) { .p-facility-equipment__title { font-size: 1.8rem; letter-spacing: -0.07em; } } .p-facility-equipment__text { margin-top: 8px; font-size: 1.6rem; font-weight: 500; letter-spacing: 0.05em; line-height: 1; } @media screen and (max-width: 960px) { .p-facility-equipment__text { font-size: 1.3rem; letter-spacing: 0; } } .p-facility-gallery { background: #F1F0EB; overflow: hidden; padding: 130px 0; } @media screen and (max-width: 960px) { .p-facility-gallery { padding: 60px 0; } } .p-facility-gallery__slider { position: relative; margin-top: 85px; } @media screen and (max-width: 960px) { .p-facility-gallery__slider { margin-top: 77px; } } .p-facility-gallery__slider .swiper { overflow: visible; } .p-facility-gallery__item { width: 800px; height: auto; } @media screen and (max-width: 960px) { .p-facility-gallery__item { width: 267px; } } .p-facility-gallery__image { width: 100%; height: auto; aspect-ratio: 3/2; } .p-facility-gallery__image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .p-facility-gallery__slider-pagination { position: relative; margin-top: 20px; background: #fff; } .p-facility-gallery__slider-pagination .swiper-pagination-progressbar-fill { background: #D1CEBB; } .p-facility-gallery__slider-button-wrap { position: absolute; top: -60px; right: 0; display: flex; gap: 11px; transform: translateY(-100%); } @media screen and (max-width: 960px) { .p-facility-gallery__slider-button-wrap { justify-content: center; margin-top: 20px; position: static; transform: translateY(0); } } .p-facility-gallery__slider-button { width: 58px; height: 58px; } .p-facility-gallery__slider-button.-prev { transform: scale(-1, 1); } .p-facility-access { padding: 100px 0; } @media screen and (max-width: 960px) { .p-facility-access { padding: 60px 0; } } .p-facility-access__wrapper { display: flex; align-items: center; gap: 90px; margin-top: 60px; } @media screen and (max-width: 960px) { .p-facility-access__wrapper { display: block; margin-top: 55px; } } .p-facility-access__map { width: 100%; max-width: 713px; height: auto; aspect-ratio: 713/535; } @media screen and (max-width: 960px) { .p-facility-access__map { width: 100%; max-width: none; } } .p-facility-access__map iframe { width: 100%; height: 100%; } .p-facility-access__info { flex-shrink: 0; } @media screen and (max-width: 960px) { .p-facility-access__info { margin-top: 30px; } } .p-facility-access__name { padding-bottom: 30px; font-size: 2rem; font-weight: 700; letter-spacing: 0.01em; line-height: 1.8; } .p-facility-access__text { font-size: 1.4rem; font-weight: 600; letter-spacing: 0; line-height: 1.4285; } .p-facility-access__text + .p-facility-access__text { margin-top: 1.4em; } .p-facility-access__button { width: 197px; height: 52px; margin-top: 30px; } @media screen and (max-width: 960px) { .p-facility-access__button { width: 100%; } } .p-facility-access__button a { display: flex; justify-content: center; align-items: center; width: 100%; height: 100%; border-radius: 57px; border: 1px solid #33383D; color: #33383D; font-size: 1.5rem; font-weight: 500; letter-spacing: 0.03em; line-height: 1; text-decoration: underline; } .p-facility-reserve { padding: 42px; } @media screen and (max-width: 960px) { .p-facility-reserve { padding: 16px; } } .p-facility-reserve__wrapper { position: relative; z-index: 1; max-width: 1196px; margin: 0 auto; padding: 100px 0 180px; background: #2C332B; border-radius: 25px; text-align: center; color: #fff; overflow: hidden; } @media screen and (max-width: 960px) { .p-facility-reserve__wrapper { padding: 100px 0 160px; } } .p-facility-reserve__wrapper::before { content: ""; position: absolute; z-index: -1; top: 200px; left: 0; width: 100%; height: 226px; background-image: url(../images/common/obj_border02.webp); background-repeat: no-repeat; background-size: 1730px 226px; background-position: -100px top; } @media screen and (max-width: 960px) { .p-facility-reserve__wrapper::before { top: 200px; height: 114px; background-size: 873px 100%; background-position: -150px top; } } .p-facility-reserve__text-en { font-family: "EB Garamond", serif; font-size: 1.4rem; font-weight: 700; letter-spacing: -0.02em; line-height: 1.44; } @media screen and (max-width: 960px) { .p-facility-reserve__text-en { font-size: 1.2rem; } } .p-facility-reserve__title { margin-top: 50px; font-family: "EB Garamond", serif; font-size: 16rem; font-weight: 700; letter-spacing: 0.04em; line-height: 1.44; } @media screen and (max-width: 960px) { .p-facility-reserve__title { margin-top: 83px; font-size: 4.9rem; } } .p-facility-reserve__text-jp { margin-top: -40px; font-size: 2rem; font-weight: 700; letter-spacing: -0.07em; line-height: 1; } @media screen and (max-width: 960px) { .p-facility-reserve__text-jp { margin-top: -10px; font-size: 1.4rem; } } .p-facility-reserve__button { display: flex; justify-content: center; align-items: center; width: 163px; height: 52px; margin: 56px auto 0; border-radius: 57px; background: #fff; color: #33383D; font-size: 1.5rem; font-weight: 500; letter-spacing: 0.03em; line-height: 1; text-decoration: underline; } @media screen and (max-width: 960px) { .p-facility-reserve__button { width: 138px; } } .p-news__wrapper { display: flex; align-items: flex-start; gap: 30px; } @media screen and (max-width: 960px) { .p-news__wrapper { display: block; } } .p-news__category { position: sticky; top: 40px; min-width: 120px; } @media screen and (max-width: 960px) { .p-news__category { position: static; min-width: auto; } } .p-news__category-head { font-family: "EB Garamond", serif; font-size: 2.4rem; font-weight: 700; letter-spacing: -0.03em; line-height: 1.8; } .p-news__category-list { margin-top: 30px; } @media screen and (max-width: 960px) { .p-news__category-list { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 12px; } } .p-news__category-item { font-size: 1.6rem; font-weight: 500; letter-spacing: 0.05em; line-height: 1.45; } @media screen and (max-width: 960px) { .p-news__category-item { padding: 12px 35px; border-radius: 6px; border: 1px solid #CFCAB9; line-height: 1; } } .p-news__category-item + .p-news__category-item { margin-top: 12px; } @media screen and (max-width: 960px) { .p-news__category-item + .p-news__category-item { margin: 0; } } @media screen and (min-width: 961px) { .p-news__category-item a { transition: opacity 0.4s linear; } .p-news__category-item a:focus { opacity: 0.6; } .p-news__category-item a:hover { opacity: 0.6; } } @media screen and (max-width: 960px) { .p-news-archive { margin-top: 50px; } } .p-news-archive__item { border: 1px solid #CFCAB9; border-bottom: none; overflow: hidden; } .p-news-archive__item:first-of-type { border-top-left-radius: 15px; border-top-right-radius: 15px; } .p-news-archive__item:last-of-type { border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; border-bottom: 1px solid #CFCAB9; } .p-news-archive__item a { display: flex; transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); } .p-news-archive__item a:hover { background: #1D668F; color: #fff; } .p-news-archive__item a:hover .p-news-archive__image { margin-left: 0; } .p-news-archive__item a:hover .p-news-archive__tag { background: #fff; color: #1D668F; } .p-news-archive__image { width: 28.79%; height: auto; margin-left: -28.8%; transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); } @media screen and (max-width: 960px) { .p-news-archive__image { display: none; } } .p-news-archive__image img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .p-news-archive__text-area { padding: 40px 50px; } @media screen and (max-width: 960px) { .p-news-archive__text-area { padding: 32px 30px; } } .p-news-archive__head { display: flex; align-items: center; gap: 10px; } .p-news-archive__tag { border-radius: 3px; background: #1D668F; padding: 4px 10px; color: #fff; font-size: 1.6rem; font-weight: 500; letter-spacing: 0.05em; line-height: 1; transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); } .p-news-archive__date { font-size: 1.6rem; font-weight: 500; letter-spacing: 0.05em; line-height: 1; } .p-news-archive__title { margin-top: 8px; font-size: 2rem; font-weight: 500; letter-spacing: 0.05em; line-height: 1; text-decoration: underline; } @media screen and (max-width: 960px) { .p-news-archive__title { font-size: 1.5rem; } } .p-news-single__head { display: flex; align-items: center; gap: 10px; } @media screen and (max-width: 960px) { .p-news-single__head { margin-top: 50px; } } .p-news-single__tag { border-radius: 3px; background: #1D668F; padding: 6px 10px; color: #fff; font-size: 1.6rem; font-weight: 500; letter-spacing: 0.05em; line-height: 1; transition: all 1s cubic-bezier(0.19, 1, 0.22, 1); } .p-news-single__date { font-size: 1.6rem; font-weight: 500; letter-spacing: 0.05em; line-height: 1; } .p-news-single__title { margin-top: 8px; font-size: 2rem; font-weight: 500; letter-spacing: 0.05em; line-height: 1.45; text-decoration: underline; text-align: left; } .p-news-single__thumbnail { margin-top: 40px; width: 100%; height: auto; } .p-news-single__thumbnail img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .p-news-single__editor { margin-top: 40px; } .p-news-single__editor > *:first-child { margin-top: 0; } .p-news-single__editor > *:first-child * { margin-top: 0; } .p-news-single__editor * + * { margin-top: 1em; } .p-news-single__editor * + h2 { margin-top: 40px; } .p-news-single__editor * + h3 { margin-top: 23px; } .p-news-single__editor h2 { padding: 1px 10px; background: rgba(29, 102, 143, 0.3); color: #1D668F; font-size: 2rem; font-weight: 700; letter-spacing: 0.05em; line-height: 1.5; } .p-news-single__editor h3 { font-size: 1.5rem; font-weight: 700; letter-spacing: 0.11em; line-height: 1.5; color: #1D668F; } .p-news-single__editor p { text-align: left; font-size: 1.3rem; font-weight: 500; line-height: 1.7692; letter-spacing: 0.11em; } .p-news-single__editor p + p { margin-top: 1em; } .p-news-single__editor strong { font-weight: 700; } .p-news-single__editor *:not(img) > a { font-weight: 500; text-decoration: underline; } .p-news-single__editor a { transition: all 0.4s linear; } .p-news-single__editor a:hover { opacity: 0.6; } .p-news-single__editor img { width: 100%; height: auto; margin-top: 40px; } .p-company__table { width: 100%; border-collapse: collapse; font-size: 1.4rem; font-weight: 600; letter-spacing: 0; line-height: 1.4285; } @media screen and (max-width: 960px) { .p-company__table { font-size: 1.3rem; } } .p-company__table th, .p-company__table td { border: 1px solid #33383D; padding: 20px; vertical-align: top; text-align: left; } @media screen and (max-width: 960px) { .p-company__table th, .p-company__table td { padding: 14px; } } .p-company__table th { background-color: #1D668F; width: 122px; color: #fff; white-space: nowrap; } @media screen and (max-width: 960px) { .p-company__table th { width: 106px; } } .p-company__table td { width: 100%; } .p-policy__title { margin-top: 40px; background: #1D668F; padding: 8px; color: #fff; font-size: 2rem; font-weight: 500; letter-spacing: 0; line-height: 1.45; } .p-policy__text { font-size: 1.4rem; font-weight: 600; letter-spacing: 0; line-height: 1.4285; } .p-policy__text.-right { text-align: right; font-weight: 400; } * + .p-policy__text { margin-top: 6px; } .p-policy__list { margin-top: 40px; } .p-policy__list dt { font-size: 2rem; font-weight: 600; letter-spacing: 0; line-height: 1.4285; } .p-policy li { font-size: 1.4rem; font-weight: 600; letter-spacing: 0; line-height: 1.4285; } .p-policy li::before { content: "・"; } .p-lower__head { position: relative; padding: 215px 0 120px; } @media screen and (max-width: 960px) { .p-lower__head { height: 330px; padding: 150px 0 0; } } .p-lower__head::before { content: ""; position: absolute; top: 100px; left: 0; z-index: -1; width: 100%; height: 226px; background-image: url(../images/common/obj_border01.webp); background-repeat: no-repeat; background-size: 135% 100%; background-position: -170px top; } @media screen and (max-width: 960px) { .p-lower__head::before { top: 117px; height: 134px; background-size: 1026px 100%; background-position: -150px top; } } .p-lower__head .c-title__jp { font-size: 5rem; } @media screen and (max-width: 960px) { .p-lower__head .c-title__jp { font-size: 3rem; } } .p-lower__head .c-title__en { font-size: 3rem; } @media screen and (max-width: 960px) { .p-lower__head .c-title__en { font-size: 2rem; } } .p-lower__content { background: #F1F0EB; padding: 120px 0; } @media screen and (max-width: 960px) { .p-lower__content { padding: 65px 0; } } .s-header { position: fixed; top: 0; left: 0; z-index: 999; width: 100%; padding: 44px 77px 0; transition: all 0.5s; } @media screen and (max-width: 960px) { .s-header { padding: 35px 8.8vw 0; } } .s-header__wrapper { display: flex; align-items: center; justify-content: space-between; width: 100%; opacity: 0; transition: all 2s cubic-bezier(0.25, 1, 0.5, 1); } .s-header__wrapper.is-fadeIn { opacity: 1; } .s-header__logo { position: relative; z-index: 999; width: 58px; height: 51px; } @media screen and (max-width: 960px) { .s-header__menu { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; background: #F7F6F2; padding: 140px 8.8vw 57px; overflow: auto; opacity: 0; pointer-events: none; transition: all 0.4s ease; } } @media screen and (max-width: 960px) { .s-header__menu.is-active { opacity: 1; pointer-events: visible; } } .s-header__nav { display: flex; gap: 30px; } .s-header__nav-list { display: flex; gap: 30px; } @media screen and (max-width: 960px) { .s-header__nav-list { display: block; width: 100%; } } @media screen and (max-width: 960px) { .s-header__nav-item + .s-header__nav-item { margin-top: 17px; } } .s-header__nav-item a { font-size: 1.3rem; font-weight: 700; letter-spacing: 0.05em; line-height: 1; } @media screen and (min-width: 961px) { .s-header__nav-item a { transition: opacity 0.4s linear; } .s-header__nav-item a:focus { opacity: 0.6; } .s-header__nav-item a:hover { opacity: 0.6; } } @media screen and (max-width: 960px) { .s-header__nav-item a { display: flex; align-items: center; justify-content: space-between; } } @media screen and (max-width: 960px) { .s-header__nav-text { display: flex; align-items: center; gap: 10px; font-family: "EB Garamond", serif; font-size: 2rem; font-weight: 700; letter-spacing: 0; line-height: 1.8; } } @media screen and (max-width: 960px) { .s-header__nav-text span { font-family: "Shippori Mincho", serif; font-weight: 600; font-size: 1.1rem; letter-spacing: -0.06em; opacity: 0.68; } } @media screen and (max-width: 960px) { .s-header__nav-icon { width: 20px; height: 20px; } } .s-header__button a { border-radius: 2px; background: #1D668F; padding: 6px 25px; font-size: 1.3rem; font-weight: 700; letter-spacing: 0.05em; line-height: 1; color: #fff; } @media screen and (max-width: 960px) { .s-header__hamburger { position: relative; z-index: 999; display: flex; justify-content: center; align-items: center; width: 24px; height: 24px; cursor: pointer; } } @media screen and (max-width: 960px) { .s-header__hamburger span { position: absolute; width: 100%; height: 1px; background: #33383D; transition: all 0.4s ease; } } @media screen and (max-width: 960px) { .s-header__hamburger span:first-of-type { transform: translateY(-8px); } } @media screen and (max-width: 960px) { .s-header__hamburger span:last-of-type { transform: translateY(8px); } } .s-header__hamburger.is-active span:nth-of-type(2) { opacity: 0; } .s-header__hamburger.is-active span:first-of-type { transform: rotate(45deg); } .s-header__hamburger.is-active span:last-of-type { transform: rotate(-45deg); } .s-footer { padding: 140px 0; background: rgba(178, 169, 137, 0.25); } @media screen and (max-width: 960px) { .s-footer { padding: 80px 0; } } .s-footer__wrapper { display: flex; justify-content: space-between; } @media screen and (max-width: 960px) { .s-footer__wrapper { display: block; } } .s-footer__title-en { font-family: "EB Garamond", serif; font-size: 2rem; font-weight: 700; letter-spacing: 0.01em; line-height: 1.8; } .s-footer__title-jp { margin-top: 40px; font-size: 1.6rem; font-weight: 600; letter-spacing: 0; line-height: 1.6875; } @media screen and (max-width: 960px) { .s-footer__title-jp { margin-top: 30px; } } .s-footer__title-jp span { font-size: 2.1rem; line-height: 1; } .s-footer__sns { margin-top: 40px; } @media screen and (max-width: 960px) { .s-footer__sns { margin-top: 30px; } } .s-footer__sns-text { font-size: 1.4rem; font-weight: 600; letter-spacing: 0; line-height: 1.4285; } .s-footer__sns-link { margin-top: 12px; } .s-footer__sns-link a { display: flex; align-items: center; gap: 3px; font-family: "EB Garamond", serif; font-size: 1.2rem; font-weight: 700; letter-spacing: 0; line-height: 1.8; } @media screen and (min-width: 961px) { .s-footer__sns-link a { transition: opacity 0.4s linear; } .s-footer__sns-link a:focus { opacity: 0.6; } .s-footer__sns-link a:hover { opacity: 0.6; } } .s-footer__sns-icon { width: 10px; height: 10px; } .s-footer__nav { display: grid; grid-template-columns: repeat(2, 308px); gap: 30px; } @media screen and (max-width: 960px) { .s-footer__nav { display: block; margin-top: 80px; } } @media screen and (max-width: 960px) { .s-footer__nav-list:first-of-type .s-footer__nav-item:last-of-type { border-bottom: none; } } .s-footer__nav-item { border-top: 1px solid #33383D; } .s-footer__nav-item:last-of-type { border-bottom: 1px solid #33383D; } .s-footer__nav-item a { display: flex; justify-content: space-between; align-items: center; padding: 12px 0; } @media screen and (min-width: 961px) { .s-footer__nav-item a { transition: opacity 0.4s linear; } .s-footer__nav-item a:focus { opacity: 0.6; } .s-footer__nav-item a:hover { opacity: 0.6; } } .s-footer__nav-text { display: flex; align-items: center; gap: 10px; font-family: "EB Garamond", serif; font-size: 1.8rem; font-weight: 700; letter-spacing: 0; line-height: 1.8; } .s-footer__nav-text span { opacity: 0.68; font-family: "Shippori Mincho", serif; font-size: 1.1rem; font-weight: 600; letter-spacing: -0.06em; line-height: 1; } .s-footer__nav-icon { width: 20px; height: 20px; } .s-footer__bottom { display: flex; justify-content: space-between; align-items: center; margin-top: 80px; } @media screen and (max-width: 960px) { .s-footer__bottom { display: block; } } .s-footer__link { display: flex; gap: 38px; } @media screen and (max-width: 960px) { .s-footer__link { gap: 14px; } } .s-footer__link-item a { display: block; font-size: 1.2rem; font-weight: 600; letter-spacing: 0; line-height: 1.4166; text-decoration: underline; } @media screen and (min-width: 961px) { .s-footer__link-item a { transition: opacity 0.4s linear; } .s-footer__link-item a:focus { opacity: 0.6; } .s-footer__link-item a:hover { opacity: 0.6; } } .s-footer__text { font-size: 1.2rem; font-weight: 700; letter-spacing: 0; line-height: 1; } @media screen and (max-width: 960px) { .s-footer__text { margin-top: 12px; } } .s-footer__logo { position: absolute; left: 50%; transform: translateX(-50%); width: 95px; height: auto; aspect-ratio: 95/83; } @media screen and (max-width: 960px) { .s-footer__logo { position: relative; margin-top: 36px; } } .s-footer__logo img { width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain; } @media screen and (min-width: 961px) { .u-sp { display: none; } } @media screen and (max-width: 960px) { .u-pc { display: none; } } .u-mt05 { margin-top: 0.5em; } .u-mb05 { margin-bottom: 0.5em; } .u-pt05 { padding-top: 0.5em; } .u-pb05 { padding-bottom: 0.5em; } .u-mt1 { margin-top: 1em; } .u-mb1 { margin-bottom: 1em; } .u-pt1 { padding-top: 1em; } .u-pb1 { padding-bottom: 1em; } .u-mt2 { margin-top: 2em; } .u-mb2 { margin-bottom: 2em; } .u-pt2 { padding-top: 2em; } .u-pb2 { padding-bottom: 2em; } .u-mt3 { margin-top: 3em; } .u-mb3 { margin-bottom: 3em; } .u-pt3 { padding-top: 3em; } .u-pb3 { padding-bottom: 3em; } .u-mt4 { margin-top: 4em; } .u-mb4 { margin-bottom: 4em; } .u-pt4 { padding-top: 4em; } .u-pb4 { padding-bottom: 4em; } .u-mt5 { margin-top: 5em; } .u-mb5 { margin-bottom: 5em; } .u-pt5 { padding-top: 5em; } .u-pb5 { padding-bottom: 5em; } .u-white { color: #fff; fill: #fff; } .u-white * { color: #fff; fill: #fff; } .u-center { text-align: center; margin-left: auto; margin-right: auto; } .u-right { text-align: right; margin-left: auto; } .u-left { text-align: left; margin-right: auto; } @media screen and (min-width: 961px) { .u-sp { display: none !important; } } @media screen and (max-width: 960px) { .u-pc { display: none !important; } }