@charset "UTF-8";@import "https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&family=Noto+Serif+JP:wght@700&display=swap";/*** The new CSS reset - version 1.11.3 (last updated 25.08.2024) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug - The "html" element is excluded, otherwise a bug in Chrome breaks the CSS hyphens property (https://github.com/elad2412/the-new-css-reset/issues/36) */ *:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) { all: unset; display: revert; } /* Preferred box-sizing value */ *, *::before, *::after { box-sizing: border-box; } /* Fix mobile Safari increase font-size on landscape mode */ html { -moz-text-size-adjust: none; -webkit-text-size-adjust: none; text-size-adjust: none; } /* Reapply the pointer cursor for anchor tags */ a, button { cursor: revert; } /* Remove list styles (bullets/numbers) */ ol, ul, menu, summary { list-style: none; } /* Firefox: solve issue where nested ordered lists continue numbering from parent (https://bugzilla.mozilla.org/show_bug.cgi?id=1881517) */ ol { counter-reset: revert; } /* For images to not be able to exceed their container */ img { max-inline-size: 100%; max-block-size: 100%; } /* removes spacing between cells in tables */ table { border-collapse: collapse; } /* Safari - solving issue when using user-select:none on the text input doesn't working */ input, textarea { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ textarea { white-space: revert; } /* minimum style to allow to style meter element */ meter { -webkit-appearance: revert; -moz-appearance: revert; appearance: revert; } /* preformatted text - use only for this feature */ :where(pre) { all: revert; box-sizing: border-box; } /* reset default text opacity of input placeholder */ ::-moz-placeholder { color: unset; } ::placeholder { color: unset; } /* fix the feature of 'hidden' attribute. display:revert; revert to element instead of attribute */ :where([hidden]) { display: none; } /* revert for bug in Chromium browsers - fix for the content editable attribute will work properly. - webkit-user-select: auto; added for Safari in case of using user-select:none on wrapper element*/ :where([contenteditable]:not([contenteditable="false"])) { -moz-user-modify: read-write; -webkit-user-modify: read-write; overflow-wrap: break-word; -webkit-line-break: after-white-space; -webkit-user-select: auto; } /* apply back the draggable feature - exist only in Chromium and Safari */ :where([draggable="true"]) { -webkit-user-drag: element; } /* Revert Modal native behavior */ :where(dialog:modal) { all: revert; box-sizing: border-box; } /* Remove details summary webkit styles */ ::-webkit-details-marker { display: none; } /**** foundation ****/ /* breakpoint ---------------------------------------------------------------------------- */ /* breakpointでvwの変更に使用 ---------------------------------------------------------------------------- */ /* variables ---------------------------------------------------------------------------- */ * { box-sizing: border-box; } body { /* min-width: 1320px; */ font-family: "Noto Sans JP", Avenir, "Helvetica Neue", Helvetica, Arial, "Hiragino Sans", "ヒラギノ角ゴシック", YuGothic, "Yu Gothic", "メイリオ", Meiryo, "ＭＳＰゴシック", "MS PGothic", sans-serif; font-size: 16px; font-weight: 400; line-height: 1; color: #222; background-color: #fff; } a { cursor: pointer; } a:hover { opacity: 0.7; transition: opacity 0.2s ease-in-out; } /**** layout ****/ .l-header { background-color: #fff; } .l-header__inner { padding: 26px 32px; } .l-header__logo > a { display: flex; gap: 16px; align-items: center; pointer-events: none; } .l-header__logo > a > img { width: 217px; height: 43px; } .l-header__logo > a > span { font-size: 16px; font-weight: 700; color: #000; } .l-footer { position: relative; /* background-color: #2b3850; */ } /* .l-footer::before { position: absolute; inset: 0; z-index: 0; display: block; width: 100%; height: 100%; content: ""; background: url("../images/bg-noise.png") repeat 50% 50%; opacity: 0.06; } */ /* .l-footer__inner { display: flex; justify-content: space-between; max-width: 1320px; position: relative; padding: 40px 60px; margin: 0 auto; font-size: 12px; font-weight: 400; color: #fff; } */ .l-footer .l-container { max-width: 880px; } .l-footer__company { padding: 40px 0 20px; } .l-footer__company-logo { width: 100px; float: left; margin-right: 20px; } .l-footer__company-logo img { width: 100%; height: auto; } .l-footer__company-name { padding-top: 20px; font-size: 18px; font-weight: 700; } .l-footer__company-name small { font-size: 14px; font-weight: 400; } .l-footer__company-desc { margin-top: 10px; font-size: 13px; line-height: 1.5; } .l-footer__privacy { display: flex; justify-content: center; align-items: center; gap: 10px; padding-bottom: 20px; font-size: 13px; } .l-footer__privacy img { width: 45px; } .l-footer__privacy p { font-size: 13px; line-height: 1.5; } .l-footer__copyright { border-top: solid 1px #ccc; padding: 20px; font-size: 14px; text-align: center; } .l-section { position: relative; padding: 80px 40px 120px; background-color: #2b3850; } .l-section::before { position: absolute; inset: 0; z-index: 0; display: block; width: 100%; height: 100%; content: ""; background: url("../images/bg-noise.png") repeat 50% 50%; opacity: 0.06; } .l-section.-beige { background-color: #f6f1ed; } .l-section.-beige::before { content: none; } .l-section.-gray { background-color: #ededed; } .l-section.-gray::before { content: none; } .l-section > * { position: relative; z-index: 1; } .l-container { max-width: 1280px; margin-left: auto; margin-right: auto; padding: 0 40px; } /**** project ****/ .p-top-about__lead, .p-top-achievements__lead, .p-top-support__lead { margin-top: 40px; font-size: 18px; font-weight: 500; line-height: 1.5; text-align: center; } .p-top-achievements__table, .p-top-ex__table { width: 100%; font-size: 16px; font-weight: 500; line-height: 1.5; /* white-space: nowrap; */ } .p-top-achievements__table th, .p-top-ex__table th, .p-top-achievements__table td, .p-top-ex__table td { padding: 8px 12px; text-align: left; } .p-top-achievements__table th, .p-top-ex__table th { font-weight: 700; } .p-top-ex__table th, .p-top-ex__table td { padding: 12px 0 0; } .p-top-ex__table th { width: 5em; } .p-top-achievements__table tr:first-child > td, .p-top-ex__table tr:first-child > td { font-weight: 700; } .p-top { width: 100%; } .p-top-mv { display: flex; width: 100%; min-height: 684px; padding: 40px 60px; background: #20293a url("../images/mv-pc.jpg") no-repeat center top -96px/cover; } .p-top-mv__inner { display: flex; gap: 34px; justify-content: space-between; width: 100%; max-width: 1320px; margin: 0 auto; } .p-top-mv__contents { display: flex; flex: 1; flex-direction: column; margin-top: 120px; } .p-top-mv__lead { font-family: "Noto Serif JP", "Avenir", "Helvetica Neue", "Helvetica", "Arial", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", "ＭＳＰ明朝", "MS PMincho", serif; font-size: 48px; font-weight: 900; line-height: 1.5; color: #fff; } .p-top-mv__lead > .-bg { display: inline-block; background-color: #957500; } .p-top-mv__text { margin-top: 24px; font-size: 18px; font-weight: 700; line-height: 1.5; color: #fff; } .p-top-mv__list { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; justify-content: center; margin-top: auto; color: #fff; } .p-top-mv__item { position: relative; display: flex; flex: 0 1 266px; flex-direction: column; align-items: center; justify-content: center; width: 266px; height: 94px; } .p-top-mv__item:first-child .p-top-mv__item--text1 { font-size: 16px; } .p-top-mv__item::before { position: absolute; top: 0; left: 0; display: block; width: 40px; height: 94px; content: ""; background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFAAAAC8CAMAAADYSdlmAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAACiUExURUdwTJN0AI9vAJNzAJR0AJV1AJd3AJNzAI9vAJV1AJV1AJV1AJR0AJR0AJR0AJR0AJ9vAJV1AJV0AJR0AJR0AJVzAJJ0AJJ1AJZ2AJNzAJV0AJV1AJJzAJR0AJJyAJR1AJZ2AJJyAJR2AJV1AI90AJRvAJV2AJV1AJRyAJxzAJZ1AJZ0AJZ2AJV1AJZ2AJVzAJZ1AJdvAJd3AJV2AJR1AJV1AGt8UJ0AAAA1dFJOUwBwIIDfvyBAEO/fn2CgkDAQz7/vv4BgUH/P74+Qr2Dfr1B/sDAwz29gH8+vcFBfn58gb5+/jDMoEgAABrdJREFUaN7NW9l2ozgQNSCQ2IyJ3XiLHWfpTiadpadn+P9fG9ugpYSccZWYc0ZPdnK4KdVy66pQJpOr17b9YzLiEnXb7i//tuICCbhrLwH+GRzmx1+mOLyH1g1Yre7abk1ReO+tE5DHrVzZDIMXsvND3HLcTsG1aYIyMG8dgO9zjWf/rX9ZRf+UmTZia8C1L7iIsP4x0wm1B95D/9gP/aMn5oEXyodvNJ7pvpQjU1p6UGcawMsSbNGp3RXSZBNvOsPifVfPVn18Df8tKjwrBMpXVoyOcJxCM2v5+GO/YT84/bx0YWdxGlVEHry3dxy36SJAGxceQljGbZv3P5jNKHYxlXRrK8a09ax32A7rTlTLJoqCZYjL5Y5auBUS0Ww1LdQFptj2ICbZuXus4hasb5hi65wYaQMLC+36NtJtMz5/vpUGcmbDXW1fnyldVMru2WA3gEOwVm+L0ID1fIC3uJ61uJl4Zetc2TsiCXu3tUvzC9xtNKPQyx6QFxluIuSDEUhs5bsAW8scZlkG0CIfhu7opUhPn9l6N20qEs/oMOQjKcuyJemzr5WlDsoIS1FAMDbgcmxAPjagGBkQqnoe/DrUdXwoQjKgFm8iiDV9sYSah9Oh0qdlZ2kGWawsan29Gufpd/9BtqXT1p5tpn69vpyZTJNG9c1w0OYWMwxpMWEKzNwS5lj/Raot9gS7/BgwdYClhD7zzqfB9MGjzalGspxc7ktYqjDEAnfgobV+YvJBZsPl6OqQVk3hSYfUNQFgKiDhpLuAKFwbwIHJ52L3OW3uZ3TOkoDxWEMUCZiKkQFH4/1m7GbcOE4PXut76+wk/bDn2E8OW1wzURpuMDBTnI307p27vYfqqHdDlUgBsE5XILacA0eYi7lHs+MDVQg6Soavwo3lKw4aHp6/FMP8sCcVVGUnncjO3/6iHeocnN0BgslbW9KK5U4DPoyBJyUIk/NRXzxZfUxP42gJmLMQxPnHJPaLx0Zqmj63b57NjveC3+npeG2aWBsbfiXk81kybCcuyZDSDirnknvrPv/07u9Ka3WBEZk3nIxt3QUmyXwmg4BZezcmf7PPxkMwGKRw2SgeRJiDqRxu1Zf+YI1sKOLLmugHVAWBZVyyRr1ASAhRcZioWOKROKe2TNRdZUmiattEfU7JqCfu1BrD2u8AkFQNc9HAy9BULVuyIYg/yK+boIkyLE/mIYXcTXRDN7tKltAJQu3Z7CoFhSCSDUjFwm/DwIunFBa+GzYDPYW6IU18WZHBiLzQebZWiRN4qi5LwXL91s0LTw0GgqIda37YbTqPHaN+saJkT9dCM4cKeZ5jTmxCHbmqjVPEiRjXpW7bPLQRX83t1sgmcKxjtgS7BiKpw8PIznPardS3jEFVs0VHvDvYxhcOrw8Eku36MnMiqhejFPVfOYeKhLNtJTO5urhh5FEgvoQYEvuUktY2Yv7VIOKrpYVw6DbwEQmo2ygTLkWBblS607cHhyfw0sEk6TeHgQTu0jNN5cbQaz5gnKFiyOCEiY09GX4zxsZ07SBqa9OhR0igGukjfT808CmnupGbPlAGfsyRL5UCEJfYDjHHS08gje1mfxYoe2oJxmpAuQBEgR5oKETOLTUXEktGIsaBdT8kJ7GOgTiFvS6k10zQ5WMK1VfuUYRJ5lBzzANQbfvbMOmJgJMkWkM9klMAYVnBe0Sk9ryeH4ov1Qo2bU7Fy3KnIClI/b5/ygVJvAYg02UIqc4FeyIhWi8mqIrEmM2xwjUq0sdpcR2yMF4QmvuOBhInv/LVlTmQNARoaffT4mqJHJkDyeUAcKqDFKPdaCj50poHcUR8RO1A3FlCG9UNkmyIWFqFt0ZpUAdiCXcskDk5RCxhx+fYw3QC/PimYp9DQRDjKVtuLYAS4pYg5Atj22nYwJ5cUq5gJsaVuZrD52PaBMEwMofsHxNftCTwXp/W2Wvyy3ITMh9OlRmln5bpcAR253en6b5cpym4JH136cUxda3/s2tc+/8rYEnq0uH21zZqnP9zcksClHJmHkc2akOb3pl1EoP7bQnNhwLe4omNFxYbWtok1r0grSZI/OVAVJABtfTET/vuUjchE7TZy6AXdMJMqNQmKfhicMGKcbnnR1JZDBx56qzCa4g83Dbr7miQySYZ3PFmgeedUUXcqrVu6Keq/hxULGwzve/xJgHEHOMudHJsMHJ0kF2Y2uJXxTmvZqcySovJqOvWfezyWJF9oPFe99nYRp4LcyVG3vbI++YnI9nvcGQjj77kI3qyYw+WF9XIkMc2fhjL0FmxW5/upM4m/wBfcpb3MByEVAAAAABJRU5ErkJggg==") no-repeat center/contain; } .p-top-mv__item::after { position: absolute; top: 0; right: 0; display: block; width: 40px; height: 94px; content: ""; background: url("data:image/png;base64,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") no-repeat center/contain; } .p-top-mv__item--text1 { font-size: 24px; font-weight: 700; letter-spacing: 0.1em; } .p-top-mv__item--text3 { margin-top: 8px; font-family: "Noto Serif JP", "Avenir", "Helvetica Neue", "Helvetica", "Arial", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", "ＭＳＰ明朝", "MS PMincho", serif; font-size: 24px; font-weight: 900; letter-spacing: 0.06em; } .p-top-mv__item--text3 > span { font-size: 32px; } .p-top-mv__formarea { flex: 0 1 440px; width: 440px; height: 100%; padding: 32px; text-align: center; background: #fff; border-radius: 24px; box-shadow: 0 4px 40px 10px rgba(32, 41, 51, 0.6); } .p-top-mv__formarea--title { display: inline-block; padding: 4px 8px; /* color: #2c387f; */ font-family: "Noto Serif JP", "Avenir", "Helvetica Neue", "Helvetica", "Arial", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", "ＭＳＰ明朝", "MS PMincho", serif; font-size: 24px; font-weight: 900; /* color: #fff; */ /* background-color: #957500; */ } .p-top-company { padding: 80px 0; pointer-events: none; } .p-top-company__slider > .swiper-wrapper { align-items: center; margin: 0 auto; transition-timing-function: linear; } .p-top-company__item { width: -moz-fit-content !important; width: fit-content !important; margin: 0 40px; } .p-top-company__thumb { display: flex; align-items: center; justify-content: center; } .p-top-company__thumb > img { max-inline-size: inherit; width: auto; height: 64px; } .p-top-ex__slider { position: relative; max-width: 1248px; min-height: 356px; padding: 0 24px !important; margin: 80px auto 0; } .p-top-ex__button { position: absolute; inset: 0 auto; z-index: 1; width: 48px; height: 48px; margin: auto; cursor: pointer; background-color: #957500; border-radius: 50%; box-shadow: 0 4px 6px 0 rgb(36, 46, 64); } .p-top-ex__button::after { position: absolute; inset: 0 0 0 -2px; width: 10px; height: 10px; margin: auto; content: ""; border-top: solid 2px #fff; border-right: solid 2px #fff; transform: rotate(45deg); } .p-top-ex__button:hover { filter: brightness(1.2); transition: filter 0.2s ease-in-out; } .p-top-ex__button.-prev { left: 0; } .p-top-ex__button.-prev::after { inset: 0 -2px 0 0; transform: rotate(-135deg); } .p-top-ex__button.-next { right: 0; } .p-top-ex__item { width: 368px; height: auto; align-self: auto; padding: 32px 40px; background-color: #fff; border-radius: 24px; } .p-top-ex__head { display: flex; gap: 16px; align-items: center; font-family: "Noto Serif JP", "Avenir", "Helvetica Neue", "Helvetica", "Arial", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", "ＭＳＰ明朝", "MS PMincho", serif; font-size: 20px; font-weight: 900; line-height: 1.2; text-align: left; } .p-top-ex__image { width: 64px; } .p-top-ex__table { /* margin-top: 32px; */ margin-top: 8px; /* margin-left: 12px; */ /* width: auto; margin-right: auto; margin-left: auto; */ } .p-top-support__list { display: flex; gap: 48px; max-width: 1200px; margin: 80px auto 0; } .p-top-support__item { flex: 1; overflow: hidden; background-color: #f5f5f5; border-radius: 24px; box-shadow: 0 4px 20px 0 rgba(90, 90, 90, 0.1); } .p-top-support__item--body { padding: 24px; } .p-top-support__item--title { font-size: 20px; font-weight: 700; line-height: 1.5; text-align: center; } .p-top-support__item--text { margin-top: 16px; font-size: 18px; font-weight: 500; line-height: 2; } .p-top-achievements__lead { color: #fff; } .p-top-achievements__list { display: flex; flex-direction: column; gap: 24px; max-width: 960px; margin: 80px auto 0; } .p-top-achievements__item { position: relative; padding: 40px 40px 32px; background-color: #fff; border-radius: 24px; box-shadow: 0 4px 5px 0 rgb(32, 40, 55); } /* @media screen and (min-width: 768.1px){ .p-top-achievements__item:last-child { padding-bottom: 48px; } .p-top-achievements__item:last-child .p-top-achievements__button { inset: auto 0 -20px; } } */ .p-top-achievements__item::before { position: absolute; inset: 0; z-index: 0; display: block; width: calc(100% - 16px); height: calc(100% - 16px); margin: auto; content: ""; border: 1px solid #957500; border-radius: 24px; } .p-top-achievements__item--contents { position: relative; z-index: 1; display: flex; -moz-column-gap: 83px; column-gap: 83px; flex-wrap: wrap; } .p-top-achievements__item--head { display: flex; gap: 32px; align-items: center; } /* .p-top-achievements__item:last-child .p-top-achievements__item--contents { gap: 62px; } */ .p-top-achievements__item:last-child .p-top-achievements__table th { padding-left: 8px; } .p-top-achievements__item--open { display: flex; gap: 40px; margin-top: 30px; } .p-top-achievements__item--before > p, .p-top-achievements__item--after > p { font-size: 16px; font-weight: 700; } .p-top-achievements__item--before > p + p, .p-top-achievements__item--after > p + p { margin-top: 16px; font-weight: 500; line-height: 2; } .p-top-achievements__persona > figure { width: 120px; height: 120px; } .p-top-achievements__persona > p { font-size: 16px; font-weight: 700; line-height: 1.5; text-align: center; } .p-top-achievements__raise { position: relative; z-index: 1; padding-bottom: 4px; margin-top: -48px; font-family: "Noto Serif JP", "Avenir", "Helvetica Neue", "Helvetica", "Arial", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", "ＭＳＰ明朝", "MS PMincho", serif; font-size: 24px; font-weight: 900; white-space: nowrap; } .p-top-achievements__raise > span { display: inline-block; padding: 0 8px; font-size: 48px; vertical-align: -0.05em; } .p-top-achievements__raise::before { position: absolute; bottom: 0; left: 0; z-index: -1; display: block; width: 100%; height: 8px; content: ""; background-color: #957500; } .p-top-achievements__table { background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAOAAAADgCAYAAAAaLWrhAAAACXBIWXMAABYlAAAWJQFJUiTwAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAk4SURBVHgB7d1NTxPdG8fxAzj0iZaChD+4YKPRhRsjCzXGhMS4cMHSV2Di6+CluHPhTkxI1EUTQwyLLmWhMRAxNfIgSKHT0qf/dXEzBNoptKUzffp+kjtV4I7amd855zrndI4xAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD4bWFhYdCgpmsGaJG5uTm9n66JwJDY3t4OJBKJvHxt28AVAURTNGzpdHp4bGzMKhQKlvzayufzA/o9eT3+mWAwaHAxAohL1QqbBsy27eOfqRU2+f6QQU0EEOdcJWxoHAHsY69evbKSyaSlYcvlcsOZTOYaYfMXAewDOhOZSqWGKsP29etXwtZmAwY9xQnb8vJyQMM2MDBwrVQqWaaN5O+SMnBFALuYhm1lZcX6+fOn1Slhc0MAayOAXaIybFKrDct6W1fMMBLA2pgi7kAatlAoNBwIBEJ37tyJTE9Pj66vr8ekdgtLnRaQH7EGhekSL1++PJQF+bJBFQLYZidbtQKRSCTYC2Fzk81mD1dXVwmgCwLoo7Nhu3///sjExERMwyZ1W6hXwuYmGo0SwBpYhvBI5b7Ivb096+PHj8cNXjweNwcHB/pNg/7GHdACbpuQK/dF9nPYZNJIe/WiQRUC2CA2ITduY2ODjyTVQAAvwL5IeI0AVpidnQ3LpEGYsMEPDA0qJJPJjAQvJ2Fjk0KLbG5uMtteAwF0sby8nLYsa19WBJg6h6cIYA2JROJgampqU3pCZu/gGQJ4gbdv3xbHx8e3pTc8MoAHqHPq9Pjx46i8RA2akdZhvUEVesA66Q0kveEedSFaiQA2YHFxMUNdiFYigA1y6sJSqZQ1qEsoFOI+q4H1mSbozv5fv37ZMzMz+tuAwYUGBgYK6+vrNFguaJmuQOtC6Ql3qQvRLAJ4RV++fLGpC9EshqAtoEPStbU1++bNm4Od+FCkdguHw8UfP37YBlXoAVunlEgk9uSV9a4KuVyO+6wG3pgWc+pChqSoBwH0gNaFulRBCHEZtqJ5a3B2djYqQYyYPlYoFIorKyt/DKrQA3qrlEwm/xnqQtRAAH2gdWEsFtthSIpKBNAnS0tLOepCVCKAPtJ9pGKn33bOdMsZFu1AAH2kT8a2bfu6LFMw+YVjtEw+kt5vQo8QM31oY2ODiSgX9IA+keWI0X7epnZyLgYq8FxQH5w8zqKv1wL1OGyDKrRKHuNZMrgIAfQQ4cNlCKBH5ufnw4bwnTo5IQkVeFM8oOH7+/dv3OAUJyS5401pMcKHRhDAFiJ8tdm2zSyoC5YhWkQnXCR81Hw1pNNpGnsXvCktwGwnmkUAr2hubk6HnIQPTWEI2iQ9vrpYLI7l83meglaH69evUwO6oAdswuzsrHXyqQbCV6fDw0PuNRe8KQ2Snm9EXib4jBtagZuoTrqbP5fLjZXL5YiEj+FU445kMZ6DTitQA9bh+fPngaWlpTi9XvMsy+K9c8GbcgGn1zs6OooNCoOmDQ0N5TkhqRo3VQ26tre4uPg/yV3QAB5hCFpBZjjDMtTUdb2hYJDswVsE0Pw31JTeLqjBo87zDPeai76+2TR4spA+srq6Oi69XYg6zztSAxalBswYnNN3AdTQbW1tRe7evRv7/v37qHwpwLKC9wigu56/8TRwKysr1v7+/rBMhQekxxs28J0MLvKfP3/eMjinpwKoYUulUkPJZNIaGxuzCoWClU6nLRle0sO1GSckueuKG1M3Puvr7du3B/TRBpubm0PZbHZwenr6+FUfditrdYNMoHQuAujOzwDqWXlBDUw8Hj/+c52nREcikQHnGGPbto9DJBdskJ6rdxBAd35ODZfkv/zU1NS4hPA4ZOXyf2eUHBwcnP6Q9GLnXtEbQqEQjakLX6fdpTbLc0RX59HTmrw+114mv1jiceF7zSRrbuW1tbXDyclJrdmYkewAt27d2n3//n3W6+vCAS3V2tYq6dHNsiywb9BWUn//e/369ekmaa6Lv9o6aygLs0fS4mZHRkaCOuli4Ld0IpE4qPyiV9fl4cOHGR0BGZxq+03v1IUyIVMw8FNaz66v9U2uiz86amaKx/v55sLwVWrVdblx48YfPabb4FRHDfv0pqD+8FxD4VNcF+90XN2lNYm2lCxVeKLh8DlacV1kvZfF3QodOfGhwxStP6TVZfd8i+hsZ7Phc5y5LjxcqUU6fncCdeHV6CJ7PB7/t7i42NLGrJnrEovFdpaWlnIGpzp+6l9bbYakzdH3LJPJbLc6fMqpCzXg9f4/nJBUrSs+PeDsnpmZmdHfBgwuJb1NfnR0dOfTp0+eLSPoeuGDBw/sfD4fqme9UBqD3O/fv/MGp7pq8VtbXR3G0BteTGtnCcaOH1P+Tl1YKpV45GATunVIMCg1SMRQG56jw8FQKLT/4cOHQ9MGl9WF2Wx2Txb4mVg7o1u3f5WoDc9z6r12hU/pNZHecK9WXcgJSdW6+hPkTm147969Yrlctvp1P6n0eodPnjzZffPmTdsbo2/fvuVr1YXytTznQ5zXMy3SixcvhlKpVNj00bBUe73h4eG9Dp3aH3z06FG84sni6auuRfaanhsSaBC3trai0tiGTY86+QDtQTfczBV1IQGs0HNDNp2VSyQSe1of9uJOGv03PX369E+33Mj693Q+bc8JSdV6vih2esRisRiSG6Fr/726/SudTv/TjwmZLqTXIZfLhd+9e0cPeEbfzErpDSDT4AGZKYw6D4XqBtrjySSLzRau3tSX08J64KZt26FO7RWdGu/Zs2eHCwsLJYOe1dfrMvokbRnSBbe3t/VkpEA7w6ihE9loNJqht+sfLIyeoT2jzJ4GZZgacB4a7CV9WK0ELivDzKysneXp7foPAazBOdRFhqqWTB4MayCvEkoNmx5QEolEiru7u/n5+fksgQMBbJATTP21nlEhPZieMXj6PkpvVpbZyuNgTU5OFiXAxbm5uRJhAwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAIB2+D8lIlBOfSRKTAAAAABJRU5ErkJggg==") no-repeat top 10px left 85px/112px auto; } .p-top-achievements__table td { padding: 8px 10px; } .p-top-achievements__table td > span { font-size: 24px; font-weight: 700; } .p-top-achievements__table th:nth-of-type(2) { padding-left: 5px; } .p-top-achievements__button-wrap { margin-top: 20px; width: 100%; } .p-top-achievements__button { /* position: absolute; */ /* inset: auto 0 -5px; */ width: 295px; height: -moz-fit-content; height: fit-content; position: relative; padding: 8px 32px 8px 16px; margin: auto; font-size: 16px; font-weight: 700; color: #fff; text-align: center; cursor: pointer; background-color: #957500; } .p-top-achievements__button:hover { opacity: 0.7; transition: opacity 0.2s ease-in-out; } .p-top-achievements__cross { position: absolute; inset: 0 16px 0 auto; width: 16px; height: 16px; margin: auto; } .p-top-achievements__cross > span { position: absolute; inset: 0; display: block; width: 16px; height: 2px; margin: auto; background-color: #fff; transition: transform 0.2s ease-in; transform: rotate(0deg); } .p-top-achievements__cross > span:nth-child(2) { transform: rotate(90deg); } .p-top-achievements__cross.is-open > span { /* transform: rotate(180deg); */ transform: rotate(0deg); } .p-top-about { background: #263145; } .p-top-about__lead { color: #fff; } .p-top-about__list { display: flex; gap: 48px; max-width: 1200px; margin: 60px auto 0; color: #fff; } .p-top-about__item { flex: 1; text-align: center; } .p-top-about__item img { } .p-top-about__item > h3 { margin-top: 12px; font-family: "Noto Serif JP", "Avenir", "Helvetica Neue", "Helvetica", "Arial", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", "ＭＳＰ明朝", "MS PMincho", serif; font-size: 24px; font-weight: 700; /* color: #957500; */ } .p-top-about__item > p { margin-top: 24px; font-size: 16px; /* font-weight: 700; */ line-height: 1.5; color: #fff; } .p-top-flow { padding-bottom: 0; } .p-top-flow__list { display: flex; flex-direction: column; gap: 20px; max-width: 640px; margin: 80px auto 0; counter-reset: number 0; } .p-top-flow__item { position: relative; padding: 32px 32px 32px 90px; background-color: #fff; border-radius: 8px; box-shadow: 0 0 30px 0 rgba(182, 176, 172, 0.2); } .p-top-flow__item::before { position: absolute; inset: 23px auto auto 32px; display: block; margin: auto; font-family: "Noto Serif JP", "Avenir", "Helvetica Neue", "Helvetica", "Arial", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", "ＭＳＰ明朝", "MS PMincho", serif; font-size: 40px; font-weight: 900; color: #957500; content: counter(number) "."; counter-increment: number 1; } .p-top-flow__item--title { font-family: "Noto Serif JP", "Avenir", "Helvetica Neue", "Helvetica", "Arial", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", "ＭＳＰ明朝", "MS PMincho", serif; font-size: 24px; font-weight: 900; } .p-top-flow__item--text, .p-top-flow__item--list { margin-top: 8px; font-size: 16px; font-weight: 500; line-height: 1.5; } .p-top-flow__item--text.-color, .p-top-flow__item--list.-color { font-weight: 700; color: #957500; } .p-top-flow__item--text { margin-top: 40px; text-align: center; } .p-top-flow__item--list { margin-left: 4px; } .p-top-flow__item--list > li::before { display: inline-block; margin-right: 4px; content: "・"; } .p-top-flow__message { /* height: 40vw; */ max-width: 720px; height: 280px; margin: 0 auto; padding-top: 40px; background-image: url(../images/flow-image.png); background-position: 100% 100%; background-size: auto 240px; background-repeat: no-repeat; text-align: right; } .p-top-flow__message-text { display: inline-block; position: relative; margin-top: 20px; margin-right: 180px; border-radius: 8px; padding: 20px 30px; background: white; color: #2c387f; /* font-family: "Noto Serif JP", "Avenir", "Helvetica Neue", "Helvetica", "Arial", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", "ＭＳＰ明朝", "MS PMincho", serif; */ font-size: 20px; font-weight: 700; line-height: 1.5; text-align: left; } .p-top-flow__message-text::before { content: ""; position: absolute; top: 40px; right: -20px; border-width: 10px; border-style: solid; /* border-color: white transparent transparent white; */ border-color: transparent transparent white white; } .p-top-faq__list { display: flex; flex-direction: column; gap: 16px; max-width: 960px; margin: 80px auto 0; } .p-top-faq__item { padding: 24px 32px; background-color: #f7f7f7; border-radius: 8px; cursor: pointer; } .p-top-faq__item--q { position: relative; padding: 0 56px 0 30px; font-size: 20px; font-weight: 700; line-height: 1.5; } .p-top-faq__item--q::before { position: absolute; inset: 0 auto auto 0; display: block; font-family: "Noto Serif JP", "Avenir", "Helvetica Neue", "Helvetica", "Arial", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", "ＭＳＰ明朝", "MS PMincho", serif; font-size: 20px; font-weight: 900; line-height: 1.5; color: #957500; content: "Q."; } .p-top-faq__item--q:hover { opacity: 0.7; transition: opacity 0.2s ease-in-out; } .p-top-faq__item--a { position: relative; display: none; padding: 0 56px 0 30px; margin-top: 8px; font-size: 16px; font-weight: 400; line-height: 2; } .p-top-faq__item--a::before { position: absolute; inset: 0 auto auto 0; display: block; font-family: "Noto Serif JP", "Avenir", "Helvetica Neue", "Helvetica", "Arial", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", "ＭＳＰ明朝", "MS PMincho", serif; font-size: 20px; font-weight: 900; line-height: 1.5; content: "A."; } .p-top-faq__cross { position: absolute; inset: 4px 0 auto auto; width: 24px; height: 24px; margin: auto; } .p-top-faq__cross > span { position: absolute; inset: 0; display: block; width: 24px; height: 3px; margin: auto; background-color: #957500; border-radius: 3px; transition: transform 0.2s ease-in; transform: rotate(0deg); } .p-top-faq__cross > span:nth-child(2) { transform: rotate(90deg); } .p-top-faq__cross.is-open > span { transform: rotate(0deg); } .p-top-registration { padding-bottom: 80px; } .p-top-link { display: flex; flex-direction: column; gap: 40px; padding: 40px; background-color: #f6f1ed; } .p-top-link__title { font-size: 20px; font-weight: 700; text-align: center; } .p-top-link__banner { display: block; width: 204px; margin: 0 auto; } /* デザインが無いため仮のスタイル */ .p-contact-completion { /* max-width: 1200px; */ /* min-height: 80vh; */ margin: 0 auto; } .p-contact-completion .l-container { max-width: 800px; } .p-contact-completion__text { max-width: 640px; margin: 40px auto 0; /* font-size: 18px; font-weight: 500; */ line-height: 2; } .p-contact-completion__text h2, .p-contact-completion__text h3, .p-contact-completion__text p, .p-contact-completion__text ul { margin-top: 1.5em; } .p-contact-completion__text h2 { border-bottom: 2px solid #2c387f; font-size: 24px; font-weight: 700; line-height: 1.5; } .p-contact-completion__text h3 { font-size: 20px; font-weight: 700; line-height: 1.5; } .p-contact-completion__text p { } .p-contact-completion__text h2 + p, .p-contact-completion__text h3 + p { margin-top: .5em; } .p-contact-completion__text p a { color: #957500; text-decoration: underline; } .p-contact-completion__text ul { } .p-contact-completion__text ul li { } .p-contact-completion__text .c-link-line { text-align: center; } .p-contact-completion__text .c-link-line img { width: auto; height: 72px; } /**** component ****/ .c-cta { position: relative; background: #957500 url("../images/cta-logo.png") no-repeat bottom -69px right -10px/607px auto; } .c-cta::before { position: absolute; inset: 0; z-index: 0; display: block; width: calc(100% - 48px); height: calc(100% - 48px); margin: auto; content: ""; border: 1px solid #fff; } .c-cta__inner { position: relative; z-index: 1; padding: 120px; color: #fff; text-align: center; } .c-cta__title { font-family: "Noto Serif JP", "Avenir", "Helvetica Neue", "Helvetica", "Arial", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", "ＭＳＰ明朝", "MS PMincho", serif; font-size: 48px; font-weight: 900; line-height: 1.5; } .c-cta__text { margin-top: 32px; font-size: 18px; font-weight: 700; line-height: 1.5; } .c-cta__button { display: inline-flex; align-items: center; justify-content: center; width: 292px; height: 80px; margin-top: 80px; font-family: "Noto Serif JP", "Avenir", "Helvetica Neue", "Helvetica", "Arial", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", "ＭＳＰ明朝", "MS PMincho", serif; font-size: 18px; font-weight: 900; line-height: 18px; letter-spacing: 0.08em; background: linear-gradient(85.43deg, #540000 -10.43%, #e92400 105.71%); } /* stylelint-disable selector-class-pattern */ .c-form { width: 840px; margin: 80px auto 0; background-color: #fff; border-radius: 24px; /* ---- HubSpot Formのスタイル変更 --- */ } .c-form.-mv { width: -moz-fit-content; width: fit-content; height: 100%; margin: 0; border-radius: 0; } .c-form__inner { width: 440px; padding: 80px 0; margin: 0 auto; text-align: center; } .c-form__inner fieldset.form-columns-1 .field.hs-form-field > label + .hs-field-desc { margin-left: 70px; } .c-form__inner .hs-button { box-shadow: 0 4px 20px 10px rgba(32, 41, 51, 0.05); } .c-form fieldset.form-columns-1, .c-form fieldset.form-columns-2 { max-width: 100%; } .c-form fieldset.form-columns-1 .field.hs-form-field, .c-form fieldset.form-columns-2 .field.hs-form-field { display: flex; flex-wrap: wrap; row-gap: 8px; width: 100%; margin-top: 24px; } .c-form fieldset.form-columns-1 .field.hs-form-field > label, .c-form fieldset.form-columns-2 .field.hs-form-field > label { /* flex: 0 1 106px; */ width: 120px; font-size: 14px; font-weight: 700; line-height: 2; text-align: left; } .c-form fieldset.form-columns-1 .field.hs-form-field > label + .hs-field-desc, .c-form fieldset.form-columns-2 .field.hs-form-field > label + .hs-field-desc { flex: 1; font-size: 12px; line-height: 1.3; text-align: left; } .c-form fieldset.form-columns-1 .field.hs-form-field > .input, .c-form fieldset.form-columns-2 .field.hs-form-field > .input { /* flex: 0 1 263px; */ width: calc(100% - 120px); margin-right: 0; } .c-form fieldset.form-columns-2 { display: flex; gap: 16px; } .c-form fieldset.form-columns-2 .field.hs-form-field { flex: 1; float: none; } .c-form fieldset.form-columns-2 .field.hs-form-field > label { flex: 1 15%; } .c-form fieldset.form-columns-2 .field.hs-form-field > .input { flex: 1 85%; margin-right: 0; } .c-form fieldset.form-columns-1 .hs_personal_information.field.hs-form-field { row-gap: 0; font-size: 14px; line-height: 1.5; text-align: left; } .c-form fieldset.form-columns-1 .hs_personal_information.field.hs-form-field a { text-decoration: underline; } .c-form fieldset.form-columns-1 .hs_personal_information.field.hs-form-field a:hover { text-decoration: none; } .c-form .input { margin-left: auto; } .c-form .input:has(> select) { position: relative; } .c-form .input:has(> select)::after { position: absolute; inset: 0 10px 0 auto; width: 0; height: 0; margin: auto; content: ""; border-style: solid; border-top: 7px solid currentcolor; border-right: 4px solid transparent; border-bottom: 0; border-left: 4px solid transparent; } .c-form .input:has(> .inputs-list) { flex: auto !important; width: 100%; margin-top: 16px; margin-left: 0; line-height: 2; text-align: center; } .c-form .input:has(> .inputs-list) [type=checkbox] { position: relative; width: 16px; height: 16px; margin-right: 4px; vertical-align: -0.1em; background: #fff; border: solid 1px #222; border-radius: 3px; } .c-form .input:has(> .inputs-list) [type=checkbox] + span { position: relative; } .c-form .input:has(> .inputs-list) [type=checkbox] + span::after { position: absolute; inset: 0; display: block; width: 10px; height: 6px; margin-top: 5px; margin-left: -17px; color: #222; content: ""; border-bottom: solid 2px currentcolor; border-left: solid 2px currentcolor; opacity: 0; transform: rotate(-45deg); } .c-form .input:has(> .inputs-list) [type=checkbox]:checked + span::after { opacity: 1; } .c-form .input:has(> .inputs-list) + .hs-error-msgs { width: 100%; text-align: center; } .c-form .input > input, .c-form .input > select, .c-form .input > .hs-dateinput { width: 100% !important; height: 30px; padding: 6px 10px; font-size: 14px; text-align: left; background-color: #fff; border: 1px solid #222; border-radius: 3px; } .c-form .input > input::-moz-placeholder, .c-form .input > select::-moz-placeholder, .c-form .input > .hs-dateinput::-moz-placeholder { font-size: 14px; color: #b7b7b7; } .c-form .input > input::placeholder, .c-form .input > select::placeholder, .c-form .input > .hs-dateinput::placeholder { font-size: 14px; color: #b7b7b7; } .c-form .hs-form-required { color: #f00; } .c-form .hs-error-msgs.inputs-list { margin-left: auto; font-size: 12px; color: #f00; text-align: left; } .c-form .hs_error_rollup .hs-error-msgs.inputs-list { margin-top: 8px; text-align: center; } .c-form .hs-button { width: 292px; height: 80px; margin-top: 16px; font-family: "Noto Serif JP", "Avenir", "Helvetica Neue", "Helvetica", "Arial", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", "ＭＳＰ明朝", "MS PMincho", serif; font-size: 18px; font-weight: 900; color: #fff; text-align: center; letter-spacing: 0.08em; cursor: pointer; background: linear-gradient(85.43deg, #540000 -10.43%, #e92400 105.71%); box-shadow: 0 4px 20px 10px rgba(32, 41, 51, 0.1); } .c-form .hs-button:hover { opacity: 0.7; transition: opacity 0.2s ease-in-out; } .c-title { position: relative; padding-top: 40px; font-family: "Noto Serif JP", "Avenir", "Helvetica Neue", "Helvetica", "Arial", "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "Yu Mincho Light", "YuMincho", "Yu Mincho", "游明朝体", "ＭＳＰ明朝", "MS PMincho", serif; font-size: 40px; font-weight: 900; line-height: 1.5; text-align: center; } .c-title::before { position: absolute; inset: 0 0 auto; display: block; width: 24px; height: 1px; margin: auto; content: ""; background-color: #957500; } .c-title.-white { color: #fff; } .c-title.-navy { padding-top: 0; font-size: 24px; color: #2c387f; } .c-title.-navy::before { content: none; } .hs_shogaishubetsu_new legend { width: 100%; order: 4; margin-left: 0 !important; } .hs_shogaishubetsu_new .hs-error-msgs { width: 100%; } .hs_shogaishubetsu_new .hs-error-msgs label { display: block; text-align: right; } /**** utility ****/ /* PC/SP表示切り替え ---------------------------------------------------------------------------- */ .u-md-only { display: none !important; } .u-md-hidden { display: block !important; } .u-text-center { text-align: center; } .u-clearfix::after { content: ""; display: block; clear: both; } @media screen and (max-width: 768px){ body { min-width: auto; } img { width: 100%; height: auto; } .l-header__inner { padding: 18px 20px; } .l-header__logo > a > img { width: 168px; height: 34px; } .l-header__logo > a > span { font-size: 12px; line-height: 1.3; } .l-footer__company { padding-top: 20px } .l-footer__company-logo { width: 48px; margin-right: 10px; } .l-footer__company-name { padding-top: 20px; font-size: 16px; } .l-footer__company-desc { clear: left; margin-top: 30px; } .l-footer__privacy a { display: block; width: 45px; } .l-footer__privacy p { width: calc(100% - 45px - 10px); font-size: 13px; line-height: 1.5; } .l-section { padding: 40px 20px 80px; } .l-container { padding: 0 16px; } .p-top-about__lead, .p-top-achievements__lead, .p-top-support__lead { margin-top: 24px; } .p-top-achievements__table, .p-top-ex__table { font-size: 14px; } .p-top-achievements__table th, .p-top-ex__table th, .p-top-achievements__table td, .p-top-ex__table td { padding: 8px; } .p-top-ex__table th, .p-top-ex__table td { padding: 10px 0 0; } .p-top-achievements__item--body { width: 100%; padding: 0; } .p-top-achievements__table { margin-left: auto; margin-right: auto; /* width: 100%; */ width: auto; } .p-top-achievements__table th, .p-top-achievements__table td { padding: 10px 0 0; } .p-top-achievements__table th { width: 3em; } .p-top-achievements__table td:nth-child(2) { padding-right: .5em; } .p-top-mv { height: 370px; min-height: 100%; padding: 24px 20px 10px; background: url("../images/mv-sp.jpg") no-repeat center top -70px/cover; } .p-top-mv__inner { max-width: 400px; } .p-top-mv__contents { margin-top: 0; } .p-top-mv__lead { margin-top: 60px; font-size: 28px; } .p-top-mv__text { margin-top: 6px; font-size: 16px; } .p-top-mv__list { flex-wrap: wrap; gap: 14px; justify-content: center; width: 100%; } .p-top-mv__item:first-child .p-top-mv__item--text1 { font-size: 10px; } .p-top-mv__item { flex: 0 1 156px; width: 156px; height: 55px; } .p-top-mv__item::before { width: 24px; height: 55px; } .p-top-mv__item::after { width: 24px; height: 55px; } .p-top-mv__item--text1 { font-size: 14px; } .p-top-mv__item--text3 { margin-top: 6px; font-size: 14px; } .p-top-mv__item--text3 > span { font-size: 18px; } .p-top-company { padding: 16px 0; } .p-top-company__item { margin: 0 30px; } .p-top-ex { padding-right: 0; padding-left: 0; } .p-top-ex__slider { width: 100%; min-height: 340px; margin-top: 40px; text-align: center; } .p-top-ex__button { position: relative; display: inline-flex; margin-top: 24px; } .p-top-ex__button.-prev { margin-right: 13px; } .p-top-ex__item { display: flex; flex-direction: column; /* justify-content: center; */ max-width: 400px; padding: 24px; } .p-top-ex__head { gap: 8px; font-size: 16px; } .p-top-ex__table { /* margin-top: 24px; */ margin-top: 0; margin-left: 0; width: auto; margin-right: auto; margin-left: auto; } .p-top-support__list { flex-direction: column; gap: 24px; align-items: center; max-width: 960px; margin-top: 40px; } .p-top-support__item { max-width: 400px; border-radius: 8px; } .p-top-support__item--thumb { height: 188px; } .p-top-support__item--thumb > img { -o-object-fit: cover; object-fit: cover; } .p-top-support__item--body { padding: 24px 20px; } .p-top-support__item--title { line-height: 1; } .p-top-support__item--text { font-size: 16px; } .p-top-achievements__list { align-items: center; margin-top: 40px; } .p-top-achievements__item { width: 100%; max-width: 400px; padding: 32px 20px; } .p-top-achievements__item--contents { flex-direction: column; align-items: center; } .p-top-achievements__item--head { flex-direction: column-reverse; gap: 16px; align-items: flex-start; } /* .p-top-achievements__item:last-child .p-top-achievements__item--contents { gap: 0; } .p-top-achievements__item:last-child .p-top-achievements__item--contents .p-top-achievements__persona { padding-left: 8px; } .p-top-achievements__item:last-child .p-top-achievements__item--contents .p-top-achievements__button { margin-top: 18px; } */ .p-top-achievements__item--open { flex-direction: column; gap: 16px; margin-top: 20px; } .p-top-achievements__item--before > p + p, .p-top-achievements__item--after > p + p { font-size: 14px; } .p-top-achievements__persona { display: flex; gap: 16px; align-items: center; justify-content: center; } .p-top-achievements__raise { margin-top: 0; } .p-top-achievements__table { background-position: top 6px left 76px; } .p-top-achievements__table td { font-size: 14px; } .p-top-achievements__table th:nth-of-type(2) { /* padding-left: 18px; */ } .p-top-achievements__button { /* position: inherit; */ width: 100%; /* margin-top: 10px; */ } .p-top-about { background-color: #263145 !important; } .p-top-about::before { content: none; } .p-top-about__list { flex-direction: column; gap: 9px; margin-top: 25px; } /* .p-top-about__item > svg { width: 150px; height: 150px; } */ .p-top-about__item img { width: 180px; } .p-top-about__item > h3 { margin-top: 9px; } .p-top-about__item > p { margin-top: 16px; font-size: 14px; line-height: 2; } .p-top-flow { padding-bottom: 0; } .p-top-flow__list { gap: 8px; margin-top: 40px; } .p-top-flow__item { padding: 16px 16px 16px 56px; } .p-top-flow__item::before { inset: 11px auto auto 18px; font-size: 28px; } .p-top-flow__item--title { font-size: 20px; } .p-top-flow__item--text.-color, .p-top-flow__item--list.-color { margin-left: -60px; } .p-top-flow__item--text { margin-top: 20px; } .p-top-flow__message { margin-right: -10px; margin-left: -10px; height: 40vw; background-size: 32% auto; } .p-top-flow__message-text { margin-top: -10px; margin-right: 34%; padding: 10px 15px; font-size: 16px; } .p-top-faq__list { gap: 8px; margin-top: 40px; } .p-top-faq__item { padding: 16px 20px; } .p-top-faq__item--q { font-size: 16px; } .p-top-faq__item--q::before { inset: -4px auto auto 0; } .p-top-faq__cross { inset: 0 0 auto auto; } .p-top-faq__item--a { padding-right: 0; font-size: 14px; } .p-top-link { gap: 16px; padding: 40px 20px; } .p-top-link__title { font-size: 16px; line-height: 1.5; } .p-top-link__banner { width: 201px; } .c-form { width: 100%; margin-top: 0; background-color: transparent; border-radius: 0; } .c-form__inner { width: 100%; max-width: 390px; padding: 0; } .c-form__inner fieldset.form-columns-1 .field.hs-form-field > label + .hs-field-desc { margin-left: 0; } .c-title { font-size: 32px; } .p-contact-completion .l-container { padding: 0; } .p-contact-completion__text .c-link-line img { height: 36px; } .u-md-only { display: block !important; } .u-md-hidden { display: none !important; } } /* TOKYO PRO Market logo */ .certification-section { display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 2rem; margin-bottom: 2rem; max-width: 1000px; margin-left: auto; margin-right: auto; } .certification-column { flex: 1; margin: 0 1rem; min-width: 300px; display: flex; flex-direction: column; } .certification-item { flex: 1; display: flex; align-items: center; justify-content: center; text-align: center; padding: 1rem; background-color: #ffffff; /* 背景色を白に設定 */ border: 1px solid #ddd; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* 軽い影を追加 */ } .certification-item img { width: 80px; height: auto; margin-right: 1rem; } .pmark-logo img{ padding: 0.5rem 0px 0.5rem 0px; } .pmark-text p{ margin-left: 1rem !important; } .certification-item p { font-size: 0.8rem; color: #333; margin: 0; padding: 0; text-align: left; } @media screen and (max-width: 768px) { .certification-section { flex-direction: column; } .certification-column { margin-bottom: 1rem; } .certification-item { justify-content: left; } .pmark-logo img{ padding: 0.5rem 0 0.5rem 0; } .pmark-text p{ margin-left: 1rem !important; } .tosho-logo img{ width: 50px; } .tosho-text p{ margin-left: 0.5rem !important; } } /* TOKYO PRO Market logo END */