@charset "UTF-8"; @import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap"); @import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Yuji+Syuku&display=swap"); /*** 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, input, textarea, script, style, title):not(svg *, symbol *):not([class*=wp])) { all: unset; /* その要素のすべてのプロパティ(unicode-bidi, direction, CSSカスタムプロパティを除いて)を、既定値が inherit のものは継承値に、そうでなければ初期値に変更 */ 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%; 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; } :where(:focus-visible) { outline-style: solid; outline-width: 2px; } @font-face { font-family: "Satoshi"; src: url("../font/Satoshi-Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; } @font-face { font-family: "Satoshi"; src: url("../font/Satoshi-Medium.ttf") format("truetype"); font-weight: 500; font-style: normal; } @font-face { font-family: "Satoshi"; src: url("../font/Satoshi-Bold.ttf") format("truetype"); font-weight: 700; font-style: normal; } :root { --breadcrumb-color: #000000; --header-height: 130px; /* ヘッダー - 高さ */ --header-top: 2.4rem; /* ヘッダー - 上余白 */ --inline-guideline: clamp(80px, 10vw, 160px); /* コンテンツガイド */ --contents-spacer: 100px; /* コンテンツ間隔 */ --section-space: 150px; /* section間隔 */ --padding-space: clamp(80px, 10vw, 160px); /* section padding */ } @media screen and (width <= 1024px) { :root { --header-height: 80px; /* ヘッダー - 高さ */ --header-top: 0px; /* ヘッダー - 上余白 */ --inline-guideline: clamp(20px, 5.3333333333vw, 80px); /* コンテンツガイド */ --contents-spacer: 100px; /* コンテンツ間隔 */ --section-space: 70px; /* section間隔 */ --padding-space: clamp(20px, 8.5333333333vw, 40px); /* section padding */ } } html { font-size: 62.5%; scroll-behavior: smooth; scroll-padding-top: var(--header-height); } body { font-size: 1.6rem; font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", "Zen Kaku Gothic New", sans-serif; min-height: 100vh; margin: 0; position: relative; z-index: 1; overflow-x: clip; background: #ffffff; isolation: isolate; } body.page-id-2 { background: #FFF8F2; } @media screen and (width <= 768px) { body { font-size: 1.4rem; } } img, svg { vertical-align: bottom; } .l-header { width: 100%; margin: 0 auto; position: fixed; top: 0px; left: 50%; transform: translateX(-50%); z-index: 1000; background: #ffffff; } .l-header.js-active { background: #000000; } .l-header #wovn-translate-widget[wovn].wovn-embedded-widget { position: fixed; top: 70px; max-width: 1600px; width: 100%; right: auto; left: 50%; transform: translateX(-50%); padding-inline: calc(var(--inline-guideline, 0) / 2); } @media screen and (width <= 963px) { .l-header #wovn-translate-widget[wovn].wovn-embedded-widget { top: 78px; } } .l-header #preview-wovn-translate-widget[wovn].type-floating .wovn-lang-selector, .l-header #wovn-translate-widget[wovn].type-floating .wovn-lang-selector { width: -moz-fit-content; width: fit-content; margin-left: auto; display: block; } .l-header #preview-wovn-translate-widget[wovn].type-floating .wovn-lang-container, .l-header #wovn-translate-widget[wovn].type-floating .wovn-lang-container { width: -moz-fit-content; width: fit-content; display: block; right: calc(var(--inline-guideline, 0) / 2); } .l-header__inner { max-width: 1600px; width: 100%; display: flex; justify-content: space-between; align-items: center; padding-inline: calc(var(--inline-guideline, 0) / 2); padding-block: 12px; margin: 0 auto; } @media screen and (width <= 1280px) { .l-header__inner { padding: 16px calc(var(--inline-guideline, 0) / 2); } } @media screen and (width <= 768px) { .l-header__inner { height: 76px; padding: 6px 8px; } } @media (max-width: 540px) { .l-header__inner { width: calc(100% - 28px); } } .l-header__inner-item { display: flex; justify-content: space-between; align-items: center; } @media screen and (width <= 963px) { .l-header__inner-item { margin-bottom: 0; width: 100%; } } @media screen and (width <= 768px) { .l-header__inner-item { gap: 10px; } } .l-header__items { max-width: 770px; width: 100%; display: flex; align-items: center; justify-content: flex-end; gap: 24px; } @media (max-width: 1080px) { .l-header__items { gap: 20px; } } @media screen and (width <= 768px) { .l-header__items { gap: 8px; } } .l-header__items-btn { width: 200px; display: block; padding: 10px 34px 10px 60px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #ffffff; border-radius: 8px; background: #EC8226; border: 1px solid #EC8226; position: relative; transition: all 0.5s; } @media screen and (width <= 1280px) { .l-header__items-btn { padding: 10px 28px 10px 54px; } } .l-header__items-btn::before { content: ""; position: absolute; top: 50%; left: 24px; transform: translateY(-50%); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #ffffff; z-index: 1; } @media screen and (width <= 1280px) { .l-header__items-btn::before { left: 18px; } } .l-header__items-btn--pc { display: flex; flex: 0 0 auto; } @media (max-width: 1080px) { .l-header__items-btn--pc { display: none; } } .l-header__items-btn--tb { display: none; } @media (max-width: 1080px) { .l-header__items-btn--tb { display: block; width: 36px; height: 36px; padding: 0; border-radius: 4px; position: relative; flex: 0 0 auto; } .l-header__items-btn--tb::before { content: ""; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #ffffff; z-index: 1; } } .l-header__items-btn:hover { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #EC8226; background: #ffffff; } @media screen and (width <= 768px) { .l-header__items-btn:hover { background: #EC8226; } } .l-header__items-btn:hover::before { content: ""; background-color: #EC8226; } @media screen and (width <= 768px) { .l-header__items-btn:hover::before { background: #ffffff; } } .l-header__logo { max-width: 322px; width: 100%; flex: 0 0 auto; position: relative; z-index: 1001; mix-blend-mode: difference; } .l-header__logo > a { display: block; } .l-header__logo > a > img { width: 100%; } @media screen and (width <= 768px) { .l-header__logo { max-width: 320px; width: 60%; } } .l-header__nav--pc { display: block; } @media screen and (width <= 963px) { .l-header__nav--pc { display: none; } } .l-header__nav--sp { display: none; } @media screen and (width <= 963px) { .l-header__nav--sp { display: block; } } .l-header__nav-inner { display: flex; justify-content: flex-end; align-items: center; max-width: 1280px; width: 100%; margin: 0 auto; gap: 3.2vw; } @media (max-width: 1760px) { .l-header__nav-inner { gap: 1.6vw; } } @media (max-width: 1280px) { .l-header__nav-inner { gap: 0vw; } } @media screen and (width <= 963px) { .l-header__nav-inner { flex-direction: column; } } .l-header__nav-item { width: -moz-fit-content; width: fit-content; } .l-header__nav-item > a { display: block; padding-inline: clamp(1vw, 1.5vw, 2.4rem); padding: 2px 16px; } .l-header__nav-item > a > span { width: -moz-max-content; width: max-content; display: block; position: relative; font-size: clamp(1.4rem, 0.875vw, 1.4rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; text-align: center; } @media (max-width: 960px) { .l-header__nav-item > a > span { font-size: clamp(2.8rem, 2.5vw, 4rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } } .l-header__nav-item.contact { border: 1px solid #000000; } .l-header__nav-item.contact a { width: 200px; } @media (max-width: 1760px) { .l-header__nav-item.contact a { width: 180px; } } .l-header__nav-item.contact a span { margin: 0 auto; } .l-header__nav-btn { display: none; } @media screen and (width <= 963px) { .l-header__nav-btn { width: 32px; height: 22px; display: flex; flex-direction: column; position: relative; z-index: 1001; margin-left: 8px; cursor: pointer; } .l-header__nav-btn > span { width: 32px; height: 2px; border-radius: 1px; background: #231815; position: absolute; transition: all 0.5s; } .l-header__nav-btn > span.top-line { top: 0; } .l-header__nav-btn > span.middle-line { top: 10px; } .l-header__nav-btn > span.bottom-line { bottom: 0; } .l-header__nav-btn.js-active > span.top-line { top: 11px; transform: rotate(45deg); } .l-header__nav-btn.js-active > span.middle-line { display: none; } .l-header__nav-btn.js-active > span.bottom-line { bottom: 9px; transform: rotate(-45deg); } } .l-header__nav--sp { width: 100%; position: absolute; left: 0; top: -8px; transition: all 0.5s; background: #ffffff; height: 100svh; padding: 220px 32px 40px; overflow-y: scroll; opacity: 0; visibility: hidden; pointer-events: none; z-index: 1000; } .l-header__nav--sp::-webkit-scrollbar { display: none; } @media screen and (width <= 768px) { .l-header__nav--sp { top: 0; } } @media (max-width: 600px) { .l-header__nav--sp { height: 100vh; padding: 160px 32px 40px; overflow-y: scroll; } } .l-header__nav--sp > p.copy { position: absolute; bottom: 24px; font-size: clamp(1rem, 0.75vw, 1.2rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } .l-header__nav--sp.js-active { opacity: 1; visibility: visible; pointer-events: all; } .l-header__nav--sp-menu .l-header__items-btn { margin-bottom: 8px; text-align: center; } .l-header__nav--sp-menu .l-header__items-btn:hover { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #ffffff; border-radius: 8px; background: #EC8226; border: 1px solid #EC8226; } .l-header__nav--sp-menu .l-header__items-btn:hover::before { background-color: #ffffff; } @media screen and (width <= 768px) { .l-header__nav--sp-menu .l-header__items-btn { max-width: 180px; padding: 5px 28px 5px 54px; font-size: 14px; } .l-header__nav--sp-menu .l-header__items-btn::before { left: 24px; } .l-header__nav--sp-menu .l-header__items-btn:nth-of-type(1)::before { content: ""; width: 20px; height: 20px; } .l-header__nav--sp-menu .l-header__items-btn:nth-of-type(2)::before { content: ""; width: 23px; height: 16px; } } .l-header__nav--sp-menu .l-header__nav-item { max-width: 295px; width: 100%; margin: 0 auto 16px; padding-bottom: 10px; border-right: none; } @media (max-width: 600px) { .l-header__nav--sp-menu .l-header__nav-item { margin: 0 auto 16px 16px; } } .l-header__nav--sp-menu .l-header__nav-item.contact { padding-bottom: 0; border: 1px solid #000000; } @media (max-width: 960px) { .l-header__nav--sp-menu .l-header__nav-item.contact { border: none; } } .l-header__nav--sp-menu .l-header__nav-item.contact a { width: 100%; padding-block: 12px; } @media (max-width: 960px) { .l-header__nav--sp-menu .l-header__nav-item.contact a { padding: 0; } } @media (max-width: 960px) { .l-header__nav--sp-menu .l-header__nav-item.contact a span { margin: 0; } } .l-header__nav--sp-menu .l-header__nav-item > a { margin-inline: 0; font-size: 18px; font-weight: 500; } @media (max-width: 960px) { .l-header__nav--sp-menu .l-header__nav-item > a { padding: 0; } } .l-header__nav--sp-menu .l-header__nav-item > a::after { display: none; } .l-header__nav--sp-menu .l-header__nav-item--parent > a::before { display: none; } .l-header__nav--sp-menu .l-header__nav-item--current { width: 100%; position: static; padding: 0; background: none; opacity: 1; visibility: visible; transform: none; } .l-header__nav--sp-menu .l-header__nav-item--current > ul { padding: 0; gap: 8px; } .l-header__nav--sp-menu .l-header__nav-item--current > ul > li { max-width: 240px; padding-inline: 20px 45px; } .l-header__nav--sp-menu .l-header__nav-item--current > ul > li:hover::after { right: 0; background-color: #000000; } .overlay { position: fixed; top: -24px; left: -26px; background: rgba(0, 0, 0, 0.4); z-index: 9; opacity: 0; visibility: hidden; transition: opacity 0.3s; } @media screen and (width <= 768px) { .overlay { top: -8px; } } .overlay.is-active { opacity: 1; visibility: visible; width: 200%; height: 100vh; } .l-footer { position: relative; background: #000000; } .l-footer__wrapper { padding-top: 50px; background: #000000; border-radius: 40px 0 0 0; position: relative; z-index: 1; } @media screen and (width <= 768px) { .l-footer__wrapper { padding-top: 40px; } } .l-footer__inner { width: min(100%, 1600px); margin: 0 auto; padding-inline: 5vw; } @media screen and (width <= 768px) { .l-footer__inner { padding-inline: 16px; } } .l-footer__content { position: relative; display: flex; gap: clamp(5vw, 120px, 8vw); } @media screen and (width <= 768px) { .l-footer__content { justify-content: center; } } .l-footer__content-links { max-width: 190px; width: 100%; margin-bottom: 40px; position: absolute; top: 50%; left: 0; transform: translateY(-50%); } @media screen and (width <= 768px) { .l-footer__content-links { margin-bottom: 8px; display: none; } } .l-footer__content-links--pc { display: block; } @media screen and (width <= 1024px) { .l-footer__content-links--pc { display: none; } } .l-footer__content-links--tb { display: none; } @media screen and (width <= 1024px) { .l-footer__content-links--tb { display: block; } } .l-footer__content-links > ul li a { position: relative; display: block; width: -moz-fit-content; width: fit-content; padding: 4px 42px 4px 0; margin-bottom: 6px; font-size: 14px; color: #ffffff; letter-spacing: 0.1em; background-color: transparent; } .l-footer__content-links > ul li a::after { content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 1px; background: #ffffff; transition: all 0.3s; } .l-footer__content-links > ul li a::before { content: ""; position: absolute; right: 0; top: 50%; width: 22px; height: 14px; transform: translateY(-50%); background: url("../assets/images/ico_w_arrow.svg") no-repeat; opacity: 0; transition: all 0.3s; } .l-footer__content-links > ul li a:hover::before { content: ""; position: absolute; right: 0; top: 50%; width: 22px; height: 14px; transform: translateY(-50%); background: url("../assets/images/ico_w_arrow.svg") no-repeat; opacity: 1; } .l-footer__content-links > ul li a:hover::after { content: ""; position: absolute; bottom: 0; width: 100%; height: 1px; background: #ffffff; transition: all 0.3s; } .l-footer__summary { width: 100%; display: flex; justify-content: center; align-items: center; flex-direction: column; } .l-footer__summary > p { margin-bottom: 16px; text-align: center; font-size: clamp(1.4rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #ffffff; } .l-footer__summary a { background-color: transparent; color: #ffffff; } .l-footer__summary > a[href^="tel:"] { font-size: clamp(1.4rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #ffffff; pointer-events: none; background-color: transparent; } @media screen and (width <= 768px) { .l-footer__summary > a[href^="tel:"] { pointer-events: all; } } .l-footer__logo { max-width: 210px; width: 100%; margin-bottom: 50px; } @media screen and (width <= 1024px) { .l-footer__logo { margin-bottom: 40px; } } .l-footer .copy { padding-block: 34px 16px; font-size: clamp(1rem, 0.75vw, 1.2rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; font-family: "Satoshi", sans-serif; text-align: center; } @media screen and (width <= 576px) { .l-footer .copy { padding-block: 34px 16px; text-align: left; } } .l-page-head { width: 100%; margin: 0 auto; background-size: cover; background-repeat: no-repeat; position: relative; top: 0; left: 0; padding-block: 218px 118px; background: #ffefe1 url("../../assets/images/bg_page-head_01.png") no-repeat; background-size: cover; background-position: center bottom; border-radius: 0 0 0 120px; } @media screen and (width <= 963px) { .l-page-head { padding-block: 140px 90px; border-radius: 0 0 0 80px; } } @media screen and (width <= 768px) { .l-page-head { padding-block: 100px 60px; border-radius: 0 0 0 50px; } } .l-page-head__inner { width: min(100%, 1440px); padding-inline: calc(var(--inline-guideline, 0) / 2); margin: 0 auto; } @media screen and (width <= 1024px) { .l-page-head__inner { padding-inline: var(--inline-guideline, 0); } } .l-page-head__title .en { margin-inline: 0px; letter-spacing: normal; font-size: clamp(1.8rem, 1.5vw, 2.4rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #EC8226; font-family: "Satoshi", sans-serif; transition: all 1s; } .l-page-head__title .en.ja-title { font-size: clamp(3.8rem, 3.1265306122rem + 1.7959183673vw, 6rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1; color: #000000; font-family: "Noto Sans JP", sans-serif; } .l-page-head__title .ja { font-size: clamp(3.2rem, 3vw, 4.8rem); font-weight: 700; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; } .l-page-head__title .ja.single-title { padding-left: 0; font-size: clamp(1.2rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; } .l-page-head__title .ja.single-title::before { display: none; } .l-page-head__breadcrumb { width: min(100%, 1440px); margin: 8px auto 0; padding-inline: calc(var(--inline-guideline, 0) / 2); } @media screen and (width <= 1024px) { .l-page-head__breadcrumb { padding-inline: var(--inline-guideline, 0); } } .l-section { width: 100%; padding-bottom: 160px; overflow-x: clip; background: #ffffff; } @media screen and (width <= 963px) { .l-section { padding-bottom: 80px; } } .l-section__inner { width: min(100%, 1600px); margin: 0 auto; padding-inline: calc(var(--inline-guideline, 0) / 2); } @media screen and (width <= 963px) { .l-section__inner { padding-inline: 20px; } } @media screen and (width <= 768px) { .l-section__inner { padding-inline: 16px; } } .l-section__title { margin-bottom: 32px; } .l-section__title h2 { margin-bottom: 12px; font-size: clamp(6.8rem, 6.25vw, 10rem); font-weight: 700; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; position: relative; border-bottom: 1px solid #000000; font-family: "Roboto Condensed", sans-serif; line-height: 1; letter-spacing: -0.05em; } @media screen and (width <= 768px) { .l-section__title h2 { margin-bottom: 32px; } } .l-section__title > span { display: block; font-size: clamp(14px, 1vw, 16px); letter-spacing: 0.1em; line-height: 1.8; } .l-section__title--sub { font-size: clamp(2.8rem, 2.5vw, 4rem); font-weight: 700; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; padding: 0 0 14px 0; position: relative; border-bottom: 2px solid #909090; background: none; } .l-section__title--sub::before { display: none; } .l-section__title--sub::after { content: ""; position: absolute; bottom: -2px; left: 0; width: 160px; height: 2px; background-color: #EC8226; } .l-section__title--list { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; padding: 0 0 10px 0; position: relative; border-bottom: 2px solid #DBDBDB; background: none; } .l-section__title--list::before { display: none; } .l-section__title--list::after { content: ""; position: absolute; bottom: -2px; left: 0; width: 160px; height: 2px; background-color: #EC8226; } .l-section-single { margin: 96px auto; } @media screen and (width <= 768px) { .l-section-single { margin: 60px auto; } } .l-section-single .l-section__inner { width: min(100%, 1040px); margin: 0 auto; } .l-seminar { width: min(100%, 1080px); margin: 96px auto 96px; } @media screen and (width <= 768px) { .l-seminar { margin: 60px 0 60px; } } .l-seminar__thumb { max-width: 800px; width: -moz-fit-content; width: fit-content; margin: 0 auto 24px; border-radius: 20px; border: 1px solid #DBDBDB; overflow: clip; } .l-seminar__title { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; padding-bottom: 16px; margin: 0 20px 16px; border-bottom: 2px solid #DBDBDB; } .l-seminar__head { margin-block: 64px 16px; padding: 13px 24px; font-size: clamp(2.4rem, 2vw, 3.2rem); font-weight: 700; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; position: relative; background: linear-gradient(90deg, rgba(236, 130, 38, 0.1) 0%, rgba(236, 130, 38, 0) 100%); } @media screen and (width <= 768px) { .l-seminar__head { margin-bottom: 32px; } } .l-seminar__head::before { content: ""; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 8px; height: 48px; border-radius: 2px; background: #EC8226; } .l-seminar__table { max-width: 880px; width: 100%; margin: 0 auto; } .l-seminar__table tr { display: flex; margin-bottom: 16px; padding-bottom: 16px; border-bottom: 1px solid #DBDBDB; } .l-seminar__table tr:last-of-type { margin-bottom: 0; } @media screen and (width <= 576px) { .l-seminar__table tr { flex-direction: column; } } .l-seminar__table th { width: 160px; flex: 0 0 auto; padding-left: 40px; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } @media screen and (width <= 576px) { .l-seminar__table th { padding-left: 0; } } .l-seminar__table td { width: 70%; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 2; color: #000000; } @media screen and (width <= 768px) { .l-seminar__table td { width: 100%; } } .l-seminar__table-caption { max-width: 880px; width: 100%; margin: 0 auto; } .l-seminar__flex { display: flex; justify-content: space-between; align-items: center; gap: 4ch; } @media screen and (width <= 768px) { .l-seminar__flex { align-items: flex-start; } } .l-seminar__flex > p:first-of-type { max-width: 500px; width: 70%; } @media screen and (width <= 768px) { .l-seminar__flex > p:first-of-type { width: 100%; } } @media screen and (width <= 768px) { .l-seminar__flex { flex-direction: column; gap: 0; margin-bottom: 8px; } } .l-seminar__btns { display: flex; gap: 0 24px; justify-content: center; align-items: center; flex-wrap: wrap; margin-block: 40px 64px; } @media screen and (width <= 768px) { .l-seminar__btns { flex-direction: column; gap: 0; margin-block: 24px 40px; } } .l-seminar__btn--color { max-width: 480px; width: 48%; height: 80px; display: flex; justify-content: center; align-items: center; margin: 0 auto 16px; border: 2px solid #EC8226; background: transparent; transition: all 0.5s; border-radius: 40px; } @media screen and (width <= 768px) { .l-seminar__btn--color { max-width: 320px; width: 100%; height: 60px; } } .l-seminar__btn--color > span { display: block; font-size: clamp(1.6rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; text-align: center; background: transparent; border-radius: none; padding: 10px; transition: all 0.5s; } .l-seminar__btn--color:hover { background: #FFDCBE; } @media screen and (width <= 768px) { .l-seminar__btn--color:hover { background: transparent; } } .l-seminar__btn--color:hover > span { font-size: clamp(1.6rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; background: transparent; } @media screen and (width <= 768px) { .l-seminar__btn--color:hover > span { font-size: clamp(1.6rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; background: transparent; } } .l-seminar__btn--color[href$=".pdf"] { max-width: 480px; width: 48%; height: 80px; margin: 0 auto 16px; padding: 3px; display: flex; justify-content: center; align-items: center; position: relative; transition: all 0.5s; background: linear-gradient(90deg, rgb(223, 124, 38) 0%, rgb(240, 212, 71) 100%); border-radius: 40px; border: 0; cursor: pointer; } @media screen and (width <= 768px) { .l-seminar__btn--color[href$=".pdf"] { max-width: 320px; width: 100%; height: 60px; } } .l-seminar__btn--color[href$=".pdf"] > span { height: 76px; width: 100%; display: flex; justify-content: center; align-items: center; font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; text-align: center; background: linear-gradient(90deg, rgb(223, 124, 38) 0%, rgb(240, 212, 71) 100%); border-radius: 40px; padding: 10px; transition: all 0.5s; } @media screen and (width <= 768px) { .l-seminar__btn--color[href$=".pdf"] > span { height: 56px; } } .l-seminar__btn--color[href$=".pdf"]:hover > span { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #B75C0D; background: #ffffff; } @media screen and (width <= 768px) { .l-seminar__btn--color[href$=".pdf"]:hover > span { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; background: linear-gradient(90deg, rgb(223, 124, 38) 0%, rgb(240, 212, 71) 100%); } } .l-seminar__archive { display: flex; justify-content: flex-start; align-items: flex-end; gap: 64px; margin-block: 64px; } @media screen and (width <= 1024px) { .l-seminar__archive { flex-direction: column; align-items: center; gap: 30px; margin-block: 30px; } } .l-seminar__iframe { max-width: 480px; width: 100%; height: 100%; border-radius: 20px; overflow: clip; aspect-ratio: 480/270; } .l-seminar__iframe > iframe { width: 100%; height: 100%; } .l-seminar-archive__info { margin-bottom: 40px; } @media screen and (width <= 1024px) { .l-seminar-archive__info { margin-bottom: 0; } } .l-seminar-archive__head { margin-bottom: 16px; font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } .l-seminar-archive__content { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 2; color: #000000; } .l-seminar__text { margin-block: 24px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 2; color: #000000; } .l-seminar__confirm { max-width: 640px; width: 100%; margin: 0 auto 64px; } .l-seminar__thanks { max-width: 710px; width: 100%; margin: 0 auto 24px; } .l-seminar-contact { max-width: 480px; width: 100%; margin: 0 auto; padding: 24px 40px; border: 1px solid #EC8226; border-radius: 20px; background: #FFF8F2; } @media screen and (width <= 768px) { .l-seminar-contact { padding: 16px; } } .l-seminar-contact__title { margin: 0 auto 16px; font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; text-align: center; } .l-seminar-contact__text { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 2; color: #000000; } .l-seminar-contact__text > a { text-decoration: underline; } .l-seminar > .c-btn--rev { max-width: 480px; width: 100%; margin: 64px auto 0; font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } @media screen and (width <= 768px) { .l-seminar > .c-btn--rev { max-width: 320px; height: 60px; margin: 40px auto 0; } } sup { vertical-align: super; font-size: small; } sub { vertical-align: sub; } .l-webreport-single { margin: 96px auto; max-width: 1600px; width: 100%; } @media screen and (width <= 768px) { .l-webreport-single { margin: 60px auto; } } .l-webreport-single__btns { display: flex; gap: 13px; } @media (max-width: 1380px) { .l-webreport-single__btns { flex-wrap: wrap; justify-content: center; } } .l-webreport-single__btns > a { max-width: 240px; width: 100%; display: flex; justify-content: center; align-items: center; padding: 12px clamp(2rem, 2.5vw, 4rem); font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; border-radius: 4px; background: #ffffff; border: 1px solid #EC8226; transition: all 0.5s; } .l-webreport-single__btns > a:hover { background: #FFDCBE; } @media screen and (width <= 768px) { .l-webreport-single__btns > a:hover { background: #ffffff; } } .l-webreport-single__btns > a:hover > span::after { top: 80%; } @media screen and (width <= 768px) { .l-webreport-single__btns > a:hover > span::after { top: 60%; } } @media (max-width: 1380px) { .l-webreport-single__btns > a { max-width: 360px; width: 48%; } } @media screen and (width <= 576px) { .l-webreport-single__btns > a { width: 100%; } } .l-webreport-single__btns > a > span { position: relative; padding-right: 24px; line-height: 1.4; } .l-webreport-single__btns > a > span::after { content: ""; position: absolute; width: 16px; height: 8px; right: 0px; top: 60%; transform: translateY(-50%); -webkit-mask-image: url("../../assets/images/icon/ico_dawn_arrow_02.svg"); mask-image: url("../../assets/images/icon/ico_dawn_arrow_02.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #000000; transition: all 0.5s; } .l-webreport-single__inner { display: flex; gap: 80px; } @media screen and (width <= 1280px) { .l-webreport-single__inner { gap: 5vw; } } @media screen and (width <= 963px) { .l-webreport-single__inner { flex-direction: column; } } .l-webreport-single__menu { width: 280px; height: -moz-fit-content; height: fit-content; position: sticky; flex: 0 0 auto; display: flex; flex-direction: column; gap: 8px; top: 200px; padding: 24px 20px 40px; background-color: #ffffff; border-radius: 20px; border: 1px solid #DBDBDB; background: #ffffff; } @media screen and (width <= 963px) { .l-webreport-single__menu { padding: 16px 20px 20px; position: static; } } .l-webreport-single__menu > p { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; text-align: center; } .l-webreport-single__menu > select { max-width: 240px; width: 100%; padding: 10px 16px; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #DBDBDB; border: 1px solid #DBDBDB; background: url("../../assets/images/icon/ico_dawn_arrow_02.svg") #ffffff no-repeat right 16px center; cursor: pointer; } .l-webreport-single__menu > select > option { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } .l-webreport-single__content { max-width: 1000px; width: calc(100% - 330px); } @media screen and (width <= 963px) { .l-webreport-single__content { width: 100%; } } .l-webreport-single__content > p { width: -moz-fit-content; width: fit-content; padding: 8px 16px; background: #FFBEBE; border-radius: 4px; } .l-webreport-single__content-container > h2 { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; padding: 64px 0 10px 0; margin-bottom: 16px; position: relative; border-bottom: 2px solid #DBDBDB; background: none; } @media screen and (width <= 963px) { .l-webreport-single__content-container > h2 { padding: 30px 0 10px; } } @media screen and (width <= 768px) { .l-webreport-single__content-container > h2 { padding: 0px 0 10px; margin-top: 30px; } } .l-webreport-single__content-container > h2::before { display: none; } .l-webreport-single__content-container > h2::after { content: ""; position: absolute; bottom: -2px; left: 0; width: 160px; height: 2px; background-color: #EC8226; } .l-webreport-single__content-container > ul.webreport-purpose > li { padding-left: 20px; margin-bottom: 16px; position: relative; } .l-webreport-single__content-container > ul.webreport-purpose > li::before { content: "■"; position: absolute; left: 0; } .l-webreport-single__content-container .webreport-new > p { margin-bottom: 16px; } .l-webreport-single__content-container .webreport-new > p > a { text-decoration: underline; transition: all 0.5s; } .l-webreport-single__content-container .webreport-new > p > a:hover { color: #EC8226; } @media screen and (width <= 768px) { .l-webreport-single__content-container .webreport-new > p > a:hover { color: #000000; } } .l-webreport-single__content-container .webreport-new li > h3 { margin-bottom: 8px; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } .l-webreport-single__content-container .webreport-new li > p { margin-bottom: 16px; } .l-webreport-single__content-container .webreport-research-method--item > h3 { margin-bottom: 8px; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } .l-webreport-single__content-container .webreport-research-method--item > p { margin-bottom: 16px; } .l-webreport-single__content-container .webreport-research-list > li { margin-bottom: 16px; } .l-webreport-single__content-container .webreport-research-list > li > p { margin-bottom: 16px; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } .l-webreport-single__content-container .webreport-research-list--item { width: 100%; display: flex; flex-wrap: wrap; border: 1px solid #DBDBDB; border-top: none; } .l-webreport-single__content-container .webreport-research-list--item p { max-width: 250px; width: 25%; padding: 15px 16px; border-right: 1px solid #DBDBDB; border-top: 1px solid #DBDBDB; } @media screen and (width <= 1280px) { .l-webreport-single__content-container .webreport-research-list--item p { max-width: none; width: 33.3333333333%; } } @media screen and (width <= 576px) { .l-webreport-single__content-container .webreport-research-list--item p { width: 50%; padding: 10px 8px; } } @media screen and (width <= 576px) { .l-webreport-single__content-container .webreport-research-list--item p:nth-of-type(2n) { border-right: none; } } @media screen and (width <= 1280px) { .l-webreport-single__content-container .webreport-research-list--item p:nth-of-type(3n) { border-right: none; } } @media screen and (width <= 576px) { .l-webreport-single__content-container .webreport-research-list--item p:nth-of-type(3n) { border-right: 1px solid #DBDBDB; } } .l-webreport-single__content-container .webreport-research-list--item p:nth-of-type(4n) { border-right: none; } @media screen and (width <= 1280px) { .l-webreport-single__content-container .webreport-research-list--item p:nth-of-type(4n) { border-right: 1px solid #DBDBDB; } } @media screen and (width <= 576px) { .l-webreport-single__content-container .webreport-research-list--item p:nth-of-type(4n) { border-right: none; } } @media screen and (width <= 576px) { .l-webreport-single__content-container .webreport-research-list--item p:nth-of-type(6) { border-right: none; } } .l-webreport-single__content-container .webreport-research-list--item p:last-of-type { border-right: none; } .l-webreport-single__content-container .graph-text { margin-bottom: 16px; } .l-webreport-single__content-container .graph-text > a { text-decoration: underline; transition: all 0.5s; } .l-webreport-single__content-container .graph-text > a:hover { color: #EC8226; } @media screen and (width <= 768px) { .l-webreport-single__content-container .graph-text > a:hover { color: #000000; } } .l-webreport-single__content-container .graph-box, .l-webreport-single__content-container .table-box { margin-bottom: 16px; width: 100%; } .l-webreport-single__content-container .graph-box > p, .l-webreport-single__content-container .table-box > p { margin-bottom: 16px; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } .l-webreport-single__content-container .graph-box.js-scrollable { overflow-x: auto; -webkit-overflow-scrolling: touch; } @media screen and (width <= 963px) { .l-webreport-single__content-container .graph-box.js-scrollable { cursor: grab; } } .l-webreport-single__content-container .graph-box table, .l-webreport-single__content-container .graph-box th, .l-webreport-single__content-container .graph-box td { border: 1px solid #DBDBDB; border-collapse: collapse; } .l-webreport-single__content-container .graph-box__item { width: 100%; } @media screen and (width <= 963px) { .l-webreport-single__content-container .graph-box__item { width: 900px; } } @media screen and (width <= 768px) { .l-webreport-single__content-container .graph-box__item { width: 750px; } } .l-webreport-single__content-container .graph-box__item tr:nth-of-type(even) { background: #FFF8F2; } .l-webreport-single__content-container .graph-box__item th { padding: 5px 24px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; background: #FFDCBE; } .l-webreport-single__content-container .graph-box__item th:nth-of-type(1) { max-width: 760px; width: 76%; } .l-webreport-single__content-container .graph-box__item th:nth-of-type(2) { max-width: 240px; width: 24%; text-align: center; } .l-webreport-single__content-container .graph-box__item td { padding: 25px 16px; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; vertical-align: middle; } .l-webreport-single__content-container .graph-box__item td:last-of-type { text-align: center; } .l-webreport-single__content-container .graph-box__item td:last-of-type > a { display: block; text-align: center; text-decoration: underline; transition: all 0.5s; } .l-webreport-single__content-container .graph-box__item td:last-of-type > a:hover { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #EC8226; } @media screen and (width <= 768px) { .l-webreport-single__content-container .graph-box__item td:last-of-type > a:hover { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } } @media screen and (width <= 768px) { .l-webreport-single__content-container .graph-box__item td { padding: 14px 12px; } } .l-webreport-single__content-container .table-box.js-scrollable { overflow-x: auto; -webkit-overflow-scrolling: touch; cursor: grab; } .l-webreport-single__content-container .table-box table, .l-webreport-single__content-container .table-box th, .l-webreport-single__content-container .table-box td { border: 1px solid #DBDBDB; border-collapse: collapse; } .l-webreport-single__content-container .table-box__item { width: 100%; } @media screen and (width <= 963px) { .l-webreport-single__content-container .table-box__item { width: 900px; } } @media screen and (width <= 768px) { .l-webreport-single__content-container .table-box__item { width: 750px; } } .l-webreport-single__content-container .table-box__item tr:nth-of-type(even) { background: #FFF8F2; } .l-webreport-single__content-container .table-box__item th { padding: 5px 24px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; background: #FFDCBE; } .l-webreport-single__content-container .table-box__item th:nth-of-type(1) { max-width: 760px; width: 76%; } .l-webreport-single__content-container .table-box__item th:nth-of-type(2) { max-width: 240px; width: 24%; text-align: center; } .l-webreport-single__content-container .table-box__item td { padding: 25px 16px; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; vertical-align: middle; } .l-webreport-single__content-container .table-box__item td:last-of-type { text-align: center; } .l-webreport-single__content-container .table-box__item td:last-of-type > a { display: block; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; text-align: center; text-decoration: underline; transition: all 0.5s; } .l-webreport-single__content-container .table-box__item td:last-of-type > a:hover { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #EC8226; } @media screen and (width <= 768px) { .l-webreport-single__content-container .table-box__item td:last-of-type > a:hover { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } } @media screen and (width <= 768px) { .l-webreport-single__content-container .table-box__item td { padding: 14px 12px; } } .l-webreport-single__content-container .table-box__item td.table-box__item-sub { padding: 0; } .l-webreport-single__content-container .table-box__item td.table-box__item-sub > div { padding: 25px 16px; border-bottom: 1px solid #DBDBDB; } @media screen and (width <= 768px) { .l-webreport-single__content-container .table-box__item td.table-box__item-sub > div { padding: 14px 12px; } } .l-webreport-single__content-container .table-box__item td.table-box__item-sub > div:last-of-type { border-bottom: none; } .l-webreport-single__content-container > div.js-scrollable { overflow-x: auto; -webkit-overflow-scrolling: touch; cursor: grab; } .l-webreport-single__content-container .webreport-data-classification { max-width: 1000px; width: 100%; margin: 0 auto 30px; border: 1px solid #DBDBDB; } @media screen and (width <= 1024px) { .l-webreport-single__content-container .webreport-data-classification { width: 900px; } } .l-webreport-single__content-container .webreport-data-classification tr { display: flex; border-bottom: 1px solid #DBDBDB; } .l-webreport-single__content-container .webreport-data-classification tr:nth-of-type(even) { background: #FFF8F2; } .l-webreport-single__content-container .webreport-data-classification tr:last-of-type { border-bottom: none; } .l-webreport-single__content-container .webreport-data-classification th { width: 280px; padding: 5px 24px; border-right: 1px solid #DBDBDB; background: #FFDCBE; text-align: center; } .l-webreport-single__content-container .webreport-data-classification th:first-of-type { width: 438px; text-align: left; } .l-webreport-single__content-container .webreport-data-classification th:last-of-type { border-right: none; } .l-webreport-single__content-container .webreport-data-classification td { width: 280px; height: 76px; display: flex; justify-content: center; align-items: center; border-right: 1px solid #DBDBDB; font-size: clamp(1.8rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; text-align: center; vertical-align: middle; } .l-webreport-single__content-container .webreport-data-classification td:first-of-type { justify-content: flex-start; width: 438px; padding: 25px 24px; text-align: left; } .l-webreport-single__content-container .webreport-data-classification td:last-of-type { border-right: none; } .l-webreport-single__content-container .webreport-data-classification td > a { width: 100%; display: block; padding: 25px 24px; font-size: clamp(1.8rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; text-decoration: underline; transition: all 0.5s; } .l-webreport-single__content-container .webreport-data-classification td > a:hover { font-size: clamp(1.8rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #EC8226; } @media screen and (width <= 768px) { .l-webreport-single__content-container .webreport-data-classification td > a:hover { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } } .l-publication { width: min(100%, 1440px); margin: 96px auto; padding-inline: calc(var(--inline-guideline, 0) / 2); } @media screen and (width <= 768px) { .l-publication { margin: 60px auto; } } .l-publication--unpublished .l-publication__content-cart { display: none; } .l-publication__inner { max-width: 1040px; margin: 0 auto; } .l-publication__inner h1 { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } .l-publication__content { display: flex; justify-content: space-between; align-items: flex-start; gap: 55px; margin-block: 24px 64px; } @media screen and (width <= 768px) { .l-publication__content { flex-direction: column; gap: 30px; } } .l-publication__content-image { max-width: 360px; width: 100%; aspect-ratio: 1; border-radius: 20px; overflow: clip; } .l-publication__content-image > img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } @media screen and (width <= 768px) { .l-publication__content-image { margin: 0 auto; } } .l-publication__content-summary { width: calc(100% - 415px); } @media screen and (width <= 768px) { .l-publication__content-summary { width: 100%; } } .l-publication__content-details { display: flex; gap: 40px; padding-block: 11px; border-top: 1px solid #DBDBDB; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 2; color: #000000; } .l-publication__content-details:last-of-type { border-bottom: 1px solid #DBDBDB; } .l-publication__content-details > span { width: 160px; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 2; color: #000000; flex: 0 0 auto; } .l-publication__content-details > span:nth-of-type(2) { width: auto; } .l-publication__content-details > a { text-decoration: underline; transition: all 0.5s; } .l-publication__content-details > a:hover { color: #EC8226; } @media screen and (width <= 768px) { .l-publication__content-details > a:hover { color: #000000; } } .l-publication__content-box { margin-bottom: 64px; } .l-publication__content-box .l-section__title--list { margin-bottom: 16px; } .l-publication__content-box > p { padding-bottom: 24px; margin-bottom: 24px; border-bottom: 1px solid #DBDBDB; } .l-publication__content-btns { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 24px; } @media screen and (width <= 576px) { .l-publication__content-btns { justify-content: center; } } .l-publication__content-btns .c-btn { max-width: 320px; height: 64px; } .l-publication__content-btns .c-btn > span { height: 60px; display: flex; justify-content: center; align-items: center; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; } .l-publication__content-btns .c-btn:hover { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; } .l-publication__content-btns .c-btn--rev { height: 64px; border-radius: 4px; flex: 0 0 auto; } .l-publication__content-btns .c-btn--rev > span { width: -moz-fit-content; width: fit-content; padding-left: 44px; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; position: relative; } .l-publication__content-btns .c-btn--rev > span::before { content: ""; width: 28px; height: 22px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); -webkit-mask-image: url("../../assets/images/icon/ico_print_01.svg"); mask-image: url("../../assets/images/icon/ico_print_01.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #000000; } .l-publication__content-btns .c-btn--rev:hover > span { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; } .l-publication__content-cart { max-width: 630px; width: 100%; } .l-publication__content-cart > form { width: 100%; display: flex; align-items: center; gap: 48px; } .l-publication__content-cart > form label { width: 260px; height: 40px; display: flex; justify-content: center; align-items: center; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 2; color: #000000; } .l-publication__content-cart > form label > input { width: 120px; padding: 8px; margin-inline: 24px 8px; } .l-publication__content-cart > form label > span { height: 100%; display: flex; align-items: end; line-height: 1.5; } .l-publication__content-toc .l-section__title--list { margin-bottom: 16px; } .l-publication__content-toc > p { line-height: 2; } .l-publication__content-toc > a { text-decoration: underline; transition: all 0.5s; } .l-publication__content-toc > a:hover { color: #EC8226; } @media screen and (width <= 768px) { .l-publication__content-toc > a:hover { color: #000000; } } @media screen and (width <= 963px) { .l-publication__content-table { margin-bottom: 30px; } } @media screen and (width <= 963px) { .l-publication__content-table.js-scrollable { overflow-x: auto; -webkit-overflow-scrolling: touch; cursor: grab; } } .l-publication__content-index { display: flex; align-items: stretch; margin-bottom: 24px; border: 1px solid #DBDBDB; } @media screen and (width <= 963px) { .l-publication__content-index { width: 900px; } } .l-publication__content-index > p { width: 100px; display: flex; justify-content: center; align-items: center; background: #FFDCBE; border-right: 1px solid #DBDBDB; } @media screen and (width <= 963px) { .l-publication__content-index > p { width: 70px; } } .l-publication__content-index > table { width: calc(100% - 100px); } @media screen and (width <= 963px) { .l-publication__content-index > table { width: calc(100% - 70px); } } .l-publication__content-index tr { border-bottom: 1px solid #DBDBDB; } .l-publication__content-index tr:last-of-type { border-bottom: none; } .l-publication__content-index tr:nth-of-type(even) { background: #FFF8F2; } .l-publication__content-index tr > th { padding: 5px; text-align: center; background: #FFDCBE; border-right: 1px solid #DBDBDB; } .l-publication__content-index tr > th:nth-of-type(2) { min-width: 100px; } .l-publication__content-index tr > th:last-of-type { border-right: none; } .l-publication__content-index tr > td { padding: 20px 16px; vertical-align: middle; border-right: 1px solid #DBDBDB; } .l-publication__content-index tr > td:last-of-type { border-right: none; } @media screen and (width <= 963px) { .l-publication__content-index tr > td:nth-of-type(3) { max-width: 400px; } } @media screen and (width <= 963px) { .l-publication__content-index tr > td { padding: 16px 8px; } } .l-publication__content-list { margin-bottom: 24px; } @media screen and (width <= 963px) { .l-publication__content-list { width: 900px; } } .l-publication__content-list > table { width: 100%; border: 1px solid #DBDBDB; } .l-publication__content-list > table tr { border-bottom: 1px solid #DBDBDB; } .l-publication__content-list > table tr:last-of-type { border-bottom: none; } .l-publication__content-list > table tr:nth-of-type(even) { background: #FFF8F2; } .l-publication__content-list > table th { padding: 5px 16px; text-align: center; background: #FFDCBE; border-right: 1px solid #DBDBDB; } .l-publication__content-list > table th:nth-of-type(1) { width: 119px; flex: 0 0 auto; } .l-publication__content-list > table th:nth-of-type(2) { max-width: 439px; vertical-align: middle; } .l-publication__content-list > table th:nth-of-type(3) { min-width: 199px; } .l-publication__content-list > table th:last-of-type { border-right: none; } .l-publication__content-list > table td { padding: 16px; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; border-right: 1px solid #DBDBDB; } .l-publication__content-list > table td:nth-of-type(1) { padding: 40px 8px; text-align: center; } .l-publication__content-list > table td:nth-of-type(2) { max-width: 439px; vertical-align: middle; } .l-publication__content-list > table td:nth-of-type(3) { min-width: 199px; text-align: center; } .l-publication__content-list > table td:last-of-type { border-right: none; } .l-publication__outline-list { padding-bottom: 24px; margin-bottom: 24px; border-bottom: 1px solid #DBDBDB; } .l-publication__outline-list > li { padding-left: 16px; position: relative; } .l-publication__outline-list > li::before { content: "・"; position: absolute; left: 0; } .copy--print { display: none; } @media print { .l-header, .l-footer, .l-page-head, .l-page-head__breadcrumb { display: none; } .l-publication__content { flex-direction: column; gap: 24px; } .l-publication__content-summary { width: 100%; } .copy--print { display: block; margin: 40px auto; } .copy--print > span { display: block; width: -moz-fit-content; width: fit-content; margin: 0 auto; padding-top: 32px; border-top: 1px solid #DBDBDB; } } .l-news { width: min(100%, 1440px); margin: 0 auto; } .l-news__content { margin: 96px auto; } @media screen and (width <= 768px) { .l-news__content { margin: 60px auto; } } .l-news__inner > a.c-news { margin-bottom: 16px; } .l-news__inner > a:hover { border: 1px solid #EC8226; } @media screen and (width <= 768px) { .l-news__inner > a:hover { border: 1px solid #DBDBDB; } } .l-news__inner > a:hover::after { right: 24px; background-color: #EC8226; } @media screen and (width <= 768px) { .l-news__inner > a:hover::after { right: 16px; background-color: #000000; } } .l-news__more { max-width: 180px; width: 100%; margin: 0 auto; } .l-news__more > button { width: 100%; padding-block: 5px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; text-align: center; background-color: #FFDCBE; border: 1px solid #EC8226; border-radius: 4px; cursor: pointer; transition: all 0.5s; } .l-news__more > button:hover { background-color: #EC8226; color: #ffffff; } @media screen and (width <= 768px) { .l-news__more > button:hover { background-color: #FFDCBE; color: #000000; } } .l-news-single { margin: 96px auto; } @media screen and (width <= 768px) { .l-news-single { margin: 60px auto; } } .l-news-single__inner { width: min(100%, 1040px); margin: 0 auto; } .l-news-single__inner > p { margin-bottom: 16px; } .l-news-single__inner > p > a { display: block; padding-left: 24px; margin-bottom: 24px; position: relative; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; text-decoration: underline; } @media screen and (width <= 768px) { .l-news-single__inner > p > a { margin-bottom: 16px; } } .l-news-single__inner > p > a::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; background: #EC8226; border-radius: 50%; } .l-news-single__inner > p > a[target=_blank] { position: relative; padding-right: 22px; display: inline; } .l-news-single__inner > p > a[target=_blank]::after { content: ""; width: 20px; height: 20px; display: inline-block; position: relative; top: 3px; right: -6px; -webkit-mask-image: url("../../assets/images/icon/ico_blank_01.svg"); mask-image: url("../../assets/images/icon/ico_blank_01.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #000000; transition: all 0.5s; } .l-news-single__inner > p > a[target=_blank][href*=".pdf"] { position: relative; padding-right: 22px; display: inline; } .l-news-single__inner > p > a[target=_blank][href*=".pdf"]::after { content: ""; width: 20px; height: 20px; display: inline-block; position: relative; top: 4px; right: -6px; -webkit-mask-image: url("../../assets/images/icon/ico_pdf_01.svg"); mask-image: url("../../assets/images/icon/ico_pdf_01.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #000000; transition: all 0.5s; } .l-news-single__inner .wp-block-image { max-width: 600px; width: 100%; margin: 64px auto; border-radius: 20px; overflow: clip; } @media screen and (width <= 768px) { .l-news-single__inner .wp-block-image { margin: 32px auto; border-radius: 8px; } } .l-news-single__title > p { display: flex; justify-content: flex-start; align-items: center; gap: 16px; margin-bottom: 12px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #909090; font-family: "Satoshi", sans-serif; } .l-news-single__title > p > span { padding: 2px 16px; font-size: clamp(1.2rem, 0.875vw, 1.4rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #ffffff; font-family: "Noto Sans JP", sans-serif; text-align: center; border-radius: 16px; background: #EC8226; } .l-news-single__title .l-section__title--list { margin-bottom: 16px; } .l-news__btn .c-btn--rev { max-width: 480px; width: 100%; margin: 64px auto 0; font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } @media screen and (width <= 768px) { .l-news__btn .c-btn--rev { max-width: 320px; height: 60px; margin: 40px auto 0; } } .h-adr { max-width: 800px; width: 100%; margin: 0 auto; } .h-adr--confirm { max-width: 840px; width: 100%; } .h-adr .l-form:nth-of-type(2) .l-form__addition { width: 100%; } .h-adr > .l-form__inputs { width: -moz-fit-content; width: fit-content; margin: 0 auto; } .l-form { max-width: 800px; width: 100%; display: flex; flex-wrap: wrap; align-items: baseline; gap: 0 28px; margin: 0 auto 16px; } .l-form--hidden { display: none; } .l-form__title { width: -moz-fit-content; width: fit-content; } .l-form__addition { position: relative; padding-left: 2ch; font-size: clamp(1.3rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #4E4E4E; } .l-form__addition::before { content: "※"; position: absolute; left: 0; top: 0; font-size: clamp(1.3rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #4E4E4E; } .l-form__name { padding-left: 52px; margin-bottom: 8px; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } .l-form__name.required { position: relative; } .l-form__name.required::before { content: attr(data-span); position: absolute; left: 0; top: 50%; transform: translateY(-50%); padding: 0 8px; font-size: clamp(1.2rem, 0.875vw, 1.4rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #ffffff; background: #DF5757; border-radius: 4px; } .l-form__name.optional { position: relative; } .l-form__name.optional::after { content: attr(data-span); position: absolute; left: 0; top: 50%; transform: translateY(-50%); padding: 0 8px; font-size: clamp(1.2rem, 0.875vw, 1.4rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; border-radius: 4px; background: #DBDBDB; } .l-form__inputs { width: 100%; flex: 0 0 auto; position: relative; } .l-form__inputs > input, .l-form__inputs select { max-width: 800px; width: 100%; padding: 8px 16px; font-family: "Noto Sans JP", sans-serif; border: 1px solid #4E4E4E; } @media screen and (width <= 768px) { .l-form__inputs > input, .l-form__inputs select { max-width: 100%; } } .l-form__inputs > input::-moz-placeholder, .l-form__inputs select::-moz-placeholder { color: #DBDBDB; } .l-form__inputs > input::placeholder, .l-form__inputs select::placeholder { color: #DBDBDB; } .l-form__inputs > textarea { max-width: 800px; width: 100%; height: 120px; padding: 8px 16px; font-family: "Noto Sans JP", sans-serif; border: 1px solid #4E4E4E; resize: none; } @media screen and (width <= 768px) { .l-form__inputs > textarea { max-width: 100%; } } .l-form__inputs > textarea::-moz-placeholder { color: #DBDBDB; } .l-form__inputs > textarea::placeholder { color: #DBDBDB; } .l-form__inputs input[type=checkbox] { position: relative; max-width: none; width: 20px; height: 20px; padding: 0; border: 1px solid #4E4E4E; vertical-align: -5px; -webkit-appearance: none; -moz-appearance: none; appearance: none; } .l-form__inputs input:checked + label::after { content: ""; position: absolute; top: 7px; left: 11px; transform: rotate(50deg); width: 6px; height: 10px; border-right: 2px solid #000000; border-bottom: 2px solid #000000; } .l-form__radio { margin-top: 8px; } .l-form__radio input[type=radio] { display: none; } .l-form__radio label { padding-left: 30px; margin-right: 40px; position: relative; } @media screen and (width <= 768px) { .l-form__radio label { padding-left: 24px; } } .l-form__radio label:hover { cursor: pointer; } .l-form__radio label::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; border: 1px solid #4E4E4E; border-radius: 50%; background: #ffffff; } @media screen and (width <= 768px) { .l-form__radio label::before { width: 20px; height: 20px; } } .l-form__radio input:checked + label::after { content: ""; position: absolute; top: 50%; left: 5px; transform: translateY(-50%); width: 14px; height: 14px; border-radius: 50%; background: #000000; } @media screen and (width <= 768px) { .l-form__radio input:checked + label::after { width: 10px; height: 10px; } } .l-form__policy { cursor: pointer; } .l-form__policy > a { padding-right: 20px; text-decoration: underline; position: relative; } .l-form__policy > a::after { content: ""; position: absolute; width: 12px; height: 12px; right: 2px; top: 62%; transform: translateY(-50%); -webkit-mask-image: url("../../assets/images/icon/ico_blank_01.svg"); mask-image: url("../../assets/images/icon/ico_blank_01.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #000000; } .l-form__submit { max-width: 400px; width: 100%; height: 80px; margin: 64px auto 16px; padding: 3px; display: flex; justify-content: center; align-items: center; position: relative; transition: all 0.5s; background: linear-gradient(90deg, rgb(223, 124, 38) 0%, rgb(240, 212, 71) 100%); border-radius: 40px; border: 0; cursor: pointer; } @media screen and (width <= 768px) { .l-form__submit { max-width: 320px; width: 100%; height: 60px; } } .l-form__submit > input { height: 76px; width: 100%; display: flex; justify-content: center; align-items: center; font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; text-align: center; background: linear-gradient(90deg, rgb(223, 124, 38) 0%, rgb(240, 212, 71) 100%); border-radius: 40px; padding: 10px; transition: all 0.5s; border: none; cursor: pointer; } @media screen and (width <= 768px) { .l-form__submit > input { height: 56px; } } .l-form__submit:hover > input { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #B75C0D; background: #ffffff; } @media screen and (width <= 768px) { .l-form__submit:hover > input { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; background: linear-gradient(90deg, rgb(223, 124, 38) 0%, rgb(240, 212, 71) 100%); } } .l-form__error { font-size: clamp(1.2rem, 0.8125vw, 1.3rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #E71B3D; } .l-form__wrap { max-width: 840px; width: 100%; display: flex; justify-content: space-between; align-items: center; gap: 40px; margin: 64px auto 0; } @media screen and (width <= 768px) { .l-form__wrap { flex-direction: column; gap: 16px; margin: 32px auto 0; } } .l-form__wrap > a { max-width: 400px; width: 100%; height: 80px; display: flex; justify-content: center; align-items: center; border: 2px solid #EC8226; background: transparent; transition: all 0.5s; border-radius: 40px; overflow: clip; } @media screen and (width <= 768px) { .l-form__wrap > a { max-width: 320px; width: 100%; height: 60px; } } .l-form__wrap > a > span { display: flex; justify-content: center; align-items: center; width: 100%; height: 80px; font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; text-align: center; background: transparent; border-radius: none; padding: 10px; transition: all 0.5s; } @media screen and (width <= 768px) { .l-form__wrap > a > span { height: 60px; } } .l-form__wrap > a:hover { background: #FFDCBE; } @media screen and (width <= 768px) { .l-form__wrap > a:hover { background: transparent; } } .l-form__wrap > a:hover > span { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; background: transparent; } @media screen and (width <= 768px) { .l-form__wrap > a:hover > span { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; background: transparent; } } .l-form__wrap > button { max-width: 400px; width: 100%; height: 80px; display: flex; justify-content: center; align-items: center; position: relative; transition: all 0.5s; background: linear-gradient(90deg, rgb(223, 124, 38) 0%, rgb(240, 212, 71) 100%); border-radius: 40px; padding: 3px; cursor: pointer; } @media screen and (width <= 768px) { .l-form__wrap > button { max-width: 320px; width: 100%; height: 60px; } } .l-form__wrap > button > span { display: flex; justify-content: center; align-items: center; width: 100%; height: 76px; font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; text-align: center; background: linear-gradient(90deg, rgb(223, 124, 38) 0%, rgb(240, 212, 71) 100%); border-radius: 38px; padding: 10px; transition: all 0.5s; } @media screen and (width <= 768px) { .l-form__wrap > button > span { height: 56px; } } .l-form__wrap > button:hover > span { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #B75C0D; background: #ffffff; } @media screen and (width <= 768px) { .l-form__wrap > button:hover > span { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; background: linear-gradient(90deg, rgb(223, 124, 38) 0%, rgb(240, 212, 71) 100%); } } .c-btn { max-width: 360px; width: 100%; height: 52px; display: flex; justify-content: center; align-items: center; position: relative; transition: all 0.5s; background: linear-gradient(90deg, rgb(223, 124, 38) 0%, rgb(240, 212, 71) 100%); border-radius: 32px; padding: 3px; cursor: pointer; } .c-btn > span { display: block; width: 100%; height: 48px; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; text-align: center; background: linear-gradient(90deg, rgb(223, 124, 38) 0%, rgb(240, 212, 71) 100%); border-radius: 32px; padding: 10px; transition: all 0.5s; } .c-btn:hover > span { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #B75C0D; background: #ffffff; } @media screen and (width <= 768px) { .c-btn:hover > span { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; background: linear-gradient(90deg, rgb(223, 124, 38) 0%, rgb(240, 212, 71) 100%); } } .c-btn--m { border-radius: 4px; } .c-btn--m > span { border-radius: 4px; } .c-btn--rev { height: 80px; border: 2px solid #EC8226; background: transparent; transition: all 0.5s; border-radius: 40px; } .c-btn--rev > span { display: block; width: 100%; height: 48px; font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; text-align: center; background: transparent; border-radius: none; padding: 10px; transition: all 0.5s; } .c-btn--rev:hover { background: #FFDCBE; } @media screen and (width <= 768px) { .c-btn--rev:hover { background: transparent; } } .c-btn--rev:hover > span { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; background: transparent; } @media screen and (width <= 768px) { .c-btn--rev:hover > span { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; } } .c-btn--links { max-width: 440px; min-width: 290px; width: 100%; height: clamp(9rem, 7.5vw, 12rem); justify-content: flex-start; padding: 0 clamp(6rem, 6.5vw, 10.4rem) 0 clamp(3rem, 2.5vw, 4rem); border: 2px solid #EC8226; background: rgba(255, 244, 234, 0) url("../../assets/images/bg_button_01.png") no-repeat; background-position: center right; background-size: cover; transition: all 0.5s; border-radius: 8px; position: relative; overflow: clip; } @media screen and (width <= 576px) { .c-btn--links { height: auto; padding-block: 10px; } } .c-btn--links::before { content: ""; position: absolute; left: 0; top: 0; width: 12px; height: 100%; background: #EC8226; } .c-btn--links::after { content: ""; position: absolute; width: clamp(3rem, 2.5vw, 4rem); height: clamp(3rem, 2.5vw, 4rem); right: clamp(2rem, 2.5vw, 4rem); top: 50%; transform: translateY(-50%); background: url("../../assets/images/icon/ico_arrow_02.svg") no-repeat; background-size: cover; transition: all 0.5s; } .c-btn--links > span { display: block; width: -moz-fit-content; width: fit-content; height: auto; font-size: clamp(1.8rem, 1.5vw, 2.4rem); font-weight: 700; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; text-align: left; background: transparent; border-radius: none; padding: 0; transition: all 0.5s; } .c-btn--links:hover { background: rgb(255, 244, 234) url("../../assets/images/bg_button_01.png") no-repeat; background-position: center right; background-size: cover; } @media screen and (width <= 768px) { .c-btn--links:hover { background: rgba(255, 244, 234, 0) url("../../assets/images/bg_button_01.png") no-repeat; background-position: center right; background-size: cover; } } .c-btn--links:hover::after { content: ""; right: clamp(1.6rem, 1.5vw, 2.4rem); background: url("../../assets/images/icon/ico_arrow_01.svg") no-repeat; background-size: cover; } @media screen and (width <= 768px) { .c-btn--links:hover::after { right: clamp(2rem, 2.5vw, 4rem); background: url("../../assets/images/icon/ico_arrow_02.svg") no-repeat; background-size: cover; } } .c-btn--links:hover > span { font-size: clamp(1.8rem, 1.5vw, 2.4rem); font-weight: 700; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; background: transparent; } .c-btn--top { width: 214px; display: flex; justify-content: center; align-items: center; padding: 16px 20px; font-size: clamp(1.6rem, 1vw, 1.6rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; border-radius: 30px; position: relative; transition: all 0.5s; background-color: #000000; border: 1px solid #000000; cursor: pointer; } .c-btn--top::before, .c-btn--top::after { display: none; } .c-btn--top:hover { font-size: clamp(1.6rem, 1vw, 1.6rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; background-color: #ffffff; } @media screen and (width <= 768px) { .c-btn--top:hover { font-size: clamp(1.6rem, 1vw, 1.6rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; background-color: #000000; } } .c-breadcrumb { display: flex; flex-wrap: wrap; row-gap: 4px; -moz-column-gap: 8px; column-gap: 8px; max-width: 1400px; width: 100%; } .c-breadcrumb__item { font-size: clamp(1.2rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; display: flex; flex: 0 0 auto; align-items: center; gap: 8px; } .c-breadcrumb__item > a { padding-right: 20px; font-size: clamp(1.2rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; position: relative; } .c-breadcrumb__item > a::after { content: ""; position: absolute; width: 12px; height: 1px; background: #EC8226; top: 54%; right: 0; transform: translateY(-50%); } .c-breadcrumb__item:last-of-type { max-width: 40ch; width: -moz-fit-content; width: fit-content; display: -webkit-box; overflow: hidden; flex: unset; -webkit-box-orient: vertical; text-decoration: none; -webkit-line-clamp: 1; } @media screen and (width <= 576px) { .c-breadcrumb__item:last-of-type { max-width: 26ch; } } .c-breadcrumb__item:last-of-type::after { display: none; } .c-news { display: flex; flex-direction: column; gap: 8px; padding: 16px 56px 16px 16px; border: 1px solid #DBDBDB; background: #ffffff; border-radius: 8px; position: relative; transition: all 0.5s; } @media screen and (width <= 768px) { .c-news { padding: 16px 45px 16px 16px; } } .c-news:hover { border: 1px solid #EC8226; } @media screen and (width <= 768px) { .c-news:hover { border: 1px solid #DBDBDB; } } .c-news:hover::after { right: 14px; background-color: #EC8226; } @media screen and (width <= 768px) { .c-news:hover::after { right: 16px; background-color: #000000; } } .c-news::after { content: ""; position: absolute; width: 24px; height: 24px; right: 24px; top: 50%; transform: translateY(-50%); -webkit-mask-image: url("../../assets/images/icon/ico_arrow_right_01.svg"); mask-image: url("../../assets/images/icon/ico_arrow_right_01.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #000000; transition: all 0.5s; } @media screen and (width <= 768px) { .c-news::after { right: 16px; } } .c-news-list { display: flex; flex-direction: column; gap: 8px; margin-top: 16px; } .c-news__meta { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 24px; } @media screen and (width <= 768px) { .c-news__meta { gap: 6px 8px; } } .c-news__date { font-size: clamp(1.6rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1; color: #909090; font-family: "Satoshi", sans-serif; } .c-news__cats { display: flex; justify-content: center; align-items: center; gap: 8px; } .c-news__cat { padding: 0px 8px; font-size: clamp(1.2rem, 0.75vw, 1.2rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #ffffff; background: #EC8226; border-radius: 16px; } .c-news__title { font-size: clamp(1.4rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; overflow: hidden; display: -webkit-box; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } @media screen and (width <= 768px) { .c-news__title { -webkit-line-clamp: 2; } } .c-news-wrapper { max-width: 880px; width: 100%; margin: 0 auto; } .c-news-wrapper .c-news__item > a.c-news { margin-bottom: 16px; } .c-seminar { max-width: 360px; width: 32%; padding: 16px 24px 16px 16px; background: #ffffff; border-radius: 8px; border: 1px solid #DBDBDB; transition: all 0.5s; } @media screen and (width <= 963px) { .c-seminar { width: 48%; } } @media screen and (width <= 576px) { .c-seminar { width: 100%; } } .c-seminar:hover { background: #FFF8F2; } @media screen and (width <= 768px) { .c-seminar:hover { background: #ffffff; } } .c-seminar:hover .c-seminar__more { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #EC8226; } @media screen and (width <= 768px) { .c-seminar:hover .c-seminar__more { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } } .c-seminar:hover .c-seminar__more::after { right: -8px; background-color: #EC8226; } @media screen and (width <= 768px) { .c-seminar:hover .c-seminar__more::after { right: 0px; background-color: #000000; } } .c-seminar__thumb { max-width: 320px; width: 100%; aspect-ratio: 360/164; margin-bottom: 16px; background: #fafafa; border-radius: 8px; border: 1px solid #DBDBDB; overflow: clip; } .c-seminar__status { width: -moz-fit-content; width: fit-content; padding: 0px 11px; margin-bottom: 8px; font-size: clamp(1.2rem, 0.875vw, 1.4rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; text-align: center; border-radius: 4px; } .c-seminar__status--active { font-size: clamp(1.2rem, 0.875vw, 1.4rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #ffffff; border: 1px solid #EC8226; background: #EC8226; } .c-seminar__status--end { border: 1px solid #000000; background: #DBDBDB; } .c-seminar__title { font-size: clamp(1.6rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; margin-bottom: 8px; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .c-seminar__date { margin-bottom: 36px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } .c-seminar__more { padding-right: 26px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; text-align: right; transition: all 0.5s; position: relative; } .c-seminar__more::after { content: ""; position: absolute; width: 18px; height: 15px; right: 0px; top: 50%; transform: translateY(-50%); -webkit-mask-image: url("../../assets/images/icon/ico_seminar_arrow_01.svg"); mask-image: url("../../assets/images/icon/ico_seminar_arrow_01.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #000000; transition: all 0.5s; } .c-webreport { border-bottom: 1px solid #DBDBDB; } .c-webreport:last-of-type { border-bottom: none; } .c-webreport:nth-of-type(even) { background: #FFF8F2; } .c-webreport__item { max-width: 839px; width: 100%; } .c-webreport__item:nth-of-type(1) > a { display: block; padding: 25px 40px; border-right: 1px solid #dbdbdb; text-align: left; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; text-decoration: underline; transition: all 0.5s; } .c-webreport__item:nth-of-type(1) > a:hover { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #EC8226; } @media screen and (width <= 768px) { .c-webreport__item:nth-of-type(1) > a:hover { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } } .c-webreport__item:nth-of-type(2) { max-width: 160px; width: 100%; display: flex; justify-content: center; align-items: center; padding: 25px 16px; } .c-cart { width: 100%; display: flex; align-items: center; gap: 48px; } @media screen and (width <= 768px) { .c-cart { gap: 24px; } } @media screen and (width <= 576px) { .c-cart { flex-direction: column; } } .c-cart__inputs { max-width: 630px; width: 100%; display: flex; justify-content: center; align-items: center; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 2; color: #000000; } .c-cart__amount { width: 120px; height: 40px; padding: 4px 8px; margin-inline: 24px 8px; } .c-cart__unit { height: 100%; display: flex; align-items: end; line-height: 1.5; } .c-cart__wrap { max-width: 320px; width: 100%; height: 64px; } .c-cart__btn { width: 100%; display: flex; justify-content: center; align-items: center; position: relative; transition: all 0.5s; background: linear-gradient(90deg, rgb(223, 124, 38) 0%, rgb(240, 212, 71) 100%); border-radius: 4px; padding: 3px; cursor: pointer; } .c-cart__btn > span { width: 100%; height: 60px; display: flex; justify-content: center; align-items: center; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; text-align: center; background: linear-gradient(90deg, rgb(223, 124, 38) 0%, rgb(240, 212, 71) 100%); border-radius: 4px; padding: 10px; transition: all 0.5s; } .c-cart__btn:hover > span { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #B75C0D; background: #ffffff; } @media screen and (width <= 768px) { .c-cart__btn:hover > span { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; background: linear-gradient(90deg, rgb(223, 124, 38) 0%, rgb(240, 212, 71) 100%); } } @media screen and (width <= 963px) { .c-cart-list.js-scrollable { overflow-x: auto; -webkit-overflow-scrolling: touch; cursor: grab; } } .c-cart-list__title { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; padding: 0 0 10px 0; margin-block: 24px 16px; position: relative; border-bottom: 2px solid #DBDBDB; background: none; } .c-cart-list__title::before { display: none; } .c-cart-list__title::after { content: ""; position: absolute; bottom: -2px; left: 0; width: 160px; height: 2px; background-color: #EC8226; } .c-cart-list-table { width: 100%; border: 1px solid #DBDBDB; margin-bottom: 24px; } @media screen and (width <= 1280px) { .c-cart-list-table { width: 1040px; } } .c-cart-list-table__row { max-width: 1040px; width: 100%; display: flex; align-items: stretch; border-bottom: 1px solid #DBDBDB; } .c-cart-list-table__row:last-of-type { border-bottom: none; } .c-cart-list-table__head { padding: 5px; background: #FFDCBE; border-right: 1px solid #DBDBDB; text-align: center; } .c-cart-list-table__head:nth-of-type(1) { width: 120px; } .c-cart-list-table__head:nth-of-type(2) { width: 402px; } .c-cart-list-table__head:nth-of-type(3) { width: 132px; } .c-cart-list-table__head:nth-of-type(4) { width: 132px; } .c-cart-list-table__head:nth-of-type(5) { width: 132px; } .c-cart-list-table__head:nth-of-type(6) { width: 120px; border-right: none; } .c-cart-list-table__content { display: flex; justify-content: center; align-items: center; padding: 25px 16px; border-right: 1px solid #DBDBDB; background: #FFF8F2; } .c-cart-list-table__content:nth-of-type(1) { width: 120px; } .c-cart-list-table__content:nth-of-type(2) { width: 402px; } .c-cart-list-table__content:nth-of-type(3) { width: 132px; } .c-cart-list-table__content:nth-of-type(4) { width: 132px; } .c-cart-list-table__content:nth-of-type(5) { width: 132px; } .c-cart-list-table__content:nth-of-type(6) { width: 120px; border-right: none; } .c-cart-list-table__content > a { transition: all 0.5s; text-decoration: underline; } .c-cart-list-table__content > a:hover { color: #EC8226; } @media screen and (width <= 768px) { .c-cart-list-table__content > a:hover { color: #000000; } } .c-cart-list-table__content input { width: 72px; padding: 4px 8px; margin-right: 8px; border: 1px solid #DBDBDB; } .c-cart-list-table__content button { width: 80px; padding: 6px; text-align: center; border-radius: 4px; border: 1px solid #909090; background: #DBDBDB; cursor: pointer; transition: all 0.5s; } .c-cart-list-table__content button:hover { background: #909090; color: #ffffff; } @media screen and (width <= 768px) { .c-cart-list-table__content button:hover { background: #000000; color: #000000; } } .c-cart-list__btns { display: flex; justify-content: flex-end; align-items: center; gap: 24px; margin-top: 64px; } @media screen and (width <= 768px) { .c-cart-list__btns { flex-direction: column; margin-top: 30px; } } .c-cart-list__btns .c-btn { max-width: 320px; height: 64px; } .c-cart-list__btns .c-btn > span { height: 60px; display: flex; justify-content: center; align-items: center; padding-left: 24px; position: relative; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #ffffff; transition: all 0.5s; } .c-cart-list__btns .c-btn > span::before { content: ""; position: absolute; width: 16px; height: 24px; left: 34%; top: 50%; transform: translateY(-50%); -webkit-mask-image: url("../../assets/images/icon/ico_calc_01.svg"); mask-image: url("../../assets/images/icon/ico_calc_01.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #ffffff; transition: all 0.5s; } .c-cart-list__btns .c-btn > span:hover { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #EC8226; } @media screen and (width <= 768px) { .c-cart-list__btns .c-btn > span:hover { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #ffffff; } } .c-cart-list__btns .c-btn > span:hover::before { background-color: #EC8226; } @media screen and (width <= 768px) { .c-cart-list__btns .c-btn > span:hover::before { background-color: #ffffff; } } .c-cart-list__btns .c-btn.c-cart-list__reset { padding: 0; background: transparent; } .c-cart-list__btns .c-btn.c-cart-list__reset > span { width: 100%; height: 64px; border: 1px solid #909090; background: #DBDBDB; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; transition: all 0.5s; position: relative; } .c-cart-list__btns .c-btn.c-cart-list__reset > span::before { content: ""; position: absolute; width: 18px; height: 24px; left: 22%; top: 50%; transform: translateY(-50%); -webkit-mask-image: url("../../assets/images/icon/ico_trash_01.svg"); mask-image: url("../../assets/images/icon/ico_trash_01.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #000000; transition: all 0.5s; } .c-cart-list__btns .c-btn.c-cart-list__reset:hover > span { background: #909090; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #ffffff; } .c-cart-list__btns .c-btn.c-cart-list__reset:hover > span::before { background-color: #ffffff; } @media screen and (width <= 768px) { .c-cart-list__btns .c-btn.c-cart-list__reset:hover > span::before { background-color: #000000; } } @media screen and (width <= 768px) { .c-cart-list__btns .c-btn.c-cart-list__reset:hover > span { background: #DBDBDB; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } } .c-publication { display: block; padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid #DBDBDB; } .c-publication:hover .c-publication__title { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #EC8226; } @media screen and (width <= 768px) { .c-publication:hover .c-publication__title { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } } .c-publication:hover .c-publication__more { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #EC8226; } @media screen and (width <= 768px) { .c-publication:hover .c-publication__more { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } } .c-publication:hover .c-publication__more::after { right: -8px; background-color: #EC8226; } @media screen and (width <= 768px) { .c-publication:hover .c-publication__more::after { right: 0px; background-color: #000000; } } .c-publication__title { margin-bottom: 16px; font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; transition: all 0.5s; } .c-publication__info { display: flex; justify-content: space-between; align-items: center; } .c-publication__meta { display: flex; gap: 40px; } .c-publication__more { padding-right: 26px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; text-align: right; transition: all 0.5s; position: relative; } .c-publication__more::after { content: ""; position: absolute; width: 18px; height: 15px; right: 0px; top: 50%; transform: translateY(-50%); -webkit-mask-image: url("../../assets/images/icon/ico_seminar_arrow_01.svg"); mask-image: url("../../assets/images/icon/ico_seminar_arrow_01.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #000000; transition: all 0.5s; } .c-contact-step { width: -moz-fit-content; width: fit-content; margin: 0 auto 64px; display: flex; justify-content: center; align-items: center; gap: 80px; } @media screen and (width <= 768px) { .c-contact-step { margin: 0 auto 40px; gap: 40px; } } .c-contact-step__item { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 8px; } @media screen and (width <= 768px) { .c-contact-step__item { gap: 0px; } } .c-contact-step__item--active .c-contact-step__index { background: #FFDCBE; border: 2px solid #EC8226; } .c-contact-step__item--active .c-contact-step__text { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #EC8226; } .c-contact-step__index { width: 64px; height: 64px; display: flex; justify-content: center; align-items: center; font-size: clamp(2.6rem, 2vw, 3.2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; font-family: "Satoshi", sans-serif; border-radius: 4px; border: 2px solid #909090; background: #DBDBDB; } @media screen and (width <= 768px) { .c-contact-step__index { width: 48px; height: 48px; } } .c-contact-step__text { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #909090; } .c-staff { max-width: 1200px; width: 100%; margin: 60px auto; } .c-staff__content { display: flex; justify-content: space-between; gap: 24px; } @media screen and (width <= 963px) { .c-staff__content { width: -moz-fit-content; width: fit-content; flex-direction: column; margin: 0 auto; } } .c-staff__content-item { max-width: 370px; width: 32%; display: flex; flex-direction: column; background: #ccc; border-radius: 16px; overflow: clip; } @media screen and (width <= 963px) { .c-staff__content-item { flex-direction: row; max-width: 600px; width: 100%; } } .c-staff__content-image { width: 100%; max-height: 180px; height: 100%; display: flex; justify-content: center; align-items: center; margin-bottom: 24px; overflow: clip; } .c-staff__content-image > img { width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } .c-staff__content-info { padding: 16px; } body { background: #ffffff; } body.is-modal-open { overflow: hidden; } p.section-intro { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } .front-arrow { position: fixed; right: 10vw; bottom: 10vh; width: 68px; height: 100px; mix-blend-mode: difference; z-index: 999; background: transparent; } @media (max-width: 768px) { .front-arrow { right: 7vw; bottom: 3vh; width: 38px; height: 56px; } } .front-arrow img { width: 100%; transition: transform 0.3s ease; } .front-arrow.is-footer img { transform: rotate(180deg); } .front-header-wrap .l-header { top: 0; transition: all 0.3s; background: transparent; } .front-header-wrap .l-header__inner { opacity: 0; transition: all 0.3s; pointer-events: none; visibility: hidden; } .front-header-wrap .l-header #wovn-translate-widget[wovn].wovn-embedded-widget { position: fixed; top: 12px; max-width: 1600px; width: 100%; right: auto; left: 50%; transform: translateX(-50%); padding-inline: calc(var(--inline-guideline, 0) / 2); } @media screen and (width <= 963px) { .front-header-wrap .l-header #wovn-translate-widget[wovn].wovn-embedded-widget { top: 12px; } } .front-header-wrap.is-visible .l-header { top: 0; transition: all 0.3s; background: #ffffff; } .front-header-wrap.is-visible .l-header__inner { opacity: 1; transition: all 0.3s; pointer-events: all; visibility: visible; } .front-header-wrap.is-visible .l-header #wovn-translate-widget[wovn].wovn-embedded-widget { position: fixed; top: 12px; max-width: 1600px; width: 100%; right: auto; left: 50%; transform: translateX(-50%); padding-inline: calc(var(--inline-guideline, 0) / 2); } @media screen and (width <= 963px) { .front-header-wrap.is-visible .l-header #wovn-translate-widget[wovn].wovn-embedded-widget { top: 12px; } } @media (max-width: 768px) { .front-header-wrap { display: flex; } } .sp-null { display: block; } @media (max-width: 768px) { .sp-null { display: none; } } .p-front-fv { min-height: 100vh; margin: 0 auto; padding-bottom: 0; position: relative; background: #ffffff; } .p-front-fv .page-title { font-size: clamp(36px, 18.5vw, 280px); font-family: "Roboto Condensed", sans-serif; line-height: 1; letter-spacing: -0.08em; font-weight: 700; color: #ffffff; z-index: 2; mix-blend-mode: difference; position: relative; --title-color: #ffffff; } @media (max-width: 768px) { .p-front-fv .page-title { width: -moz-fit-content; width: fit-content; } } .p-front-fv .page-title .page-title__sub { display: block; font-size: clamp(14px, 1vw, 16px); letter-spacing: 0.1em; line-height: 1.8; font-weight: 500; padding-left: clamp(12px, 1vw, 25px); margin-top: 32px; } @media (max-width: 768px) { .p-front-fv .page-title .page-title__sub { text-align: center; padding-left: 0; margin-top: 16px; } } .p-front-fv .page-title .p-front-fv__ttl-wrap { display: block; line-height: 0; width: clamp(228px, 112vw, 1700px); max-width: 100%; } @media (max-width: 768px) { .p-front-fv .page-title .p-front-fv__ttl-wrap { width: clamp(228px, 85vw, 1700px); } } .p-front-fv .page-title .p-front-fv__ttl-svg { display: block; width: 100%; height: auto; overflow: visible; } .p-front-fv .page-title .p-front-fv__ttl-svg .ttl-char { fill: var(--title-color); fill-opacity: 0; stroke: var(--title-color); stroke-width: 2; vector-effect: non-scaling-stroke; } @media (prefers-reduced-motion: reduce) { .p-front-fv .page-title .ttl-char { transition: none !important; stroke-dashoffset: 0 !important; fill-opacity: 1 !important; } } @media (prefers-reduced-motion: reduce) { .p-front-fv .page-title .p-front-fv__ttl-svg path { transition: none !important; stroke-dashoffset: 0 !important; fill-opacity: 1 !important; } } @media (prefers-reduced-motion: reduce) { .p-front-fv .page-title .p-front-fv__ttl, .p-front-fv .page-title .p-front-fv__ttl::before { transition: none !important; clip-path: inset(0 0 0 0) !important; } } .p-front-fv__inner { max-width: 1600px; width: 100%; height: 100vh; margin: 0 auto; position: relative; } .p-front-fv__inner .l-section__content { position: absolute; top: 7vh; left: calc(var(--inline-guideline, 0) / 2); max-width: 1200px; width: 80vw; } @media (max-width: 768px) { .p-front-fv__inner .l-section__content { width: 100%; top: 38vh; left: 5vw; } } .p-front-line { position: absolute; top: 0; right: 0; width: 60vw; height: calc(100vh + clamp(2.4rem, 6.25vw, 10rem)); z-index: 1; } @media (max-width: 768px) { .p-front-line { width: 100%; } } @media (max-width: 768px) { .p-front-line .pc-line { display: none; } } .p-front-line svg { width: 100%; height: 100%; } .p-front-line .sp-line { display: none; } @media (max-width: 768px) { .p-front-line .sp-line { display: block; } } .p-front-line .line-shape { fill: #1a1a1a; fill-opacity: 0; stroke: #1a1a1a; stroke-width: 2; vector-effect: non-scaling-stroke; transition: fill-opacity 0.6s ease 1.1s; } .p-front-line.is-drawn .line-shape { fill-opacity: 1; } .p-front-line .clip-rect { transform-box: fill-box; transform-origin: top; transform: scaleY(0); transition: transform 1.1s cubic-bezier(0.65, 0, 0.35, 1); } .p-front-line.is-drawn .clip-rect { transform: scaleY(1); } @media (prefers-reduced-motion: reduce) { .p-front-line .line-shape, .p-front-line .clip-rect { transition: none !important; transform: scaleY(1) !important; fill-opacity: 1 !important; } } .p-front-nav { position: absolute; left: calc(var(--inline-guideline, 0) / 2); bottom: 100px; } @media (max-width: 768px) { .p-front-nav { display: none; } } .p-front-nav ul li a { position: relative; display: block; width: -moz-fit-content; width: fit-content; padding: 4px 42px 4px 0; margin-bottom: 6px; font-size: 20px; color: #000000; letter-spacing: 0.1em; } .p-front-nav ul li a::after { content: ""; position: absolute; bottom: 0; left: 0; width: 0; height: 1px; background: #000000; transition: all 0.3s; } .p-front-nav ul li a::before { content: ""; position: absolute; right: 0; top: 50%; width: 22px; height: 14px; transform: translateY(-50%); background: url("../assets/images/ico_b_l_arrow.svg") no-repeat; opacity: 0; transition: all 0.3s; } .p-front-nav ul li a:hover::before { content: ""; position: absolute; right: 0; top: 50%; width: 22px; height: 14px; transform: translateY(-50%); background: url("../assets/images/ico_b_l_arrow.svg") no-repeat; opacity: 1; } .p-front-nav ul li a:hover::after { content: ""; position: absolute; bottom: 0; width: 100%; height: 1px; background: #000000; transition: all 0.3s; } .p-front-program { padding-inline: 0; } .p-front-program .l-section__title { width: min(100%, 1600px); margin: 0 auto 32px; padding-inline: calc(var(--inline-guideline, 0) / 2); } @media (max-width: 768px) { .p-front-program .l-section__title { padding-inline: 16px; margin: 0 auto 16px; } } .p-front-program .l-section__inner { width: 100%; max-width: 100%; padding: 0; } .p-front-program .l-section__inner > p { width: min(100%, 1600px); margin: 0 auto 80px; padding-inline: calc(var(--inline-guideline, 0) / 2); font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } @media (max-width: 768px) { .p-front-program .l-section__inner > p { padding-inline: 16px; margin: 0 auto 40px; } } .p-front-program .archive-links a { display: block; width: 100%; margin-block: 30px 120px; } @media (max-width: 768px) { .p-front-program .archive-links a { margin-block: 30px 60px; } } .p-front-program .archive-links a:last-of-type { margin-block: 30px 0; } .p-front-program .archive-links-summary { width: min(100%, 1600px); margin: 36px auto 0; display: flex; align-items: center; padding-inline: calc(var(--inline-guideline, 0) / 2); } @media (max-width: 1000px) { .p-front-program .archive-links-summary { flex-wrap: wrap; gap: 12px 0; } } @media (max-width: 768px) { .p-front-program .archive-links-summary { padding-inline: 16px; } } .p-front-program .archive-links-summary h2 { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; flex: 0 0 auto; font-size: clamp(2.4rem, 2.25vw, 3.6rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; } .p-front-program .archive-links-summary h2 span { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; } @media (max-width: 860px) { .p-front-program .archive-links-summary h2 { width: 100%; } } .p-front-program .archive-links-summary > p { padding-inline: clamp(14px, 3vw, 40px); margin-inline: clamp(14px, 3vw, 40px); font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 2; color: #000000; border-left: 1px solid #000000; border-right: 1px solid #000000; } @media (max-width: 860px) { .p-front-program .archive-links-summary > p { margin-left: 0; padding-left: 0; border-left: none; } } @media (max-width: 700px) { .p-front-program .archive-links-summary > p { margin-inline: 0; padding-inline: 0; border-left: none; border-right: none; } } .p-front-program .archive-links-summary > p.program { flex: 0 0 auto; padding-inline: 0px; margin-inline: 0; font-size: clamp(1.4rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; border: none; } @media (max-width: 768px) { .p-front-program .archive-links-summary > p.program { width: 100%; display: flex; align-items: baseline; } } .p-front-program .archive-links-summary > p.program span { margin-right: 8px; font-size: clamp(3.6rem, 2.5vw, 4rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; } .p-front-program .archive-links-summary > p.program span.line { display: none; position: relative; } @media (max-width: 768px) { .p-front-program .archive-links-summary > p.program span.line { width: calc(100% - 140px); display: block; height: 28px; margin-right: 16px; } .p-front-program .archive-links-summary > p.program span.line::before { content: ""; position: absolute; left: 0; top: 50%; transform: translateY(-50%); height: 1px; width: 100%; background: #000000; } } .p-front-top { margin: 194px auto 0; } @media screen and (width <= 963px) { .p-front-top { margin: 140px auto 0; } } @media screen and (width <= 768px) { .p-front-top { margin: 80px auto 0; } } .p-front-top__title h2 { font-size: clamp(3.2rem, 2.5vw, 4rem); font-weight: 700; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; filter: drop-shadow(0px 0px 6px #000000); } @media screen and (width <= 768px) { .p-front-top__title h2 { font-size: clamp(2.4rem, 2.5vw, 4rem); font-weight: 700; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; filter: none; margin-bottom: 8px; } } .p-front-top__title h2 > span { display: block; font-size: clamp(2rem, 1.875vw, 3rem); font-weight: 700; -webkit-font-smoothing: antialiased; line-height: 1; color: #ffffff; } @media screen and (width <= 768px) { .p-front-top__title h2 > span { font-size: clamp(2rem, 1.875vw, 3rem); font-weight: 700; -webkit-font-smoothing: antialiased; line-height: 1; color: #000000; } } .p-front-top__intro { max-width: 1200px; width: 100%; height: 280px; position: relative; display: flex; justify-content: space-between; align-items: flex-start; flex-direction: column; margin: 0 auto; padding: 24px 40px; background: url("../../assets/images/img_front_intro_01.png") no-repeat; background-size: cover; } @media screen and (width <= 768px) { .p-front-top__intro { height: auto; padding: 16px; background: #ffffff; border-radius: 8px; } } .p-front-top__intro-summary { max-width: 816px; width: 100%; padding: 15px 24px; border-radius: 8px; background: rgba(55, 87, 134, 0.4); backdrop-filter: blur(3px) brightness(0.4); } @media screen and (width <= 768px) { .p-front-top__intro-summary { padding: 0; background: transparent; backdrop-filter: none; border-radius: 0; } } .p-front-top__intro-title { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #ffffff; } @media screen and (width <= 768px) { .p-front-top__intro-title { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } } .p-front-top__intro-details { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #ffffff; } @media screen and (width <= 768px) { .p-front-top__intro-details { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } } .p-front-about { padding-block: 80px 90px; background: #000000; } .p-front-about .l-section__title h2 { margin-bottom: 12px; font-size: clamp(6.8rem, 6.25vw, 10rem); font-weight: 700; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #ffffff; position: relative; border-bottom: 1px solid #ffffff; font-family: "Roboto Condensed", sans-serif; line-height: 1; letter-spacing: -0.05em; } @media screen and (width <= 768px) { .p-front-about .l-section__title h2 { margin-bottom: 32px; } } .p-front-about .l-section__title > span { display: block; font-size: clamp(14px, 1vw, 16px); letter-spacing: 0.1em; line-height: 1.8; color: #ffffff; } .p-front-about .about__content { display: flex; justify-content: space-between; align-items: flex-start; gap: clamp(36px, 5.1vw, 120px); margin-top: 58px; } @media (max-width: 1000px) { .p-front-about .about__content { flex-direction: column; } } .p-front-about .about__content-summary { max-width: 575px; width: 100%; } @media (max-width: 1000px) { .p-front-about .about__content-summary { max-width: 100%; } } .p-front-about .about__content-summary p { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 2; color: #ffffff; } .p-front-about .about__content-summary p.first { margin-bottom: 24px; } .p-front-about .about__content-summary .summary-container { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; margin-top: 38px; } @media (max-width: 1000px) { .p-front-about .about__content-summary .summary-container { width: 100%; } } .p-front-about .about__content-summary .summary-container-item { max-width: 300px; width: 50%; padding: 28px 16px; min-height: 180px; } @media (max-width: 1000px) { .p-front-about .about__content-summary .summary-container-item { max-width: 100%; } } @media (max-width: 768px) { .p-front-about .about__content-summary .summary-container-item { padding: 24px 12px; min-height: 185px; } } .p-front-about .about__content-summary .summary-container-item:nth-of-type(1) { border-right: 1px solid #ffffff; border-bottom: 1px solid #ffffff; } .p-front-about .about__content-summary .summary-container-item:nth-of-type(2) { border-bottom: 1px solid #ffffff; } .p-front-about .about__content-summary .summary-container-item:nth-of-type(3) { border-right: 1px solid #ffffff; } .p-front-about .about__content-summary .summary-container-item h3 { text-align: center; font-size: clamp(1.4rem, 0.9375vw, 1.5rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.7; color: #ffffff; } .p-front-about .about__content-summary .summary-container-item p { margin-top: 20px; text-align: center; font-size: clamp(1.2rem, 0.875vw, 1.4rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; } .p-front-case { padding-top: 120px; } .p-front-case__container { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: clamp(16px, 2.4vw, 60px) 24px; margin-top: 60px; } @media (max-width: 1400px) { .p-front-case__container { justify-content: space-evenly; } } @media (max-width: 768px) { .p-front-case__container { justify-content: center; } } @media (max-width: 500px) { .p-front-case__container { justify-content: center; gap: 16px; } } .p-front-case__container-item { max-width: 440px; width: 31.5%; padding: 32px 16px; border: 1px solid #000000; transition: all 0.3s; cursor: pointer; } @media (max-width: 1400px) { .p-front-case__container-item { width: 30%; padding: 30px 16px; } } @media (max-width: 1100px) { .p-front-case__container-item { min-height: 176px; } } @media (max-width: 1000px) { .p-front-case__container-item { width: 48%; min-height: 220px; } } @media (max-width: 768px) { .p-front-case__container-item { width: 46%; min-height: 170px; } } @media (max-width: 500px) { .p-front-case__container-item { width: 47%; padding: 20px 12px; } } .p-front-case__container-item h3 { font-size: clamp(1.4rem, 1.5vw, 2.4rem); font-weight: 600; -webkit-font-smoothing: antialiased; line-height: 1.8; color: #666666; transition: all 0.3s; } @media (max-width: 500px) { .p-front-case__container-item h3 { height: 52px; } } .p-front-case__container-item h3 span { font-size: clamp(1.2rem, 1.375vw, 2.2rem); font-weight: 600; -webkit-font-smoothing: antialiased; line-height: 1.8; color: #666666; transition: all 0.3s; } @media (max-width: 500px) { .p-front-case__container-item h3 span { display: block; } } .p-front-case__container-item p { font-size: clamp(1.2rem, 1.0625vw, 1.7rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.8; color: #666666; transition: all 0.3s; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 4; } .p-front-case__container-item:hover { background: #000000; } .p-front-case__container-item:hover h3 { font-size: clamp(1.4rem, 1.5vw, 2.4rem); font-weight: 600; -webkit-font-smoothing: antialiased; line-height: 1.8; color: #ffffff; } .p-front-case__container-item:hover h3 span { font-size: clamp(1.2rem, 1.375vw, 2.2rem); font-weight: 600; -webkit-font-smoothing: antialiased; line-height: 1.8; color: #ffffff; } .p-front-case__container-item:hover p { font-size: clamp(1.2rem, 1.0625vw, 1.7rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.8; color: #ffffff; } .p-front-contact__inner { display: flex; justify-content: space-between; align-items: flex-start; gap: 36px; } @media (max-width: 1000px) { .p-front-contact__inner { flex-direction: column; gap: 24px; } } .p-front-contact__inner p.section-intro { flex: 0 0 auto; } .p-front-contact__switch { position: relative; width: 100%; } .p-front-contact__form, .p-front-contact__complete { position: absolute; top: 0; left: 0; width: 100%; opacity: 0; visibility: hidden; transition: opacity 0.4s ease; pointer-events: none; } .p-front-contact__form.is-active, .p-front-contact__complete.is-active { position: relative; opacity: 1; visibility: visible; pointer-events: auto; } .p-front-contact__form.is-active { display: flex; justify-content: space-between; align-items: flex-start; gap: 36px; } @media (max-width: 1000px) { .p-front-contact__form.is-active { flex-direction: column; gap: 24px; } } .p-front-contact__form p.section-intro { flex: 0 0 auto; } .p-front-contact__content { max-width: 845px; width: 100%; } @media (max-width: 790px) { .p-front-contact__content { padding-inline: 3vw; } } .p-front-contact__content p.wp-block-paragraph { display: none; } .p-front-contact__content form { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 30px 16px; } .p-front-contact__content form > p span.contact-title { display: block; position: relative; width: -moz-fit-content; width: fit-content; padding-right: 48px; margin-bottom: 4px; font-size: 14px; } .p-front-contact__content form > p span.required::after { content: "必須"; position: absolute; right: 0; color: #c1272d; font-size: 12px; } .p-front-contact__content form > p:nth-of-type(1), .p-front-contact__content form > p:nth-of-type(2), .p-front-contact__content form > p:nth-of-type(3), .p-front-contact__content form > p:nth-of-type(4), .p-front-contact__content form > p:nth-of-type(5), .p-front-contact__content form > p:nth-of-type(6) { width: 48%; } @media (max-width: 790px) { .p-front-contact__content form > p:nth-of-type(1), .p-front-contact__content form > p:nth-of-type(2), .p-front-contact__content form > p:nth-of-type(3), .p-front-contact__content form > p:nth-of-type(4), .p-front-contact__content form > p:nth-of-type(5), .p-front-contact__content form > p:nth-of-type(6) { width: 100%; } } .p-front-contact__content form > p:nth-of-type(1) .wpcf7-form-control-wrap input, .p-front-contact__content form > p:nth-of-type(1) .wpcf7-form-control-wrap select, .p-front-contact__content form > p:nth-of-type(2) .wpcf7-form-control-wrap input, .p-front-contact__content form > p:nth-of-type(2) .wpcf7-form-control-wrap select, .p-front-contact__content form > p:nth-of-type(3) .wpcf7-form-control-wrap input, .p-front-contact__content form > p:nth-of-type(3) .wpcf7-form-control-wrap select, .p-front-contact__content form > p:nth-of-type(4) .wpcf7-form-control-wrap input, .p-front-contact__content form > p:nth-of-type(4) .wpcf7-form-control-wrap select, .p-front-contact__content form > p:nth-of-type(5) .wpcf7-form-control-wrap input, .p-front-contact__content form > p:nth-of-type(5) .wpcf7-form-control-wrap select, .p-front-contact__content form > p:nth-of-type(6) .wpcf7-form-control-wrap input, .p-front-contact__content form > p:nth-of-type(6) .wpcf7-form-control-wrap select { width: 100%; font-size: 16px; color: #000000; padding: 18px 12px; border: 1px solid #000000; border-radius: 0; } .p-front-contact__content form > p:nth-of-type(7) .wpcf7-checkbox { display: flex; align-items: center; flex-wrap: wrap; gap: 10px 18px; margin-block: 18px; } .p-front-contact__content form > p:nth-of-type(7) .wpcf7-checkbox .wpcf7-list-item { margin-left: 0; } .p-front-contact__content form > p:nth-of-type(7) .wpcf7-checkbox .wpcf7-list-item input[type=checkbox i] { margin: 0; border-radius: 0; } .p-front-contact__content form > p:nth-of-type(8), .p-front-contact__content form > p:nth-of-type(9), .p-front-contact__content form > p:nth-of-type(10) { width: 100%; } .p-front-contact__content form > p:nth-of-type(8) .wpcf7-form-control-wrap input, .p-front-contact__content form > p:nth-of-type(8) .wpcf7-form-control-wrap textarea, .p-front-contact__content form > p:nth-of-type(9) .wpcf7-form-control-wrap input, .p-front-contact__content form > p:nth-of-type(9) .wpcf7-form-control-wrap textarea, .p-front-contact__content form > p:nth-of-type(10) .wpcf7-form-control-wrap input, .p-front-contact__content form > p:nth-of-type(10) .wpcf7-form-control-wrap textarea { width: 100%; font-size: 16px; color: #000000; padding: 18px 12px; border: 1px solid #000000; border-radius: 0; } .p-front-contact__content form > p:nth-of-type(8) .wpcf7-form-control-wrap textarea, .p-front-contact__content form > p:nth-of-type(9) .wpcf7-form-control-wrap textarea, .p-front-contact__content form > p:nth-of-type(10) .wpcf7-form-control-wrap textarea { max-height: 155px; } .p-front-contact__content form > p:nth-of-type(10) { display: flex; flex-direction: column; align-items: flex-end; } @media (max-width: 768px) { .p-front-contact__content form > p:nth-of-type(10) { align-items: center; } } .p-front-contact__content form > p:nth-of-type(10) > span { font-size: 12px; margin-block: 24px; } .p-front-contact__content form > p:nth-of-type(10) > span a { position: relative; } .p-front-contact__content form > p:nth-of-type(10) > span a::after { content: ""; width: 100%; height: 1px; position: absolute; left: 0; bottom: -2px; background: #000000; } .p-front-contact__content form > p:nth-of-type(10) .wpcf7-submit { max-width: 200px; width: 100%; height: 55px; display: flex; justify-content: center; align-items: center; font-size: 18px; color: #ffffff; cursor: pointer; padding: 0; border: none; outline: none; background: #000000; } .p-front-contact__content form > p:nth-of-type(10) .wpcf7-spinner { display: none; } .p-front-contact__complete { text-align: center; padding: 60px 0; } .p-front-case__modal { position: fixed; inset: 0; z-index: 1000; display: none; align-items: center; justify-content: center; } .p-front-case__modal.is-open { display: flex; } .p-front-case__modal.is-visible .p-front-case__modal-overlay { opacity: 1; } .p-front-case__modal.is-visible .p-front-case__modal-content { opacity: 1; transform: translateY(0) scale(1); } .p-front-case__modal-title { margin-top: 60px; font-size: clamp(20px, 5.3333333333vw, 24px); padding-bottom: 8px; margin-bottom: 8px; border-bottom: 1px solid #000000; font-weight: 600; } @media (max-width: 768px) { .p-front-case__modal-title { margin-top: 42px; } } .p-front-case__modal-text { font-size: clamp(16px, 4.2666666667vw, 18px); line-height: 1.8; } .p-front-case__modal-overlay { position: absolute; inset: 0; background: rgba(255, 255, 255, 0.6); opacity: 0; transition: opacity 0.3s ease; } .p-front-case__modal-content { position: relative; background: #fff; max-width: 800px; width: 90%; max-height: 80vh; overflow-y: auto; padding: 50px clamp(20px, 4vw, 50px) 80px; z-index: 1; opacity: 0; transform: translateY(16px) scale(0.98); transition: opacity 0.3s ease, transform 0.3s ease; border: 1px solid #000000; } @media (max-width: 768px) { .p-front-case__modal-content { padding: 80px clamp(25px, 4vw, 50px); } } .p-front-case__modal-close { position: absolute; top: 12px; right: 12px; width: 32px; height: 32px; background: none; border: none; font-size: 24px; line-height: 1; cursor: pointer; } .p-front-case__modal-close span { display: block; width: 40px; height: 1px; background: #000000; } .p-front-case__modal-close span:nth-of-type(1) { transform: rotate(45deg) translate(1px); } .p-front-case__modal-close span:nth-of-type(2) { transform: rotate(-45deg) translate(0px); } .p-qanda__content-intro { max-width: 980px; margin: 0 auto 36px; } .p-qanda__content-intro h2 { color: #4D4397; font-size: clamp(18px, 1.2vw, 24px); } .p-qanda__content-container .faq-accordion { max-width: 980px; margin: 0 0 0 auto; } .p-qanda__content-container .panel { border-bottom: 1px solid #666666; margin-bottom: 10px; } .p-qanda__content-container .panel-header { width: 100%; padding: 20px; display: flex; justify-content: space-between; align-items: center; background: #fff; border: none; cursor: pointer; } @media (max-width: 768px) { .p-qanda__content-container .panel-header { gap: 8px; padding: 15px 16px 15px 6px; } } .p-qanda__content-container .panel-header > p { display: flex; align-items: center; letter-spacing: 0.1em; } @media (max-width: 768px) { .p-qanda__content-container .panel-header > p { align-items: flex-start; } } .p-qanda__content-container .panel-header > p > span { font-size: clamp(1.6rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.8; color: #000000; color: #000000; text-align: left; letter-spacing: 0.1em; } .p-qanda__content-container .panel-header > p > span.mark { font-size: clamp(20px, 1.1vw, 22px); font-weight: 500; color: #000000; } .p-qanda__content-container .panel-header > .icon { position: relative; display: flex; justify-content: center; align-items: center; width: 30px; height: 30px; border: 1px solid #000000; background: #ffffff; transition: background 0.3s; } @media (max-width: 768px) { .p-qanda__content-container .panel-header > .icon { flex: 0 0 auto; width: 24px; height: 24px; } } .p-qanda__content-container .panel-header > .icon span.top { position: absolute; width: 15px; height: 1px; background: #000000; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.3s; } .p-qanda__content-container .panel-header > .icon span.bottom { position: absolute; width: 1px; height: 15px; background: #000000; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: all 0.3s; } .p-qanda__content-container .panel-header.active .icon { background: #000000; } .p-qanda__content-container .panel-header.active .icon span.top { position: absolute; width: 15px; height: 1px; background: #ffffff; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(45deg); transition: all 0.3s; } .p-qanda__content-container .panel-header.active .icon span.bottom { position: absolute; width: 1px; height: 15px; background: #ffffff; top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(45deg); transition: all 0.3s; } .p-qanda__content-container .panel-content { height: 0; overflow: hidden; transition: height 0.3s ease-out; } .p-qanda__content-container .panel-body { display: flex; justify-content: space-between; align-items: flex-start; flex-wrap: wrap; gap: 8px; padding: 20px 20px 20px 40px; position: relative; } .p-qanda__content-container .panel-body p { width: 100%; letter-spacing: 0.1em; line-height: 1.8; } .p-qanda__content-container .panel-body p a { display: block; color: #000000; } .p-qanda__content-container .panel-body span.mark { position: absolute; content: ""; left: 0; top: 33px; width: 32px; height: 1px; background: #000000; } .archive-header { width: 100%; } .archive-header-image { max-height: 250px; height: 100%; overflow: clip; } .archive-header-image img { height: 100%; width: 100%; -o-object-fit: cover; object-fit: cover; } .archive-header-summary { display: flex; justify-content: space-between; align-items: center; margin-top: 40px; border-bottom: 1px solid #000000; padding-bottom: 8px; margin-bottom: 12px; } @media (max-width: 768px) { .archive-header-summary { border-bottom: none; } } @media (max-width: 480px) { .archive-header-summary { flex-direction: column; align-items: flex-start; } } .archive-header-summary h2 { display: flex; flex-direction: column; justify-content: flex-start; gap: 4px; position: relative; font-size: clamp(2.8rem, 2.5vw, 4rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; } @media (max-width: 768px) { .archive-header-summary h2 { width: 100%; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; } } .archive-header-summary h2 span { display: block; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; } @media (max-width: 768px) { .archive-header-summary h2 span { font-size: clamp(2.8rem, 2.5vw, 4rem); font-weight: 900; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; font-family: "Roboto Condensed", sans-serif; } } .archive-header-summary h2 p.sub-program { display: none; padding-left: 24px; position: absolute; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; letter-spacing: 0.1em; } @media (max-width: 768px) { .archive-header-summary h2 p.sub-program { display: block; right: 0; bottom: 0; } } .archive-header-summary h2 p.sub-program::before { content: ""; position: absolute; width: 18px; height: 1px; left: 0; top: 50%; transform: translateY(-50%); background: #000000; } .archive-header-summary p.program { font-size: clamp(1.6rem, 1.25vw, 2rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; } @media (max-width: 768px) { .archive-header-summary p.program { display: none; } } .archive-header-summary p.program span { margin-right: 8px; font-size: clamp(2.8rem, 3.125vw, 5rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; } .archive__page .archive__inner { width: min(100%, 1600px); margin: 0 auto; padding-top: 80px; padding-inline: calc(var(--inline-guideline, 0) / 2); } @media (max-width: 768px) { .archive__page .archive__inner { padding-top: 76px; } } .archive__page-content { display: flex; justify-content: flex-start; align-items: flex-start; gap: 30px; flex-wrap: wrap; margin-top: 50px; } .archive__page-item { width: calc(33.3333333333% - 20px); border: 1px solid #000000; } @media (max-width: 900px) { .archive__page-item { width: calc(50% - 20px); } } @media (max-width: 600px) { .archive__page-item { width: 100%; } } .archive__page-item-image { width: 100%; height: 250px; overflow: clip; position: relative; } .archive__page-item-image img { height: 100%; -o-object-fit: cover; object-fit: cover; transition: all 0.3s; } .archive__page-item-image span.time { position: absolute; left: 12px; top: 12px; padding: 2px 10px 0; background: #ffffff; } .archive__page-item-summary { padding: 20px 28px; position: relative; height: 224px; } .archive__page-item-summary::after { content: ""; position: absolute; right: 24px; top: 18px; opacity: 0; width: 32px; height: 22px; background: url("../assets/images/ico_arrow_01.svg") no-repeat; background-size: cover; transition: all 0.3s; } @media (max-width: 600px) { .archive__page-item-summary::after { opacity: 1; top: 30px; width: 24px; height: 18px; } } @media (max-width: 1200px) { .archive__page-item-summary { padding: 18px 20px; } } @media (max-width: 600px) { .archive__page-item-summary { height: auto; } } .archive__page-item-summary h3 { padding-bottom: 6px; margin-bottom: 10px; font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.6; color: #000000; border-bottom: 1px solid #000000; } .archive__page-item-summary h3 > span { display: block; font-size: clamp(1.2rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.4; color: #000000; } @media (max-width: 600px) { .archive__page-item-summary h3 { padding-right: 30px; } } .archive__page-item-summary > span.archive__category { display: block; padding-left: 18px; margin-bottom: 30px; position: relative; font-size: clamp(1.2rem, 0.875vw, 1.4rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; letter-spacing: 0.1em; } .archive__page-item-summary > span.archive__category::before { content: ""; position: absolute; width: 13px; height: 1.5px; left: 0; top: 50%; transform: translateY(-50%); background: #000000; } .archive__page-item:hover .archive__page-item-image img { transform: scale(1.02); } .archive__page-item:hover .archive__page-item-summary::after { content: ""; position: absolute; right: 24px; top: 18px; opacity: 1; width: 32px; height: 22px; background: url("../assets/images/ico_arrow_01.svg") no-repeat; background-size: cover; } @media (max-width: 600px) { .archive__page-item:hover .archive__page-item-summary::after { top: 30px; width: 24px; height: 18px; } } .archive__page .archive__pagination { padding-bottom: 6px; border-bottom: 1px solid #cccccc; } @media (min-width: 769px) { .archive__page .archive__pagination { display: none !important; } } @media (max-width: 768px) { .archive__page .archive__pagination { margin-top: 0px; } } .archive__page .archive__pagination-list { display: flex; justify-content: flex-start; align-items: center; gap: 8px; list-style: none; margin: 0; padding: 0; } .archive__page .archive__pagination-list a.js-archive-page-link { color: #cccccc; font-size: 18px; padding: 2px 14px 10px; border-bottom: 1px solid transparent; } .archive__page .archive__pagination-list a.js-archive-page-link.is-active { color: #000000; border-bottom: 1px solid #000000; } .archive__page p.sub-program { display: block; padding-left: 24px; position: relative; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; letter-spacing: 0.1em; } @media (max-width: 768px) { .archive__page p.sub-program { display: none; } } .archive__page p.sub-program::before { content: ""; position: absolute; width: 18px; height: 1px; left: 0; top: 50%; transform: translateY(-50%); background: #000000; } .current_page { margin-top: 80px; } .modal-content { display: flex; } @media (max-width: 768px) { .modal-content { flex-direction: column; height: 100%; } } .modal-content .modal-image { width: 50%; } @media (max-width: 768px) { .modal-content .modal-image { width: 100%; } } .modal-content .modal-summary { margin: 80px 40px; max-height: 800px; height: 70vh; overflow: auto; position: relative; } @media (max-width: 1000px) { .modal-content .modal-summary { margin: 40px 16px; } } @media (max-width: 768px) { .modal-content .modal-summary { max-height: 100%; height: auto; overflow: inherit; } } @media (max-width: 600px) { .modal-content .modal-summary { margin: 36px 0px; } } .modal-content .modal-summary__container { overflow-y: scroll; padding-bottom: 60px; } .modal-content .modal-summary__container > h3 { padding-bottom: 8px; margin-bottom: 32px; border-bottom: 1px solid #000000; font-size: clamp(1.8rem, 1.125vw, 2.2rem); font-weight: 600; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; } @media (max-width: 768px) { .modal-content .modal-summary__container > h3 > span { display: block; } } .modal-content .modal-summary .workshop-category { position: relative; padding-left: 14px; margin-bottom: 8px; font-size: clamp(1.2rem, 0.75vw, 1.2rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; } .modal-content .modal-summary .workshop-category::before { content: ""; position: absolute; left: 0; top: 50%; width: 10px; height: 1px; background: #000000; } .modal-content .modal-summary .workshop-info { display: flex; border: 1px solid #b3b3b3; } .modal-content .modal-summary .workshop-info > dl { width: 50%; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; } .modal-content .modal-summary .workshop-info > dl:nth-of-type(2) { border-left: 1px solid #b3b3b3; } .modal-content .modal-summary .workshop-info > dl dt { padding: 6px; font-size: clamp(1.3rem, 0.875vw, 1.4rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #b3b3b3; } .modal-content .modal-summary .workshop-info > dl dd { padding: 6px; font-size: clamp(1.3rem, 0.875vw, 1.4rem); font-weight: 600; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; } .modal-content .modal-summary p.modal-title { display: block; padding-left: 18px; margin-block: 56px 20px; position: relative; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 600; -webkit-font-smoothing: antialiased; line-height: 1.2; color: #000000; letter-spacing: 0.1em; } .modal-content .modal-summary p.modal-title--first { margin-block: 24px 20px; } .modal-content .modal-summary p.modal-title::before { content: ""; position: absolute; width: 14px; height: 1px; left: 0; top: 50%; transform: translateY(-50%); background: #000000; } .modal-content .modal-summary .workshop-overview, .modal-content .modal-summary .workshop-skills, .modal-content .modal-summary .workshop-merit, .modal-content .modal-summary .workshop-recommend, .modal-content .modal-summary .workshop-price { padding-left: 20px; } @media (max-width: 768px) { .modal-content .modal-summary .workshop-overview, .modal-content .modal-summary .workshop-skills, .modal-content .modal-summary .workshop-merit, .modal-content .modal-summary .workshop-recommend, .modal-content .modal-summary .workshop-price { padding-left: 16px; } } .modal-content .modal-summary .workshop-overview > span, .modal-content .modal-summary .workshop-skills > span, .modal-content .modal-summary .workshop-merit > span, .modal-content .modal-summary .workshop-recommend > span, .modal-content .modal-summary .workshop-price > span { display: block; position: relative; padding-left: 14px; font-size: clamp(1.4rem, 0.875vw, 1.4rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.8; color: #000000; } .modal-content .modal-summary .workshop-overview > span::before, .modal-content .modal-summary .workshop-skills > span::before, .modal-content .modal-summary .workshop-merit > span::before, .modal-content .modal-summary .workshop-recommend > span::before, .modal-content .modal-summary .workshop-price > span::before { content: ""; position: absolute; left: 0; top: 9px; width: 8px; aspect-ratio: 1; background: #000000; } .modal-content .modal-summary .workshop-overview__info { margin-top: 16px; } .modal-content .modal-summary .workshop-overview__info p { font-size: clamp(1.2rem, 0.875vw, 1.4rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.8; color: #000000; } .modal-content .modal-summary .workshop-overview__info p span { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 600; -webkit-font-smoothing: antialiased; line-height: 1.8; color: #b3b3b3; } .modal-content .modal-summary .workshop_link-item { max-width: 400px; width: 100%; display: flex; justify-content: center; align-items: center; margin: 48px auto 0; background: #000000; padding: 4px 30px 4px 8px; } .modal-content .modal-summary .workshop_link-item span { position: relative; font-size: clamp(1.2rem, 1vw, 1.6rem); font-weight: 600; -webkit-font-smoothing: antialiased; line-height: 1.8; color: #ffffff; } .modal-content .modal-summary .workshop_link-item span::after { content: ""; position: absolute; right: -40px; top: 50%; transform: translateY(-50%); width: 24px; height: 20px; background: url("../assets/images/ico_w_arrow_r.svg") no-repeat; background-size: cover; } @media (max-width: 500px) { .modal-content .modal-summary .workshop_link-item span::after { right: -34px; width: 20px; height: 16px; } } .image-container { width: 100%; height: 100%; } .image-container img { width: 100%; height: auto; display: block; } .overview-container { width: 50%; } /* =========================== Modal =========================== */ .workshop-modal { position: fixed; inset: 0; z-index: 9999; display: none; } .workshop-modal.is-open { display: block; } @media (max-width: 768px) { .workshop-modal.is-open { width: 85%; height: 85%; top: 50%; left: 50%; transform: translate(-50%, -50%); } } @media (max-width: 460px) { .workshop-modal.is-open { width: 95%; height: 95%; top: 50%; left: 50%; transform: translate(-50%, -50%); } } .workshop-modal__overlay { position: absolute; inset: 0; background: rgba(255, 255, 255, 0.7); height: 140%; width: 140%; top: -15%; left: -15%; } .workshop-modal__content { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: clamp(70vw, 80vw, 1280px); max-height: calc(85vh - 60px); background: #fff; overflow-y: auto; box-sizing: border-box; border: 1px solid #000000; overflow: clip; } .workshop-modal__prev, .workshop-modal__next { position: absolute; top: 50%; transform: translateY(-50%); width: 50px; height: 100px; cursor: pointer; z-index: 100; } @media (max-width: 768px) { .workshop-modal__prev, .workshop-modal__next { width: 24px; height: 45px; } } .workshop-modal__prev { left: 4vw; background: url("../assets/images/ico_prev.svg") no-repeat; background-size: cover; } @media (max-width: 768px) { .workshop-modal__prev { left: -4vw; background: url("../assets/images/ico_prev_02.svg") no-repeat; background-size: cover; } } @media (max-width: 460px) { .workshop-modal__prev { left: 4vw; background: url("../assets/images/ico_prev_02.svg") no-repeat; background-size: cover; opacity: 0.5; } } .workshop-modal__next { right: 4vw; background: url("../assets/images/ico_next.svg") no-repeat; background-size: cover; } @media (max-width: 768px) { .workshop-modal__next { right: -4vw; background: url("../assets/images/ico_next_02.svg") no-repeat; background-size: cover; } } @media (max-width: 460px) { .workshop-modal__next { right: 4vw; background: url("../assets/images/ico_next_02.svg") no-repeat; background-size: cover; opacity: 0.5; } } .workshop-modal__body { width: 100%; height: 100%; overflow-y: scroll; } .workshop-modal__close { position: absolute; top: 20px; right: 40px; width: 42px; height: 42px; border: none; background: none; font-size: 60px; line-height: 1; cursor: pointer; z-index: 10; } .loading { text-align: center; padding: 80px 0; } /* Swiper */ .workshop-modal .swiper { width: 100%; height: 100%; } @media (max-width: 768px) { .workshop-modal .swiper { max-height: 380px; } } .workshop-modal .swiper-slide img { width: 100%; height: 100%; max-height: calc(85vh - 60px); display: block; -o-object-fit: contain; object-fit: contain; -o-object-position: center; object-position: center; } /* Scroll */ .workshop-modal__content::-webkit-scrollbar { width: 8px; } .workshop-modal__content::-webkit-scrollbar-thumb { background: #ccc; } @media screen and (max-width: 768px) { .workshop-modal__content { width: calc(100% - 16px); max-height: calc(100vh - 30px); padding: 20px 16px; height: 100%; } .workshop-modal__close { top: 10px; right: 10px; font-size: 48px; } } .p-front-program__sticky { display: flex; flex-direction: column; justify-content: flex-start; background: #fff; } @media (max-width: 860px) { .p-front-program__sticky { top: 100px; } } .p-front-program__sticky .l-section__inner > p { margin-bottom: 3vw; } /* --- archive-links をクロスフェード表示 --- */ .archive-links { position: relative; } .archive-links a { transition: opacity 0.8s ease, visibility 0.8s ease; } .archive-links a.is-active { opacity: 1; visibility: visible; pointer-events: auto; } .archive-links-image { max-height: 450px; height: 38vh; position: relative; overflow: hidden; padding: 0; width: min(100%, 1600px); margin: 0 auto; padding-inline: calc(var(--inline-guideline, 0) / 2); } @media (max-width: 768px) { .archive-links-image { height: 250px; width: 100%; padding-inline: 0; } } .archive-links-image img { display: block; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; opacity: 0; } .archive-links-image::after { content: ""; position: absolute; top: 0; left: clamp(20px, 5.3333333333vw, 80px); max-width: 1440px; width: calc(100% - clamp(20px, 5.3333333333vw, 80px)); height: 100%; background: #000; z-index: 2; transform: scaleX(0); transform-origin: left; pointer-events: none; } .archive-links a.is-revealed .archive-links-image::after { animation: barReveal 1.2s ease forwards; } .archive-links a.is-revealed .archive-links-image img { animation: imageFadeIn 1.2s ease forwards; } @keyframes barReveal { 0% { transform: scaleX(0); transform-origin: left; } 50% { transform: scaleX(1); transform-origin: left; } 50.01% { transform-origin: right; } 100% { transform: scaleX(0); transform-origin: right; } } @keyframes imageFadeIn { 0% { opacity: 0; } 55% { opacity: 0; } 75% { opacity: 1; } 100% { opacity: 1; } } @media (max-width: 768px) { .archive-links-image::after { display: none; } .archive-links-image img { opacity: 1; } .archive-links a.is-revealed .archive-links-image::after, .archive-links a.is-revealed .archive-links-image img { animation: none; } } @media (max-width: 768px) { .container { display: none; } } .block { position: relative; width: 80px; height: 80px; margin: auto; } .circleText { overflow: visible; animation: rotation 18s linear infinite; position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .circleText__circle { fill: none; } .circleText__text { fill: #ffffff; font-size: 12px; letter-spacing: 0.05em; } .block__logo { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 70px; height: 70px; display: flex; align-items: center; justify-content: center; pointer-events: none; } .block__logo img, .block__logo svg { width: 100%; height: 100%; display: block; } @keyframes rotation { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } /* 768px以上のときは、この要素をリンクホバー時だけマウスカーソルとして表示する */ @media (min-width: 768px) { body.is-cursor-active { cursor: none; } .block.is-cursor { position: fixed; top: 0; left: 0; margin: 0; transform: translate(-50%, -50%) scale(0); opacity: 0; pointer-events: none; mix-blend-mode: difference; z-index: 19999; transition: opacity 0.15s ease, transform 0.15s ease; } .block.is-cursor.is-hover { opacity: 1; transform: translate(-50%, -50%) scale(1); } } .inset-item .modal-content { display: none; } ::-moz-placeholder { color: #666666; } ::placeholder { color: #666666; } .p-about { margin-top: 96px; } @media screen and (width <= 768px) { .p-about { margin-top: 60px; } } .p-about__summary { width: min(100%, 960px); margin: 0 auto; } .p-about__summary-details { margin-bottom: 16px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 2; color: #000000; } .p-about__summary-meta { margin-bottom: 24px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 2; color: #000000; text-align: right; } .p-about__summary-sign { width: -moz-fit-content; width: fit-content; max-width: 300px; margin: 0 0 0 auto; } .p-about-purpose { margin-top: 160px; } @media screen and (width <= 768px) { .p-about-purpose { margin-top: 80px; } } .p-about-purpose__content { width: min(100%, 1120px); margin: 0 auto; } .p-about-purpose__content-intro { margin-bottom: 64px; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 2; color: #000000; } .p-about-purpose__content-list { width: min(100%, 1040px); margin: 0 auto; } .p-about-purpose__content-list > li { margin-bottom: 14px; padding-left: clamp(2rem, 1.5vw, 2.4rem); font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; position: relative; } .p-about-purpose__content-list > li::before { content: ""; position: absolute; width: 16px; height: 16px; left: 0; top: 50%; transform: translateY(-50%); background: #EC8226; border-radius: 50%; } @media screen and (width <= 768px) { .p-about-purpose__content-list > li::before { width: 13px; height: 13px; left: 0; top: 8px; transform: translateY(0); } } .p-about-content { margin-top: 160px; padding-inline: 0; } @media screen and (width <= 768px) { .p-about-content { margin-top: 80px; } } .p-about-content__inner { width: 100%; } .p-about-content__title { padding-inline: calc(var(--inline-guideline, 0) / 2); width: min(100%, 1600px); margin: 0 auto; } @media screen and (width <= 768px) { .p-about-content__title { padding-inline: 16px; } } .p-about-content__container { padding-block: 96px; } @media screen and (width <= 768px) { .p-about-content__container { padding-block: 48px; } } @media screen and (width <= 963px) { .p-about-content__container:nth-of-type(2) { padding-block: 30px 96px; } } .p-about-content__container:nth-of-type(odd) { background: #FFF8F2; } .p-about-content__container:nth-of-type(odd) .p-about-content__container-thumb { order: 1; } .p-about-content__container-inner { display: flex; gap: 64px; width: min(100%, 1440px); margin: 0 auto; padding-inline: calc(var(--inline-guideline, 0) / 2); } @media screen and (width <= 768px) { .p-about-content__container-inner { padding-inline: 16px; } } .p-about-content__container-thumb { max-width: 400px; width: 100%; max-height: 400px; aspect-ratio: 1; border-radius: 20px; overflow: clip; } .p-about-content__container-thumb > img { display: block; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover; } @media screen and (width <= 963px) { .p-about-content__container-thumb { margin: 0 auto 40px; } } .p-about-content__container-title { font-size: clamp(2.8rem, 2.5vw, 4rem); font-weight: 700; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; padding: 0 0 14px 0; margin-bottom: 24px; position: relative; border-bottom: 2px solid #909090; background: none; } .p-about-content__container-title::before { display: none; } .p-about-content__container-title::after { content: ""; position: absolute; bottom: -2px; left: 0; width: 160px; height: 2px; background-color: #EC8226; } .p-about-content__container-text { font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 2; color: #000000; } .p-about-links__content { display: flex; justify-content: center; gap: 40px; margin: 64px auto 96px; } @media screen and (width <= 1024px) { .p-about-links__content { gap: 3vw; } } @media screen and (width <= 963px) { .p-about-links__content { flex-direction: column; } .p-about-links__content > a { margin: 0 auto; } } .p-access-about { margin-top: 96px; } @media screen and (width <= 768px) { .p-access-about { margin-top: 60px; } } .p-access-about__content { width: min(100%, 960px); margin: 0 auto; border: 1px solid #DBDBDB; } .p-access-member { margin-top: 160px; } @media screen and (width <= 768px) { .p-access-member { margin-top: 80px; } } .p-access-member__content { width: min(100%, 960px); margin: 0 auto; border: 1px solid #DBDBDB; } .p-access-member__content table { width: 100%; } .p-access-member__content > h2 { padding: 12px 24px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; background: #FFDCBE; border-bottom: 1px solid #DBDBDB; border-top: 1px solid #DBDBDB; } .p-access-member__content > h2:first-of-type { border-top: none; } .p-access-member__content .p-access__table-head { text-align: center; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } @media screen and (width <= 768px) { .p-access-member__content .p-access__table-head { text-align: left; } } .p-access { margin-top: 160px; } @media screen and (width <= 768px) { .p-access { margin-top: 80px; } } .p-access__content { width: min(100%, 1040px); margin: 0 auto; display: flex; justify-content: space-between; align-items: center; } @media screen and (width <= 963px) { .p-access__content { flex-direction: column; gap: 40px; } } .p-access__content-summary { max-width: 440px; width: 100%; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 2; color: #000000; } .p-access__content-summary > .c-btn { margin: 40px auto 0; } .p-access__content-summary > .c-btn:hover > span > span::after { background-color: #B75C0D; } .p-access__content-summary > .c-btn > span > span { position: relative; } .p-access__content-summary > .c-btn > span > span::after { content: ""; width: 14px; height: 14px; display: inline-block; position: absolute; top: 64%; right: -20px; transform: translateY(-50%); -webkit-mask-image: url("../../assets/images/icon/ico_blank_01.svg"); mask-image: url("../../assets/images/icon/ico_blank_01.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #ffffff; transition: all 0.5s; } .p-access__content-map { max-width: 480px; width: 100%; aspect-ratio: 480/360; } @media screen and (width <= 963px) { .p-access__content-map { max-width: 100%; aspect-ratio: 16/9; } } .p-access__content-map > iframe { width: 100%; height: 100%; } .p-access__table { display: flex; border-bottom: 1px solid #DBDBDB; } @media screen and (width <= 768px) { .p-access__table { flex-direction: column; } } .p-access__table:last-of-type { border-bottom: none; } .p-access__table-head { width: 280px; padding: 12px 24px; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; background: #FFDCBE; } @media screen and (width <= 963px) { .p-access__table-head { width: 200px; } } @media screen and (width <= 768px) { .p-access__table-head { width: 100%; padding: 8px 18px; } .p-access__table-head.empty-th { display: none; } } .p-access__table-item { width: calc(100% - 280px); padding: 12px 20px 12px 24px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; background: transparent; } @media screen and (width <= 963px) { .p-access__table-item { width: calc(100% - 200px); } } @media screen and (width <= 768px) { .p-access__table-item { width: 100%; padding: 8px 18px; } } .p-access__table-item > a { position: relative; padding-right: 22px; display: inline; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; text-decoration: underline; transition: all 0.5s; } .p-access__table-item > a:hover { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #EC8226; } @media screen and (width <= 768px) { .p-access__table-item > a:hover { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } } .p-access__table-item > a:hover[target=_blank]::after { background-color: #EC8226; } @media screen and (width <= 768px) { .p-access__table-item > a:hover[target=_blank]::after { background-color: #000000; } } .p-access__table-item > a[target=_blank]::after { content: ""; width: 20px; height: 20px; display: inline-block; position: relative; top: 3px; right: -6px; -webkit-mask-image: url("../../assets/images/icon/ico_pdf_01.svg"); mask-image: url("../../assets/images/icon/ico_pdf_01.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #000000; transition: all 0.5s; } .p-seminar { margin-top: 96px; } @media screen and (width <= 768px) { .p-seminar { margin-top: 60px; } } .p-seminar .l-section__inner { width: min(100%, 1160px); margin: 0 auto; } .p-seminar__inner { display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; gap: 16px; margin: 24px 24px 96px; } @media screen and (width <= 963px) { .p-seminar__inner { justify-content: center; } } @media screen and (width <= 768px) { .p-seminar__inner { margin: 24px 0 60px; } } @media screen and (width <= 576px) { .p-seminar__inner { align-items: center; flex-direction: column; } } .p-seminar__more { max-width: 180px; width: 100%; margin: 0 auto; } .p-seminar__more > button { width: 100%; padding-block: 5px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; text-align: center; background-color: #FFDCBE; border: 1px solid #EC8226; border-radius: 4px; cursor: pointer; transition: all 0.5s; } .p-seminar__more > button:hover { background-color: #EC8226; color: #ffffff; } @media screen and (width <= 768px) { .p-seminar__more > button:hover { background-color: #FFDCBE; color: #000000; } } .p-news { width: min(100%, 1600px); margin: 0 auto; } .p-news__inner { display: flex; justify-content: space-between; align-items: flex-start; gap: 30px; margin: 96px auto; } @media screen and (width <= 963px) { .p-news__inner { flex-direction: column; margin: 60px auto; } } .p-news__inner > a.c-news { margin-bottom: 16px; } .p-news__inner > a:hover { border: 1px solid #EC8226; } @media screen and (width <= 768px) { .p-news__inner > a:hover { border: 1px solid #DBDBDB; } } .p-news__inner > a:hover::after { right: 16px; background-color: #EC8226; } @media screen and (width <= 768px) { .p-news__inner > a:hover::after { right: 16px; background-color: #000000; } } .p-news__content { max-width: 460px; width: 32%; border-radius: 8px; background: #FFF8F2; overflow: clip; border: 1px solid #EC8226; } @media screen and (width <= 963px) { .p-news__content { max-width: 600px; width: 100%; margin: 0 auto; } } .p-news__content > h3 { padding: 16px; font-size: clamp(2rem, 1.75vw, 2.8rem); font-weight: 700; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #ffffff; text-align: center; background: #EC8226; } .p-news__content-box { padding: 16px 16px 40px; } .p-news__content-box .p-news-category__inner > a.c-news::after { right: 16px; } .p-news__content-box .p-news-category__inner > a:hover { border: 1px solid #EC8226; } @media screen and (width <= 768px) { .p-news__content-box .p-news-category__inner > a:hover { border: 1px solid #DBDBDB; } } .p-news__content-box .p-news-category__inner > a:hover::after { right: 16px; background-color: #EC8226; } @media screen and (width <= 768px) { .p-news__content-box .p-news-category__inner > a:hover::after { background-color: #000000; } } .p-news__content-btn { max-width: 240px; width: 100%; height: 48px; display: block; margin: 24px auto 0; padding: 12px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; text-align: center; border-radius: 24px; border: 1px solid #EC8226; background: #FFDCBE; transition: all 0.5s; } .p-news__content-btn:hover { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #ffffff; background: #EC8226; } @media screen and (width <= 768px) { .p-news__content-btn:hover { font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.5; color: #000000; background: #FFDCBE; } } .p-news__content--publication { background: #F6FFF5; border: 1px solid #52C441; } .p-news__content--publication > h3 { background: #52C441; } .p-news__content--publication .p-news__content-btn { border: 1px solid #52C441; background: rgba(82, 196, 65, 0.2); } .p-news__content--publication .p-news__content-btn:hover { background: rgb(82, 196, 65); } @media screen and (width <= 768px) { .p-news__content--publication .p-news__content-btn:hover { background: rgba(82, 196, 65, 0.2); } } .p-news__content--webreport { background: #F0F7FF; border: 1px solid #2D79CF; } .p-news__content--webreport > h3 { background: #2D79CF; } .p-news__content--webreport .p-news__content-btn { border: 1px solid #2D79CF; background: rgba(46, 121, 206, 0.2); } .p-news__content--webreport .p-news__content-btn:hover { background: rgb(46, 121, 206); } @media screen and (width <= 768px) { .p-news__content--webreport .p-news__content-btn:hover { background: rgba(46, 121, 206, 0.2); } } .p-news-content__inner > a.c-news { margin-bottom: 16px; } .p-news-content__inner > a.c-news::after { right: 16px; } .p-news-content__inner > a:hover { border: 1px solid #EC8226; } @media screen and (width <= 768px) { .p-news-content__inner > a:hover { border: 1px solid #DBDBDB; } } .p-news-content__inner > a:hover::after { right: 16px; background-color: #EC8226; } @media screen and (width <= 768px) { .p-news-content__inner > a:hover::after { background-color: #000000; } } .p-news__more { max-width: 180px; width: 100%; margin: 0 auto; } .p-news__more > button { width: 100%; padding-block: 5px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; text-align: center; background-color: #FFDCBE; border: 1px solid #EC8226; border-radius: 4px; cursor: pointer; transition: all 0.5s; } .p-news__more > button:hover { background-color: #EC8226; color: #ffffff; } @media screen and (width <= 768px) { .p-news__more > button:hover { background-color: #FFDCBE; color: #000000; } } .p-news-category { margin: 96px auto; } @media screen and (width <= 768px) { .p-news-category { margin: 60px auto; } } .p-news-category__inner { display: flex; flex-direction: column; gap: 16px; } .p-news-category__more { max-width: 180px; width: 100%; margin: 16px auto 0; } .p-news-category__more > button { width: 100%; padding-block: 5px; font-size: clamp(1.4rem, 1vw, 1.6rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; text-align: center; background-color: #FFDCBE; border: 1px solid #EC8226; border-radius: 4px; cursor: pointer; transition: all 0.5s; } .p-news-category__more > button:hover { background-color: #EC8226; color: #ffffff; } @media screen and (width <= 768px) { .p-news-category__more > button:hover { background-color: #FFDCBE; color: #000000; } } .p-news-category__more > button.js-hide { display: none; visibility: hidden; } form > .l-form__inputs { width: -moz-fit-content; width: fit-content; margin: 0 auto; } form .p-contact__text { max-width: 800px; margin-bottom: 16px; } .p-contact { margin-block: 96px; } @media screen and (width <= 768px) { .p-contact { margin-block: 60px; } } .p-contact--confirm .p-contact__text { max-width: 640px; } .p-contact--confirm .l-form { display: flex; flex-direction: column; } .p-contact__text { max-width: 530px; width: 100%; margin: 0 auto 64px; } @media screen and (width <= 768px) { .p-contact__text { margin: 0 auto 32px; } } .p-contact__title { width: min(100%, 1040px); margin: 0 auto 64px; padding: 13px 24px; font-size: clamp(2.4rem, 2vw, 3.2rem); font-weight: 700; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; position: relative; background: linear-gradient(90deg, rgba(236, 130, 38, 0.1) 0%, rgba(236, 130, 38, 0) 100%); } @media screen and (width <= 768px) { .p-contact__title { margin-bottom: 32px; } } .p-contact__title::before { content: ""; position: absolute; top: 50%; left: 0; transform: translateY(-50%); width: 8px; height: 48px; border-radius: 2px; background: #EC8226; } .p-contact__thanks { max-width: 800px; width: 100%; margin: 0 auto; } .p-contact > .c-btn--rev { max-width: 480px; width: 100%; margin: 64px auto 0; font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } @media screen and (width <= 768px) { .p-contact > .c-btn--rev { max-width: 320px; height: 60px; margin: 40px auto 0; } } .p-contact .p-cart__inner { margin-bottom: 64px; } .p-contact .p-cart__inner .p-cart__content-total > p { display: none; } .p-contact .p-cart__inner .c-cart-list__btns { margin-top: 40px; } .p-contact .p-cart__inner .c-cart-list__btns .c-cart-list__reset { display: none; } .p-contact .p-cart__inner .p-cart__content-total { margin-top: 24px; } .p-contact .p-cart__inner .p-cart__content--confirm .c-cart-list-table__row .c-cart-list-table__head:nth-of-type(1) { min-width: 120px; } .p-contact .p-cart__inner .p-cart__content--confirm .c-cart-list-table__row .c-cart-list-table__head:nth-of-type(2) { min-width: 641px; width: 100%; } .p-contact .p-cart__inner .p-cart__content--confirm .c-cart-list-table__row .c-cart-list-table__head:nth-of-type(3) { min-width: 139px; } .p-contact .p-cart__inner .p-cart__content--confirm .c-cart-list-table__row .c-cart-list-table__head:nth-of-type(4) { min-width: 139px; } .p-contact .p-cart__inner .p-cart__content--confirm .c-cart-list-table__row .c-cart-list-table__content:nth-of-type(1) { min-width: 120px; } .p-contact .p-cart__inner .p-cart__content--confirm .c-cart-list-table__row .c-cart-list-table__content:nth-of-type(2) { min-width: 641px; width: 100%; } .p-contact .p-cart__inner .p-cart__content--confirm .c-cart-list-table__row .c-cart-list-table__content:nth-of-type(3) { min-width: 139px; } .p-contact .p-cart__inner .p-cart__content--confirm .c-cart-list-table__row .c-cart-list-table__content:nth-of-type(4) { min-width: 139px; } .p-contact .p-contact__thanks-purchase { max-width: 610px; width: 100%; margin: 0 auto; } .p-notfound { margin-block: 96px; } @media screen and (width <= 768px) { .p-notfound { margin-block: 60px; } } .p-notfound__content { max-width: 510px; width: 100%; margin: 0 auto; } .p-notfound__content-text { margin-bottom: 64px; } @media screen and (width <= 768px) { .p-notfound__content-text { margin-bottom: 32px; } } .p-notfound__content > .c-btn--rev { max-width: 480px; width: 100%; margin: 64px auto 0; font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } @media screen and (width <= 768px) { .p-notfound__content > .c-btn--rev { max-width: 320px; height: 60px; margin: 40px auto 0; } } .p-sitemap { margin: 96px auto; max-width: 1360px; width: 100%; } @media screen and (width <= 768px) { .p-sitemap { margin: 60px auto; } } .p-sitemap__content { max-width: 1040px; width: 100%; margin: 0 auto; } .p-sitemap__list > li { margin-bottom: 24px; font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; transition: all 0.5s; position: relative; } .p-sitemap__list > li > a { display: block; font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 500; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; padding: 0 0 10px 0; margin-block: 0 24px; position: relative; border-bottom: 2px solid #DBDBDB; background: none; transition: all 0.5s; } .p-sitemap__list > li > a::before { content: ""; position: absolute; width: 24px; height: 24px; right: 24px; top: 50%; transform: translateY(-50%); -webkit-mask-image: url("../../assets/images/icon/ico_arrow_right_01.svg"); mask-image: url("../../assets/images/icon/ico_arrow_right_01.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #000000; transition: all 0.5s; } @media screen and (width <= 768px) { .p-sitemap__list > li > a::before { right: 16px; } } .p-sitemap__list > li > a::after { content: ""; position: absolute; bottom: -2px; left: 0; width: 160px; height: 2px; background-color: #EC8226; } .p-sitemap__list > li > a:hover { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #EC8226; } @media screen and (width <= 768px) { .p-sitemap__list > li > a:hover { font-size: clamp(1.8rem, 1.25vw, 2rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; } } .p-sitemap__list > li > a:hover::before { right: 0; background-color: #EC8226; } @media screen and (width <= 768px) { .p-sitemap__list > li > a:hover::before { right: 16px; background-color: #000000; } } .p-sitemap__list > li > ul { margin-top: 16px; } .p-sitemap__list > li > ul > li { max-width: 456px; width: 100%; margin-bottom: 8px; border-bottom: 1px solid #DBDBDB; font-size: clamp(1.6rem, 1.125vw, 1.8rem); font-weight: 400; -webkit-font-smoothing: antialiased; line-height: 1.75em; color: #000000; position: relative; } .p-sitemap__list > li > ul > li::before { content: ""; position: absolute; bottom: -1px; left: 0; width: 0%; height: 1px; background: #EC8226; transition: all 0.5s; } .p-sitemap__list > li > ul > li::after { content: ""; position: absolute; width: 24px; height: 24px; right: 16px; top: 50%; transform: translateY(-50%); -webkit-mask-image: url("../../assets/images/icon/ico_arrow_right_01.svg"); mask-image: url("../../assets/images/icon/ico_arrow_right_01.svg"); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-size: 100%; mask-size: 100%; background-color: #000000; transition: all 0.5s; } .p-sitemap__list > li > ul > li:hover::before { width: 100%; } @media screen and (width <= 768px) { .p-sitemap__list > li > ul > li:hover::before { width: 0%; } } .p-sitemap__list > li > ul > li:hover::after { right: 0; background-color: #EC8226; } @media screen and (width <= 768px) { .p-sitemap__list > li > ul > li:hover::after { right: 16px; background-color: #000000; } } .p-sitemap__list > li > ul > li > a { display: block; padding-bottom: 8px; }/*# sourceMappingURL=style.css.map */