/*** 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) */ ul { list-style: none; } /* Firefox: solve issue where nested ordered lists continue numbering from parent (https://bugzilla.mozilla.org/show_bug.cgi?id=1881517) */ /* 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 */ /* Safari - solving issue when using user-select:none on the text input doesn't working */ input { -webkit-user-select: auto; } /* revert the 'white-space' property for textarea elements on Safari */ /* minimum style to allow to style meter element */ /* preformatted text - use only for this feature */ /* reset default text opacity of input placeholder */ ::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; } /* --------------------------------------------------------- * * Sass Variables * *--------------------------------------------------------- */ /* --------------------------------------------------------- * * Media query * *--------------------------------------------------------- */ /* --------------------------------------------------------- * * Responsive size * *--------------------------------------------------------- */ /* --------------------------------------------------------- * * Text * *--------------------------------------------------------- */ :root { --black: #000; --white: #fff; --primary: #6e46e7; --accent: #fb3bae; --accent-02: #ffff9f; --note: #ed4648; --gray: #a2a1b7; --text-white: #fff; --challenge: #ff61c6; --challenge-light: #ffb9e3; --u20: #00d227; --u20-light: #8fed97; --veteran: #994fff; --veteran-light: #ccabff; --solo: #26b2ff; --solo-light: #99dbff; --collaboration: #ff8a4a; --collaboration-light: #ffba9b; --top100: #fb0; --top100-light: #ffe074; --bg-01: #eef; --bg-02: #bfc1ff; --bg-03: #fff; --bg-04: #ffff9f; --bg-05: #a9a6ff; --btn-height: 64; --btn-width: 265; --btn-size: 16; --btn-color: var(--body-color); --btn-bg-color: var(--white); --btn-white: #fff; --btn-accent: #82ffdb; --btn-border-color: #27263a; --btn-icon-color: #eeeef4; --btn-disable: #6d6daa; --btn-shadow-color: #ddddec; --btn-shadow-width: 8px; --tab-height: 56; --ttl-page-spacing: 32; --ttl-earth-spacing: 16; --ff-base: "Noto Sans JP", "Noto Sans", sans-serif; --ff-02: "Dela Gothic One", serif; --ff-03: "M PLUS 1p", serif; --body-color: #27263a; --link-color: #9443ff; --hover-opacity: 0.5; --zindex-sticky: 1020; --zindex-fixed: 1030; --zindex-modal: 1055; --gutter: 24; --base-width: 375; --vw-per-px: calc(100vw / var(--base-width)); --header-height: 60; --global-nav-height: 48; --footer-spacing: 40; } @media screen and (min-width: 648px) { :root { --gutter: 20; --base-width: 648; --footer-spacing: 48; } } @media screen and (min-width: 951px) { :root { --btn-width: 326; --btn-height: 72; --btn-size: 20; --gutter: 40; --base-width: 1200; --header-height: 61; --global-nav-height: 48; --footer-spacing: 64; } }/* --------------------------------------------------------- * * Sass Variables * *--------------------------------------------------------- */ /* --------------------------------------------------------- * * Media query * *--------------------------------------------------------- */ /* --------------------------------------------------------- * * Responsive size * *--------------------------------------------------------- */ /* --------------------------------------------------------- * * Text * *--------------------------------------------------------- */ html { height: 100%; } body { height: 100%; margin-top: calc(min(var(--header-height) * var(--vw-per-px), var(--header-height) * 1px) + min(var(--global-nav-height) * var(--vw-per-px), var(--global-nav-height) * 1px)); font-family: var(--ff-base); font-size: min(16 * var(--vw-per-px), 16 * 1px); font-weight: 500; line-height: 1.5; color: var(--body-color); background-color: #fff; } img, svg { height: auto; vertical-align: middle; } /* --------------------------------------------------------- * * .container * *--------------------------------------------------------- */ .container { max-width: min(var(--base-width) * var(--vw-per-px), var(--base-width) * 1px); padding-right: min(var(--gutter) * var(--vw-per-px), var(--gutter) * 1px); padding-left: min(var(--gutter) * var(--vw-per-px), var(--gutter) * 1px); margin-right: auto; margin-left: auto; } /* --------------------------------------------------------- * * .Main * *--------------------------------------------------------- */ .main { background: var(--bg-01) url("../../assets/images/bg-De4gnNN0.png") center/744px 744px repeat; } /* --------------------------------------------------------- * * .Text Character * *--------------------------------------------------------- */ .char { width: min(44 * var(--vw-per-px), 44 * 1px); height: min(44 * var(--vw-per-px), 44 * 1px); } @media screen and (min-width: 648px) { .char { width: min(48 * var(--vw-per-px), 48 * 1px); height: min(48 * var(--vw-per-px), 48 * 1px); } } @media screen and (min-width: 951px) { .char { width: min(106 * var(--vw-per-px), 106 * 1px); height: min(106 * var(--vw-per-px), 106 * 1px); } } /* --------------------------------------------------------- * * .Animation * *--------------------------------------------------------- */ @keyframes anime { 50% { opacity: 0; } 50.01% { opacity: 1; } } @keyframes anime { 50% { opacity: 0; } 100% { opacity: 1; } } .animated { animation-name: anime; animation-duration: 1s; animation-timing-function: steps(1); animation-iteration-count: infinite; animation-fill-mode: both; } .animated-2 { animation-direction: reverse; } /* --------------------------------------------------------- * * Title * *--------------------------------------------------------- */ .ttl-earth-img { width: auto; height: min(129 * var(--vw-per-px), 129 * 1px); } @media screen and (min-width: 951px) { .ttl-earth-img { height: min(199 * var(--vw-per-px), 199 * 1px); } } /* --------------------------------------------------------- * * .Category * *--------------------------------------------------------- */ .main-category { padding-bottom: min(32 * var(--vw-per-px), 32 * 1px); background: url("../../../images/home/category-bg.svg") center min(116 * var(--vw-per-px), 116 * 1px)/100% auto repeat; } @media screen and (max-width: 647.98px) { .main-category { --gutter: 16; } } @media screen and (min-width: 648px) { .main-category { padding-bottom: min(48 * var(--vw-per-px), 48 * 1px); background-size: 50% auto; } } @media screen and (min-width: 951px) { .main-category { padding-bottom: min(64 * var(--vw-per-px), 64 * 1px); background-size: min(384 * var(--vw-per-px), 384 * 1px) min(256 * var(--vw-per-px), 256 * 1px); } } .main-category .section a { color: var(--primary); text-decoration: underline; } .main-category .section a:hover { text-decoration: none; } @media screen and (min-width: 951px) { .main-category .notice-block { margin-bottom: min(40 * var(--vw-per-px), 40 * 1px); } } .main-category .list-icon > li { margin-bottom: min(6 * var(--vw-per-px), 6 * 1px); } .ct-small { font-size: min(13 * var(--vw-per-px), 13 * 1px); line-height: 1.3846153846; letter-spacing: 0.04em; } @media screen and (min-width: 951px) { .ct-small { font-size: min(14 * var(--vw-per-px), 14 * 1px); line-height: 1.7; } } .ct-small-ex { font-size: min(12 * var(--vw-per-px), 12 * 1px); line-height: 1.5; letter-spacing: 0.04em; } @media screen and (min-width: 951px) { .ct-small-ex { font-size: min(13 * var(--vw-per-px), 13 * 1px); line-height: 1.5; } } .ct-small-ex-sm { font-size: min(12 * var(--vw-per-px), 12 * 1px); line-height: 1.5; letter-spacing: 0.04em; } .ct-caution { margin-bottom: min(24 * var(--vw-per-px), 24 * 1px); font-size: min(18 * var(--vw-per-px), 18 * 1px); font-weight: 900; line-height: 1.4; color: var(--accent); text-align: center; letter-spacing: 0.04em; } @media screen and (min-width: 951px) { .ct-caution { margin-bottom: min(10 * var(--vw-per-px), 10 * 1px); text-align: left; } } .ct-caution-small { margin-bottom: min(10 * var(--vw-per-px), 10 * 1px); font-size: min(14 * var(--vw-per-px), 14 * 1px); font-weight: 900; line-height: 1.7; color: var(--accent); letter-spacing: 0.04em; } .ct-note { margin-bottom: min(16 * var(--vw-per-px), 16 * 1px); font-size: min(14 * var(--vw-per-px), 14 * 1px); font-weight: 700; line-height: 1.7; color: var(--note); letter-spacing: 0.04em; } @media screen and (min-width: 951px) { .ct-note { font-size: min(16 * var(--vw-per-px), 16 * 1px); line-height: 1.6; } } .ct-heading { margin-bottom: min(16 * var(--vw-per-px), 16 * 1px); font-size: min(18 * var(--vw-per-px), 18 * 1px); font-weight: 900; line-height: 1.4; letter-spacing: 0.04em; } .ct-important { display: block; padding: min(8 * var(--vw-per-px), 8 * 1px); font-size: min(14 * var(--vw-per-px), 14 * 1px); font-weight: 700; line-height: 1.7; color: #fff; letter-spacing: 0.04em; background-color: var(--note); } @media screen and (min-width: 951px) { .ct-important { padding: min(8 * var(--vw-per-px), 8 * 1px) min(16 * var(--vw-per-px), 16 * 1px); font-size: min(16 * var(--vw-per-px), 16 * 1px); line-height: 1.6; } } .ct-target-list { line-height: 1.5; } @media screen and (min-width: 951px) { .ct-target-list { line-height: 1.7; } } .ct-schedule-wrap { font-size: min(12 * var(--vw-per-px), 12 * 1px); font-weight: 900; line-height: 1.4; text-align: center; letter-spacing: 0.04em; } @media screen and (min-width: 951px) { .ct-schedule-wrap { padding: min(4 * var(--vw-per-px), 4 * 1px) 0; font-size: min(14 * var(--vw-per-px), 14 * 1px); line-height: 1.6; text-align: left; } } .ct-schedule { font-size: min(24 * var(--vw-per-px), 24 * 1px); font-weight: 900; line-height: 1.4; letter-spacing: 0.04em; } .ct-schedule-between { margin-right: 0.25em; margin-left: 0.25em; } .ct-ranking-row { display: flex; flex-direction: column; gap: min(45 * var(--vw-per-px), 45 * 1px); justify-content: center; text-align: center; } @media screen and (min-width: 951px) { .ct-ranking-row { flex-direction: row; gap: min(96 * var(--vw-per-px), 96 * 1px); } .ct-ranking-row .ct-ranking-heading { min-width: min(226 * var(--vw-per-px), 226 * 1px); } } @media screen and (min-width: 951px) { .ct-ranking-row-item .ct-ranking-heading { min-width: min(201 * var(--vw-per-px), 201 * 1px); } } .ct-ranking-items { display: flex; flex-direction: column; gap: min(18 * var(--vw-per-px), 18 * 1px); justify-content: center; text-align: center; } @media screen and (min-width: 951px) { .ct-ranking-items { flex-direction: row; gap: min(0 * var(--vw-per-px), 0 * 1px); padding: 0 min(50 * var(--vw-per-px), 50 * 1px); } } @media screen and (min-width: 951px) { .ct-ranking-item { position: relative; flex: 1; } .ct-ranking-item:not(:first-child)::before { position: absolute; top: 0; left: 0; width: 1px; height: min(74 * var(--vw-per-px), 74 * 1px); content: ""; background: var(--bg-05); } } .ct-hr { margin: min(32 * var(--vw-per-px), 32 * 1px) 0; border: 0; border-top: 2px solid var(--bg-05); } .ct-box { padding: 0 min(16 * var(--vw-per-px), 16 * 1px); } @media screen and (min-width: 648px) { .ct-box { padding: 0 min(8 * var(--vw-per-px), 8 * 1px); } } @media screen and (min-width: 951px) { .ct-box { padding: 0; } } @media screen and (min-width: 648px) { .ct-box-02 { padding: 0 min(8 * var(--vw-per-px), 8 * 1px); } } @media screen and (min-width: 951px) { .ct-box-02 { padding: 0; } } .ct-mb-lg { margin-bottom: min(48 * var(--vw-per-px), 48 * 1px); } .ct-mb-md { margin-bottom: min(32 * var(--vw-per-px), 32 * 1px); } .ct-mb { margin-bottom: min(16 * var(--vw-per-px), 16 * 1px); } .ct-mb-half { margin-bottom: min(8 * var(--vw-per-px), 8 * 1px); } .ct-ranking-wrap { margin-top: min(40 * var(--vw-per-px), 40 * 1px); } @media screen and (min-width: 951px) { .ct-ranking-wrap { margin-top: min(24 * var(--vw-per-px), 24 * 1px); } } /* --------------------------------------------------------- * * .notice * *--------------------------------------------------------- */ .notice-block { display: flex; flex-direction: column; gap: min(16 * var(--vw-per-px), 16 * 1px); width: 100%; padding: min(16 * var(--vw-per-px), 16 * 1px); margin-bottom: min(24 * var(--vw-per-px), 24 * 1px); text-align: center; background-color: #fff; border-radius: min(16 * var(--vw-per-px), 16 * 1px); } .notice-text { font-size: min(14 * var(--vw-per-px), 14 * 1px); font-weight: 700; line-height: 1.6; letter-spacing: 0.04em; } @media screen and (min-width: 648px) { .notice-text { font-size: min(16 * var(--vw-per-px), 16 * 1px); line-height: 1.5; } } .notice-lead { font-size: min(16 * var(--vw-per-px), 16 * 1px); font-weight: 700; line-height: 1.5; letter-spacing: 0.04em; } @media screen and (min-width: 648px) { .notice-lead { font-size: min(18 * var(--vw-per-px), 18 * 1px); line-height: 1.4; } } .notice-link { display: inline-flex; align-items: center; margin-top: min(8 * var(--vw-per-px), 8 * 1px); font-size: min(14 * var(--vw-per-px), 14 * 1px); font-weight: 700; line-height: 1.6; color: var(--link-color); text-decoration: underline; letter-spacing: 0.04em; } .notice-link:hover { text-decoration: none; } /* --------------------------------------------------------- * * Fancybox * *--------------------------------------------------------- */ body .fancybox__container { --fancybox-zIndex: calc(var(--zindex-modal) - 1); --fancybox-bg: rgb(0 0 0 / 50%); } body .is-compact .fancybox__content > .f-button.is-close-btn, body .fancybox__content > .f-button.is-close-btn { --f-button-bg: #fff; --f-button-hover-bg: var(--bg-01); --f-button-active-bg: var(--link-color); --f-button-border-radius: 100%; --f-button-width: 56px; --f-button-height: 56px; --f-button-svg-width: 20px; --f-button-svg-height: 20px; top: -64px; right: 0; border: 3px solid var(--body-color); opacity: 1; } body .fancybox__container:not(.is-compact) .fancybox__slide.has-close-btn, body .fancybox__container .fancybox__slide.has-close-btn { padding: 68px min(var(--gutter) * var(--vw-per-px), var(--gutter) * 1px) 54px; } @media screen and (min-width: 951px) { body .fancybox__container:not(.is-compact) .fancybox__slide.has-close-btn, body .fancybox__container .fancybox__slide.has-close-btn { padding: 159px min(var(--gutter) * var(--vw-per-px), var(--gutter) * 1px) 95px; } } body .f-button svg { stroke: var(--body-color); } html.with-fancybox .header { padding-right: calc(var(--fancybox-body-margin, 0px) + var(--fancybox-scrollbar-compensate, 0px)); } /* --------------------------------------------------------- * * Modal * *--------------------------------------------------------- */ body .modal { position: relative; display: none; width: 100%; max-height: 100%; padding: 0; background: var(--bg-01) url("../../assets/images/bg-De4gnNN0.png") center/744px 744px repeat; border-radius: min(16 * var(--vw-per-px), 16 * 1px); box-shadow: 0 4px 16px 8px rgba(0, 0, 0, 0.25); } @media screen and (min-width: 648px) { body .modal { max-width: min(608 * var(--vw-per-px), 608 * 1px); } } @media screen and (min-width: 951px) { body .modal { max-width: min(1120 * var(--vw-per-px), 1120 * 1px); } } body .modal-container { position: relative; padding: min(40 * var(--vw-per-px), 40 * 1px) 0; overflow: hidden auto; border-radius: min(16 * var(--vw-per-px), 16 * 1px); } @media screen and (min-width: 951px) { body .modal-container { padding: min(64 * var(--vw-per-px), 64 * 1px) 0; } } body .modal-ttl { margin-bottom: min(18 * var(--vw-per-px), 18 * 1px); text-align: center; } body .modal-ttl-img { width: auto; height: min(87 * var(--vw-per-px), 87 * 1px); } @media screen and (min-width: 648px) { body .modal-ttl-img { height: min(51 * var(--vw-per-px), 51 * 1px); } } body .modal-ttl-img-02 { width: auto; height: min(86 * var(--vw-per-px), 86 * 1px); } @media screen and (min-width: 648px) { body .modal-ttl-img-02 { height: min(83 * var(--vw-per-px), 83 * 1px); } } /* --------------------------------------------------------- * * Card * *--------------------------------------------------------- */ .card-ranking-list { display: flex; flex-wrap: wrap; gap: min(16 * var(--vw-per-px), 16 * 1px); counter-reset: card-ranking; } @media screen and (min-width: 648px) { .card-ranking-list { justify-content: center; } .card-ranking-list:not(:empty) { padding-top: min(8 * var(--vw-per-px), 8 * 1px); } } @media screen and (min-width: 951px) { .card-ranking-list { gap: min(32 * var(--vw-per-px), 32 * 1px) min(16 * var(--vw-per-px), 16 * 1px); } .card-ranking-list:not(:empty) { padding-top: min(24 * var(--vw-per-px), 24 * 1px); } } .card-ranking-list-item { width: calc(50% - min(8 * var(--vw-per-px), 8 * 1px)); } @media screen and (min-width: 648px) { .card-ranking-list-item { width: calc(33.33333% - min(11 * var(--vw-per-px), 11 * 1px)); } } @media screen and (min-width: 951px) { .card-ranking-list-item { width: calc(20% - min(13 * var(--vw-per-px), 13 * 1px)); } } .card-ranking-list-item:nth-child(1) { width: 100%; } @media screen and (min-width: 648px) { .card-ranking-list-item:nth-child(1) { margin-bottom: min(8 * var(--vw-per-px), 8 * 1px); } .card-ranking-list-home .card-ranking-list-item:nth-child(1) { margin-bottom: 0; } } @media screen and (min-width: 951px) { .card-ranking-list-item:nth-child(1) { width: calc(33.33333% - min(16 * var(--vw-per-px), 16 * 1px)); } } .card-ranking-list-item:nth-child(2), .card-ranking-list-item:nth-child(3) { width: 100%; } @media screen and (min-width: 648px) { .card-ranking-list-item:nth-child(2), .card-ranking-list-item:nth-child(3) { width: calc(50% - min(8 * var(--vw-per-px), 8 * 1px)); margin-bottom: min(8 * var(--vw-per-px), 8 * 1px); } .card-ranking-list-home .card-ranking-list-item:nth-child(2), .card-ranking-list-home .card-ranking-list-item:nth-child(3) { margin-bottom: 0; } } @media screen and (min-width: 951px) { .card-ranking-list-item:nth-child(2), .card-ranking-list-item:nth-child(3) { width: calc(33.33333% - min(16 * var(--vw-per-px), 16 * 1px)); } } @media screen and (min-width: 951px) { .card-ranking-list-item:nth-child(2) { margin-right: min(8 * var(--vw-per-px), 8 * 1px); margin-left: min(8 * var(--vw-per-px), 8 * 1px); } .card-ranking-list-home .card-ranking-list-item:nth-child(2) { margin: 0; } } .card-ranking-list-home .card-ranking-list-item { width: 100%; } @media screen and (min-width: 951px) { .card-ranking-list-home .card-ranking-list-item { width: calc(20% - min(13 * var(--vw-per-px), 13 * 1px)); } } .card-ranking-list-home:not(:empty) { margin-bottom: min(32 * var(--vw-per-px), 32 * 1px); } @media screen and (min-width: 648px) { .card-ranking-list-home:not(:empty) { gap: min(16 * var(--vw-per-px), 16 * 1px); padding-top: 0; } } .card-ranking-item { position: relative; height: 100%; transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, transform 0.15s ease-in-out; } @media screen and (min-width: 648px) { .card-ranking-list-item:nth-child(1) .card-ranking-item { width: calc(50% - min(16 * var(--vw-per-px), 16 * 1px)); margin: 0 auto; } } @media screen and (min-width: 951px) { .card-ranking-list-item:nth-child(1) .card-ranking-item { width: 100%; margin: 0; } } .card-ranking-list-home .card-ranking-list-item:nth-child(1) .card-ranking-item { width: 100%; margin: 0; } .card-ranking-item:hover:has(a) { transform: translateY(4px); } .card-ranking-item::before { content: ""; background: url("data:image/png;base64,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") center/contain no-repeat; display: flex; align-items: center; justify-content: center; text-align: center; position: absolute; padding-bottom: min(2 * var(--vw-per-px), 2 * 1px); width: min(42 * var(--vw-per-px), 42 * 1px); height: min(42 * var(--vw-per-px), 42 * 1px); left: -11px; top: -6px; } @media screen and (min-width: 648px) { .card-ranking-item::before { width: min(52 * var(--vw-per-px), 52 * 1px); height: min(52 * var(--vw-per-px), 52 * 1px); left: -12px; top: -8px; } } @media screen and (min-width: 951px) { .card-ranking-item::before { padding: 0 min(2 * var(--vw-per-px), 2 * 1px) min(4 * var(--vw-per-px), 4 * 1px) 0; } } @media screen and (min-width: 648px) { .card-ranking-list-home .card-ranking-item::before { width: min(42 * var(--vw-per-px), 42 * 1px); height: min(42 * var(--vw-per-px), 42 * 1px); } } @media screen and (min-width: 951px) { .card-ranking-list-home .card-ranking-item::before { width: min(52 * var(--vw-per-px), 52 * 1px); height: min(52 * var(--vw-per-px), 52 * 1px); } } .card-ranking-list-item:nth-child(1) .card-ranking-item::before, .card-ranking-list-item:nth-child(2) .card-ranking-item::before, .card-ranking-list-item:nth-child(3) .card-ranking-item::before { padding-bottom: min(12 * var(--vw-per-px), 12 * 1px); padding-right: min(9 * var(--vw-per-px), 9 * 1px); width: min(76 * var(--vw-per-px), 76 * 1px); height: min(76 * var(--vw-per-px), 76 * 1px); } @media screen and (min-width: 648px) { .card-ranking-list-item:nth-child(1) .card-ranking-item::before, .card-ranking-list-item:nth-child(2) .card-ranking-item::before, .card-ranking-list-item:nth-child(3) .card-ranking-item::before { padding-bottom: min(9 * var(--vw-per-px), 9 * 1px); padding-right: min(8 * var(--vw-per-px), 8 * 1px); width: min(56 * var(--vw-per-px), 56 * 1px); height: min(56 * var(--vw-per-px), 56 * 1px); } } @media screen and (min-width: 951px) { .card-ranking-list-item:nth-child(1) .card-ranking-item::before, .card-ranking-list-item:nth-child(2) .card-ranking-item::before, .card-ranking-list-item:nth-child(3) .card-ranking-item::before { padding-bottom: min(12 * var(--vw-per-px), 12 * 1px); padding-right: min(9 * var(--vw-per-px), 9 * 1px); width: min(76 * var(--vw-per-px), 76 * 1px); height: min(76 * var(--vw-per-px), 76 * 1px); } } .card-ranking-list-home .card-ranking-list-item:nth-child(1) .card-ranking-item::before, .card-ranking-list-home .card-ranking-list-item:nth-child(2) .card-ranking-item::before, .card-ranking-list-home .card-ranking-list-item:nth-child(3) .card-ranking-item::before { padding-bottom: min(7 * var(--vw-per-px), 7 * 1px); padding-right: min(6 * var(--vw-per-px), 6 * 1px); width: min(48 * var(--vw-per-px), 48 * 1px); height: min(48 * var(--vw-per-px), 48 * 1px); } @media screen and (min-width: 951px) { .card-ranking-list-home .card-ranking-list-item:nth-child(1) .card-ranking-item::before, .card-ranking-list-home .card-ranking-list-item:nth-child(2) .card-ranking-item::before, .card-ranking-list-home .card-ranking-list-item:nth-child(3) .card-ranking-item::before { padding-bottom: min(9 * var(--vw-per-px), 9 * 1px); padding-right: min(8 * var(--vw-per-px), 8 * 1px); width: min(56 * var(--vw-per-px), 56 * 1px); height: min(56 * var(--vw-per-px), 56 * 1px); } } .card-ranking-list-item:nth-child(1) .card-ranking-item::before, .card-ranking-list-item:nth-child(2) .card-ranking-item::before, .card-ranking-list-item:nth-child(3) .card-ranking-item::before { background-image: url("../../assets/images/ranking-num-01-bg-BT1YQAN-.png"); } .card-ranking-link { position: relative; display: block; width: 100%; height: 100%; text-decoration: none; background-color: #fff; border: 3px solid var(--body-color); border-radius: min(16 * var(--vw-per-px), 16 * 1px); box-shadow: 0 4px var(--bg-05); transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, transform 0.15s ease-in-out; } .card-ranking-link:hover:not(span) { box-shadow: 0 0 var(--bg-05); } @media screen and (max-width: 950.98px) { .card-ranking-list-home .card-ranking-link { display: flex; align-items: center; width: 100%; } } .card-ranking-num { background: url("../../assets/images/ranking-num-DLXLqz0k.png") center/contain no-repeat; display: flex; align-items: center; justify-content: center; text-align: center; position: absolute; padding-bottom: min(2 * var(--vw-per-px), 2 * 1px); width: min(42 * var(--vw-per-px), 42 * 1px); height: min(42 * var(--vw-per-px), 42 * 1px); left: -13px; top: -14px; } @media screen and (min-width: 648px) { .card-ranking-num { width: min(52 * var(--vw-per-px), 52 * 1px); height: min(52 * var(--vw-per-px), 52 * 1px); left: -14px; top: -14px; } } @media screen and (min-width: 951px) { .card-ranking-num { padding: 0 min(2 * var(--vw-per-px), 2 * 1px) min(4 * var(--vw-per-px), 4 * 1px) 0; } } @media screen and (min-width: 648px) { .card-ranking-list-home .card-ranking-num { width: min(42 * var(--vw-per-px), 42 * 1px); height: min(42 * var(--vw-per-px), 42 * 1px); } } @media screen and (min-width: 951px) { .card-ranking-list-home .card-ranking-num { width: min(52 * var(--vw-per-px), 52 * 1px); height: min(52 * var(--vw-per-px), 52 * 1px); } } .card-ranking-list-item:nth-child(1) .card-ranking-num, .card-ranking-list-item:nth-child(2) .card-ranking-num, .card-ranking-list-item:nth-child(3) .card-ranking-num { padding-bottom: min(12 * var(--vw-per-px), 12 * 1px); padding-right: min(9 * var(--vw-per-px), 9 * 1px); width: min(76 * var(--vw-per-px), 76 * 1px); height: min(76 * var(--vw-per-px), 76 * 1px); } @media screen and (min-width: 648px) { .card-ranking-list-item:nth-child(1) .card-ranking-num, .card-ranking-list-item:nth-child(2) .card-ranking-num, .card-ranking-list-item:nth-child(3) .card-ranking-num { padding-bottom: min(9 * var(--vw-per-px), 9 * 1px); padding-right: min(8 * var(--vw-per-px), 8 * 1px); width: min(56 * var(--vw-per-px), 56 * 1px); height: min(56 * var(--vw-per-px), 56 * 1px); } } @media screen and (min-width: 951px) { .card-ranking-list-item:nth-child(1) .card-ranking-num, .card-ranking-list-item:nth-child(2) .card-ranking-num, .card-ranking-list-item:nth-child(3) .card-ranking-num { padding-bottom: min(12 * var(--vw-per-px), 12 * 1px); padding-right: min(9 * var(--vw-per-px), 9 * 1px); width: min(76 * var(--vw-per-px), 76 * 1px); height: min(76 * var(--vw-per-px), 76 * 1px); } } .card-ranking-list-home .card-ranking-list-item:nth-child(1) .card-ranking-num, .card-ranking-list-home .card-ranking-list-item:nth-child(2) .card-ranking-num, .card-ranking-list-home .card-ranking-list-item:nth-child(3) .card-ranking-num { padding-bottom: min(7 * var(--vw-per-px), 7 * 1px); padding-right: min(6 * var(--vw-per-px), 6 * 1px); width: min(48 * var(--vw-per-px), 48 * 1px); height: min(48 * var(--vw-per-px), 48 * 1px); } @media screen and (min-width: 951px) { .card-ranking-list-home .card-ranking-list-item:nth-child(1) .card-ranking-num, .card-ranking-list-home .card-ranking-list-item:nth-child(2) .card-ranking-num, .card-ranking-list-home .card-ranking-list-item:nth-child(3) .card-ranking-num { padding-bottom: min(9 * var(--vw-per-px), 9 * 1px); padding-right: min(8 * var(--vw-per-px), 8 * 1px); width: min(56 * var(--vw-per-px), 56 * 1px); height: min(56 * var(--vw-per-px), 56 * 1px); } } .card-ranking-list-item:nth-child(1) .card-ranking-num { background-image: url("../../assets/images/ranking-num-01-D4fj204_.png"); } .card-ranking-list-item:nth-child(2) .card-ranking-num { background-image: url("../../assets/images/ranking-num-02-Cqh51QIi.png"); } .card-ranking-list-item:nth-child(3) .card-ranking-num { background-image: url("../../assets/images/ranking-num-03-i1kjo5Bm.png"); } .card-ranking-num::before { font-family: var(--ff-02); font-size: min(26 * var(--vw-per-px), 26 * 1px); font-weight: 400; line-height: 1; color: #fff; content: counter(card-ranking); counter-increment: card-ranking; } @media screen and (min-width: 648px) { .card-ranking-num::before { font-size: min(32 * var(--vw-per-px), 32 * 1px); } } @media screen and (min-width: 648px) { .card-ranking-list-home .card-ranking-num::before { font-size: min(26 * var(--vw-per-px), 26 * 1px); } } @media screen and (min-width: 951px) { .card-ranking-list-home .card-ranking-num::before { font-size: min(32 * var(--vw-per-px), 32 * 1px); } } .card-ranking-list-item:nth-child(1) .card-ranking-num::before, .card-ranking-list-item:nth-child(2) .card-ranking-num::before, .card-ranking-list-item:nth-child(3) .card-ranking-num::before { font-size: min(42 * var(--vw-per-px), 42 * 1px); } @media screen and (min-width: 648px) { .card-ranking-list-item:nth-child(1) .card-ranking-num::before, .card-ranking-list-item:nth-child(2) .card-ranking-num::before, .card-ranking-list-item:nth-child(3) .card-ranking-num::before { font-size: min(32 * var(--vw-per-px), 32 * 1px); } } @media screen and (min-width: 951px) { .card-ranking-list-item:nth-child(1) .card-ranking-num::before, .card-ranking-list-item:nth-child(2) .card-ranking-num::before, .card-ranking-list-item:nth-child(3) .card-ranking-num::before { font-size: min(42 * var(--vw-per-px), 42 * 1px); } } .card-ranking-list-home .card-ranking-list-item:nth-child(1) .card-ranking-num::before, .card-ranking-list-home .card-ranking-list-item:nth-child(2) .card-ranking-num::before, .card-ranking-list-home .card-ranking-list-item:nth-child(3) .card-ranking-num::before { font-size: min(28 * var(--vw-per-px), 28 * 1px); } @media screen and (min-width: 951px) { .card-ranking-list-home .card-ranking-list-item:nth-child(1) .card-ranking-num::before, .card-ranking-list-home .card-ranking-list-item:nth-child(2) .card-ranking-num::before, .card-ranking-list-home .card-ranking-list-item:nth-child(3) .card-ranking-num::before { font-size: min(32 * var(--vw-per-px), 32 * 1px); } } .card-ranking-list-item:nth-child(9) ~ .card-ranking-list-item .card-ranking-num::before { padding: min(6 * var(--vw-per-px), 6 * 1px) 0.07em 0 0; font-family: var(--ff-03); font-size: min(28 * var(--vw-per-px), 28 * 1px); font-weight: 900; letter-spacing: -0.07em; } .card-ranking-list-item:nth-child(100) .card-ranking-num::before { content: ""; } .card-ranking-list-item:nth-child(100) .card-ranking-num::after { position: absolute; top: 50%; left: 50%; width: 78%; height: 100%; content: ""; background: url("data:image/svg+xml,%3csvg%20width='40'%20height='21'%20viewBox='0%200%2040%2021'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M37.5273%2018.536C36.3818%2020.1787%2034.6327%2021%2032.2799%2021C29.9271%2021%2028.178%2020.1787%2027.0326%2018.536C25.8872%2016.8933%2025.3145%2014.2147%2025.3145%2010.5C25.3145%206.78533%2025.8872%204.10667%2027.0326%202.464C28.178%200.821333%2029.9271%200%2032.2799%200C34.6327%200%2036.3818%200.821333%2037.5273%202.464C38.6727%204.10667%2039.2454%206.78533%2039.2454%2010.5C39.2454%2014.2147%2038.6727%2016.8933%2037.5273%2018.536ZM30.585%2015.456C30.941%2016.352%2031.506%2016.8%2032.2799%2016.8C33.0539%2016.8%2033.6111%2016.352%2033.9516%2015.456C34.3077%2014.5413%2034.4857%2012.8893%2034.4857%2010.5C34.4857%208.11067%2034.3077%206.468%2033.9516%205.572C33.6111%204.65733%2033.0539%204.2%2032.2799%204.2C31.506%204.2%2030.941%204.65733%2030.585%205.572C30.2445%206.468%2030.0742%208.11067%2030.0742%2010.5C30.0742%2012.8893%2030.2445%2014.5413%2030.585%2015.456Z'%20fill='white'/%3e%3cpath%20d='M23.1288%2018.536C21.9834%2020.1787%2020.2343%2021%2017.8815%2021C15.5287%2021%2013.7796%2020.1787%2012.6342%2018.536C11.4887%2016.8933%2010.916%2014.2147%2010.916%2010.5C10.916%206.78533%2011.4887%204.10667%2012.6342%202.464C13.7796%200.821333%2015.5287%200%2017.8815%200C20.2343%200%2021.9834%200.821333%2023.1288%202.464C24.2742%204.10667%2024.847%206.78533%2024.847%2010.5C24.847%2014.2147%2024.2742%2016.8933%2023.1288%2018.536ZM16.1866%2015.456C16.5426%2016.352%2017.1075%2016.8%2017.8815%2016.8C18.6554%2016.8%2019.2127%2016.352%2019.5532%2015.456C19.9092%2014.5413%2020.0872%2012.8893%2020.0872%2010.5C20.0872%208.11067%2019.9092%206.468%2019.5532%205.572C19.2127%204.65733%2018.6554%204.2%2017.8815%204.2C17.1075%204.2%2016.5426%204.65733%2016.1866%205.572C15.846%206.468%2015.6758%208.11067%2015.6758%2010.5C15.6758%2012.8893%2015.846%2014.5413%2016.1866%2015.456Z'%20fill='white'/%3e%3cpath%20d='M4.87583%206.71979H4.85261L1.39309%2010.6398L0%205.87978L4.87583%200.279785H9.75166V20.7198H4.87583V6.71979Z'%20fill='white'/%3e%3c/svg%3e") center/contain no-repeat; transform: translate(-50%, -50%); } .card-ranking-image { aspect-ratio: 1.7777777778; overflow: hidden; background-color: var(--bg-01); border-top-left-radius: min(12 * var(--vw-per-px), 12 * 1px); border-top-right-radius: min(12 * var(--vw-per-px), 12 * 1px); } @media screen and (min-width: 951px) { .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(1) .card-ranking-image, .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(2) .card-ranking-image, .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(3) .card-ranking-image { aspect-ratio: 1.7326732673; } } @media screen and (max-width: 950.98px) { .card-ranking-list-home .card-ranking-image { flex: 0 0 min(160 * var(--vw-per-px), 160 * 1px); align-self: stretch; width: min(160 * var(--vw-per-px), 160 * 1px); aspect-ratio: 1.7777777778; border-top-left-radius: min(12 * var(--vw-per-px), 12 * 1px); border-top-right-radius: 0; border-bottom-left-radius: min(12 * var(--vw-per-px), 12 * 1px); } } .card-ranking-img { width: 100%; height: 100%; object-fit: cover; } .card-ranking-body { display: flex; flex-direction: column; gap: min(4 * var(--vw-per-px), 4 * 1px); width: 100%; min-width: 0; padding: min(12 * var(--vw-per-px), 12 * 1px) min(8 * var(--vw-per-px), 8 * 1px); } @media screen and (min-width: 648px) { .card-ranking-body { gap: min(8 * var(--vw-per-px), 8 * 1px); padding: min(12 * var(--vw-per-px), 12 * 1px); } } .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(1) .card-ranking-body, .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(2) .card-ranking-body, .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(3) .card-ranking-body { gap: min(8 * var(--vw-per-px), 8 * 1px); padding: min(12 * var(--vw-per-px), 12 * 1px); } @media screen and (min-width: 951px) { .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(1) .card-ranking-body, .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(2) .card-ranking-body, .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(3) .card-ranking-body { padding: min(16 * var(--vw-per-px), 16 * 1px); } } .card-ranking-list-home .card-ranking-body { gap: min(8 * var(--vw-per-px), 8 * 1px); } @media screen and (min-width: 648px) { .card-ranking-list-home .card-ranking-body { padding: min(12 * var(--vw-per-px), 12 * 1px) min(8 * var(--vw-per-px), 8 * 1px); } } @media screen and (min-width: 951px) { .card-ranking-list-home .card-ranking-body { padding: min(12 * var(--vw-per-px), 12 * 1px); } } .card-ranking-ttl { font-size: min(11 * var(--vw-per-px), 11 * 1px); font-weight: 700; line-height: 1.4; letter-spacing: 0.04em; display: -webkit-box; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } @media screen and (min-width: 648px) { .card-ranking-ttl { font-size: min(14 * var(--vw-per-px), 14 * 1px); line-height: 1.6; } } @media screen and (min-width: 648px) { .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(1) .card-ranking-ttl, .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(2) .card-ranking-ttl, .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(3) .card-ranking-ttl { font-size: min(11 * var(--vw-per-px), 11 * 1px); line-height: 1.4; } } @media screen and (min-width: 951px) { .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(1) .card-ranking-ttl, .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(2) .card-ranking-ttl, .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(3) .card-ranking-ttl { font-size: min(20 * var(--vw-per-px), 20 * 1px); line-height: 1.6; letter-spacing: 0.02em; } } @media screen and (min-width: 648px) { .card-ranking-list-home .card-ranking-ttl { font-size: min(11 * var(--vw-per-px), 11 * 1px); line-height: 1.4; } } @media screen and (min-width: 951px) { .card-ranking-list-home .card-ranking-ttl { font-size: min(14 * var(--vw-per-px), 14 * 1px); line-height: 1.6; } } .card-ranking-user { font-size: min(10 * var(--vw-per-px), 10 * 1px); font-weight: 500; line-height: 1.4; color: var(--gray); letter-spacing: 0.04em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } @media screen and (min-width: 648px) { .card-ranking-user { font-size: min(12 * var(--vw-per-px), 12 * 1px); line-height: 1.5; } } @media screen and (min-width: 648px) { .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(1) .card-ranking-user, .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(2) .card-ranking-user, .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(3) .card-ranking-user { font-size: min(10 * var(--vw-per-px), 10 * 1px); line-height: 1.4; } } @media screen and (min-width: 951px) { .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(1) .card-ranking-user, .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(2) .card-ranking-user, .card-ranking-list:not(.card-ranking-list-home) .card-ranking-list-item:nth-child(3) .card-ranking-user { font-size: min(16 * var(--vw-per-px), 16 * 1px); line-height: 1.5; } } @media screen and (min-width: 648px) { .card-ranking-list-home .card-ranking-user { font-size: min(10 * var(--vw-per-px), 10 * 1px); line-height: 1.4; } } @media screen and (min-width: 951px) { .card-ranking-list-home .card-ranking-user { font-size: min(12 * var(--vw-per-px), 12 * 1px); line-height: 1.5; } }/* --------------------------------------------------------- * * Sass Variables * *--------------------------------------------------------- */ /* --------------------------------------------------------- * * Media query * *--------------------------------------------------------- */ /* --------------------------------------------------------- * * Responsive size * *--------------------------------------------------------- */ /* --------------------------------------------------------- * * Text * *--------------------------------------------------------- */ .d-none { display: none !important; } .d-inline-block { display: inline-block !important; } @media screen and (min-width: 648px) { .d-tab-none { display: none !important; } .d-tab-block { display: block !important; } .d-tab-inline { display: inline !important; } } @media screen and (min-width: 951px) { .d-pc-none { display: none !important; } .d-pc-block { display: block !important; } .d-pc-inline { display: inline !important; } .d-pc-flex { display: flex !important; } } .w-100 { width: 100% !important; } .ms-auto { margin-left: auto !important; } .mb-0 { margin-bottom: 0 !important; } .text-center { text-align: center !important; } @media screen and (min-width: 951px) { .text-pc-start { text-align: left !important; } } .text-accent { color: var(--accent) !important; } .text-link { color: var(--primary); text-decoration: underline; } .text-link:hover { text-decoration: none; } .word-break { word-break: break-all; } .list-disc { padding-left: 1.5em; list-style: disc; } .list-icon > li { display: flex; gap: 4; align-items: flex-start; } .list-icon-icon { flex: 0 0 auto; } .icon-circle { color: var(--bg-05); } .hover-opacity { transition: opacity 0.15s ease-in-out; } .hover-opacity:hover { opacity: var(--hover-opacity); }.footer[data-astro-cid-35ed7um5]{padding:min(var(--footer-spacing) * var(--vw-per-px),var(--footer-spacing) * 1px) 0;color:var(--white);text-align:center;background-color:#27263a}.footer-links-ttl[data-astro-cid-35ed7um5]{margin-bottom:min(16 * var(--vw-per-px),16 * 1px);font-size:min(16 * var(--vw-per-px),16 * 1px);font-weight:700;line-height:1.6;letter-spacing:0.04em}.footer-sns-row[data-astro-cid-35ed7um5] .footer-links-ttl[data-astro-cid-35ed7um5]{margin-bottom:min(8 * var(--vw-per-px),8 * 1px)}@media screen and (min-width: 951px){.footer-sns-row[data-astro-cid-35ed7um5] .footer-links-ttl[data-astro-cid-35ed7um5]{margin-bottom:min(16 * var(--vw-per-px),16 * 1px)}}.footer-bnr[data-astro-cid-35ed7um5]{display:flex;flex-direction:column;gap:min(24 * var(--vw-per-px),24 * 1px);max-width:min(310 * var(--vw-per-px),310 * 1px);margin:0 auto min(32 * var(--vw-per-px),32 * 1px)}@media screen and (min-width: 951px){.footer-bnr[data-astro-cid-35ed7um5]{flex-flow:row wrap;justify-content:center;max-width:100%}}@media screen and (min-width: 951px){.footer-bnr-item[data-astro-cid-35ed7um5]{width:min(310 * var(--vw-per-px),310 * 1px)}}.footer-archive[data-astro-cid-35ed7um5]{display:flex;flex-direction:column;gap:min(24 * var(--vw-per-px),24 * 1px);align-items:center;justify-content:center;margin-bottom:min(32 * var(--vw-per-px),32 * 1px)}@media screen and (min-width: 951px){.footer-archive[data-astro-cid-35ed7um5]{flex-flow:row wrap}}.footer-archive-link[data-astro-cid-35ed7um5]{display:inline-block;display:flex;align-items:center;justify-content:center;width:min(240 * var(--vw-per-px),240 * 1px);height:min(48 * var(--vw-per-px),48 * 1px);font-size:min(20 * var(--vw-per-px),20 * 1px);font-weight:700;line-height:1;text-align:center;letter-spacing:0.02em;border:1px solid var(--white);border-radius:50rem;transition:color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out,transform 0.15s ease-in-out}.footer-archive-link[data-astro-cid-35ed7um5]:hover{color:var(--body-color);background-color:var(--white)}.footer-sns-row[data-astro-cid-35ed7um5]{display:flex;flex-direction:column;gap:min(32 * var(--vw-per-px),32 * 1px);margin-bottom:min(32 * var(--vw-per-px),32 * 1px)}@media screen and (min-width: 951px){.footer-sns-row[data-astro-cid-35ed7um5]{flex-direction:row;gap:min(124 * var(--vw-per-px),124 * 1px);justify-content:center}}.footer-sns[data-astro-cid-35ed7um5]{display:flex;gap:min(48 * var(--vw-per-px),48 * 1px);align-items:center;justify-content:center}@media screen and (min-width: 951px){.footer-sns[data-astro-cid-35ed7um5]{gap:min(24 * var(--vw-per-px),24 * 1px)}}.footer-sns-btn[data-astro-cid-35ed7um5]{display:block;width:min(52 * var(--vw-per-px),52 * 1px)}.footer-bottom[data-astro-cid-35ed7um5]{padding-top:min(24 * var(--vw-per-px),24 * 1px);border-top:1px solid var(--white)}.footer-yamaha-logo[data-astro-cid-35ed7um5]{display:block;width:min(140 * var(--vw-per-px),140 * 1px);margin:0 auto min(4 * var(--vw-per-px),4 * 1px)}@media screen and (min-width: 951px){.footer-yamaha-logo[data-astro-cid-35ed7um5]{width:min(163 * var(--vw-per-px),163 * 1px);margin-bottom:min(16 * var(--vw-per-px),16 * 1px)}}.footer-yamaha[data-astro-cid-35ed7um5]{display:inline-block;margin-bottom:min(16 * var(--vw-per-px),16 * 1px);font-size:min(13 * var(--vw-per-px),13 * 1px);font-weight:500;line-height:1.5;text-align:left;letter-spacing:0.04em}@media screen and (min-width: 951px){.footer-yamaha[data-astro-cid-35ed7um5]{margin-bottom:min(8 * var(--vw-per-px),8 * 1px)}}.footer-copyright-small[data-astro-cid-35ed7um5]{font-size:min(13 * var(--vw-per-px),13 * 1px);font-weight:500;line-height:1.5;letter-spacing:0.04em}.burger[data-astro-cid-sltviwnf]{--burger-width: 26px;z-index:calc(var(--zindex-fixed) + 1);display:flex;align-items:center;justify-content:center;width:min(56 * var(--vw-per-px),56 * 1px);height:min(48 * var(--vw-per-px),48 * 1px);margin:0;text-align:center;cursor:pointer;background:none;border:none;outline:none;transition:transform 0.3s ease-in-out}.burger-bar[data-astro-cid-sltviwnf]{position:relative;margin:9px auto 9px auto;user-select:none;background-color:#00a0e9}.burger-bar[data-astro-cid-sltviwnf],.burger-bar[data-astro-cid-sltviwnf]::before,.burger-bar[data-astro-cid-sltviwnf]::after{display:block;width:var(--burger-width);height:3px;outline:1px solid transparent;transition-duration:0.3s;transition-property:background-color,transform}.burger-bar[data-astro-cid-sltviwnf]::before,.burger-bar[data-astro-cid-sltviwnf]::after{position:absolute;content:""}.burger-bar[data-astro-cid-sltviwnf]::before{top:-9px;background-color:#64b72f}.burger-bar[data-astro-cid-sltviwnf]::after{top:9px;background-color:#e62e8b}.burger[data-astro-cid-sltviwnf][aria-expanded=true] .burger-bar[data-astro-cid-sltviwnf]{--burger-width: 32px;background-color:transparent;transform:rotateY(360deg)}.burger[data-astro-cid-sltviwnf][aria-expanded=true] .burger-bar[data-astro-cid-sltviwnf]::before{transform:translateY(9px) rotate(45deg)}.burger[data-astro-cid-sltviwnf][aria-expanded=true] .burger-bar[data-astro-cid-sltviwnf]::after{transform:translateY(-9px) rotate(-45deg)}@media screen and (min-width: 951px){.burger[data-astro-cid-sltviwnf]{display:none}}.gnav[data-astro-cid-d22xvw6e]{font-size:min(16 * var(--vw-per-px),16 * 1px);font-weight:700;letter-spacing:0.04em}@media screen and (max-width: 950.98px){.gnav[data-astro-cid-d22xvw6e]{position:fixed;top:min(var(--header-height) * var(--vw-per-px),var(--header-height) * 1px);right:0;z-index:var(--zindex-fixed);width:100%;height:0;overflow:hidden;overflow-y:auto;overscroll-behavior-y:contain;visibility:hidden;background-color:#fff}.gnav[data-astro-cid-d22xvw6e][aria-expanded=false]{transition:visibility 0s ease 0.4s,height 0.4s ease-out}.gnav[data-astro-cid-d22xvw6e][aria-expanded=true]{height:calc(100vh - min(var(--header-height) * var(--vw-per-px),var(--header-height) * 1px));height:calc(100dvh - min(var(--header-height) * var(--vw-per-px),var(--header-height) * 1px));visibility:visible;transition:visibility 0s ease,height 0.4s ease-out}}@media screen and (min-width: 951px){.gnav[data-astro-cid-d22xvw6e]{position:static;width:auto;height:auto;overflow:inherit;visibility:visible}}.gnav-container[data-astro-cid-d22xvw6e]{padding:0 min(24 * var(--vw-per-px),24 * 1px) min(16 * var(--vw-per-px),16 * 1px)}@media screen and (min-width: 648px){.gnav-container[data-astro-cid-d22xvw6e]{max-width:min(448 * var(--vw-per-px),448 * 1px);margin-right:auto;margin-left:auto}}@media screen and (min-width: 951px){.gnav-container[data-astro-cid-d22xvw6e]{display:flex;gap:min(50 * var(--vw-per-px),50 * 1px);align-items:center;max-width:100%;padding:0;margin:0}}.gnav-item[data-astro-cid-d22xvw6e]{margin-bottom:-1px;border-top:1px solid var(--bg-02);border-bottom:1px solid var(--bg-02)}@media screen and (min-width: 951px){.gnav-item[data-astro-cid-d22xvw6e]{position:relative;display:flex;align-items:center;height:min(var(--header-height) * var(--vw-per-px),var(--header-height) * 1px);margin:0;border:0}}.gnav-link[data-astro-cid-d22xvw6e]{display:flex;gap:min(var(--spacingdefault) * var(--vw-per-px),var(--spacingdefault) * 1px);align-items:center;height:min(64 * var(--vw-per-px),64 * 1px);padding:0 min(24 * var(--vw-per-px),24 * 1px);transition:color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out,transform 0.15s ease-in-out}@media screen and (min-width: 951px){.gnav-link[data-astro-cid-d22xvw6e]{height:auto;padding:0;transition:color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out,transform 0.15s ease-in-out}}.gnav-link[data-astro-cid-d22xvw6e]:not(a){cursor:default}.gnav-link[data-astro-cid-d22xvw6e]:hover:is(a){color:var(--primary)}@media screen and (min-width: 951px){.gnav-group[data-astro-cid-d22xvw6e]:hover .gnav-link[data-astro-cid-d22xvw6e]{color:var(--primary)}}.gnav-children[data-astro-cid-d22xvw6e]{padding-top:min(4 * var(--vw-per-px),4 * 1px)}@media screen and (min-width: 951px){.gnav-children[data-astro-cid-d22xvw6e]{position:absolute;top:calc(100% - 1px);left:min(-28 * var(--vw-per-px),-28 * 1px);display:flex;flex-direction:column;gap:min(var(--spacing2) * var(--vw-per-px),var(--spacing2) * 1px);padding:min(16 * var(--vw-per-px),16 * 1px) min(16 * var(--vw-per-px),16 * 1px) min(8 * var(--vw-per-px),8 * 1px);white-space:nowrap;pointer-events:none;visibility:hidden;background-color:#fff;box-shadow:0 min(4 * var(--vw-per-px),4 * 1px) rgba(35,27,78,0.2);opacity:0;transition:visibility 0s ease 0.4s,opacity 0.4s ease-out,transform 0.4s ease-out;transform:translateY(-20px)}.gnav-group[data-astro-cid-d22xvw6e]:hover .gnav-children[data-astro-cid-d22xvw6e]{pointer-events:inherit;visibility:visible;opacity:1;transition:visibility 0s ease,opacity 0.4s ease-out,transform 0.4s ease-out;transform:translateY(0)}}.gnav-child[data-astro-cid-d22xvw6e]{margin-bottom:min(8 * var(--vw-per-px),8 * 1px)}@media screen and (max-width: 647.98px){.gnav-child[data-astro-cid-d22xvw6e]:last-child{margin-bottom:min(10 * var(--vw-per-px),10 * 1px)}}@media screen and (max-width: 950.98px){.gnav-child[data-astro-cid-d22xvw6e]{margin-bottom:min(16 * var(--vw-per-px),16 * 1px)}}.gnav-child-link[data-astro-cid-d22xvw6e]{display:flex;align-items:center;justify-content:space-between;height:min(56 * var(--vw-per-px),56 * 1px);padding:min(16 * var(--vw-per-px),16 * 1px) min(12 * var(--vw-per-px),12 * 1px) min(16 * var(--vw-per-px),16 * 1px) min(16 * var(--vw-per-px),16 * 1px);transition:color 0.15s ease-in-out,background-color 0.15s ease-in-out,border-color 0.15s ease-in-out,box-shadow 0.15s ease-in-out,transform 0.15s ease-in-out}@media screen and (min-width: 951px){.gnav-child-link[data-astro-cid-d22xvw6e]{width:min(302 * var(--vw-per-px),302 * 1px);padding:min(16 * var(--vw-per-px),16 * 1px)}}@media screen and (max-width: 950.98px){.gnav-child-link[data-astro-cid-d22xvw6e]{transition:opacity 0.15s ease-in-out}.gnav-child-link[data-astro-cid-d22xvw6e]:hover{opacity:var(--hover-opacity)}}.gnav-child-challenge[data-astro-cid-d22xvw6e]:hover{color:#fff;background-color:var(--challenge)}@media screen and (max-width: 950.98px){.gnav-child-challenge[data-astro-cid-d22xvw6e]{color:#fff;background-color:var(--challenge)}}.gnav-child-u-20[data-astro-cid-d22xvw6e]:hover{color:#fff;background-color:var(--u20)}@media screen and (max-width: 950.98px){.gnav-child-u-20[data-astro-cid-d22xvw6e]{color:#fff;background-color:var(--u20)}}.gnav-child-veteran[data-astro-cid-d22xvw6e]:hover{color:#fff;background-color:var(--veteran)}@media screen and (max-width: 950.98px){.gnav-child-veteran[data-astro-cid-d22xvw6e]{color:#fff;background-color:var(--veteran)}}.gnav-child-solo[data-astro-cid-d22xvw6e]:hover{color:#fff;background-color:var(--solo)}@media screen and (max-width: 950.98px){.gnav-child-solo[data-astro-cid-d22xvw6e]{color:#fff;background-color:var(--solo)}}.gnav-child-collaboration[data-astro-cid-d22xvw6e]:hover{color:#fff;background-color:var(--collaboration)}@media screen and (max-width: 950.98px){.gnav-child-collaboration[data-astro-cid-d22xvw6e]{color:#fff;background-color:var(--collaboration)}}.gnav-child-top-100[data-astro-cid-d22xvw6e]:hover{color:#fff;background-color:var(--top100)}@media screen and (max-width: 950.98px){.gnav-child-top-100[data-astro-cid-d22xvw6e]{color:#fff;background-color:var(--top100)}}.gnav-icon[data-astro-cid-d22xvw6e]{flex:0 0 auto;width:min(24 * var(--vw-per-px),24 * 1px);height:min(24 * var(--vw-per-px),24 * 1px)}@media screen and (min-width: 951px){.gnav-link[data-astro-cid-d22xvw6e] .gnav-icon[data-astro-cid-d22xvw6e]:not(.gnav-group-icon){display:none}}.gnav-group-icon[data-astro-cid-d22xvw6e]{transform:translateY(min(2 * var(--vw-per-px),2 * 1px)) rotate(180deg)}.gnav-group[data-astro-cid-d22xvw6e]:hover .gnav-group-icon[data-astro-cid-d22xvw6e]{transform:rotate(0)}@media screen and (max-width: 950.98px){.gnav-group-icon[data-astro-cid-d22xvw6e]{display:none}}.gnav-copyright[data-astro-cid-d22xvw6e]{margin:min(18 * var(--vw-per-px),18 * 1px) 0 0}@media screen and (min-width: 951px){.gnav-copyright[data-astro-cid-d22xvw6e]{display:none}}.gnav-copyright-small[data-astro-cid-d22xvw6e]{font-size:min(12 * var(--vw-per-px),12 * 1px);font-weight:500;line-height:1.5;color:var(--gray);letter-spacing:0.04em}.gnav-badge-wrap[data-astro-cid-d22xvw6e]{display:flex;align-items:center;gap:min(12 * var(--vw-per-px),12 * 1px)}@media screen and (min-width: 951px){.gnav-badge-wrap[data-astro-cid-d22xvw6e]{gap:min(4 * var(--vw-per-px),4 * 1px);margin-right:min(4 * var(--vw-per-px),4 * 1px)}}.header[data-astro-cid-qlfjksao]{position:fixed;top:0;left:0;z-index:calc(var(--zindex-sticky) + 1);width:100%;height:min(var(--header-height) * var(--vw-per-px),var(--header-height) * 1px);padding:0 min(var(--spacingdefault) * var(--vw-per-px),var(--spacingdefault) * 1px);background-color:#fff}@media screen and (min-width: 951px){.header[data-astro-cid-qlfjksao]{padding:0 min(var(--spacing5) * var(--vw-per-px),var(--spacing5) * 1px)}}.header[data-astro-cid-qlfjksao] .container[data-astro-cid-qlfjksao]{display:flex;align-items:center;justify-content:space-between;height:min(var(--header-height) * var(--vw-per-px),var(--header-height) * 1px)}@media screen and (max-width: 950.98px){.header[data-astro-cid-qlfjksao] .container[data-astro-cid-qlfjksao]{max-width:100%;padding:0 0 0 min(13 * var(--vw-per-px),13 * 1px)}}@media screen and (min-width: 951px){.header[data-astro-cid-qlfjksao] .container[data-astro-cid-qlfjksao]{padding:0 min(24 * var(--vw-per-px),24 * 1px)}}.header-logo[data-astro-cid-qlfjksao]{width:min(62 * var(--vw-per-px),62 * 1px);margin:0;font-size:16px;line-height:1}@media screen and (min-width: 951px){.header-logo[data-astro-cid-qlfjksao]{width:min(88 * var(--vw-per-px),88 * 1px)}}.global-nav[data-astro-cid-qlfjksao]{display:flex;align-items:center;justify-content:center;padding:min(12 * var(--vw-per-px),12 * 1px) 0;font-size:min(12 * var(--vw-per-px),12 * 1px);font-weight:700;line-height:1.4;color:inherit;text-align:center;text-decoration:none;letter-spacing:0.04em;cursor:pointer;background-color:#ffff9f;border-top:1px solid #27263a;box-shadow:0 2px 4px 0 rgba(0,0,0,0.1019607843)}@media screen and (min-width: 648px){.global-nav[data-astro-cid-qlfjksao]{font-size:min(16 * var(--vw-per-px),16 * 1px)}}.global-nav[data-astro-cid-qlfjksao] .link[data-astro-cid-qlfjksao]{margin-right:0 min(4 * var(--vw-per-px),4 * 1px);color:#9443ff}.global-nav[data-astro-cid-qlfjksao] .text[data-astro-cid-qlfjksao]{color:#27263a}.global-nav[data-astro-cid-qlfjksao]:hover .link[data-astro-cid-qlfjksao]{opacity:0.5}@media screen and (min-width: 951px){.icon[data-astro-cid-qlfjksao]{width:min(32 * var(--vw-per-px),32 * 1px)}}.wrapper[data-astro-cid-sckkx6r4]{display:grid;grid-template-rows:auto 1fr auto;grid-template-columns:100%;min-height:100%}