@charset "utf-8";
/*
スマホ： 小川屋 2025
*/


/* --------------------------------------------------------------------------------
	html tag
-------------------------------------------------------------------------------- */
body {
	margin: 0 auto;
	padding: 0;
	line-height: 1.5;
	font-size: 3.8vw;
	-webkit-text-size-adjust: 100%;
	font-feature-settings: "palt";
	font-weight: 500;
	font-family: "Noto Serif", serif;
}
img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}

* {
	box-sizing: border-box;
	font-family: "Noto Serif", serif;
}

/* --------------------------------------------------------------------------------
	common
-------------------------------------------------------------------------------- */
.common * {
	margin: 0;
	padding: 0;
}
.common ul, .common ul li .common ol, .common ol li {
	list-style: none;
}
.common h1, .common h2, .common h3, .common h4, .common h5, .common h6, .common input, .common textarea {
	font-weight: normal;
	font-size: 1em;
}
.common table {
	border-collapse: collapse;
	border-spacing: 0;
	font-size: 1em;
}
.common a {
	text-decoration: none;
	color: #000;
}
.common a:link, .common a:visited {
	text-decoration: none;
}
.common a:hover, .common a:active {
	text-decoration: none;
}


/* --------------------------------------------------------------------------------
	class
-------------------------------------------------------------------------------- */
.clear {
	clear: both;
}
br.clear {
	display: block;
	margin: 0;
	padding: 0;
	clear: both;
	height: 0;
	border: none;
	visibility: hidden;
	font-size: 0;
}
.clearfix::after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}
.clearfix {
	min-height: 1%;
}
* html .clearfix {
	height: 1%;
	/*\*/ /*/
	height: auto;
	overflow: hidden;
	/**/
}
/********** プレースホルダー **********/
::-webkit-input-placeholder {
	color: #000;
}


/* --------------------------------------------------------------------------------
	device
-------------------------------------------------------------------------------- */
.device-sp {
	display: block;
}
.device-sp-inline {
	display: inline;
}
.device-pc {
	display: none;
}
.device-pc-inline {
	display: none;
}


/* --------------------------------------------------------------------------------
	container
-------------------------------------------------------------------------------- */
#container {
	
}


/* --------------------------------------------------------------------------------
	header
-------------------------------------------------------------------------------- */
#header {
	position: absolute;
	z-index: 20;
	width: 100%;
}



/* ----------------------------------------
ロゴ（absolute）
---------------------------------------- */
#header .h-logo {
	top: 4.5vw;
	left: 4.5vw;
	width: 29vw;
	
	transition: opacity 1s .5s ease-out;
	position: absolute;
	z-index: 10;
}
#header .h-logo img {
	display: block;
	width: 100%;
	height: auto;
}



/* ----------------------------------------
head-inner-wrap
---------------------------------------- */
#header .head-inner-wrap {
	display: none;
	
	width: 100%;
	height: 100%;
	
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	
	
	background-color: rgba(255, 255, 255, 0.95);
	transition: all 0.2s 0s ease-out;
	will-change: animate;
	opacity: 0;
	visibility: hidden;
}
#header .head-inner-wrap::before {
	content: "";
	display: block;
	width: 100%;
	height: 1px;
	background-color: #d6d6d6;
	position: absolute;
	top: calc(100% - 1px);
	z-index: 10;
	pointer-events: none;
}

/********** 開いているとき **********/
#header.nav-open .head-inner-wrap {
	display: block;
	
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	
	width: 100%;
	height: 100%;
	
	opacity: 1;
	visibility: inherit;
	transform: translateY(0);
	z-index: 10;
	
	overflow: auto;
	-webkit-overflow-scrolling: touch;
}
#header .head-inner {
	padding: 22vw 12vw 6vw;
}

/* ----------------------------------------
fixed：固定ロゴ
スマホでは消す
---------------------------------------- */
/* ヘッダー内の固定ロゴ */
#header .head-logo {
	display: none;
}

/* ----------------------------------------
グローバルナビ
---------------------------------------- */
#g-nav {
	
}
#g-nav {
	margin: 0 0 0 0;
}

/* ----------------------------------------
グローバルナビ内：メニューリスト
---------------------------------------- */
#g-nav ul.g-nav-list {
	padding: 0 0 12vw;
}

/* ul.g-nav-list li */
#header #g-nav ul.g-nav-list li {
	border-bottom: solid 1px #999;
}
#header #g-nav ul.g-nav-list li:first-child {
	border-top: solid 1px #999;
}

/* 最後の li */
#header #g-nav ul.g-nav-list li a {
	display: block;
	padding: 3.5vw 7vw 3.5vw 3vw;
	font-size: 5.2vw;
	font-weight: bold;
	
	background: url("../images/common-device-2025/h-icon-arr-big.png") no-repeat calc(100% - 4vw) 4.5vw;
	background-size: 2.2vw 4.8vw;
}

/* ----------------------------------------
グローバルナビ内：
お問い合わせ・オンラインショップ
---------------------------------------- */
/* --- ul.btn-list --- */
#header #g-nav ul.btn-list {
	margin: 0;
}

/* ul.btn-list li */
#header #g-nav ul.btn-list li {
	padding: 0 0 7vw;
	font-size: 3.8vw;
}

/* aタグ全体（ボタンのベース） */
#header #g-nav ul.btn-list li a {
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	padding: 2.5vw 7vw 2.5vw 3vw;
	text-align: center;
	/* 文字の大きさに合わせて矢印の縦位置を微調整する場合があります */
}

/* --- お問い合わせボタン --- */
#header #g-nav ul.btn-list li.btn-list-contact a {
	background-color: #fff;
	border: 1px solid #999;
	color: #333;
}

/* --- オンラインショップボタン --- */
#header #g-nav ul.btn-list li.btn-list-online a {
	background-color: #be3e11;
	border: 1px solid #be3e11;
	color: #fff;
}

/* 矢印アイコン */
#header #g-nav ul.btn-list li a i {
	position: absolute;
	right: 1.8vw;
	top: calc(50% - 1.6vw);
	width: 1.3vw;
	height: 2.9vw;
}

/* お問い合わせ */
#header #g-nav ul.btn-list li.btn-list-contact a i {
	background: url("../images/common-device-2025/h-icon-arr-contact.png") no-repeat 0 0;
	background-size: 100% 100%;
}

/* オンラインショップ */
#header #g-nav ul.btn-list li.btn-list-online a i {
	background: url("../images/common-device-2025/h-icon-arr-online.png") no-repeat 0 0;
	background-size: 100% 100%;
}


/* ----------------------------------------
h-btns
---------------------------------------- */
#header .h-btns {
	position: absolute; /* ヘッダー内の任意の位置に配置するため */
	top: 0;
	right: 0;
	
	width: 29.6vw;
}

/* ボタンリスト (横並び設定) */
#header .h-btns ul {
	display: flex; /* 子要素を横並びに */
	margin: 0;
	padding: 0;
	list-style: none;
	
	width: 100%;
}

/* 各リストアイテム */
#header .h-btns ul li {
	margin: 0;
	padding: 0;
}

/* 正方形のボタン：オンラインショップ */
#header .h-btns ul li .nav-btn-online {
	position: relative;
	z-index: 1000;
}
#header .h-btns ul li .nav-btn-online a {
	width: 14.8vw;
	height: 14.8vw;
	padding: 3vw 3.5vw 0;
	background-color: #be3e11; /* 背景色を設定 */
	display: flex;
	justify-content: center;
}

/********** 正方形のボタン：ハンバーガーメニューを開いたらオンラインのz-indexを変更 **********/
#header.nav-open .h-btns ul li .nav-btn-online {
	z-index: 1;
}



/* ======================================================= */
/* 1. 通常時（ボタンコンテナと要素の配置） */
/* ======================================================= */

/* メニュー */
#header .btn-open-close {
	display: block;
	position: absolute;
	width: 14.8vw;
	height: 14.8vw;
	top: 0;
	right: 0;
	z-index: 1000;
	background-color: #fff;
	cursor: pointer;
}
#header.nav-open .btn-open-close {
	background: transparent;
}

#header .btn-open-close .btn-open-close-box {
	overflow: hidden; 
	width: 14.8vw;
	height: 14.8vw;
	position: relative;
	top: 0;
	right: 0;
	background: #fff;
}

/* 各線 */
#header .btn-open-close .btn-open-close-box i {
	display: block;
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
	width: 6vw;
	height: 1px;
	background-color: #000;
	transition: transform 0.2s ease-out, opacity 0.2s ease-out, top 0.2s ease-out;
}

/* 1本目の線 */
#header .btn-open-close .btn-open-close-box i:nth-of-type(1) {
	top: 4.7vw;
}

/* 2本目の線（クロス中心点） */
#header .btn-open-close .btn-open-close-box i:nth-of-type(2) {
	top: 5.8vw;
}

/* 3本目の線 */
#header .btn-open-close .btn-open-close-box i:nth-of-type(3) {
	top: 6.8vw;
}

/* MENU文字画像コンテナ */
#header .btn-open-close .btn-open-close-box .h-btn-txt-menu {
	position: absolute;
	top: 4.5vw;
	left: 50%;
	transform: translateX(-50%);
	transition: opacity 0.2s ease-out;
	width: 8vw;
	height: auto;
}


/* ======================================================= */
/* 2. 開いているとき（#headerに.nav-openが付与） */
/* ======================================================= */

/* 1本目の線: 中央へ移動しながら45度回転 */
#header.nav-open .btn-open-close .btn-open-close-box i:nth-of-type(1) {
	transform: translateX(-50%) translateY(2vw) rotate(45deg);
}

/* 2本目の線: 中央に留まり、右に移動しながらフェードアウト */
#header.nav-open .btn-open-close .btn-open-close-box i:nth-of-type(2) {
	opacity: 0;
	transform: translateX(100%); 
}

/* 3本目の線: 中央へ移動しながら-45度回転 */
#header.nav-open .btn-open-close .btn-open-close-box i:nth-of-type(3) {
	transform: translateX(-50%) translateY(-2vw) rotate(-45deg);
}

/* MENU文字画像: 非表示 */
#header.nav-open .btn-open-close .btn-open-close-box .h-btn-txt-menu {
	opacity: 0;
}


/* オープン時： バツの位置・サイズ調整 */
#header.nav-open .btn-open-close .btn-open-close-box i {
	width: 9vw;
}
#header.nav-open.nav-open .btn-open-close .btn-open-close-box i:nth-of-type(1) {
	top: 5.3vw;
	left: 7.5vw;
}
#header.nav-open .btn-open-close .btn-open-close-box i:nth-of-type(2) {
	/* 2番目は消えている */
}
#header.nav-open .btn-open-close .btn-open-close-box i:nth-of-type(3) {
	top: 9.2vw;
	left: 7.5vw;
}


/* -----------------------------------------------------------------------------------
追従型ヘッダーはスマホでは消す
----------------------------------------------------------------------------------- */
#header .h-fix {
	display: none;
}


/* ----------------------------------------
h-contents：スマホの固定対象要素
---------------------------------------- */
#header .h-contents {
	/* #headerがabsoluteなので、この要素はposition指定なし */
}

/* h-fixed-spが付与された時（固定時） */
#header .h-contents.h-fixed-sp {
	position: fixed;
	width: 100%;
	top: 0;
	left: 0;
	z-index: 9999; /* .h-fix.fixedと同じように高い値を設定 */
	
	/* スライドダウン時のために高さをautoまたは明確に指定 */
	height: 14.8vw; /* ハンバーガーボタンの高さに合わせる */
	
	background: rgba(255, 255, 255, 0.95);
}

/* ----------------------------------------
ヘッダー内の要素の調整（固定時）
---------------------------------------- */

/* 固定時、ロゴ（h-logo）のスタイル調整 */
#header .h-fixed-sp .h-logo {
}


/* 固定時、ヘッダー内の他の要素（.h-btnsなど）の位置調整が必要であれば追記 */
#header .h-fixed-sp .h-btns {
	position: absolute; /* .h-contentsが固定されたので、h-btnsを再配置 */
	top: 0;
	right: 0;
}







/* --------------------------------------------------------------------------------
	wrapper
-------------------------------------------------------------------------------- */
#wrapper {
	padding: 0 0 19vw;
}


/* --------------------------------------------------------------------------------
	main
-------------------------------------------------------------------------------- */
#main {
	padding: 0 0 6vw;
}


/********** wp-pagenavi **********/
#main .wp-pagenavi {
	word-break: break-all;
	
	text-align: center;
	padding: 7vw 0 0;
	font-size: 4vw;
}
#main .wp-pagenavi .pages {
	padding: 1.5vw 2vw;
	border: none;
	color: #000;
	background: #fff;
}
#main .wp-pagenavi .current {
	padding: 1.5vw 2vw;
	border: none;
	color: #fff;
	font-weight: normal;
	background: #be3e11;
}
#main .wp-pagenavi .extend {
	padding: 1.5vw 2vw;
	border: none;
	color: #000;
	background: #fff;
}
#main .wp-pagenavi a {
	padding: 1.5vw 2vw;
	border: none;
	color: #000;
	background: #fff;
}


/* --------------------------------------------------------------------------------
	sub1
-------------------------------------------------------------------------------- */
#sub1 {
	padding: 0 3vw;
}

/********** TOP **********/
#sub1 .s1-btn-top {
	padding: 0 0 4vw;
}
#sub1 .s1-btn-top a {
	display: block;
	padding: 3.25vw 0 3.25vw 2vw;
	color: #fff;
	background: #6e6a2d;
}

/********** サイドバーメニュー **********/
#sub1 .sidebar-menu {
	padding: 0 0 2vw;
}
#sub1 .sidebar-menu .widget_recent_entries .widget-header, #sub1 .sidebar-menu .widget_recent_comments .widget-header, #sub1 .sidebar-menu .widget_categories .widget-header, #sub1 .sidebar-menu .widget_archive .widget-header {
	border-left: solid 5px #45bd14;
}
#sub1 .sidebar-menu .widget_recent_entries .widget-header span, #sub1 .sidebar-menu .widget_recent_comments .widget-header span, #sub1 .sidebar-menu .widget_categories .widget-header span, #sub1 .sidebar-menu .widget_archive .widget-header span {
	display: block;
	padding: 2.6vw 4vw;
	border-top: solid 1px #a0a0a0;
	border-right: solid 1px #a0a0a0;
	border-bottom: solid 1px #a0a0a0;
	font-weight: bold;
	font-size: 4.4vw;
}
#sub1 .sidebar-menu ul {
	padding: 1vw 0 7vw;
}
#sub1 .sidebar-menu ul li {
	display: block;
	padding: 1.2vw 1.2vw 1.2vw 5vw;
	background: url("images/common-device-2025/s1-icon-arr.png") no-repeat 1vw 2.7vw;
	background-size: 1.8vw auto;
}
#sub1 .sidebar-menu ul li a {
	display: block;
	font-size: 3.8vw;
}
#sub1 .sidebar-menu ul li:last-child a {
	border-bottom: none;
}
#sub1 .sidebar-menu .widget_archive {
	padding: 0 0 0;
}


/********** 検索 **********/
#sub1 .sidebar-menu .widget_search {
	padding: 6.5vw 0 0;
	border-top: dotted 1px #a0a0a0;
}
#sub1 .sidebar-menu .widget_search .widget-header {
	padding: 0 0 2.8vw;
	border-bottom: none;
	font-weight: bold;
	font-size: 4.4vw;
}
#sub1 .sidebar-menu .widget_search .screen-reader-text {
	display: none;
}
#sub1 .sidebar-menu .widget_search form div {
	display: flex;
	justify-content: space-between;
	width: 100%;
	font-size: 3.8vw;
}
#sub1 .sidebar-menu .widget_search #s {
	display: block;
	width: 78%;
	padding: 2.8vw 0;
	border: solid 1px #a0a0a0;
}
#sub1 .sidebar-menu .wp-block-search__button {
	display: block;
	padding: 2.8vw 5vw;
	border: none;
	color: #fff;
	background: #6e6a2d;
	white-space: nowrap;
}













/* --------------------------------------------------------------------------------
	footer
-------------------------------------------------------------------------------- */
#footer {
	
	
}
/********** ページトップボタン **********/
#footer #pagetop {
	position: fixed;
	z-index: 10;
	right: 3.7vw;
	bottom: 4.6vw;
}

/* リンク（aタグ） */
#footer #pagetop a {
	display: inline-block;
}

/* 画像（imgタグ） */
#footer #pagetop img {
	display: block;
}

/********** f-img **********/
#footer .f-img {
	margin: 0 0 5.5vw;
}

#footer .f-img img {
	width: 100%;
	height: 65vw;
	
	object-fit: cover;
}

/********** copyright **********/
#footer .copyright {
	padding: 0 0 10vw;
	text-align: center;
	font-size: 2.2vw;
}
#footer .copyright small {
	font-size: 1em;
}