/* style.lessをCSSにコンパイル 
   id: fapmed-id 内の要素にスタイルを適用します 
*/
/* 全体のレイアウト設定 */
body {
    padding-left: 20px;      /* 左側に20pxの余白を追加 */
    padding-right: 20px;
    line-height: 1.5;
    height: auto; 
    overflow: visible;
}
/* バナー風リンクのスタイル */
.banner-link {
    font-weight: bold;
    font-size: 1.1rem;
    color: #00B0F0;
    text-decoration: underline;
}

/* マウスを載せた時の変化（おまけ） */
.banner-link:hover {
    color: #008fcc;
    text-decoration: none;
}
/* --- メインコンテンツのスタイル --- */
#fapmed-id h1 {
    font-size: 50px;
    font-weight: bold;
    text-align: center;
    margin: 10mm 0 10mm; 
    padding: 0.5em 0;
    border-top: solid 5px #5D0C12;
    border-bottom: solid 5px #5D0C12;
}

#fapmed-id h2 {
    font-size: 24px;
    font-weight: bold;
    background-color: #5D0C12; 
    color: #e5e8e8;
    border-radius: 5px;
    margin: 20px 0 5px;
    padding: 2px 12px;
}

#fapmed-id h3 {
    font-size: 22px;
    font-weight: bold;
    border-bottom: dashed 2px #5D0C12;
    margin: 20px 0 5px;
    padding: 6px 14px;
}

#fapmed-id h4 {
    font-size: 18px;
    font-weight: bold;
    border-left: 3px solid #5D0C12;
    margin: 40px 0 10px;
    padding: 4px 16px;
}

#fapmed-id h5 {
    font-size: 16px;
    font-weight: bold;
    margin: 10px 0 5px 0;
    padding: 2px 0px;
}

#fapmed-id h6 {
    font-size: 12px;
    font-weight: bold;
    margin: 40px 0 10px;
    padding: 0px 20px;
}

/* 数字付きリストの1行目を太字にする */
#fapmed-id ol li p::first-line,
#fapmed-id ol li::first-line {
    font-weight: bold;
}

/* 引用内は太字を解除 */
#fapmed-id ol li blockquote::first-line,
#fapmed-id ol li blockquote p::first-line {
    font-weight: normal;
}

/* codeブロック */
#fapmed-id code {
    font-family: monospace;
}

/* 画像・svgに影 */
#fapmed-id img,
#fapmed-id svg {
    box-shadow: 0 0 5px #333;
    max-width: 100%;
    height: auto;
    display: block;
    margin: 10px 0 0  5px; /* 上の余白を10pxに広げて行間を確保 */
}
/* --- ロゴ関連 --- */
#logo-id img,
#logo-id svg {
    box-shadow: none; /* 影を完全に消去 */
}

/* 目次用の表（#contents-id） */
#contents-id table {
    font-size: 16px; 
    border-collapse: collapse;
    width: 100%;}

#contents-id th {
    background-color: #ffffff;
    border: none; 
    font-size: 1px; 
    line-height: 0;
    padding: 0;}

#contents-id td {
    background-color: #ffffff;
    border: none;
    padding: 0px 5px; /* 上下パディングを少し足すと読みやすくなります */
    vertical-align: middle; 
}
/* 奇数行を灰色にする  */
#contents-id tr:nth-child(odd) td {
    background: #eeeeee;
}
/* 1列目（番号など）：大きく太字*/
#contents-id tr td:nth-of-type(1) {
    font-size: 18px;
    font-weight: bold; 
    width: 40px;
    text-align: center;
}
/* 目次内のリンク装飾を消す */
#contents-id a {
    text-decoration: none;
    color: inherit;
}
#contents-id a:hover {
    text-decoration: underline;
}

/* --- ビデオリンク用 --- */
.video-link {
    display: inline-flex;
    align-items: center;
    text-decoration: none;
    color: #0088cc; /* 画像の色 */
    font-size: 16px;
    margin: 10px 0;
}

.video-link:hover {
    text-decoration: underline;
}

/* アイコンの間隔調整 */
.video-link span {
    margin-right: 5px;
    font-size: 1.2em;
}

/* テーブルの基本スタイル */
table  {
    border-collapse: collapse;
    width: 100%;
    margin: 15px 0;
}
th, td {
    border: 1px solid #ccc;
    padding: 8px;
    text-align: left;
}
th {
    background-color: #f2f2f2;
}

/* --- 設定項目用のテーブル --- */
.setting-table {
    border-collapse: collapse;
    width: auto;             /* コンテンツの幅に合わせる */
    min-width: 150px;        /* 短すぎないように最小幅を設定 */
    margin: 10px 0 25px 0px; /* 上 下 右 左（少しインデント） */
    font-size: 15px;
    box-shadow: 2px 2px 5px rgba(0,0,0,0.05); /* 軽い影で浮かせる */
}

.setting-table th {
    background-color: #f2f2f2;
    border: 1px solid #ccc;
    padding: 8px 15px;
    font-weight: bold;
    color: #333;
}

.setting-table td {
    border: 1px solid #ccc;
    padding: 8px 15px;
    background-color: #fff;
}

/* ---画像を並べるテーブル --- */
.image-fit-table {
    width: auto;      /* 幅をコンテンツ（画像）に合わせる */
    margin-left: 0;   /* 左寄せ */
    border-spacing: 0; /* セル間の隙間をなくす */
}

.image-fit-table th,
.image-fit-table td {
    padding: 2px 10px;       /* 左右に少しだけ余白があると見やすいです */
    text-align: center;
    font-size: 0.9em;        /* キャプションなので少し小さめに */
}
.datac {
    text-align: center;                /* 横方向中央 */
	white-space: nowrap;
}

.datal {
    text-align: left;                /* 横方向左 */
	white-space: nowrap;
}


/* 樹種や強度データなど、幅広のテーブルが必要な場合用の汎用クラス */
.full-width {
    width: 100% !important;
    margin-left: 0 !important;
}

/* 引用（メモ）のスタイル */
blockquote {
    background-color: #f9f9f9;
    border-left: 5px solid #D6D6D6;
    padding: 10px 20px;
    margin: 20px 0;
    color: #5C5C5C ;
}
/* 解説用ガイドテーブル (コピー&ペースト用など) */
.guide-table {
    border-collapse: collapse;
    width: auto;
    margin: 10px 0;
    background-color: #f6f6f6;
    border: 1px solid #ddd;
}

.guide-table th {
    background-color: #eee;
    padding: 10px;
    border-bottom: 1px solid #ddd;
    text-align: center;
}

.guide-table td {
    padding: 15px;
    vertical-align: top;
    border-right: 1px solid #ddd;
}
/* --- 矢印セルのスタイル --- */
.arrow-cell {
    vertical-align: middle !important; /* 縦方向中央 */
    text-align: center;                /* 横方向中央 */
    font-size: 24px;                   /* 矢印を大きく */
    font-weight: bold;
    color: #666;
    width: 20px;                       /* 幅を固定 */
}
/* リード文 */
.lead
{
	margin-top: 1em;/*上に、隙間を作る */
	margin-left: 0.5em;/*左に、隙間を作る */
	margin-bottom: 0.5em;/*下に、隙間を作る */
}
.indent/*「リスト形式の文章」や「注釈」設定*/
{
	margin-top: 0.5em;/*上に、隙間を作る*/
	margin-bottom: 0.5em;/*下に、隙間を作る*/
    padding-left:1em;/*左側に、余白を作る*/
	text-indent:-1em;/*一行目のインデント（マイナス値を指定しているので、ぶら下げ）*/
}
.indent1/*「リスト形式の文章」や「注釈」設定*/
{
	margin-top: 1.5em;/*上に、隙間を作る*/
	margin-bottom: 0.5em;/*下に、隙間を作る*/
    padding-left:1em;/*左側に、余白を作る*/
	text-indent:-1em;/*一行目のインデント（マイナス値を指定しているので、ぶら下げ）*/
}
.image
{
    margin:0px;
    padding:5px 0px;
}
.image2/* アイコン2 */
{
  	width: 20px;/*画像の幅*/
	height: 20px;/*画像の高さ*/
	vertical-align: middle;
	margin: 0 2px !important; /* 上下の余計な余白を消し、左右に少し隙間を作る */
    display: inline-block !important;/* インライン表示を強制し、改行を防ぐ */
    box-shadow: none !important; /* 影を消す */
}
/* 目次のスタイル */
.menu1 {
    list-style: none;
    padding: 0;
}

.menu1 li {
    margin-bottom: 10px;
}

.menu1 li a {
    display: block;
    padding: 12px 15px;
    text-decoration: none;
    color: #333;
    background-color: #fff;
    border: 1px solid #e0e0e0;
    border-left: 5px solid #004080; /* 左側のアクセント棒 */
}

.menu1 li a:hover {
    background-color: #f0f4f8;
    border-color: #004080;
}

.menu2 
{
      list-style: none;
      padding: 0;
      max-width: 450px;
}

.menu2 li 
{
      margin-bottom: 10px;
}
/* リンク：塗りつぶさず、細い枠線と文字色で表現 */
.menu2 li a 
{
      display: block;
      padding: 14px 20px;
      text-decoration: none;
      color: #000000;
      border: 1px solid #5D0C12; /* 細い指定色の枠線 */
      border-radius: 6px; /* 角を最小限に丸める */
      font-size: 16px;
      transition: all 0.2s ease;
}
/* ホバー時：背景を薄く色付け */
.menu2 li a:hover 
{
      text-decoration: none;
      padding-left: 30px; /* 少しだけ横に広がる動き */
}

.menu3 {
    list-style: none;
    padding: 0;
    margin: 0;
    max-width: 500px;
}

.menu3 li 
{
    margin-bottom: 10px;
}

/* 記号の代わりに「枠線」でボタンのように見せる */
.menu3 li a {
    display: block;
    padding: 4px 16px;
    text-decoration: none;
    color: #000000;
    background-color: #ffffff;
    border-left: 3px solid #5D0C12; /* 左側だけ太くしてアクセントに */
    font-weight: bold;
    margin: 10px 0 10px;
}
/* マウスを乗せた時の動作 */
.menu3 li a:hover 
{
     color: #5D0C12;
     text-decoration: none;
}

.menu4
{
     list-style: none;
     padding: 0;
     max-width: 500px;
}
.menu4 li {
     margin-bottom: 12px;
}
/* リンクのデザイン：背景の塗りをメインに */
.menu4 li a {
     display: block;
     padding: 14px 20px;
     text-decoration: none;
     color: #444;
     background-color: #f0f2f5; /* 落ち着いたグレー */
     border-radius: 6px;
     font-weight: bold;
     transition: all 0.2s ease;
}
/* マウスを乗せた時に、赤系のグラデーションで鮮やかに */
 .menu4 li a:hover {
     background-color: #7A141B; /* 少し明るい赤へ */
     opacity: 0.9;
     color: #ffffff;
     transform: translateX(4px);
     text-decoration: none;
}


.type
{ 
	margin-top: 0.5px;
}

.type1
{ 
	margin-top: 1px;
}
.type10
{ 
	margin-top: 10px;
}
.nobr
{
	white-space: nowrap;
}
.pagebreak {
  break-after: page;
}
a:link
{
	text-decoration:none; /*下線を消す*/
	color:#003CB9 ; /*未訪問リンクのカラー*/
}
a:visited
{
	text-decoration:none; /*下線を消す*/
	color:#003CB9 ; /*訪問済みリンクのカラー*/
}
a:active
{
	text-decoration:none; /*下線を消す*/
	color:#cc66ff ; /*クリックしたときのカラー*/
}
a:hover
{
	text-decoration:underline; /*下線を出す*/
	color:#9999ff ; /*マウスが乗ったときのカラー*/
}


.left {text-align: left;}
.center {text-align: center;}
.right {text-align: right;}
.top {vertical-align:top; /* 上で揃える */}
.bottom {vertical-align:bottom; /* 下で揃える */}
.middle {vertical-align:middle; /* 中央で揃える */}

.space-bottom{margin-bottom:10px;}
.space-bottom1{margin-bottom:30px;}
.space-bottom2{margin-bottom:60px;}
.space-bottom3{margin-bottom:90px;}
