/* mixin */
main:where(#obihiro-gourmetPC) { --colorB: #643D08; color: var(--colorB); font-size: 16px; font-weight: normal; font-style: normal; text-decoration: none; line-height: normal; overflow-x: clip; display: flex; flex-direction: column; justify-content: center; width: 100%; container-type: inline-size; }

main:where(#obihiro-gourmetPC) > #wrapper { --expansion: 40; width: calc(100cqi + var(--expansion) * 1cqi); container-type: inline-size; margin-left: calc(var(--expansion) * 1cqi / (-2)); }

main:where(#obihiro-gourmetPC) > * { --onepx: calc(100cqi / 1920); }

main:where(#obihiro-gourmetPC) * { color: inherit; font-size: 1em; font-weight: inherit; font-style: inherit; font-family: inherit; text-decoration: inherit; line-height: inherit; margin: 0; padding: 0; }

main:where(#obihiro-gourmetPC) a:hover { color: inherit; }

main:where(#obihiro-gourmetPC) a:is(:hover, :active) img { filter: none; }

main:where(#obihiro-gourmetPC) .sr-only { clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; }

main:where(#obihiro-gourmetPC) .center-size { width: calc(var(--onepx) * 1200); }

main:where(#obihiro-gourmetPC) :has(> .pc-bg) { margin-top: calc(var(--onepx) * (-1.5)); position: relative; display: grid; place-items: center; width: 100cqi; z-index: 1; }

main:where(#obihiro-gourmetPC) :has(> .pc-bg) > * { position: absolute; z-index: 2; }

main:where(#obihiro-gourmetPC) .pc-bg { width: 100%; position: relative; z-index: 1; }

main:where(#obihiro-gourmetPC) .o-g_hr { width: 100cqi; display: grid; place-content: center; margin-block: calc(var(--onepx) * (-87.8) / 2 - var(--onepx) * 1.5) calc(var(--onepx) * (-87.8) / 2); position: relative; z-index: 2; }

main:where(#obihiro-gourmetPC) .o-g_hr img { position: relative; width: calc(var(--onepx) * 1901.21); scale: 0.71; }

main:where(#obihiro-gourmetPC) .o-g_btn { --h: 45; --b: 1.2; display: block; height: calc(var(--onepx) * var(--h)); top: calc(var(--onepx) * var(--t)); left: calc(var(--onepx) * var(--l)); transition-property: scale, filter; transition-duration: 0.25s; transition-timing-function: ease; }

main:where(#obihiro-gourmetPC) .o-g_btn img { height: 100%; }

main:where(#obihiro-gourmetPC) #o-g_btnHfbt { --t: 752; --l: 602; }

main:where(#obihiro-gourmetPC) #o-g_btnBami { --t: 752; --l: 956; }

main:where(#obihiro-gourmetPC) #o-gGt_btn { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(var(--onepx) * 30); padding-inline: calc(var(--onepx) * 145); align-items: end; top: calc(var(--onepx) * 40); }

main:where(#obihiro-gourmetPC) #o-gGt_btn a { transition: scale 0.25s ease; }

main:where(#obihiro-gourmetPC) #o-gGt_btn img { width: 100%; }

main:where(#obihiro-gourmetPC) #video-tmp { height: calc(var(--onepx) * 370.6); aspect-ratio: 16/9; top: calc(var(--onepx) * 3239); left: calc(var(--onepx) * 631); }

main:where(#obihiro-gourmetPC) #video-tzwbk { height: calc(var(--onepx) * 297); aspect-ratio: 16/9; top: calc(var(--onepx) * 383); left: calc(var(--onepx) * 1032); }

main:where(#obihiro-gourmetPC) #o-g_link { display: grid; grid-template-columns: repeat(3, 1fr); width: calc(var(--onepx) * 1260); top: calc(var(--onepx) * 1921); left: calc(var(--onepx) * 330); }

main:where(#obihiro-gourmetPC) #o-g_link a { margin-right: calc(var(--onepx) * (-11)); transition-property: scale, filter; transition-duration: 0.25s; transition-timing-function: ease; }

main:where(#obihiro-gourmetPC) #limit-widthPC { position: fixed; top: 0; left: 0; width: 100%; height: 100lvh; display: grid; place-content: center; z-index: 2; background-color: #fff3; backdrop-filter: blur(2rem); padding: 1rem 1rem calc(100lvh - 100svh); }

main:where(#obihiro-gourmetSP) { --colorB: #643D08; color: var(--colorB); font-size: 16px; font-weight: normal; font-style: normal; text-decoration: none; line-height: normal; overflow-x: clip; width: 100%; }

main:where(#obihiro-gourmetSP) * { color: inherit; font-size: 1em; font-weight: inherit; font-style: inherit; font-family: inherit; text-decoration: inherit; line-height: inherit; margin: 0; padding: 0; }

main:where(#obihiro-gourmetSP) a:hover { color: inherit; }

main:where(#obihiro-gourmetSP) a:is(:hover, :active) img { filter: none; }

main:where(#obihiro-gourmetSP) .sr-only { clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%); height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; }

main:where(#obihiro-gourmetSP) #wrapper { width: 100%; display: grid; grid-template-columns: 1fr; justify-items: center; position: relative; overflow-y: clip; background-image: linear-gradient(to bottom, #f0f1, #0ff1, #ff01), url(../images/obihiro/gourmet/sp/o-g_wrapper.webp); background-size: cover, 380px; background-attachment: scroll, fixed; }

main:where(#obihiro-gourmetSP) #o-g_sidemenu { display: none; width: 100%; height: calc(100lvh - 51.2px - 40px); position: sticky; top: 40px; padding-bottom: calc(100lvh - 100svh); container-type: size; }

main:where(#obihiro-gourmetSP) #o-g_sidemenu img { width: 60cqb; max-width: 250px; }

main:where(#obihiro-gourmetSP) [id="o-g_main"] { width: 100%; position: relative; container-type: inline-size; max-width: 380px; }

main:where(#obihiro-gourmetSP) [id="o-g_main"] * { --mt: 0; --pt: 0; margin-top: calc(1cqi * var(--mt)); padding-top: calc(1cqi * var(--pt)); }

main:where(#obihiro-gourmetSP) [id="o-g_main"] img { --cqi: 85; width: calc(1cqi * var(--cqi)); }

main:where(#obihiro-gourmetSP) .grid-center { display: grid; justify-items: center; }

main:where(#obihiro-gourmetSP) .o-g_hr { display: grid; justify-items: center; margin-block: calc(100cqi / 715 * 89 / (-2)); }

main:where(#obihiro-gourmetSP) .o-g_hr img { --cqi: 100; }

main:where(#obihiro-gourmetSP) #o-gGt { background-image: url(../images/obihiro/gourmet/sp/o-gGt_bg.webp); background-size: 380px; }

main:where(#obihiro-gourmetSP) #o-gGf { background-image: url(../images/obihiro/gourmet/sp/o-gGf_bg.webp); background-size: 380px; }

main:where(#obihiro-gourmetSP) [class^="o-gGf"] { display: grid; justify-items: center; background-color: white; padding-top: 10cqi; clip-path: polygon(0 1.5cqi, 1.5cqi 0, calc(100% - 15cqi) 0, 100% 15cqi, 100% calc(100% - 1.5cqi), calc(100% - 1.5cqi) 100%, 1.5cqi 100%, 0 calc(100% - 1.5cqi)); }

main:where(#obihiro-gourmetSP) .o-gGf-r { scale: -1 1; }

main:where(#obihiro-gourmetSP) .o-gGf-r > * { scale: -1 1; }

main:where(#obihiro-gourmetSP) #o-gGd { background-image: linear-gradient(to top, #ED5A5Aff, #ED5A5A00 20cqi), url(../images/obihiro/gourmet/sp/o-gGd_bg.webp); background-size: auto, 380px; display: grid; justify-items: center; }

main:where(#obihiro-gourmetSP) .o-gGd_tootg { background-color: white; width: 100cqi; display: grid; justify-items: center; }

main:where(#obihiro-gourmetSP) .o-gGd_oras { width: 85cqi; display: grid; justify-items: start; }

main:where(#obihiro-gourmetSP) .o-gGd_oras img { width: auto; height: calc(100cqi / 380 * 28); }

main:where(#obihiro-gourmetSP) #o-gGd_tm { position: relative; display: grid; justify-items: center; }

main:where(#obihiro-gourmetSP) #o-gGd_tm iframe { position: absolute; top: 7.5cqi; width: 85cqi; aspect-ratio: 16/9; }

main:where(#obihiro-gourmetSP) #o-gGd_tm img { position: relative; }

main:where(#obihiro-gourmetSP) #o-gSt { background-color: #D5DEE4; background-image: url(../images/obihiro/gourmet/sp/o-gSt_bg.webp); background-size: 100%; margin-top: calc(-100cqi / 380 * 42.37); display: grid; justify-items: center; }

main:where(#obihiro-gourmetSP) #o-gSt_bk { background-color: white; border-radius: 8cqi; width: 100cqi; display: grid; justify-items: center; }

main:where(#obihiro-gourmetSP) #o-gSt_bk iframe { width: 85cqi; aspect-ratio: 16/9; }

main:where(#obihiro-gourmetSP) .o-gSt_tktmrt { width: 85cqi; }

main:where(#obihiro-gourmetSP) .o-gSt_tktmrt img { height: calc(100cqi / 380 * 28); width: auto; }

main:where(#obihiro-gourmetSP) #o-gSn { background-image: url(../images/obihiro/gourmet/sp/o-gSn_deco.webp), url(../images/obihiro/gourmet/sp/o-gSn_bg.webp); background-size: 100%, 100%; background-repeat: no-repeat, repeat-y; background-position: top center; display: grid; justify-items: center; }

main:where(#obihiro-gourmetSP) #o-gOt { background-image: linear-gradient(to top, #ED5A5Aff, #ED5A5A00 20cqi), url(../images/obihiro/gourmet/sp/o-gGd_bg.webp); background-size: auto, 380px; display: grid; justify-items: center; }

main:where(#obihiro-gourmetSP) #o-gOm { background-color: white; width: 100cqi; display: grid; justify-items: center; border-radius: 10cqi; }

main:where(#obihiro-gourmetSP) .o-gOm_moh { width: 85cqi; }

main:where(#obihiro-gourmetSP) .o-gOm_moh img { height: calc(100cqi / 380 * 28); width: auto; }

main:where(#obihiro-gourmetSP) #o-gOs { background-color: #CADBE5; background-image: url(../images/obihiro/gourmet/sp/o-gSt_bg.webp); background-size: 100%; margin-top: calc(-100cqi / 380 * 42.37); display: grid; justify-items: center; }

main:where(#obihiro-gourmetSP) .o-gOs { width: 85cqi; --h: 28; }

main:where(#obihiro-gourmetSP) .o-gOs img { height: calc(100cqi / 380 * var(--h)); width: auto; }

main:where(#obihiro-gourmetSP) #limit-widthSP { position: fixed; top: 0; left: 0; width: 100%; height: 100lvh; place-content: center; z-index: 2; background-color: #fff3; backdrop-filter: blur(2rem); padding: 1rem 1rem calc(100lvh - 100svh); display: none; font-size: 1.5rem; }

main:where(#obihiro-gourmetSP) ~ * { background-color: white; position: relative; z-index: 2; }

@media (min-width: 1200px) { main:where(#obihiro-gourmetPC) > #wrapper { --expansion: 20; } main:where(#obihiro-gourmetPC) .o-g_hr img { scale: 0.83; } main:where(#obihiro-gourmetPC) #o-g_btnHfbt { --t: 300; --l: 1390; } main:where(#obihiro-gourmetPC) #o-g_btnBami { --l: 796; } }

@media (min-width: 1500px) { main:where(#obihiro-gourmetPC) > #wrapper { --expansion: 0; } main:where(#obihiro-gourmetPC) .o-g_hr img { scale: 1; } }

@media (any-hover: hover) { main:where(#obihiro-gourmetPC) .o-g_btn:hover { scale: 1.1; filter: brightness(var(--b)); } main:where(#obihiro-gourmetPC) #o-gGt_btn a:hover { scale: 1.1; } main:where(#obihiro-gourmetPC) #o-g_link a:hover { scale: 1.1; filter: brightness(0.8); } }

@media (min-width: 992px) { main:where(#obihiro-gourmetPC) #limit-widthPC { display: none; } main:where(#obihiro-gourmetSP) #limit-widthSP { display: grid; } }

@media (min-width: 760px) { main:where(#obihiro-gourmetSP) #wrapper { grid-template-columns: 1fr 380px 2rem; } main:where(#obihiro-gourmetSP) #o-g_sidemenu { display: flex; flex-direction: column; align-items: center; justify-content: space-evenly; } main:where(#obihiro-gourmetSP) #o-gGt_links { display: none; } }
