@charset "utf-8";
/* スマホ用（画面幅767px以下だけ読み込む。PC表示には効かない）2026-10-12 */

html { -webkit-text-size-adjust: 100%; }
body { min-width: 0; overflow-x: hidden; }
img { max-width: 100%; height: auto; }
body, p, li, dd, td, th { font-size: 14px; line-height: 1.7; }

/* 固定幅をすべて画面幅に */
header > div:first-of-type section,
header nav:first-of-type ul,
#slider, header > img, #breadcrumb, #main, #main > section, #main > aside,
.home #main > section:first-of-type, .home #main > section:nth-of-type(2),
footer > section > div, small {
	width: auto !important;
	max-width: 100%;
	float: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	box-sizing: border-box;
}

/* ヘッダー */
header > div:first-of-type section {
	height: auto;
	padding: 12px 64px 12px 14px;
}
header > div:first-of-type section h1 { float: none; }
header > div:first-of-type section h1 img { width: 170px; }
header > div:first-of-type section p { display: none; }

/* PCのメニューは隠して三本線にする */
header nav:first-of-type { display: none; }

.sk-menu-btn {
	display: block;
	position: absolute;
	top: 50%;
	right: 10px;
	width: 44px;
	height: 44px;
	margin-top: -22px;
	padding: 0;
	border: 0;
	background: transparent;
	cursor: pointer;
}
.sk-menu-btn span {
	display: block;
	width: 24px;
	height: 2px;
	margin: 5px auto;
	background: #333;
	transition: transform .2s, opacity .2s;
}
.sk-menu-btn.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.sk-menu-btn.is-open span:nth-child(2) { opacity: 0; }
.sk-menu-btn.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.sk-spnav { display: none; border-bottom: 1px solid #ccc; background: #fff; }
.sk-spnav.is-open { display: block; }
.sk-spnav li { margin: 0 !important; padding: 0 !important; border-top: 1px solid #eee; list-style: none; }
.sk-spnav li a {
	display: block;
	position: relative;
	padding: 14px 40px 14px 16px;
	color: #333;
	font-size: 15px;
	text-decoration: none;
}
.sk-spnav li a:after {
	content: "";
	position: absolute;
	top: 50%;
	right: 18px;
	width: 7px;
	height: 7px;
	margin-top: -4px;
	border-top: 2px solid #d80c18;
	border-right: 2px solid #d80c18;
	transform: rotate(45deg);
}

/* メイン画像・スライダー */
#slider { height: auto; margin-bottom: 24px; background: none; }
#slider img { display: block; width: 100%; height: auto; }
header > img { width: 100% !important; height: auto; }

/* パンくず */
#breadcrumb ul { padding: 10px 14px 20px; }
#breadcrumb li { font-size: 12px; }

/* 本文 */
#main { margin-bottom: 40px; padding: 0 14px; }
#main > section, .home #main > section:first-of-type, .home #main > section:nth-of-type(2) { margin-bottom: 40px; }
#content > h1 { margin-bottom: 24px; }
#content section { margin-bottom: 40px; }
#content table { width: 100% !important; }
#content table, #content tbody, #content tr, #content th, #content td { box-sizing: border-box; }
#content img { height: auto !important; }
#content iframe, #content video { max-width: 100%; }
#content div, #content p, #content ul, #content ol, #content dl, #content section { max-width: 100%; box-sizing: border-box; }

/* 横に並んだ表は縦に積む */
#content th, #content td { display: block; width: auto !important; text-align: left !important; padding-right: 0 !important; }
#content th { padding-top: 10px; font-weight: bold; }

/* 浮動配置の解除（PC用の幅指定がある塊） */
#content [style*="width"] { max-width: 100% !important; }
#content [style*="float"] { float: none !important; }

/* 経営理念 */
.philosophy #content section p { margin: 0 6px; }
.philosophy #content li { margin: 0 6px 10px 26px; }

/* 会社情報 */
.corporate .fixHeight div:nth-of-type(odd),
.corporate .fixHeight div:nth-of-type(even) { float: none; width: auto; }
.corporate .fixHeight div:nth-of-type(odd) { margin-bottom: 4px; padding-bottom: 0; border-bottom: 0; font-weight: bold; }
.access div:first-of-type { float: none; width: auto; margin-right: 0; }

/* トップのニュース */
.home #main dt { float: none; margin: 0 0 4px; text-align: left; }
.home #main dt > div { display: inline-block; margin-right: 6px; }

/* お問い合わせ等のフォーム */
#content input[type="text"], #content input[type="email"], #content input[type="tel"],
#content select, #content textarea {
	width: 100% !important;
	max-width: 100%;
	box-sizing: border-box;
	font-size: 16px;
}
#content .parsonal-info-button .parsonal-info-button-link { padding: 8px 24px; }

/* サイドバー（本文の下に並べる） */
#main > aside { margin-top: 20px; }
#main > aside .inside { margin-bottom: 30px; }
#main > aside .inside p { margin-bottom: 16px; text-align: center; }
#main > aside .outside p { margin-bottom: 12px; text-align: center; }
#main > aside img { width: 100%; max-width: 360px; height: auto; }

/* フッター */
footer > section { height: auto; padding: 16px 14px 18px; }
footer ul { float: none; margin: 0 !important; }
footer li { display: inline-block; margin: 0 14px 10px 0; }
footer section div:first-of-type li, footer section div:nth-of-type(2) li { font-size: 13px; }
footer .company-address { flex-wrap: wrap; justify-content: flex-start; padding-top: 10px; }
footer .company-address p { font-size: 12px; line-height: 1.6; }
footer > p:last-of-type { height: auto; padding: 6px 14px; line-height: 1.6; text-align: center; }

/* トップのブランドバナーは2列 */
.home #main > section:first-of-type { display: flex; flex-wrap: wrap; justify-content: space-between; }
.home #main > section:first-of-type > h1 { width: 100%; }
.home #main > section:first-of-type > p { width: 48%; margin: 0 0 12px !important; }
.home #main > section:first-of-type > p img { width: 100%; }

/* 事業内容：写真の上、説明文は下に読める大きさで */
#karaoke > div img, #cafe > div img, #restaurant > div img { float: none !important; display: block; margin: 0 auto 8px; padding-bottom: 0 !important; }
#karaoke div p, #cafe div p, #restaurant div p {
	display: block !important;
	height: auto !important;
	padding: 0 0 18px !important;
	font-size: 14px !important;
}
#karaoke div p *, #cafe div p *, #restaurant div p * { font-size: inherit; }
#cafe .d-flex { flex-wrap: wrap; }

/* 個人情報保護方針：ページ用の li の余白がパンくずにも効くので打ち消す */
.policy #breadcrumb li { margin: 0 !important; padding: 0 !important; }

/* サイドバーのバナーは2列（本人指示 2026-10-12） */
#main > aside .inside, #main > aside .outside { display: flex; flex-wrap: wrap; justify-content: space-between; }
#main > aside .inside p, #main > aside .outside p { width: 48.5%; margin: 0 0 12px !important; }
#main > aside .inside p:last-of-type { margin-bottom: 12px !important; }
#main > aside img { width: 100%; max-width: none; }

/* トップのNEWS RELEASE・SHOP INFO.はスマホでは3件まで（本人指示 2026-10-12） */
.home #main > section:nth-of-type(2) > section > div > dl:nth-of-type(n+4) { display: none; }
