@charset "UTF-8";

/* ============================================================
   style.css  - comn.css をベースに、セマンティック要素対応・ページ固有スタイルを統合
   ============================================================ */


/* ===== 1. ベース（comn.css 由来） ===== */

html,
body {
    margin: 0;
    padding: 0;
}


/* リンク */
a:link {
    text-decoration: none;
    color: #5544cc;
}

a:visited {
    text-decoration: none;
    color: #5544cc;
}

a:hover {
    text-decoration: none;
    color: #ff8000;
}

a:active {
    text-decoration: none;
    color: #4c4c4c;
}

span.here {
    color: #ff8000;
}

ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

html {
    background-color: transparent;
    background-image: url(../img/comn_bk.jpg);
    background-repeat: repeat;
    background-attachment: scroll;
    background-position: 0% 0%;
}

body {
    color: #505070;
    font-family:
        -apple-system, BlinkMacSystemFont,
        'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3',
        'メイリオ', Meiryo,
        'ＭＳ Ｐゴシック', Osaka,
        sans-serif;
}

/* wrapper */
#wrapper {
    font-size: 12px;
    width: 984px;
    margin: 0 auto 23px;
}

/* ヘッダー（<header id="header"> → flex） */
#header {
    width: 984px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

#header p {
    margin: 0 0 0 7px;
}

ul.lang1 {
    margin: 15px 0 0 120px;
    display: flex;
    align-items: center;
}

ul.lang1 li {
    margin: 0 5px;
    display: flex;
    align-items: center;
}

ul.lang1 li img {
    height: 13px;
    width: 85px;
    vertical-align: middle;
    margin: 0;
}

ul.lang2 {
    margin: 20px 0 0 45px;
    float: left;
}

/* 他ページ用に float 保持 */
ul.lang2 li {
    margin: 0 5px;
}

ul.gmenu1 {
    margin: 5px 8px;
    display: flex;
    align-items: center;
}

ul.gmenu1 li {
    line-height: 17px;
}

/* gmenu2: flex に変更 */
ul.gmenu2 {
    margin: 0;
    float: none;
}

ul.gmenu2 li {
    margin: 0;
}

form {
    margin: 0;
    width: 233px;
    margin-left: auto;
    /* flex 文脈で右寄せ */
}

/* pgroup → flex */
#pgroup ul {
    display: flex;
}

#pgroup ul li {
    line-height: 0;
}

#pgroup ul.ptrack {
    background: #e3e6ff;
    height: 19px;
    align-items: center;
    margin-bottom: 11px;
    font-size: 80%;
    box-shadow: 0 6px 5px -1px rgba(100, 110, 200, 0.4);
}

#pgroup ul.ptrack li {
    display: flex;
    align-items: center;
    line-height: normal;
}

#pgroup ul.ptrack li img {
    display: block;
}

#pgroup ul.ptrack li a,
#pgroup ul.ptrack li span.here {
    margin: 0 8px;
}

#pgroup ul.ptrack li:first-child a {
    margin: 0;
}

#pgroup ul.ptrack li span.here {
    color: #ff6600;
}

#pgroup ul.ptrack a:hover {
    color: #ff6600;

}

/* フッター */
footer#footer {
    width: 984px;
    margin: 25px 0 50px;
    height: 124px;
    box-sizing: border-box;
    background-image: url(../img/comn_footerimg01.png);
    background-repeat: no-repeat;
}

footer#footer ul {
    padding: 0;
}

footer#footer ul li {
    float: none;
}

footer#footer p {
    padding: 3px 0 10px 20px;
}

/* smenu */
#smenu {
    width: 198px;
}

#smenu p {
    margin: 0;
}

#smenu ul li {
    line-height: 0;
}

#smenu ul li dd {
    margin: 0;
    width: 198px;
    background: transparent url(../img/compact_smbtn02_bk.png) no-repeat 0 0;
}

#smenu ul li dd li {
    padding: 0;
    height: 24px;
}

/* サイドメニュー各種 */
.smenu2 {
    margin: 80px 0 0 0;
    float: left;
    background-image: url(../img/comn_sm2_bk.png);
    width: 198px;
    height: 196px;
}

.smenu2-2 {
    margin: 80px 0 0 0;
    float: left;
    background-image: url(../img/comn_sm2_2_bk.png);
    width: 198px;
    height: 134px;
}

.smenu2-3 {
    margin: 80px 0 0 0;
    float: left;
    background-image: url(../img/comn_sm2_3_bk.png);
    width: 198px;
    height: 258px;
}

.smenu2-4 {
    margin: 80px 0 0 0;
    float: left;
    background-image: url(../img/comn_sm2_4_bk.png);
    width: 198px;
    height: 72px;
}

.smenu2 ul li,
.smenu2-2 ul li,
.smenu2-3 ul li,
.smenu2-4 ul li {
    margin: 10px 10px 15px 10px;
}

/* contentsArea / product → flex */
#contentsArea {
    margin: 13px 0 0 0;
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

#product {
    width: 766px;
    background: #ffffff;
    border: 1px solid #cbd1ff;
    border-radius: 10px;
    box-shadow: inset 0 0 4px rgba(180, 180, 255, 0.6);
}

#product .ptop {
    height: 78px;
}

#product .pfooter {
    height: 10px;
}

.ptop {
    background-color: #e3e6ff;
    border-bottom: 4px solid #081788;
    border-radius: 10px 10px 0 0;
}

.pcontents {
    padding: 0 38px;
    box-sizing: border-box;
}

.pfooter {
    background-image: url(../img/comn_contentsbk03.png);
}

/* pagetop */
.pagetop {
    display: none;
    position: fixed;
    bottom: 40px;
    right: 45px;
    z-index: 9999;
}

.pagetop a {
    display: block;
    background-color: #0022ff;
    text-align: center;
    color: #ffffff;
    font-size: 17px;
    text-decoration: none;
    padding: 23px 8px;
    opacity: 0.75;
    border-radius: 40px;
}

.pagetop a:hover {
    background-color: #2266ff;
    color: #00ff00;
}

/* floating-container */
.floating-container {
    display: flex;
    justify-content: center;
    position: fixed;
    margin: 0;
    padding: 0;
    line-height: 0;
    right: 0;
    bottom: 0;
    width: 100%;
    z-index: 9998;
}

.floating-button {
    display: block;
    margin-bottom: 1px;
    background-color: #fff;
    border: 2px solid #ccc;
    text-align: center;
    width: 33%;
    height: 60px;
    line-height: 80px;
}

.floating-button img {
    max-width: 100%;
    max-height: 100%;
}

button {
    padding: 0;
    font-family: inherit;
    appearance: none;
    cursor: pointer;
    background-color: transparent;
    border: none;
}

.buttonRound {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 320px;
    height: 64px;
    padding: 8px 24px;
    font-family: sans-serif;
    font-size: 16px;
    color: #fff;
    text-align: center;
    overflow-wrap: anywhere;
    background-color: #6fa24a;
    border-radius: 32px;
}

@media (any-hover: hover) {
    .buttonRound {
        transition: background-color 0.2s;
    }

    .buttonRound:hover {
        background-color: #54802f;
    }
}

.vertical-text {
    writing-mode: vertical-rl;
    text-orientation: upright;
}

.order-form {
    display: none;
    position: fixed;
    bottom: 40px;
    right: 45px;
    z-index: 9999;
}

.order-form a {
    display: block;
    background-color: #0022ff;
    text-align: center;
    color: #ffffff;
    font-size: 17px;
    text-decoration: none;
    padding: 23px 8px;
    opacity: 0.75;
    border-radius: 40px;
}

.order-form a:hover {
    background-color: #2266ff;
    color: #00ff00;
}

.chokuhan {
    color: #FF66CC;
}

.fade:hover {
    opacity: 0.5;
    transition: .4s;
}

.shadow:hover {
    box-shadow: 2px 2px 3px rgba(30, 60, 60, 0.5);
    transition: .3s;
}

img {
    border: 0;
    transition: .4s;
}

dl,
p,
h2,
h3 {
    margin: 0;
}

.blinking {
    animation: 0.6s linear 0s alternate none infinite running blink;
}

@keyframes blink {
    0% {
        opacity: 0;
    }

    19.9% {
        opacity: 0;
    }

    20% {
        opacity: 1;
    }

    100% {
        opacity: 1;
    }
}

.relative {
    position: relative;
}

img.han {
    position: absolute;
    z-index: 999;
}


/* ===== 2. ページ固有スタイル（旧 <style> ブロック） ===== */

/* AEO：FAQ・技術解説・選び方 */
.aeo-section {
    width: 100%;
    margin: 0 auto 20px;
    font-size: 12px;
    clear: both;
}

.aeo-section-title {
    background: #f0f4ff;
    border-left: 4px solid #3366ee;
    padding: 6px 10px;
    font-size: 13px;
    font-weight: bold;
    color: #133ea2;
    margin-bottom: 8px;
}

.aeo-guide-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 6px;
    margin-bottom: 10px;
}

.aeo-guide-step {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    font-size: 13px;
    line-height: 1.65;
    border: 1px solid #dde4f5;
    border-radius: 3px;
    padding: 7px 9px;
    background: #f7f9ff;
}

.aeo-step-num {
    background: #3366ee;
    color: white;
    width: 20px;
    height: 20px;
    min-width: 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: bold;
    flex-shrink: 0;
    margin-top: 2px;
}

.aeo-step-body {
    flex: 1;
    text-align: left;
}

.aeo-tech-more {
    font-size: 12px;
    font-weight: bold;
    color: #3366ee;
    text-decoration: none;
}

.aeo-tech-more:hover {
    text-decoration: underline;
}

.aeo-tech-box {
    background: #fff9ee;
    border: 1px solid #e8c96a;
    border-left: 4px solid #e8a020;
    padding: 8px 12px;
    margin-bottom: 6px;
    border-radius: 2px;
    font-size: 12px;
    line-height: 1.7;
    color: #444;
}

.aeo-tech-box h4 {
    color: #995500;
    font-size: 12px;
    margin: 0 0 5px;
}

.aeo-faq-item {
    border: 1px solid #dde4f5;
    margin-bottom: 5px;
    border-radius: 3px;
    overflow: hidden;
}

.aeo-faq-q {
    background: #f7f9ff;
    padding: 8px 12px;
    cursor: pointer;
    font-weight: bold;
    color: #133ea2;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 8px;
    user-select: none;
}

.aeo-faq-q:hover {
    background: #eef1fa;
}

.aeo-faq-q .q-label {
    background: #3366ee;
    color: white;
    font-size: 10px;
    padding: 1px 5px;
    border-radius: 2px;
    flex-shrink: 0;
    margin-top: 2px;
}

.aeo-faq-q .q-text {
    flex: 1;
    font-size: 12px;
}

.aeo-faq-q .q-toggle {
    color: #8899cc;
    font-size: 16px;
    flex-shrink: 0;
    line-height: 1;
}

.aeo-faq-a {
    display: none;
    padding: 8px 12px 10px 30px;
    font-size: 12px;
    color: #333;
    line-height: 1.75;
    background: #fff;
    border-top: 1px solid #dde4f5;
    text-align: left;
}

.aeo-faq-a.is-open {
    display: block;
}

.aeo-faq-a a {
    color: #3366ee;
    font-weight: bold;
    text-decoration: none;
}

.aeo-faq-a a:hover {
    text-decoration: underline;
}

/* フッター gmenu2（comn.css の float/margin を上書き） */
footer#footer .gmenu2 {
    font-size: 11px;
    margin: 0;
    padding: 20px 0 0 0;
    list-style: none;
    display: flex !important;
    float: none !important;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
}

footer#footer .gmenu2 li {
    float: none;
    /* comn.css の #footer ul li { float:left } を無効化 */
    margin: 0;
    /* comn.css の ul.gmenu2 li { margin:0 0 0 14px } を無効化 */
    padding: 0 0.5em;
}

/* リストメニュー共通（section-nav・gmenu1・gmenu2） */
.menu {
    list-style: none;
    padding: 0;
    margin: 0;
}

.menu li:not(:last-child)::after {
    content: "|";
    padding: 0 6px;
}

/* section-nav のみインライン表示 */
.section-nav li {
    display: inline;
    position: relative;
    margin-top: -2px;
    padding-top: 7px;
    padding-bottom: 4px;
}

/* section-nav 行間に全幅点線（上枠は section-nav::before/z-index:1 が担当、1行目の::before は上書きされる） */
.section-nav li::before {
    content: '';
    position: absolute;
    top: 2px;
    left: -9999px;
    right: -9999px;
    height: 1px;
    background: repeating-linear-gradient(90deg, #cbd1ff 0, #cbd1ff 3px, transparent 3px, transparent 6px) fixed;
}

/* テキスト揃え */
.ta-left {
    text-align: left;
}

.ta-center {
    text-align: center;
}

.ta-right {
    text-align: right;
}

/* フォントサイズ */
.fs-85 {
    font-size: 85%;
}

.fs-90 {
    font-size: 90%;
}

.fs-95 {
    font-size: 95%;
}

.fs-100 {
    font-size: 100%;
}

.fs-115 {
    font-size: 115%;
}

.fs-120 {
    font-size: 120%;
}

.fs-125 {
    font-size: 125%;
}

.fs-140 {
    font-size: 140%;
}

.fs-150 {
    font-size: 150%;
}

.fs-160 {
    font-size: 160%;
}

.fs-180 {
    font-size: 180%;
}

/* フォント色 */
.c-0033aa {
    color: #0033aa;
}

.c-0044aa {
    color: #0044aa;
}

.c-2255bb {
    color: #2255bb;
}

.c-3377ee {
    color: #3377ee;
}

.c-4499ff {
    color: #4499ff;
}

.c-ff0000 {
    color: #ff0000;
}

.c-ff00ff {
    color: #ff00ff;
}

.c-973922 {
    color: #973922;
}

.c-cc0000 {
    color: #cc0000;
}

.c-404040 {
    color: #404040;
}

.c-00aa00 {
    color: #00aa00;
}

.c-009900 {
    color: #009900;
}

.c-ff8000 {
    color: #ff8000;
}

/* 太字・フォントフェース */
.bold {
    font-weight: bold;
}

.font-arial-black {
    font-family: "Arial Black", sans-serif;
}

/* ページタイトル h1 */
h1.page-title {
    height: 78px;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    line-height: 1;
}

.page-title-main {
    color: #000088;
    font-family: 'HGS明朝E';
    font-size: 90%;
    font-weight: bold;
    font-style: italic;
    white-space: nowrap;
    display: inline-block;
    line-height: 13px;
    padding: 4px 0.5em;
    background: linear-gradient(to bottom, rgba(255, 255, 0, 0) 30%, #77eeff 100%);
}

.page-title-sub {
    display: block;
    font-size: 50%;
    font-weight: bold;
    font-style: normal;
    font-family: 'メイリオ', sans-serif;
    color: #000088;
    margin-top: 6px;
    white-space: nowrap;
    background: none;
}

/* pgroup 1行化 */
#pgroup>ul {
    padding: 0;
    margin: 0;
}

#pgroup>ul>li {
    margin: 0;
    padding: 0;
}

/* セクションヘッダー */
.sec-header {
    display: flex;
    width: 100%;
    margin: 0 auto;
    align-items: stretch;
    border-bottom: 1px solid #000;
}

.sec-header-bar {
    width: 8px;
    min-height: 30px;
    background-color: #3366ee;
    flex-shrink: 0;
}

.sec-header-title {
    flex: 1;
    display: flex;
    align-items: center;
    min-height: 30px;
}

.sec-header-title h2 {
    margin: 0;
    padding: 0;
}

/* セクション区切り（ダブル点線） */
.sec-spacer {
    margin: 48px 0;
}

/* 細区切り線（実線） */
hr.comn-hr {
    border: none;
    border-top: 1px solid #cbd1ff;
    width: 701px;
    margin: 24px auto;
    height: 0;
}

.sec-spacer::before {
    content: "";
    display: block;
    width: 100%;
    margin: 0 auto;
    border-top: 1px dotted #cbd1ff;
    border-bottom: 1px dotted #cbd1ff;
    height: 2px;
}

.sp-h18 {
    height: 18px;
}

.sp-h24 {
    height: 24px;
}

.sp-h36 {
    height: 36px;
}

/* ナビゲーション帯 */
.section-nav {
    width: 100%;
    margin: 18px auto 24px auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    padding: 0;
    font-size: 108%;
    line-height: 1.4;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
}

/* section-nav 上下の破線枠（z-index:1 で li::before を上書き、#fff で位相干渉を遮断） */
.section-nav::before,
.section-nav::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    height: 1px;
    background:
        repeating-linear-gradient(90deg, #cbd1ff 0, #cbd1ff 3px, transparent 3px, transparent 6px),
        #ffffff;
    z-index: 1;
}

.section-nav::before {
    top: 0;
}

.section-nav::after {
    bottom: 0;
}

/* 検索フォーム */
.search input[name="q"] {
    width: 149px;
    height: 15px;
}

.search input[type="submit"] {
    height: 22px;
}

/* 画像・メディア */
.img-overlay-wrap {
    position: relative;
}

.img-overlay-loupe {
    position: absolute;
    top: 25px;
    right: 20px;
}

.media-center {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.img-valign-n3 {
    vertical-align: -3px;
}

.img-mb5 {
    margin-bottom: 5px;
}

.text-italic {
    font-style: italic;
}

.img-mb7 {
    margin-bottom: 7px;
}

/* その他補助 */
.li-banner-top {
    padding-top: 35px;
}

.highlight-yl {
    background: linear-gradient(to bottom, rgba(255, 255, 0, 0) 40%, #e0ff40 80%);
}

.tax-num {
    color: #0044bb;
    font-size: 110%;
}

.gtm-hidden {
    display: none;
    visibility: hidden;
}

.cw-block {
    width: 100%;
    margin: 0 auto;
}

/* 製品概要 */
.product-intro {
    width: 100%;
    margin: 0 auto;
    display: flex;
    align-items: flex-start;
}

.product-intro-img {
    width: 437px;
    flex-shrink: 0;
    text-align: center;
}

.product-intro-features {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.feat-row {
    display: flex;
    align-items: flex-start;
    background: #fff;
}

.feat-bullet {
    white-space: nowrap;
}

/* 情報+画像 2列 */
.info-img-row {
    width: 100%;
    margin: 0 auto;
    display: flex;
    align-items: center;
}

.info-img-text {
    flex: 1;
}

.info-img-img {
    flex-shrink: 0;
    text-align: center;
}

/* 製品タイトルボックス */
.prod-title-box {
    width: 174px;
}

.prod-title-top {
    height: 3px;
    line-height: 0;
    font-size: 0;
}

.prod-title-name {
    height: 19px;
    background-image: url(../img/frame/titlebgd_w174.png);
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    justify-content: center;
}

.prod-title-name h3 {
    margin: 0;
    padding: 0;
    text-align: center;
}

/* ラインアップ */
.lineup-grid {
    width: 100%;
    margin: 0 auto;
    display: flex;
    align-items: flex-start;
}

.lineup-col {
    width: 190px;
    flex-shrink: 0;
    position: relative;
}

.lineup-col:first-child::after {
    content: "";
    position: absolute;
    right: 0;
    top: 10%;
    height: 80%;
    border-right: 1px dotted #cbd1ff;
}

.lineup-sep {
    width: 60px;
    flex-shrink: 0;
    display: flex;
    justify-content: center;
    padding-top: 4px;
}

.lineup-name {
    text-align: left;
    padding: 4px 0;
}

.lineup-desc {
    text-align: left;
    padding: 4px 0;
}

.lineup-price {
    background-color: #ffe9e9;
    text-align: center;
    padding: 4px 0;
}

.lineup-detail {
    text-align: center;
    padding: 4px 0;
}

.lineup-note-row {
    width: 100%;
    margin: 8px auto 0;
}

/* 機能グリッド（行グループの縦積みコンテナ） */
.feat-grid {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

/* 3列1行グループ（外枠付き）※ .feat-grid 内限定 */
.feat-grid .feat-row {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: auto 1fr;
    /* 行1: ヘッダー(auto), 行2: ボディ(1fr) */
    gap: 1px;
    background-color: #cccccc;
    border: 1px solid #cbd1ff;
    border-radius: 4px;
    overflow: hidden;
}

/* 各機能ブロック：subgrid で親の行トラックを共有し上下を揃える */
.feat-item {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 2;
}

.feat-item-hdr {
    background-color: #eeeeee;
    text-align: center;
    padding: 6px 4px;
}

.feat-item-body {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: center;
    padding: 4px;
    text-align: center;
    background-color: #ffffff;
}

/* バナーセル（上下中央揃え・白背景・2行分） */
.feat-item-banner {
    grid-row: span 2;
    align-self: stretch;
    background-color: #ffffff;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 4px;
}


/* 汎用 flex 行 */
.flex-row {
    width: 100%;
    margin: 0 auto;
    display: flex;
    align-items: flex-start;
}

.flex-row-mid {
    width: 100%;
    margin: 0 auto;
    display: flex;
    align-items: center;
}

.flex-main {
    flex: 1;
}

.flex-shrink {
    flex-shrink: 0;
}

.flex-col-140 {
    width: 140px;
    flex-shrink: 0;
    text-align: center;
}

.flex-col-300 {
    width: 300px;
    flex-shrink: 0;
    text-align: center;
}

/* 深度合成 */
.depth-row {
    width: 100%;
    margin: 0 auto;
    display: flex;
    align-items: flex-start;
}

.depth-col-a {
    width: 335px;
    flex-shrink: 0;
    text-align: center;
}

.depth-col-b {
    width: 20px;
    flex-shrink: 0;
    text-align: center;
}

.depth-col-c {
    flex: 1;
}

.depth-dl-row {
    display: flex;
    align-items: center;
}

.depth-dl-label {
    flex: 1;
    text-align: right;
}

/* 動画・三眼・解説動画・後払い */
.video-wrap {
    background-color: #000000;
    width: 100%;
    text-align: center;
}

.attach-row {
    width: 694px;
    margin: 0 auto;
    display: flex;
    align-items: flex-start;
}

.attach-text {
    flex: 1;
}

.attach-img {
    flex-shrink: 0;
    text-align: center;
}

.kaminaga-bottom {
    width: 100%;
    margin: 0 auto;
    display: flex;
    align-items: flex-end;
}

.kaminaga-left {
    flex: 1;
    text-align: right;
}

.kaminaga-right {
    flex-shrink: 0;
    text-align: right;
}

.bottom-info-row {
    width: 640px;
    margin: 0 auto 36px;
    display: flex;
    align-items: center;
}

.bottom-info-main {
    width: 370px;
    flex-shrink: 0;
    text-align: center;
}

.bottom-info-gap {
    width: 30px;
    flex-shrink: 0;
}

.bottom-info-btn {
    width: 160px;
    flex-shrink: 0;
    text-align: center;
}

.bottom-info-tel {
    width: 80px;
    flex-shrink: 0;
    text-align: center;
}

/* AEO 補助クラス */
.aeo-guide-title {
    text-align: center;
    font-weight: bold;
    color: #133ea2;
    margin-bottom: 3px;
}

.aeo-link-center {
    text-align: center;
    margin-top: 4px;
}

.aeo-link-nowrap {
    text-align: center;
    margin-top: 4px;
    white-space: nowrap;
}

.aeo-h4 {
    text-align: center;
}

.aeo-p {
    text-align: left;
    margin: 0 0 5px;
}

.aeo-faq-link {
    text-align: center;
    margin-top: 4px;
}

/* ヘッダーナビラッパー */
.header-nav {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

/* セクションヘッダー下余白（元テーブルの height:8px 行の代替） */
.sec-header-spacer {
    height: 8px;
}

/* ===== 3. ページ固有追加スタイル ===== */

/* aeo-section 幅690px版（35SLR index等） */
.aeo-section-690 {
    width: 690px;
    margin: 0 auto 20px;
    font-size: 12px;
    clear: both;
}

/* aeo-guide-step フォントサイズ12px版 */
.aeo-guide-step-02 {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    font-size: 12px;
    line-height: 1.65;
    border: 1px solid #dde4f5;
    border-radius: 3px;
    padding: 7px 9px;
    background: #f7f9ff;
}

/* カメラ対応表 */
.aeo-camera-table {
    width: 100%;
    border-collapse: collapse;
    margin: 10px 0 4px;
    font-size: 11px;
}

.aeo-camera-table th {
    background: #3366ee;
    color: white;
    padding: 5px 6px;
    text-align: center;
    border: 1px solid #3366ee;
    font-size: 11px;
}

.aeo-camera-table td {
    padding: 4px 6px;
    border: 1px solid #d0d8f0;
    text-align: center;
    vertical-align: top;
    color: #333;
    line-height: 1.4;
}

.aeo-camera-table tr:nth-child(even) td {
    background: #f4f7ff;
}

.aeo-camera-table .mark-best {
    color: #cc2200;
    font-weight: bold;
}

.aeo-camera-table td.td-label {
    text-align: left;
    font-weight: bold;
    font-size: 11px;
}

.aeo-camera-table td.td-models {
    text-align: left;
    font-size: 10px;
    color: #444;
}

/* カメラ対応表リンク */
.aeo-chart-link {
    text-align: right;
    font-size: 12px;
    font-weight: bold;
    margin-top: 4px;
}

.aeo-chart-link a {
    color: #3366ee;
    text-decoration: none;
    font-weight: bold;
}