@charset "utf-8";

/* --------------------------------------------------------------
   トップだけに足す指定（指示書 2.「上部の告知」「一行告知」）。
   現行の top.css は書き換えず、この1本を後から読む。
   900px 以上の見た目で現行と変わるのは、画像だった「上部の告知」を
   同じ位置・同じ大きさの文字の枠にした所だけ。
   -------------------------------------------------------------- */

/* 上部の告知：現行は images/top/fixer.png（400×90）。
   同じ枠に文字で出す。重ね表示用の背景画像は出さない。
   K-14（hpmj8017774651 の 4-9）：枠を 400×90 から 430×115 に広げる。
   直すのはこの2か所の width・height だけ。css/top.css は変えない。 */
#top_navi3 li.navi08 { background: none; }

#top_navi3 li.navi08 a {
	display: block;
	width: 430px;
	height: 115px;
}

#top_navi3 .hpmj_kokuchi {
	display: block;
	width: 430px;
	height: 115px;
	box-sizing: border-box;
	padding: 8px 12px;
	background-color: #000000;
	color: #FFFFFF;
	font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "ＭＳ Ｐ明朝", "MS PMincho", serif;
	font-size: 15px;
	line-height: 24px;   /* 3行組み */
	text-align: left;
	overflow: hidden;
}

/* VF6024643：メイン告知のマウスオーバー。文字と同じ色の逆影＋輝度1.3（利用者の決定 2026-10-11 23:24 見本の4）。text-shadow に色を書かないと、それぞれの文字が自分の色で光る */
#top_navi3 li.navi08 a:hover .hpmj_kokuchi {
  color: rgb(255, 255, 255);
  filter: brightness(1.3);
  text-shadow: 0 0 4px, 0 0 10px;
}

/* 上部の告知の中の書式（許可集合。仕様 1-13）。
   行ごとの寄せは div、大きさと色は span、太字は b、リンクは a。 */
#top_navi3 .hpmj_kokuchi div { margin: 0; }
#top_navi3 .hpmj_kokuchi b { font-weight: bold; }
#top_navi3 .hpmj_kokuchi a { color: inherit; text-decoration: underline; }

/* 行間（4-5）。
   ・行に line-height の指定が無いとき＝既定。その行の高さは、枠の既定（上の 24px）と
     その行の文字の大きさ×1.2 の大きい方になる（max で書く。24px は上の値と同じ）。
   ・行に line-height:Npx が付いているときは、その行の高さはちょうど N px になる。
   vertical-align: top は、大きさの違う文字が同じ行に混じっても行の高さが
   指定した値どおりになるようにするため（付けないと、文字の大きさの差の分だけ行が伸びる）。 */
#top_navi3 .hpmj_kokuchi span { line-height: max(24px, 1.2em); vertical-align: top; }
#top_navi3 .hpmj_kokuchi div[style*="line-height"] span { line-height: inherit; }

/* --------------------------------------------------------------
   新刊バナーの書影：マウスを載せたときの切り替え（指示書 4-4、仕様 1-21）。
   現行は js/smartRollover.js が img の src を _off → _on に差し替えていた。
   ここでは JavaScript を使わず、案内（a）の背景に切り替え用の画像を敷き、
   マウスを載せたときだけ上の通常画像を隠す（現行と同じ見え方）。
   背景の画像は作品ごとに inline の style で指定する。
   -------------------------------------------------------------- */
#container #top #mein02 #shinkan a.shinkan_img {
	display: inline-block;
	background-repeat: no-repeat;
	background-size: 100% 100%;
}

#container #top #mein02 #shinkan a.shinkan_img:hover img { visibility: hidden; }

/* 一行告知（D-9）：枠の幅を超える文字列のときだけ右から左へ流す。
   判定は js/headline.js。収まるときは何も起きない（現行と同じ見た目）。 */
#container #info01 {
	overflow: hidden;
	white-space: nowrap;
}

#container #info01 .headline_text { display: inline-block; }

#container #info01.scroll .headline_text {
	padding-left: 100%;
	animation-name: hpmj-headline-flow;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	animation-duration: 20s;   /* 実際の秒数は headline.js が長さから入れる */
}

@keyframes hpmj-headline-flow {
	from { transform: translateX(0); }
	to   { transform: translateX(-100%); }
}

/* --------------------------------------------------------------
   書影の影（hpmj8037221779 の束7-a・7-b。K-15・K-16）。

   書影の画像に焼き込まれていた影を画像から外し、ここで付ける。
   値は現行サイトの焼き込みの影を実測し、Chromium で描かせて突き合わせたもの
   （指示書 2-3）。影の範囲での差は、幅180 が平均1.99・最大5、
   幅106 が平均6.14・最大26（いずれも256段階中）。

   css/base.css・css/style.css・css/top.css は書き換えない（束7-a）。
   -------------------------------------------------------------- */

/* 作品一覧の書影（幅106） */
ul.book_ichiran li.books a img {
	box-shadow: 1.5px 1.5px 2px rgba(0,0,0,.30);
}

/* 作品ページの書影（幅180）。
   直下の img だけに当てる（books_picture1・books_picture2 の中には
   Amazon のボタン画像も入るため）。
   関連する本の小さい書影（books_picture_s）と翻訳本のページ（books_picture4〜6）は
   現行の画像をそのまま使っているので、影を足さない。 */
.books_picture1 > img,
.books_picture2 > img {
	box-shadow: 2px 3px 2.5px rgba(0,0,0,.50);
}

/* --------------------------------------------------------------
   作品一覧の重ね表示（束7-c。2026-09-16・17 の決定）。

   これまでは枠の背景に明るい画像（images/books/ichiran/on/…_on.jpg）を敷き、
   マウスを載せたときに通常の書影を隠して背景を見せていた。
   画像を作るのをやめたので、通常の書影を隠さず明るさだけを上げる。
   倍率 1.205 は現行サイトの 108 組を1組ずつ測った値（hpmj8029895814 の束1）。

   現行 css/base.css の `li a:hover img { visibility:hidden }` より強い書き方にして、
   作品一覧の書影だけに効かせる。
   -------------------------------------------------------------- */
ul.book_ichiran li.books a:hover img {
	visibility: visible;
	filter: brightness(1.205);
}

/* --------------------------------------------------------------
   hpmj8046807521 ②：赤い四角の箇条書き（仕様 1-13・F-33。利用者決定 2026-09-21）。

   編集サイトの自在編集画面（.bodybox）の中で、ul.text02 の項目を
   現行サイトと同じ赤い四角（images/shikaku_aka.png、左に 12px）で見せる。
   編集画面は style.css を読まないため（Layout.cs 29〜31行）ここに置く。

   セレクタの先頭に .bodybox を付けているので、公開サイトのどのページにも効かない
   （.bodybox は編集サイトにしか無い。厳命 0-1・受け入れ C-6・C-7）。
   -------------------------------------------------------------- */
.bodybox ul.text02 li { list-style: none; padding-left: 12px; background: url(../images/shikaku_aka.png) no-repeat left top; }

/* hpmj8054823426：汎用固定ページの本文で、右に置いて本文を回り込ませる画像（<figure class="right">）。
   ＜この番号＞：余白を現行サイトに合わせる（利用者決定 2026-09-22 案ア）。現行は表の中に幅10pxの空きセルを1つ置いており、
   本文側だけに10px、上下は0。あわせて左に置く画像（<figure class="left">）を足す。
   display: table と figcaption の display: table-caption は、キャプションの1行が画像より長いときに
   入れ物が横へ広がるのを止めるためのもの（現行は <table width="179"> で幅を固定していた）。
   width: min-content は使わない。幅375pxで入れ物が24pxまで潰れることを実測したため。 */
figure.right { float: right; margin: 0 0 0 10px; }
figure.left { float: left; margin: 0 10px 0 0; }
/* hpmj8067231527long2738：右（左）に回り込む画像が続くとき、前の右（左）の回り込みの画像の下から始める。
   これが無いと、2枚目が1枚目の横に並び、文が狭い幅で折り返していた（真山組07。2026-09-24 に Claude が手元で再現） */
figure.right { clear: right; }
figure.left { clear: left; }
figure.left, figure.right { display: table; }
figure.left > figcaption, figure.right > figcaption { display: table-caption; caption-side: bottom; }
figure.left > img, figure.right > img { display: block; }
/* hpmj8062078338：汎用固定ページの本文で、中央に置く画像（<figure class="center">）。
   現行サイトの .text03（style.css：width 100%・text-align center・clear both）と同じく、
   画像とキャプションを本文の幅の中央に置き、前にある回り込みの画像の下から始める。上下の空きはほかの画像と同じ0。 */
figure.center { text-align: center; clear: both; }

/* hpmj8055752312：汎用固定ページの本文で、画像を横に並べる枠。当面値の間隔 12px */
.figrow { display: grid; gap: 12px; margin: 10px 0; clear: both; }
.figrow.figrow-2 { grid-template-columns: 1fr 1fr; }
.figrow.figrow-3 { grid-template-columns: 1fr 1fr 1fr; }
.figrow figure { margin: 0; }
.figrow img { max-width: 100%; height: auto; }

/* --------------------------------------------------------------
   ＜この番号＞：汎用固定ページの本文（versatileeditor.js が保存するもの）の見え方を、編集画面と同じにする
   （利用者決定 2026-09-23「編集画面と公開サイトの見え方は必ず合わせる」）。
   ここの指定は、汎用固定ページの本文だけが持つ印（blockquote.inyou・ul.jizai・ul.text09）にだけ効く。
   現行サイトのページの見え方は変わらない。
   -------------------------------------------------------------- */

/* C 引用。値は編集画面の edit.css 298行 .bodybox blockquote と同じ。
   P（利用者決定 2026-09-23 提案どおり）：前にある箇条書き（項目が float: left）や回り込みの画像に、引用の枠を重ねない（display: flow-root）。
   box-sizing は編集画面（edit.css 6行）と同じ border-box にする（寄せたときの幅の上限を編集画面と同じに数えるため）。 */
blockquote.inyou { display: flow-root; box-sizing: border-box; margin: 4px 0 4px 12px; padding-left: 8px; border-left: 3px solid #bbb; color: #444; }
/* N（利用者決定 2026-09-23）：寄せた引用は、縦線と文字をひとかたまりにして寄せる。枠の幅はいちばん長い行に合わせ、
   左の下がり 12px より左へは出さない。 */
blockquote.inyou[style*="text-align:right"] { width: fit-content; max-width: calc(100% - 12px); margin-left: auto; margin-right: 0; }
blockquote.inyou[style*="text-align:center"] { width: fit-content; max-width: calc(100% - 12px); margin-left: auto; margin-right: auto; }

/* D 黒い四角の箇条書き（利用者決定 2026-09-23「赤四角の仕様に同じ。見た目が違うだけ」）。
   style.css 53行 ul.text02 li と同じ値で、印の画像だけ shikaku_kuro.png にする。 */
ul.text09 li { width: 98%; float: left; margin: 0px; padding: 0px 0px 0px 12px; background-image: url("../images/shikaku_kuro.png"); background-position: left top; background-repeat: no-repeat; }

/* O（利用者決定 2026-09-23）：項目の中のリンクを、文の途中に置く（一部分だけリンクにできる）。
   base.css 23行 li a { display: block; } がサイト全体の li の中のリンクを1行にしているのを、汎用固定ページの箇条書き（ul.jizai）でだけ打ち消す。 */
ul.jizai li a { display: inline; }

/* L（利用者決定 2026-09-23 案ウ）：寄せを付けた項目は、印も文字と一緒に寄せる。
   寄せの付いていない項目には当たらない（HtmlFilter が書き出す style="text-align:center|right" の付いた li に限る）。
   項目の幅と左の余白（width:98%・padding-left:12px）は変えない。変えると項目の右に空きができ、次の段落の文字がそこへ入り込む（実測）。
   背景に置いていた印を消し、文字の前に同じ画像を置く。印と文字の間は4px（印8px＋4px＝従来の12px）。 */
ul.jizai li[style*="text-align:center"], ul.jizai li[style*="text-align:right"] { background-image: none; }
ul.jizai li[style*="text-align:center"]::before, ul.jizai li[style*="text-align:right"]::before {
  content: ""; display: inline-block; width: 8px; height: 12px; margin-right: 4px;
  background-position: left top; background-repeat: no-repeat; vertical-align: top;
}
ul.jizai.text02 li[style*="text-align:center"]::before, ul.jizai.text02 li[style*="text-align:right"]::before { background-image: url("../images/shikaku_aka.png"); }
ul.jizai.text09 li[style*="text-align:center"]::before, ul.jizai.text09 li[style*="text-align:right"]::before { background-image: url("../images/shikaku_kuro.png"); }

/* hpmj8080511644：目次の OFF の行・主要参考文献の空の行は赤い四角の印を付けない（#71・#73）。
   本番の印の無い行（dl.mokuji の dt・ul の中の文だけの行）と同じく、字下げ 0。 */
ul.text02 li.nomark { background-image: none; padding-left: 0; }
