/*
AF2025 Theme
[2025 Wikidot Theme]
by The Backrooms JP Wiki
*/
@import url('https://fonts.googleapis.com/css2?family=Yuji+Syuku&display=swap');
/* 変数の指定 */
:root {
--logo-image: none;
--header-title: "うらべ屋";
--header-subtitle: "お食事処";
--gray-monochrome: 34, 30, 30;
--medium-accent: 34, 30, 30;
--white-monochrome: 245, 245, 245;
--pale-gray-monochrome: 251, 251, 251;
--dark-accent: 50, 48, 48;
--link-color: 160, 78, 66;
--pale-accent: 136, 126, 96;
--visited-link-color: 136, 86, 76;
--header-font: 'Yuji Syuku', serif;
--title-font: 'Yuji Syuku', serif;
--header-h1-font-size: clamp(1.8rem, 1.0601rem + 3.1154vw, 2.8125rem);
--header-h2-font-size: clamp(1rem, 0.7716rem + 0.9615vw, 1.3125rem);
--gradient-header: linear-gradient(rgb(var(--medium-accent)) 0%, rgb(var(--medium-accent)) 100%);
--swatch-topmenu-border-color: var(--medium-accent);
--background-gradient-color: var(--medium-accent);
--header-gradient-color-bottom: var(--medium-accent);
--header-gradient-color-middle: var(--medium-accent);
--header-gradient-color-top: var(--medium-accent);
--swatch-topmenu-bg-color: var(--medium-accent);
--header-height-on-desktop: 5.5rem;
--header-height-on-mobile: 5.5rem;
/* Backrooms JP における interwiki のスタイル変数 */
/* interwiki-style で変数を引き継ぐために、いくつかの値の変更のない old-liminal 変数を あえて再定義する*/
--black-monochrome: 25, 20, 16;
--bright-accent: 140, 136, 126;
--sidebar-background-color: var(--white-monochrome);
--sidebar-title-background-color: var(--medium-accent), 0.5;
--sidebar-title-text-color: var(--white-monochrome);
--sidebar-title-shadow-color: var(--black-monochrome);
--sidebar-text-color: var(--black-monochrome);
--sidebar-hover-text-color: var(--black-monochrome);
--sidebar-border-color: var(--black-monochrome), .08;
--sidebar-hover-background-color: var(--bright-accent), .25;
}
/* ヘッダー・ページ全体の背景色を単色にする */
#skrollr-body {
background: none;
}
@supports (display:grid) {
div#container-wrap {
background: none;
}
}
/* ヘッダーの位置を調整 */
#header h1, #header h1 a {
width: 70%;
min-width: 320px;
justify-content: left;
}
@supports (display:grid) {
#header h1 a:before {
position: absolute;
top: 1.1rem;
left: clamp(4.9rem, 3.8038rem + 4.6154vw, 6.4rem);
}
}
#header h2, #header h2 span {
width: 80%;
}
#header h2, #header h2 span, #header h2 span::before {
justify-content: left;
}
#header h2, #header h2 span, #header h2 span::before {
top: 1.05rem;
left: 0.2em;
}
/* 検索バーをコンパクトな表示に変更する */
@supports (display:grid) {
/* PC版 */
@media only screen and (min-width:769px) {
div#search-top-box {
width: 2rem;
top: .2rem;
right: 14.5rem;
z-index: 21
}
#search-top-box-input {
display: none;
}
#search-top-box-form>input[type=submit], #search-top-box-form>input[type=submit]:focus, #search-top-box-form>input[type=submit]:hover, #search-top-box-form>input[type=submit]:target {
background: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23ddd%22%20d%3D%22M505%20442.7L405.3%20343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3%2044-79.7%2044-128C416%2093.1%20322.9%200%20208%200S0%2093.1%200%20208s93.1%20208%20208%20208c48.3%200%2092.7-16.4%20128-44v16.3c0%206.4%202.5%2012.5%207%2017l99.7%2099.7c9.4%209.4%2024.6%209.4%2033.9%200l28.3-28.3c9.4-9.4%209.4-24.6.1-34zM208%20336c-70.7%200-128-57.2-128-128%200-70.7%2057.2-128%20128-128%2070.7%200%20128%2057.2%20128%20128%200%2070.7-57.2%20128-128%20128z%22%2F%3E%3C%2Fsvg%3E") 50%/.8rem no-repeat, #000 !important;
border: none;
border-radius: 30%;
font-size: 0;
height: 1.2rem;
width: 1.2rem;
margin-top: .2rem
}
}
}
/* モバイル版 */
@media only screen and (max-width:768px) {
#search-top-box:not(:focus-within):before {
background-color: rgb(var(--black-monochrome));
right: 11px;
top: calc(var(--header-height-on-mobile)/ 2 - .6em)
}
#search-top-box {
top: -52px;
right: 21px;
}
#search-top-box form[id=search-top-box-form] {
visibility: visible;
}
#search-top-box form[id=search-top-box-form]:not(:focus-within) input[type=text] {
display: none;
}
#search-top-box form[id=search-top-box-form]:not(:focus-within) input[type=submit] {
background: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20512%20512%22%3E%3Cpath%20fill%3D%22%23ddd%22%20d%3D%22M505%20442.7L405.3%20343c-4.5-4.5-10.6-7-17-7H372c27.6-35.3%2044-79.7%2044-128C416%2093.1%20322.9%200%20208%200S0%2093.1%200%20208s93.1%20208%20208%20208c48.3%200%2092.7-16.4%20128-44v16.3c0%206.4%202.5%2012.5%207%2017l99.7%2099.7c9.4%209.4%2024.6%209.4%2033.9%200l28.3-28.3c9.4-9.4%209.4-24.6.1-34zM208%20336c-70.7%200-128-57.2-128-128%200-70.7%2057.2-128%20128-128%2070.7%200%20128%2057.2%20128%20128%200%2070.7-57.2%20128-128%20128z%22%2F%3E%3C%2Fsvg%3E) 50%/.8rem no-repeat, #000 !important;
border: none;
border-radius: 30%;
font-size: 0;
height: 1.2rem;
width: 1.2rem;
margin-top: .2rem;
color: #efefef;
padding: 2px 5px;
opacity: unset
}
#search-top-box:not(:focus-within):before {
display: none;
}
}
}
