/* 必要最低限のリセット */
* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

.cBT-dsgn {
    font-family: Arial, sans-serif;
    color: #333;
    background-color: #f9f9f9;
}

.cBT-dsgn a {
    color: inherit;
    text-decoration: none;
}

.cBT-dsgn ul, .cBT-dsgn ol {
    list-style: none;
    margin: 0;
    padding: 0;
}

.cBT-dsgn img {
    max-width: 100%;
    height: auto;
    display: block;
}

.cBT-btn a {
    display: block;
    width: 100%;
    height: 100%;
    color: inherit;
    text-decoration: none;
}

/* 外側のデザイン要素 */
.cBT-dsgn {
    padding: 10px 20px 2px !important;
    background-color: #f9f9f9 !important;
    border: 2px solid #ccc !important;
    box-shadow: 5px 5px 15px rgba(0, 0, 0, 0.2) !important;
    border-radius: 10px !important;
}

/* コンテナ全体のレイアウト設定 */
.cBT-cont {
	padding: 10px 0px 0px ;
	margin: 20px  0px 2px ;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
}

/* 画像専用のスタイル */
.cBT-imgcont {
    width: 150px; /* 固定幅を指定 */
	flex-shrink: 0;     /*  "縮まない" ようにする */
    text-align: center; /* 画像を中央揃え */
    margin: -10px 0px 0px ; /* 上下に適切な余白を設定 */
}

.cBT-imgcont img {
    width: 150px; /* 固定幅を指定 */
    max-width: none;    /* 100%指定を上書き */
    height: auto; /* アスペクト比を維持 */
    display: block; /* 余分な余白を防ぐ */
}

.cBT-imgcont2 {
    width: 150px; /* 固定幅を指定 */
	flex-shrink: 0;     /*  "縮まない" ようにする */
    text-align: center; /* 画像を中央揃え */
    margin: -10px 0px 0px ; /* 上下に適切な余白を設定 */
}

.cBT-imgcont2 img {
    width: 150px; /* 固定幅を指定 */
    max-width: none;    /* 100%指定を上書き */
    height: auto; /* アスペクト比を維持 */
    display: block; /* 余分な余白を防ぐ */
}

/* 書籍情報のコンテナ、タイトルとボタンを含む */
.cBT-info {
    flex-grow: 1 !important;
    text-align: left !important;
    margin: 0 10px 0 !important;
}

/* 書籍のタイトルリンクのスタイル */
.cBT-titl {
    position: relative;
    display: inline-block;
    color: #0056b3 !important;
    text-decoration: none !important;
    font-size: 18px !important;
    margin: -15px 0px 0 !important; /* 上下に2pxの余白、左右は0 */
    padding: 0px !important; /* 内側余白はなし */
    overflow: hidden !important; /* コンテンツが溢れた場合に隠す */
    text-overflow: ellipsis !important; /* 溢れた部分を省略記号にする */
    display: -webkit-box !important; /* Flexboxベースのマルチライン対応 */
    -webkit-line-clamp: 1 !important; /* 最大表示行数を1行に制限 */
    -webkit-box-orient: vertical !important; /* 垂直方向に表示を制限 */
}

.cBT-titl:hover {
    text-decoration: underline !important;
}

.cBT-titl2 {
    position: relative;
    display: inline-block;
    color: #0056b3 !important;
    text-decoration: none !important;
    font-size: 18px !important;
    margin: -15px 0px 0 !important; /* 上下に2pxの余白、左右は0 */
    padding: 0px !important; /* 内側余白はなし */
    overflow: hidden !important; /* コンテンツが溢れた場合に隠す */
    text-overflow: ellipsis !important; /* 溢れた部分を省略記号にする */
    display: -webkit-box !important; /* Flexboxベースのマルチライン対応 */
    -webkit-line-clamp: 1 !important; /* 最大表示行数を1行に制限 */
    -webkit-box-orient: vertical !important; /* 垂直方向に表示を制限 */
}

.cBT-titl2:hover {
    text-decoration: underline !important;
}


/* p要素の上下余白を調整 */
.cBT-info p {
    margin: -3px 5px 0 !important; /* 上下に2pxの余白、左右は0 */
    padding: 0 !important; /* 内側余白はなし */
}

/* ボタンを配置するためのグリッドコンテナ .cBT-btnc */
.cBT-btnc {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    width: 100%;
}

/* 画面幅600px以下：2列レイアウト */
@media (max-width: 601px) {
    .cBT-btnc {
        grid-template-columns: repeat(2, 1fr);
        grid-column-gap: 5px;
        grid-row-gap: 5px;
    }
}

/* 画面幅600px～800px：2列レイアウト */
@media (min-width: 600px) and (max-width: 800px) {
    .cBT-btnc {
        grid-template-columns: repeat(3, 1fr);
        grid-column-gap: 10px;
        grid-row-gap: 10px;
    }
}

/* 画面幅991x～1200px：2列レイアウト */
@media (min-width: 991px) and (max-width: 1200px) {
    .cBT-btnc {
        grid-template-columns: repeat(2, 1fr);
        grid-column-gap: 10px;
        grid-row-gap: 10px;
    }
}

/* 各ボタンの基本スタイル */
.cBT-btn {
    display: inline-flex !important;
    align-items: center !important;          /* 縦中央揃え */
    justify-content: center !important;      /* 横中央揃え */
    width: 100% !important;
    box-sizing: border-box !important;       /* padding込みで計算するなら */
    text-align: center !important;
    padding: 10px 3px !important;
    color: #FFF !important; /* ボタンのテキストを白色に統一 */
    text-decoration: none !important;
    border-radius: 10px !important; /* 角を丸くする */
    font-size: 16px !important; /* フォントサイズを少し大きく */
    font-weight: 600 !important; /* 文字を太くして視認性を高める */
    box-shadow: 
        inset 0 2px 2px rgba(255, 255, 255, 0.5), /* 上に光が当たる効果 */
        inset 2px 0 2px rgba(255, 255, 255, 0.5), /* 左側に光が当たる効果 */
        4px 4px 6px rgba(0, 0, 0, 0.4),           /* 右と下の外側の影 */
        0 0 10px rgba(255, 255, 255, 0.1);        /* 外側の微光 */
    text-shadow: 
        -1px -1px 0 rgba(0, 0, 0, 0.4), /* 上側に濃い影 */
        1px 1px 2px rgba(255, 255, 255, 0.8); /* 下側に白っぽい影で彫り込み効果 */
    transition: all 0.2s ease-in-out !important; /* スムーズなアニメーション */
    white-space: nowrap !important; /* テキストを1行にする */
    overflow: hidden !important; /* はみ出た部分を非表示 */
    text-overflow: ellipsis !important; /* はみ出た部分を省略記号に */
}

.cBT-btn a {
    display: inline-block !important;
    width: 100% !important;    /* 親(.cBT-btn)の幅をフル活用 */
    text-align: center !important; 
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    color: inherit;
    text-decoration: none;
    line-height: normal;
}

/* ボタンのスタイル（30色のプリセット） */
.btnBT-00FFFF { background-color: #00FFFF !important; } /* シアン */
.btnBT-0000FF { background-color: #0000FF !important; } /* 青 */
.btnBT-5F9EA0 { background-color: #5F9EA0 !important; } /* キャドmiumブルー */
.btnBT-6495ED { background-color: #6495ED !important; } /* コーンフラワーブルー(DMM) */
.btnBT-008B8B { background-color: #008B8B !important; } /* ダークサイアングリーン(公式サイト他) */
.btnBT-A9A9A9 { background-color: #A9A9A9 !important; } /* ダークグレー */
.btnBT-556B2F { background-color: #556B2F !important; } /* ダークオリーブグリーン */
.btnBT-E9967A { background-color: #E9967A !important; } /* ダークサーモン */
.btnBT-2F4F4F { background-color: #2F4F4F !important; } /* ダークスレートグレー */
.btnBT-00BFFF { background-color: #00BFFF !important; } /* ディープスカイブルー */
.btnBT-B22222 { background-color: #B22222 !important; } /* ファイアブリック(rakuten) */
.btnBT-DAA520 { background-color: #DAA520 !important; } /* ゴールデンロッド(ヤフオク) */
.btnBT-ADFF2F { background-color: #ADFF2F !important; } /* グリーンイエロー */
.btnBT-4B0082 { background-color: #4B0082 !important; } /* インディゴ */
.btnBT-D3D3D3 { background-color: #D3D3D3 !important; } /* ライトグレー */
.btnBT-FFA07A { background-color: #FFA07A !important; } /* ライトサーモン */
.btnBT-778899 { background-color: #778899 !important; } /* ライトスレートグレー */
.btnBT-FF00FF { background-color: #FF00FF !important; } /* マゼンタ */
.btnBT-0000CD { background-color: #0000CD !important; } /* ミディアムブルー */
.btnBT-7B68EE { background-color: #7B68EE !important; } /* ミディアムスレートブルー */
.btnBT-191970 { background-color: #191970 !important; } /* ミッドナイトブルー */
.btnBT-FFA500 { background-color: #FFA500 !important; } /* オレンジ(amazon) */
.btnBT-DB7093 { background-color: #DB7093 !important; } /* パレーピンク */
.btnBT-B0E0E6 { background-color: #B0E0E6 !important; } /* パウダーブルー */
.btnBT-FF0000 { background-color: #FF0000 !important; } /* 赤(メルカリ) */
.btnBT-FA8072 { background-color: #FA8072 !important; } /* サーモン */
.btnBT-87CEEB { background-color: #87CEEB !important; } /* スカイブルー */
.btnBT-00FF7F { background-color: #00FF7F !important; } /* スプリンググリーン */
.btnBT-D8BFD8 { background-color: #D8BFD8 !important; } /* シスル */
.btnBT-9ACD32 { background-color: #9ACD32 !important; } /* イエローグリーン */

/* ボタンの共通ホバー時スタイル */
.cBT-btn:hover {
    opacity: 0.9 !important;
    transform: translateY(-2px) !important;
    box-shadow: 
        inset 0 2px 2px rgba(255, 255, 255, 0.6),
        inset 2px 0 2px rgba(255, 255, 255, 0.6),
        6px 6px 8px rgba(0, 0, 0, 0.5),
        0 0 15px rgba(255, 255, 255, 0.2);
}

/* ボタンの共通クリック時スタイル */
.cBT-btn:active {
    transform: translateY(2px) !important;
    box-shadow: 
        inset 0 1px 1px rgba(255, 255, 255, 0.3) !important,
        inset 1px 0 1px rgba(255, 255, 255, 0.3) !important,
        2px 2px 4px rgba(0, 0, 0, 0.3);
}

    .cBT-btn {
        width: auto !important;
    }

/* キラキラ効果用のスタイル */
.cBT-btn {
    position: relative !important;
    overflow: hidden !important;
}

/* 左側の極細の輝き（疑似要素 :before） */
.cBT-btn:before {
    content: "";
    position: absolute;
    top: -50%;
    left: -50%;
    width: 30%;
    height: 200%;
    background: linear-gradient(45deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 100%);
    transform: rotate(45deg);
    /* アニメーション全体を8秒に設定 */
    animation: shineLeft 7s infinite linear;
}

/* 右側の細めの輝き（疑似要素 :after） */
.cBT-btn:after {
    content: "";
    position: absolute;
    top: -50%;
    left: -50%;
    width: 30%;
    height: 200%;
    background: linear-gradient(45deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 100%);
    transform: rotate(45deg);
    animation: shineRight 8s infinite linear;

}

/* 左側用のアニメーション */
@keyframes shineLeft {
    0%   { left: -50%; }
    3%  { left: 150%; }
    100% { left: 150%; }
}
@-webkit-keyframes shineLeft {
    0%   { left: -50%; }
    3%  { left: 150%; }
    100% { left: 150%; }
}

/* 右側用のアニメーション */
@keyframes shineRight {
    0%   { left: 150%; }
    3%   { left: -50%; }
    100% { left: -50%; }
}
@-webkit-keyframes shineRight {
    0%   { left: 150%; }
    3%   { left: -50%; }
    100% { left: -50%; }
}



/* ダブルサイズボタン（2カラム幅） */
.cBT-dub { 
    grid-column: span 2 !important; /* 横幅を2カラムに広げる */
    font-size: 18px !important; /* 必要に応じてフォントサイズを調整 */
    font-weight: bold !important; /* ボタンを目立たせる */
    text-align: center !important;
}

/* 高さが90%のボタン */
.cBT-shrt { 
    height: 98% !important; /* 通常ボタンの高さを96%にする */
    padding: 6px 3px 5px !important; /* 縦のパディングを調整 */
    font-size: 13px !important; /* 必要に応じてフォントサイズを調整 */
}

/* ダブルサイズかつ高さが90%のボタン */
.cBT-dsht { 
    grid-column: span 2 !important; /* 横幅を2カラムに広げる */
    height: 98% !important; /* 通常ボタンの高さを96%にする */
    padding: 6px 3px 5px !important; /* 高さに応じてパディングを調整 */
    font-size: 13px !important; /* 高さに合わせてフォントサイズを調整 */
    font-weight: bold !important; /* 必要に応じてボタンを目立たせる */
    text-align: center !important;
}

/* 共通ボタンスタイル（divタグに適用） */
div.cBT-btn {
    display: inline-flex !important;         /* flexで中身を配置 */
    align-items: center !important;          /* 縦中央揃え */
    justify-content: center !important;      /* 横中央揃え */
    width: auto;
    text-align: center;
    box-sizing: border-box !important;       /* padding込みで計算するなら */
    padding: 10px 3px;
    background-color: #f57c00; /* 元の背景色 */
    color: #fff; /* テキスト色 */
    text-decoration: none;
    border-radius: 10px; /* 角丸 */
    font-size: 16px;
    font-weight: 600;
    box-shadow: 
        inset 0 2px 2px rgba(255, 255, 255, 0.5),
        inset 2px 0 2px rgba(255, 255, 255, 0.5),
        4px 4px 6px rgba(0, 0, 0, 0.4),
        0 0 10px rgba(255, 255, 255, 0.1);
    text-shadow: 
        -1px -1px 0 rgba(0, 0, 0, 0.4),
        1px 1px 2px rgba(255, 255, 255, 0.8);
    transition: all 0.2s ease-in-out;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* ホバー時のスタイル */
div.cBT-btn:hover {
    opacity: 0.9;
    transform: translateY(-2px);
    box-shadow: 
        inset 0 2px 2px rgba(255, 255, 255, 0.6),
        inset 2px 0 2px rgba(255, 255, 255, 0.6),
        6px 6px 8px rgba(0, 0, 0, 0.5),
        0 0 15px rgba(255, 255, 255, 0.2);
}

/* クリック時のスタイル */
div.cBT-btn:active {
    transform: translateY(2px);
    box-shadow: 
        inset 0 1px 1px rgba(255, 255, 255, 0.3),
        inset 1px 0 1px rgba(255, 255, 255, 0.3),
        2px 2px 4px rgba(0, 0, 0, 0.3);
}

/* div内のaタグのスタイル */
div.cBT-btn a {
    display: block; /* クリック可能範囲を広げる */
    width: 100%; /* div全体をクリック範囲にする */
    height: 100%; /* div全体をクリック範囲にする */
    color: inherit; /* divの色を継承 */
    text-decoration: none; /* 下線を消す */
    line-height: normal; /* 必要に応じて調整 */
}


/* 親の a 要素は画像に合わせたサイズにする */
.cBT-imgcont {
    position: relative !important;
    display: inline-block !important;
    overflow: hidden !important;
}

/* 画像はレスポンシブ */
.cBT-imgcont img {
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
    overflow: hidden !important;
    z-index: 1 !important;
}

/* 親の a 要素は画像に合わせたサイズにする */
.cBT-imgcont2 {
    position: relative !important;
    display: inline-block !important;
    overflow: hidden !important;
}

/* 画像はレスポンシブ */
.cBT-imgcont2 img {
    display: block !important;
    max-width: 100% !important;
    height: auto !important;
    overflow: hidden !important;
    z-index: 1 !important;
}


@media (max-width: 768px) {
    .cBT-cont {
        flex-direction: column !important; /* 縦方向に要素を並べる */
        align-items: center !important; /* 要素を中央揃え */
    }

    .cBT-imgcont {
        margin-bottom: 10px !important; /* 下に適切な余白を追加 */
        width: 200px !important; /* 画像コンテナを親要素幅に適応 */
        text-align: center !important; /* 画像を中央に配置 */
    }

	.cBT-imgcont img {
    width: 200px;
  }

	.cBT-imgcont2 {
        margin-bottom: 10px !important; /* 下に適切な余白を追加 */
        width: 200px !important; /* 画像コンテナを親要素幅に適応 */
        text-align: center !important; /* 画像を中央に配置 */
    }
	
  .cBT-imgcont2 img {
    width: 200px;
  }

    .cBT-info {
        width: 100% !important; /* 情報コンテナを親要素幅に適応 */
    }

}


/* オーバーレイは親要素全体を覆う */
.cBT-imgcont .shayer,
.cBT-titl .shayer {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 1000px !important;    /* 仮の固定サイズ */
    height: 500px !important;   /* 仮の固定サイズ */
    transform: translate(-50%, -50%) !important; /* 中央揃え */
    z-index: 2 !important;
    pointer-events: none !important;
    overflow: visible !important;
    background: transparent !important;
}

/* 疑似要素の共通設定 */
.cBT-titl .shayer:before,
.cBT-titl .shayer:after,
.cBT-imgcont .shayer:before,
.cBT-imgcont .shayer:after {
    content: "";
    position: absolute;
    top: -50%;
    left: 150%;
    height: 200%;
    transform: rotate(45deg);
    pointer-events: none;
    z-index: 3;
}

/* 左側の輝き：幅を相対値で指定 */
.cBT-titl .shayer:after,
.cBT-imgcont .shayer:before,
.cBT-imgcont2 .shayer:before {
    width:10%;
    background: linear-gradient(45deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 100%) !important;
    animation: shineLeftReverse 10s infinite linear;
}

/* 右側の輝き */
.cBT-titl .shayer:before,
.cBT-imgcont .shayer:after,
.cBT-imgcont2 .shayer:after {
    width: 10%;
    background: linear-gradient(45deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 100%) !important;
    animation: shineRightReverse 9s infinite linear;
    animation-delay: 0.1s;
}

/* アニメーション（左側） */
@keyframes shineLeftReverse {
    0%   { left: 150%; }
    5%   { left: -50%; }
    100% { left: -50%; }
}
@-webkit-keyframes shineLeftReverse {
    0%   { left: 150%; }
    5%   { left: -50%; }
    100% { left: -50%; }
}

/* アニメーション（右側） */
@keyframes shineRightReverse {
    0%   { left: -50%; }
    5%   { left: 150%; }
    100% { left: 150%; }
}
@-webkit-keyframes shineRightReverse {
    0%   { left: -50%; }
    5%   { left: 150%; }
    100% { left: 150%; }
}


/* ボタンを配置するためのグリッドコンテナ .cBT-btnc2 */
.cBT-btnc2 {
    clear: both; /* 上部画像の影響を避ける */
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    width: 100%;
}

/* 画面幅600px以下：2列レイアウト */
@media (max-width: 601px) {
    .cBT-btnc2 {
        grid-template-columns: repeat(2, 1fr);
        grid-column-gap: 5px;
        grid-row-gap: 5px;
    }
}

/* 画面幅600px～800px：3列レイアウト */
@media (min-width: 600px) and (max-width: 800px) {
    .cBT-btnc2 {
        grid-template-columns: repeat(3, 1fr);
        grid-column-gap: 10px;
        grid-row-gap: 10px;
    }
}

/* 画面幅991x～1200px：3列レイアウト */
@media (min-width: 991px) and (max-width: 1200px) {
    .cBT-btnc2 {
        grid-template-columns: repeat(3, 1fr);
        grid-column-gap: 10px;
        grid-row-gap: 10px;
    }
}

@media (min-width: 991px){
  /* #sidebar 内のボタンコンテナ */
  #sidebar .cBT-btnc {
    grid-template-columns: repeat(2, 1fr) !important;
    grid-column-gap: 5px !important;
    grid-row-gap: 5px !important;
    width: 100% !important;
  }
}

@media (min-width: 991px){
  /* #sidebar 内のボタンコンテナ */
  #sidebar .cBT-btnc2 {
    grid-template-columns: repeat(2, 1fr) !important;
    grid-column-gap: 5px !important;
    grid-row-gap: 5px !important;
    width: 100% !important;
  }

  /* #sidebar 内のコンテナ全体 */
  #sidebar .cBT-cont {
    flex-direction: column !important;
    align-items: center !important;
  }

  /* #sidebar 内の画像コンテナ */
  #sidebar .cBT-imgcont {
    margin-bottom: 10px !important;
    width: 150px !important;
    text-align: center !important;
  }

  /* #sidebar 内の情報コンテナ */
  #sidebar .cBT-info {
    width: 100% !important;
  }
}


/* バナーPR表記 */
.cBT-spec0 {
    width: 100% !important;
    margin: -1px 0 15px 0 !important;
    padding: 1px 3px 1px 3px !important;
    font-size: 10px !important;
    text-align: right !important;
    color: #444 !important;
    background-color: #fbfbfb;
	border-top: 1px solid #ccc !important;
    overflow: hidden !important; /* コンテンツが溢れた場合に隠す */
    text-overflow: ellipsis !important; /* 溢れた部分を省略記号にする */
    display: -webkit-box !important; /* Flexboxベースのマルチライン対応 */
    -webkit-line-clamp: 1 !important; /* 最大表示行数を2行に制限 */
    -webkit-box-orient: vertical !important; /* 垂直方向に表示を制限 */
}

/* 諸元部分 */
.cBT-spec {
    width: 100% !important;
    margin: 3px 2px 3px !important;
    padding: 0 0 -5px !important;
    border-bottom: 1px solid #ccc !important;
    font-size: 11px !important;
    text-align: left !important;
    color: #808080 !important;
    overflow: hidden !important; /* コンテンツが溢れた場合に隠す */
    text-overflow: ellipsis !important; /* 溢れた部分を省略記号にする */
    display: -webkit-box !important; /* Flexboxベースのマルチライン対応 */
    -webkit-line-clamp: 1 !important; /* 最大表示行数を2行に制限 */
    -webkit-box-orient: vertical !important; /* 垂直方向に表示を制限 */
}

/* txt-PR表記 */
.cBT-spec1 {
    width: 100% !important;
    margin: -8px 0 10px 0 !important;
    padding: 2px 0 0 !important;
    font-size: 10px !important;
    text-align: left !important;
    color: #808080 !important;
    border-top: 1px solid #ddd !important;
    overflow: hidden !important; /* コンテンツが溢れた場合に隠す */
    text-overflow: ellipsis !important; /* 溢れた部分を省略記号にする */
    display: -webkit-box !important; /* Flexboxベースのマルチライン対応 */
    -webkit-line-clamp: 1 !important; /* 最大表示行数を2行に制限 */
    -webkit-box-orient: vertical !important; /* 垂直方向に表示を制限 */
}

/* 画像PR表記 */
.cBT-spec2 {
    width: 100% !important;
    margin: 0 0 -3px 0 !important;
    padding: 1px 0 0 0 !important;
    font-size: 10px !important;
    text-align: right !important;
    color: #808080 !important;
    border-top: 1px solid #ccc !important;
    overflow: hidden !important; /* コンテンツが溢れた場合に隠す */
    text-overflow: ellipsis !important; /* 溢れた部分を省略記号にする */
    display: -webkit-box !important; /* Flexboxベースのマルチライン対応 */
    -webkit-line-clamp: 1 !important; /* 最大表示行数を2行に制限 */
    -webkit-box-orient: vertical !important; /* 垂直方向に表示を制限 */
}


/* 提携ASP部分 */
.cBT-asp {
    width: 100% !important;
    margin-top: 5px !important;
    padding: 2px 2px 1px !important;
    border-top: 1px solid #aaa !important;
    font-size: 9px !important;
    color: #808080 !important;
    text-align: left !important;
    box-sizing: border-box !important;
    overflow: hidden !important; /* コンテンツが溢れた場合に隠す */
    text-overflow: ellipsis !important; /* 溢れた部分を省略記号にする */
    display: -webkit-box !important; /* Flexboxベースのマルチライン対応 */
    -webkit-line-clamp: 1 !important; /* 最大表示行数を1行に制限 */
    -webkit-box-orient: vertical !important; /* 垂直方向に表示を制限 */
}


/* リンクのスタイル（共通） */
.cBT-spec a, .cBT-spec0 a, .cBT-asp a {
    color: inherit !important; /* リンク色が文字色に影響しない */
    text-decoration: none !important; /* 下線を消す */
}

.cBT-spec a:hover, .cBT-spec0 a:hover, .cBT-asp a:hover {
    text-decoration: underline !important; /* ホバー時のみ下線を表示 */
}


.random-banner {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    justify-content: center;
}


.cBT-randbn {
	position: relative;
    display: flex;              /* flex に変更 */
    flex-wrap: nowrap;          /* 折り返し禁止 */
    align-items: center;        /* 垂直中央揃え */
    justify-content: center;    /* 横中央揃え */
    white-space: nowrap;        /* 改行を禁止 */
    overflow: hidden;           /* はみ出し部分を隠す */
}

.cBT-randbn > * {
    flex-shrink: 1;
    min-width: 0;
}

/* オーバーレイ（shayer）の設定：オーバーフローをhiddenに変更 */
.cBT-randbn .shayer {
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 1000px !important;      /* 仮の固定サイズ */
    height: 500px !important;      /* 仮の固定サイズ */
    transform: translate(-50%, -50%) !important; /* 中央揃え */
    z-index: 2 !important;
    pointer-events: none !important;
    overflow: hidden !important;   /* オーバーフローは隠す */
    background: transparent !important;
}

/* 疑似要素の共通設定 */
.cBT-randbn .shayer:before,
.cBT-randbn .shayer:after {
    content: "";
    position: absolute;
    top: -50%;
    left: 150%;
    height: 200%;
    transform: rotate(45deg);
    pointer-events: none;
    z-index: 3;
}

/* 左側の輝き：幅を相対値で指定 */
.cBT-randbn .shayer:before {
    width:10%;
    background: linear-gradient(45deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 100%) !important;
    animation: shineLeftReverse 8s infinite linear;
}

/* 右側の輝き */
.cBT-randbn .shayer:after {
    width: 10%;
    background: linear-gradient(45deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 100%) !important;
    animation: shineRightReverse 11s infinite linear;
    animation-delay: 0.1s;
}

/* アニメーション（左側） */
@keyframes shineLeftReverse {
    0%   { left: 150%; }
    5%   { left: -50%; }
    100% { left: -50%; }
}
@-webkit-keyframes shineLeftReverse {
    0%   { left: 150%; }
    5%   { left: -50%; }
    100% { left: -50%; }
}

/* アニメーション（右側） */
@keyframes shineRightReverse {
    0%   { left: -50%; }
    5%   { left: 150%; }
    100% { left: 150%; }
}
@-webkit-keyframes shineRightReverse {
    0%   { left: -50%; }
    5%   { left: 150%; }
    100% { left: 150%; }
}