@charset "UTF-8"; :root { --color-white: #ffffff; --color-black: rgba(0, 0, 0, 1); --color-base: rgba(252, 240, 228, 1); --color-cream: rgba(255, 249, 242, 1); --color-brown: #672526; --color-skyblue: #dff8f5; --color-blue: rgba(0, 168, 227, 1); --color-green: rgba(118, 196, 33, 1); --color-yellow: rgba(254, 222, 103, 1); --txt-brown: rgba(75, 0, 0, 1); --txt-lbrown: rgba(178, 94, 34, 1); --bdr-brown: rgba(196, 112, 52, 0.3); --color-yellow: rgba(254, 222, 103, 1); --color-orange: rgba(247, 117, 84, 1); --color-pink: #FF576F; --innerW: 86.66%; --color-bg-nav: rgba(255, 251, 247, 1); --nav-color-brown: #612800; --color-hover: #EA5539; --fs-13: clamp(1.1rem, 1.015625vw, 1.3rem); --fs-14: clamp(1.2rem, 1.09375vw, 1.4rem); --fs-16: clamp(1.4rem, 1.25vw, 1.6rem); --fs-18: clamp(1.4rem, 1.40625vw, 1.8rem); --fs-20: min(10.93vw,41px); --fs-28: clamp(1.4rem, 1.4583333333vw, 2.8rem); --fs-24: min(6.4vw,24px); --fs-12-14: clamp(1.2rem, 1.09375vw, 1.4rem); --fs-14-14: clamp(1.4rem, 1.09375vw, 1.4rem); --fs-11: clamp(1.1rem, 0.859375vw, 1.1rem); --fs-10-16: clamp(1rem, 1.25vw, 1.6rem); --fs-14-15: clamp(1.4rem, 1.171875vw, 1.5rem); --fs-14-16: clamp(1.4rem, 1.25vw, 1.6rem); --fs-14-24: clamp(1.4rem, 1.875vw, 2.4rem); --fs-16-22: clamp(1.6rem, 1.71875vw, 2.2rem); --fs-22-40: 5.87vw; --fs-17-40: 4.53vw; --fs-38-56: clamp(3.8rem, 4.375vw, 5.6rem); --fs-30-56: clamp(3rem, 4.375vw, 5.6rem); --fs-32-56: clamp(3.2rem, 4.375vw, 5.6rem); --fs-32-52: clamp(3.2rem, 4.0625vw, 5.2rem); --fs-52: clamp(2.6rem, 4.0625vw, 5.2rem); --fs-56: clamp(2.8rem, 4.375vw, 5.6rem); --fs-glbnav: clamp(2.4rem, 2.96875vw, 3.8rem); --hide-y: min(8vw,30px); --img-radius: min(9.07vw,34px); } @media all and (min-width: 641px) { :root { --fs-20: min(1.56vw,20px); --fs-24: min(1.88vw,24px); --fs-17-40: min(3.13vw,40px); --fs-22-40: min(3.13vw,40px); --img-radius: min(6.25vw,80px); } } @media all and (min-width: 1280px) { :root { --fs-20: 2.5rem; --fs-24: 2.4rem; --fs-40: 4.0rem; } } /*** The new CSS reset - version 1.11.2 (last updated 15.11.2023) GitHub page: https://github.com/elad2412/the-new-css-reset ***/ /* Remove all the styles of the "User-Agent-Stylesheet", except for the 'display' property - The "symbol *" part is to solve Firefox SVG sprite bug - 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; } /* 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; appearance: revert; } /* preformatted text - use only for this feature */ :where(pre) { all: revert; box-sizing: border-box; } /* 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; } html { font-size: 62.5%; } body { font-size: 14px; font-size: 1.4rem; } /* Small Devices, Tablets */ @media all and (min-width: 1280px) { html { font-size: 62.5%; } body { font-size: 14px; font-size: 1.4rem; } } :root { --vh: 100vh; } body { color: #000; background: var(--color-base); font-family: "Noto Sans JP", "Helvetica Neue", "Segoe UI", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Hiragino Sans", "游ゴシック", YuGothic, "メイリオ", Meiryo, "ＭＳＰゴシック", sans-serif; font-weight: 400; font-style: normal; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; overscroll-behavior-y: none; touch-action: manipulation; overflow-wrap: anywhere; word-break: normal; line-break: strict; letter-spacing: 0.06em; } a { color: #000; text-decoration: none; text-decoration-thickness: 1px; } li { list-style: none; } h1, h2, h3, h4, h5, h6 { font-weight: normal; } img { vertical-align: top; width: 100%; height: auto; } [data-wave] { width: 100%; height: 65px; position: relative; } [data-wave] canvas { width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; vertical-align: top; } [data-marquee] { width: 100%; overflow: hidden; position: relative; z-index: 2; } [data-marquee] ul { display: flex; width: 100%; } [data-marquee] ul li { width: 26.66%; flex-shrink: 0; } [data-marquee] ul li figure { width: calc(100% - 4px); aspect-ratio: 200/142; overflow: hidden; border-radius: min(8.53vw,32px) 0; } [data-marquee] .c-ttl_marquee { width: 100%; height: 100%; position: absolute; bottom: 0px; left: 0px; overflow: hidden; } [data-marquee] .c-ttl_marquee p { display: block; text-indent: -1000000px; width: 100%; height: 100%; position: absolute; bottom: -7px; left: 0px; background-image: url(../images/common/txt_almondfes.svg); background-size: auto 100%; background-repeat: repeat-x; } #s-kv .c-ttl_marquee p { background-image: url(../images/common/txt_almondfes2.svg); } footer { width: 100%; background: var(--color-brown); } footer [data-wave] { background: var(--color-brown); } footer [data-wave] canvas { background: var(--color-cream); } footer .c-footer_content { padding: min(33.07vw,124px) 0 0 0; background: var(--color-brown); position: relative; top: -1px; } footer .c-list_labs { padding-bottom: min(42.67vw,160px); } footer .c-list_labs h4 { font-size: var(--fs-14-24); margin-bottom: min(6.4vw,24px); text-align: center; color: #FCF0E4; } footer .c-list_labs ul { width: var(--innerW); margin: auto; display: flex; flex-wrap: wrap; gap: 4%; } footer .c-list_labs ul li { width: 48%; margin-bottom: 6%; } footer .c-list_labs ul li:last-child { margin-bottom: 0px; } footer .c-list_labs ul li figure { border-radius: min(1.6vw,6px); overflow: hidden; } footer .c-list_labs ul a.disable { pointer-events: none; } footer .c-list_labs ul p { width: 80%; border: 1px solid var(--color-white); border-radius: 100vmax; display: grid; place-content: center; color: var(--color-white); margin-inline: auto; margin-top: min(3.2vw,12px); box-sizing: border-box; } footer .c-list_labs ul p span { display: inline; padding: 0.4em 0 0.3em 0; font-size: var(--fs-12-14); letter-spacing: 0.4em; text-align: center; text-indent: 0.4em; } footer .c-copy { width: 100%; background: #4a0000; padding: min(16vw,60px) 0 min(18.67vw,70px) 0; } footer .c-copy p.logo { width: min(43.2vw,162px); margin: auto; } footer .c-copy p.copy { margin-top: min(5.33vw,20px); } footer p.logo svg { width: 100%; } footer svg .st0 { fill-rule: evenodd; clip-rule: evenodd; fill: var(--color-white); } footer dt, footer dd { color: var(--color-white); } footer p.copy { color: var(--color-white); text-align: center; } a.btn { display: block; } a.btn .inr { display: flex; align-items: center; justify-content: center; } a.round { border-radius: min(17.07vw,64px); overflow: hidden; } a.bdr_black { border: 1px solid var(--color-black); } a.bdr_black span { font-size: var(--fs-18); } a.bdr_black.brown svg { fill: var(--txt-brown); } a.bdr_black.brown span { color: var(--txt-brown); font-weight: 700; } a.bdr_brown { border: 1px solid var(--txt-brown); } a.bdr_brown svg { fill: var(--txt-brown); } a.bdr_brown span { font-size: var(--fs-12-14); color: var(--txt-brown); font-weight: 700; letter-spacing: 0em; } a.yellow { background: var(--color-yellow); } a.yellow svg { fill: var(--txt-brown); } a.yellow span { color: var(--txt-brown); font-size: var(--fs-16); letter-spacing: 0em; } a .icon_pin { width: 19px; height: 19px; margin-right: min(1.07vw,4px); } .icon { position: relative; } .icon svg { width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; } .c-table dl { border-bottom: 1px solid var(--bdr-brown); padding-bottom: 4.27vw; margin-bottom: 4.27vw; } .c-table dl:nth-of-type(1) { padding-top: min(7.47vw,28px); border-top: 1px solid var(--bdr-brown); } .c-table dl dt, .c-table dl dd, .c-table dl p { color: var(--txt-brown); font-weight: 700; font-size: var(--fs-14-16); } .c-table dl dt { margin-bottom: 0.8em; } .c-table dl dd .year { margin-bottom: 0.8em; } .c-table dl dd p { line-height: 1.6; } .c-table dl .icon_free { margin-top: 1.6vw; } .c-table dl .icon_free span { display: inline-block; color: var(--color-white); font-size: var(--fs-14-14); background: var(--color-pink); padding: min(1.87vw,7px) min(2.67vw,10px) min(1.2vw,4.5px) min(2.67vw,10px); } .c-notes ul li { position: relative; padding-left: 1.2rem; line-height: 2; } .c-notes ul li span, .c-notes ul li:before { color: var(--txt-brown); font-size: var(--fs-14); font-weight: 700; } .c-notes ul li span { position: relative; } .c-notes ul li:before { content: "・"; position: absolute; left: 0px; top: 0px; } .c-share { text-align: center; } .c-share p { line-height: 1.2; margin-bottom: 12px; color: var(--txt-brown); letter-spacing: 0em; } .c-share .c-list_share { display: inline-block; height: 64px; padding: 0 48px; background: var(--color-skyblue); border-radius: 64px; } .c-share .c-list_share ul { display: flex; justify-content: center; align-items: center; column-gap: 32px; height: 64px; } .c-share .c-list_share ul li { width: 32px; } .c-share .c-list_share ul li button { display: block; cursor: pointer; width: 32px; height: 32px; border-radius: 32px; overflow: hidden; } .c-share .c-list_share ul li svg { width: 32px; height: 32px; } .c-share .c-list_share ul li:nth-child(1) button { background: var(--color-white); } .c-share .c-list_share ul li:nth-child(1) svg { fill: rgb(0, 193, 0); } .c-share .c-list_share ul li:nth-child(2) svg { fill: rgb(0, 0, 0); } .c-share .c-list_share ul li:nth-child(3) button { background: var(--color-white); } .c-share .c-list_share ul li:nth-child(3) svg { fill: rgb(24, 119, 242); } .c-list_news { margin: auto; } .c-list_news ul li { border-bottom: 1px solid var(--bdr-brown); padding: 16px 0; } .c-list_news ul li:nth-child(1) { border-top: 1px solid var(--bdr-brown); } .c-list_news ul dl dt { font-weight: 700; color: var(--txt-lbrown); } .c-list_news ul dl dd { font-weight: 700; color: var(--txt-brown); } .c-list_event ul li { position: relative; margin-bottom: min(14.93vw,56px); } .c-list_event ul li:last-child { margin-bottom: 0px; } .c-list_event ul li figure { position: relative; } .c-list_event ul li .c-img { margin-bottom: min(6.93vw,26px); } .c-list_event ul li .c-img figure { border-radius: var(--img-radius); overflow: hidden; } .c-list_event ul li .c-list_event_info .logo { width: 100%; margin-bottom: min(3.2vw,12px); } .c-list_event ul li .c-list_event_info .logo figure { width: 51.31%; } .c-list_event ul li .c-list_event_info h3 { margin-bottom: 0.25em; } .c-list_event ul li .c-list_event_info h3 span { padding: min(1.07vw,4px) min(4.27vw,16px); display: inline-block; } .c-list_event ul li .c-list_event_info p.ja span { padding: min(0.53vw,2px) min(4.27vw,16px); display: inline-block; } .c-list_event ul li .c-list_event_info h3, .c-list_event ul li .c-list_event_info p.ja { color: var(--color-white); } .c-list_event ul li .c-list_event_info .txt { margin-top: min(4.27vw,16px); background: var(--color-cream); box-sizing: border-box; padding: 14px; } .c-list_event ul li:nth-child(1) .c-list_event_info { border-color: var(--color-orange); } .c-list_event ul li:nth-child(1) .c-list_event_info h3 span, .c-list_event ul li:nth-child(1) .c-list_event_info p.ja span { background: var(--color-orange); } .c-list_event ul li:nth-child(2) .c-list_event_info { border-color: var(--color-blue); } .c-list_event ul li:nth-child(2) .c-list_event_info .logo { width: 100%; display: flex; justify-content: flex-end; } .c-list_event ul li:nth-child(2) .c-list_event_info h3, .c-list_event ul li:nth-child(2) .c-list_event_info p.ja { text-align: right; } .c-list_event ul li:nth-child(2) .c-list_event_info h3 span, .c-list_event ul li:nth-child(2) .c-list_event_info p.ja span { background: var(--color-blue); } .c-list_event ul li:nth-child(3) .c-list_event_info { border-color: var(--color-green); } .c-list_event ul li:nth-child(3) .c-list_event_info h3 span, .c-list_event ul li:nth-child(3) .c-list_event_info p.ja span { background: var(--color-green); } .i { position: absolute; } .i span { position: absolute; width: 100%; height: 100%; top: 0px; left: 0px; display: block; background-size: cover; background-position: top left; background-repeat: no-repeat; } .show_nav { overflow: hidden; } .show_nav #glbnav { opacity: 1; pointer-events: auto; transition: opacity 0.5s ease; } .show_nav button[data-toggle-nav] span.b:nth-of-type(2) { display: none; } .show_nav button[data-toggle-nav] span.b:nth-of-type(1) { width: 24px; rotate: 45deg; top: 10px; margin-left: -12px; } .show_nav button[data-toggle-nav] span.b:nth-of-type(3) { width: 24px; rotate: -45deg; top: 10px; margin-left: -12px; } #glbnav { position: fixed; width: 100%; height: 100%; top: 0px; left: 0px; display: block; z-index: 10000; background: var(--color-bg-nav); opacity: 0; pointer-events: none; transition: opacity 0.2s ease; } #glbnav .c-inner { position: absolute; width: 100%; height: 100%; top: 0px; left: 0px; overflow: auto; } #glbnav .nav_content { padding: min(5.33vw,20px) 0 5em 0; } #glbnav button { cursor: pointer; display: block; } #glbnav p.c-logo_almondmilk { width: 42.66%; max-width: 160px; margin: auto; margin-bottom: min(19.73vw,74px); } #glbnav nav p.c-logo_fes { width: 74.66%; max-width: 280px; margin: auto; margin-bottom: min(12.8vw,48px); } #glbnav nav ul li { text-align: center; margin-bottom: 2em; } #glbnav nav ul li:last-child { margin-bottom: 0px; } #glbnav nav ul li a { color: var(--txt-brown); font-size: var(--fs-glbnav); line-height: 1.2; display: block; } button[data-toggle-nav] { position: fixed; display: block; width: 48px; height: 48px; border: min(0.45vw,1.7px) solid var(--nav-color-brown); z-index: 10001; top: 24px; right: 24px; border-radius: 50%; box-sizing: border-box; background: var(--color-bg-nav); cursor: pointer; } button[data-toggle-nav] .inr { display: block; position: absolute; width: 24px; height: 23px; top: 50%; left: 50%; transform: translate3d(-50%, -50%, 0); } button[data-toggle-nav] span.b { width: 18px; height: 3px; border-radius: 3px; overflow: hidden; display: block; position: absolute; left: 50%; margin-left: -9px; background: var(--nav-color-brown); transition: widthk 0.2s ease 0s, rotate 0.2s ease 0s; } button[data-toggle-nav] span.b:nth-of-type(1) { top: 0px; } button[data-toggle-nav] span.b:nth-of-type(2) { width: 24px; top: 9.5px; margin-left: -12px; } button[data-toggle-nav] span.b:nth-of-type(3) { top: 19px; } #ttl_day { position: absolute; width: min(42.67vw,160px); left: 50%; margin-left: max(-21.33vw,-80px); top: min(5.33vw,20px); } header#global_header { padding-top: min(29.87vw,112px); width: 100%; background: var(--color-bg-nav); } header#global_header h2 { width: min(74.67vw,280px); margin: auto; } header#global_header nav { display: none; } header#global_header [data-wave] { background: var(--color-bg-nav); } [data-page=top] header#global_header { display: none; } [data-page=page] footer [data-wave] canvas { background: var(--color-base); } [data-page=page] #wrapper { padding-top: min(22.67vw,85px); } [data-page=page] .c-ttl_h3 { padding: 0; margin-bottom: 0; position: relative; width: auto; text-align: center; } [data-page=page] .c-ttl_h3.page_event .bg_ttl { height: min(33.87vw,127px); position: absolute; width: 32%; top: max(-8.53vw,-32px); left: 50%; margin-left: max(-48vw,-180px); } [data-page=page] .c-ttl_h3.page_event p, [data-page=page] .c-ttl_h3.page_event h3, [data-page=page] .c-ttl_h3.page_event .lead { position: relative; } [data-page=page] .c-ttl_h3.page_event p.ja { margin-bottom: min(1.6vw,6px); } [data-page=page] .c-ttl_h3.page_event h3 { font-size: var(--fs-30-56); margin-bottom: min(3.2vw,12px); color: var(--txt-brown); padding-left: min(6.67vw,25px); } [data-page=page] .c-ttl_h3.page_event .i0 { left: 50%; margin-left: max(-42.67vw,-160px); bottom: 45%; width: min(8vw,30px); height: min(10.67vw,40px); } [data-page=page] .c-ttl_h3.page_event .i0 span { background-image: url(../images/top/event/i_n0.webp); } [data-page=page] .c-ttl_h3.page_event .i1 { left: 50%; margin-left: max(-48vw,-180px); bottom: 40%; width: min(8.53vw,32px); height: min(6.13vw,23px); } [data-page=page] .c-ttl_h3.page_event .i1 span { background-image: url(../images/top/event/i_n1.webp); } @media all and (min-width: 641px) { a.round { border-radius: min(2.5vw,32px); } a .icon_pin { width: min(1.48vw,19px); height: min(1.48vw,19px); margin-right: min(0.47vw,6px); } a.bdr_black { border: 1px solid var(--color-black); } a.bdr_black.brown { transition: background 0.15s linear; } a.bdr_black.brown span { transition: color 0.15s linear; } a.bdr_black.brown svg { transition: fill 0.15s linear; } a.bdr_black.brown:hover { background: var(--txt-brown); } a.bdr_black.brown:hover span { color: var(--color-white); } a.bdr_black.brown:hover svg { fill: var(--color-white); } a.bdr_brown { transition: background 0.15s linear; } a.bdr_brown:hover { background: var(--color-yellow); } a.yellow { background: var(--color-yellow); box-sizing: border-box; border: 1px solid var(--color-yellow); transition: background 0.15s linear; } a.yellow:hover { background: var(--color-cream); } a.yellow svg { fill: var(--txt-brown); } a.yellow span { color: var(--txt-brown); font-size: var(--fs-16); letter-spacing: 0em; } .c-list_news { width: var(--innerW); max-width: 800px; } .c-list_news ul li { padding: min(1.25vw,16px) 0; } .c-list_news ul li a { display: block; transition: opacity 0.15s linear; } .c-list_news ul li a:hover { opacity: 0.5; } .c-list_news ul dl { display: flex; } .c-list_news ul dl dt { width: 17.875%; } .c-list_news ul dl dd { width: 82.125%; position: relative; } .c-list_event ul li { width: 100%; padding-bottom: min(2.89vw,37px); margin-bottom: min(4.69vw,60px); } .c-list_event ul li:last-child { margin-bottom: 0px; } .c-list_event ul li .c-img { margin-bottom: 0px; } .c-list_event ul li .c-list_event_info .logo { margin-bottom: min(0.94vw,12px); } .c-list_event ul li .c-list_event_info .logo figure { width: min(13.75vw,176px); } .c-list_event ul li .c-list_event_info h3 { margin-bottom: min(0.63vw,8px); letter-spacing: 0em; } .c-list_event ul li .c-list_event_info h3 span { padding: min(0.16vw,2px) min(1.25vw,16px) min(0.08vw,1px) min(1.25vw,16px); } .c-list_event ul li .c-list_event_info p.ja span { padding: min(0.08vw,1px) min(1.09vw,14px) min(0.08vw,1px) min(1.09vw,14px); } .c-list_event ul li .c-list_event_info .txt { margin-top: min(1.88vw,24px); } .c-list_event ul li .c-list_event_info .txt p { font-size: var(--fs-10-16); } .c-list_event ul li:nth-child(2n) .c-img { display: flex; justify-content: flex-end; } .c-list_event ul li:nth-child(2n) .c-list_event_info { right: auto; left: min(6.25vw,80px); } .c-list_event ul li:nth-child(2n) .c-list_event_info .logo { width: 100%; display: flex; justify-content: flex-start; } .c-list_event ul li:nth-child(2n) .c-list_event_info h3, .c-list_event ul li:nth-child(2n) .c-list_event_info p.ja { text-align: left; } .c-list_event ul li figure { width: min(62.5vw,800px); } .c-list_event ul li .c-list_event_info { position: absolute; bottom: 0px; width: min(30.31vw,388px); right: min(3.44vw,44px); } .c-table dl { display: flex; padding-bottom: min(1.72vw,22px); margin-bottom: min(2.34vw,30px); } .c-table dl:nth-of-type(1) { padding-top: min(2.19vw,28px); } .c-table dl dt, .c-table dl dd, .c-table dl p { font-size: var(--fs-16); } .c-table dl dt { width: min(15.63vw,200px); margin-bottom: 0; line-height: 1.6; } .c-table dl dd { width: min(46.88vw,600px); position: relative; } .c-table dl dd p { line-height: 1.6; } .c-table dl .has_icon { position: relative; display: flex; align-items: center; } .c-table dl .icon_free { top: -0.2em; margin-top: 0px; margin-left: 1em; } .c-table dl .dates { display: flex; } .c-table dl .dates .year { line-height: 1.6; } .c-table dl .dates .col_r { padding-left: min(2.5vw,32px); } .c-notes ul li { padding-left: min(1.41vw,18px); display: flex; } .c-notes ul li span, .c-notes ul li:before { font-size: var(--fs-14); } footer .c-footer_content { padding: min(4.84vw,62px) 0 0 0; } footer .c-list_labs { width: min(65.63vw,840px); margin: auto; padding-bottom: min(6.25vw,80px); } footer .c-list_labs h4 { margin-bottom: min(3.75vw,48px); } footer .c-list_labs ul { width: 100%; column-gap: min(3.13vw,40px); row-gap: min(3.75vw,48px); } footer .c-list_labs ul li { width: min(31.25vw,400px); margin-bottom: 0px; } footer .c-list_labs ul li figure { border-radius: 10px; } footer .c-list_labs ul li p { margin-top: min(1.41vw,18px); height: 32px; width: 50%; } footer .c-list_labs ul li p span { padding: 0px; } footer .c-list_labs ul a { transition: filter 0.15s linear; } footer .c-list_labs ul a:hover { filter: brightness(0.6); } footer .c-copy { padding: min(2.34vw,30px) 0 min(2.73vw,35px) 0; } footer .c-copy p.logo { width: min(12.66vw,162px); margin: auto; } footer .c-copy p.copy { margin-top: min(1.56vw,20px); } footer svg .st0 { fill-rule: evenodd; clip-rule: evenodd; fill: var(--color-white); } .show_nav #wrapper, .show_nav footer { width: calc(100% - var(--scrollbar)) !important; } .show_nav #listenlive_container { right: var(--scrollbar); } #glbnav .nav_content { padding: 0 0 0.5em 0; } #glbnav p.c-logo_almondmilk { width: 184px; margin: 0; position: absolute; top: 28px; left: 30px; margin-bottom: 0; } #glbnav nav { margin-top: 120px; padding-bottom: 60px; } #glbnav nav p.c-logo_fes { width: 280px; margin-bottom: 48px; } #glbnav nav ul li a { transition: color 0.15s linear; } #glbnav nav ul li a.current, #glbnav nav ul li a:hover { color: var(--color-hover); } } @media all and (min-width: 960px) { [data-marquee] { padding-bottom: 8px; } [data-marquee] ul li { width: 16.25%; flex-shrink: 0; } [data-marquee] ul li figure { width: calc(100% - 8px); aspect-ratio: 200/142; } [data-marquee] .c-ttl_marquee { overflow: visible; height: calc(100% - 8px); } [data-marquee] .c-ttl_marquee p { background-repeat: no-repeat; background-position: 0 0 !important; } #ttl_day { position: absolute; width: 184px; margin-left: 0; top: 26px; left: 30px; } header#global_header { padding-top: 32px; width: 100%; } header#global_header h2 { width: 360px; margin: auto; } header#global_header nav { display: block; margin-top: 32px; padding-bottom: 28px; } header#global_header nav ul { display: flex; justify-content: center; } header#global_header nav ul li { padding-right: 16px; display: flex; } header#global_header nav ul li:after { content: ""; width: 1px; height: 16px; display: block; background: var(--txt-brown); margin-left: 16px; } header#global_header nav ul li:last-child:after { display: none; } header#global_header nav ul li a { font-size: var(--fs-16); color: var(--txt-brown); transition: color 0.15s linear; } header#global_header nav ul li a.current, header#global_header nav ul li a:hover { color: var(--color-hover); } header#global_header [data-wave] { background: var(--color-bg-nav); } [data-page=page] #wrapper { padding-top: 4px; } [data-page=page] footer [data-wave] canvas { background: var(--color-base); } [data-page=page] .c-ttl_h3 { padding: min(6.25vw,80px) 0 min(2.5vw,32px) 0; margin-bottom: 0; } [data-page=page] .c-ttl_h3.page_event .bg_ttl { position: absolute; width: 25%; height: 100%; top: 0px; left: 50%; margin-left: -21.7%; } [data-page=page] .c-ttl_h3.page_event p.ja { margin-bottom: min(0.31vw,4px); } [data-page=page] .c-ttl_h3.page_event h3 { margin-bottom: min(0.94vw,12px); } [data-page=page] .c-ttl_h3.page_event br.sp { display: none; } [data-page=page] .c-ttl_h3.page_event .i0 { width: min(5.63vw,72px); height: min(6.64vw,85px); margin-left: max(-26.25vw,-336px); bottom: min(5.86vw,75px); } [data-page=page] .c-ttl_h3.page_event .i1 { width: min(5.16vw,66px); height: min(3.83vw,49px); margin-left: max(-30.08vw,-385px); bottom: min(5.47vw,70px); } [data-page=top] header#global_header { display: block; background: none; padding-top: 0px; position: absolute; z-index: 2; } [data-page=top] header#global_header nav { width: 100%; position: absolute; top: min(11.88vw,152px); margin-top: 0px; padding-bottom: 0px; } [data-page=top] button[data-toggle-nav] { opacity: 0; transition: opacity 0.3s ease; pointer-events: none; } .show_btn [data-page=top] button[data-toggle-nav] { opacity: 1; pointer-events: auto; } } @media (min-width: 641px) and (min-height: 760px) { #glbnav .c-inner { display: flex; justify-content: center; align-items: center; } #glbnav nav { padding-bottom: 0px; margin-top: 0px; } } .chealsea { font-family: "chelsea-market-pro", sans-serif; font-weight: 400; font-style: normal; } .notob { font-weight: 700; } .c_brown { color: var(--txt-lbrown); } .fs16 { font-size: var(--fs-16); } .c-list_news ul dl dt, .c-list_news ul dl dd { line-height: 2; font-size: var(--fs-14-16); } .c-list_event .c-list_event_info h3 { font-size: var(--fs-32-52); line-height: 1.2; white-space: nowrap; } .c-list_event .c-list_event_info p.ja { font-size: var(--fs-14-24); line-height: 1.5; } .c-list_event .c-list_event_info .txt p { color: var(--txt-brown); font-size: var(--fs-16); line-height: 1.7; font-weight: 700; } [data-page=page] .c-ttl_h3 { text-align: center; } [data-page=page] .c-ttl_h3 p.ja { font-size: var(--fs-14-24); } [data-page=page] .c-ttl_h3 h3 { font-size: var(--fs-38-56); line-height: 1.2; color: var(--txt-brown); } [data-page=page] .c-ttl_h3 .lead p { font-size: var(--fs-12-14); line-height: 2; } [data-page=top] .c-ttl_h3 { text-align: center; } [data-page=top] .c-ttl_h3 p.ja { font-size: var(--fs-14-24); } [data-page=top] .c-ttl_h3 h3 { font-size: var(--fs-38-56); line-height: 1.2; color: var(--txt-brown); } [data-page=top] .c-ttl_h3 .lead p { font-size: var(--fs-12-14); line-height: 2; } [data-page=top] #s-fes .c-ttl_h3 .txt_place span { font-size: var(--fs-28); font-weight: 700; line-height: 1.7; position: relative; top: 2px; } [data-page=top] #s-fes .img_kv .txt_free p { color: var(--color-white); font-size: var(--fs-17-40); line-height: 1.1; } @media all and (min-width: 1280px) { [data-page=top] .c-ttl_h3 .txt_place span { top: 2px; } }