body {
 font-family: "Meiryo", sans-serif;
}

table a{
 color:#0056b3;
 text-decoration:none;
}

table a:hover{
 text-decoration:underline;
 color:#003f7d;
}

.breadcrumb-top-line {
 border-top: 1px solid #ffffff;
 width: 900px;
 height: 1px;
 margin-top:7px;
}

.breadcrumb-bottom-line {
 border-top: 1px solid #B0BEC5;
 width: 900px;
 height: 1px;
 margin-bottom: 10px;
}

.breadcrumb {
 font-size: 9pt;
 color: #333;
 margin: 10px 0;
 margin-left:20px;
}

.breadcrumb a {
 color: #0056b3;
 text-decoration: none;
 margin: 0 4px;
}

.breadcrumb a:hover {
 color: #a0c4ff;
 text-decoration: none;
}


/*オプション・関連品*/
 table.option-table {
 border-collapse: collapse;
 margin-left:10px;
 width: 750px;  /* 列幅（調整可） */
 table-layout: fixed; /* セル幅を固定 */
}

 table.option-table td {
 border: 1px solid #808080;
 padding: 10px;
 width: 220px;  /* 列幅（調整可） */
 vertical-align: top;
 text-align: center;
}

 table.option-table img {
 display: block;
 margin: 0 auto;
 max-width: 100%;
 max-height: 120px;
 height: auto;
 object-fit: contain;
} 

.image-wrapper {
 height: 120px; /* 画像領域を固定 */
 display: flex;
 align-items: center;
 justify-content: center;
 margin-bottom: 6px;
}

 table.option-table a {
 text-decoration: none; /* 下線を消す */
 color: inherit;        /* 親要素の文字色を継承 */
 display: block;        /* リンク全体をブロック化してクリック範囲拡大 */
}

.option-title {
 font-size: 10pt;
 color: #0056B3;
 margin-bottom: 10px;
 font-weight: bold;
}

.option-description {
 display: block;
 font-size: 10pt;
 color: #333;
 margin-bottom: 0;
 line-height: 1.5;
 flex-grow: 1; /* 説明文が長い場合に高さを調整 */
}

 table.option-table td:empty {
 border: none;
 background: none;
}

 table.option-table td:not(:empty):hover {
 background-color: #F0F8FF;
 cursor: pointer;
}

 table.option-table td:empty { /* 空セルはホバー効果なし */
 border: none;
 background: none;
 cursor: default; 
}

 table.option-table td:not(:empty):hover img {
 opacity: 0.6;
 transition: opacity 0.3s ease;
}

.contact-button {
 display: inline-block;
 padding: 12px 24px;
 font-size: 18px;
 font-weight: bold;
 color: #333;
 background-color: #f8f8f8;
 border: 2px solid #ccc;
 border-radius: 6px;
 text-decoration: none;
 cursor: pointer;
 margin-left:15px;
 margin-top:10px;
}

.contact-button:hover {
 text-decoration:underline;
 color:#333;
}

.footer-nav {
 text-align: center;
 font-size: 10pt;
 color: #B0BEC5;
 margin-top: 40px;
}

.footer-nav a {
 color: #0056b3;
 text-decoration: none;
 margin: 0 8px;
}

.footer-nav a:hover {
 text-decoration:none;
 color:#a0c4ff;
}

.copy {
 font-size: 8pt;
 color:#333;
 text-align:center;
}

.copy a {
 text-decoration:none;
 color:#0056b3;
}

.copy a:hover {
 text-decoration:none;
 color:#a0c4ff;
}