/* .navi-in > ul li {
   border-radius: 13px !important;
 } */
  
/* ヘッダーメニューの角丸 */
.sub-menu {
 border-radius: 4px;
}

 /* .header, .header .site-name-text {
    color: #fff;
    font-size: 40px;
} */
 .site-name-text {
   display: none;
 }

 @media (min-width: 769px) {
   .header {
     background-image: url(https://www.notepcpower.com/wp-content/uploads/2026/04/3.png) !important;
     background-size: cover;
     /* background-position: center; */
     /* padding-top: 60px; 
  padding-bottom: 60px; */
     height: 300px;
     position: relative;
     object-fit: none;
     /* width: 3840px;      親要素の幅に合わせて表示枠を確保する場合 */
     /* height: auto;     高さを自動調整する場合 */
   }



   /* .header {
  background-image: url(bg_pc.png);
  background-size: cover;
  background-position: center;
  position: relative;
  height: 140px;
} */

   /* ロゴを重ねる */
   .header::after {
     content: "";
     position: absolute;
     inset: 0;
     background-image: url(https://www.notepcpower.com/wp-content/uploads/2026/04/logo2a.png);
     background-repeat: no-repeat;
     background-position: center center;
     background-size: auto 80%;
   }
 }

 /* position: relative;とセット リンク設定*/
 /* .header::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 10;
} */


 body {
   font-family: "Noto Sans JP", sans-serif;
   font-size: 18px !important;
   line-height: 2.2;
 }

#post-2271 .entry-title,
#post-19 .entry-title {
   font-size: 26px;
   line-height: 1.3 !important;
   /* color: #333; */
   color: #fff;
   border: 2px solid #4da3ff;
   border-radius: 10px;
   /* border-bottom: 2px solid #4da3ff; */
   padding: 15px 7px;
   background-color: #003366 !important;
   text-align: center;
 }

 a {
   text-decoration: none;
 }

 /* a:hover {
  text-decoration: underline;
} */

 /* ================================
   基本テキスト
================================ */
 .entry-content p {
   font-size: 18px;
   line-height: 2.0;
   /* margin: 1.7em 0; */
   color: #333;
 }

 /* ================================
   見出し（H2 / H3）
================================ */
 .entry-content h2 {
   font-size: 24px;
   font-weight: 700;
   padding-bottom: 8px;
   border-bottom: 2px solid #222;
   margin: 2.2em 0 1.2em;
 }

 .entry-content h3 {
   font-size: 22px;
   font-weight: 600;
   margin: 2em 0 1em;
 }

 /* ================================
   画像＋キャプション
================================ */
 .entry-content figure {
   margin: 2em 0;
   text-align: center;
 }

 .entry-content figcaption {
   font-size: 13px;
   color: #777;
   margin-top: 6px;
 }

 /* ================================
   箇条書き
================================ */
 .entry-content ul {
   margin: 1.6em 0 1.6em 1.0em;
   padding: 0 0 0 0.5em;
 }

 .entry-content ul li {
   /* margin: 0.6em 0; */
   line-height: 2.1;
 }

 ul li::marker {
   /* color: #ccc; */
   color: #6fa9a8;
   /* 青緑系 */
   color: #9bb6c9;
   /* スモークブルー */
   font-size: 0.7em;
   font-weight: 300;
 }

 /* ================================
   注意ボックス（赤系）
================================ */
 .box-alert {
   border-left: 4px solid #d9534f;
   background: #fff5f5;
   padding: 1em 1.2em;
   margin: 2em 0;
 }

 .box-alert strong {
   color: #d9534f;
 }

 /* ================================
   ポイントボックス（青系）
================================ */
 .box-point {
   border-left: 4px solid #0275d8;
   background: #f0f7ff;
   padding: 1em 1.2em;
   margin: 2em 0;
 }

 .box-point strong {
   color: #0275d8;
 }

 /* ================================
   表（比較表）
================================ */
 .entry-content table {
   width: 100%;
   border-collapse: collapse;
   margin: 2em 0;
   font-size: 15px;
 }

 .entry-content table th,
 .entry-content table td {
   border: 1px solid #ccc;
   padding: 10px 12px;
 }

 .entry-content table th {
   background: #f7f7f7;
   font-weight: 700;
 }



 /* まとめBOX */

 /* ボックス全体 */
 .article-points {
   background: #ffffff !important;
   border-radius: 8px !important;
   padding: 20px !important;
   margin: 30px 70px 30px 70px !important;

   border: 1px solid #e0e0e0 !important;
 }

 /* タイトル部分 */
 .points-title {
   font-size: 20px !important;
   font-weight: bold !important;
   margin-bottom: 15px !important;
   padding-bottom: 6px !important;
   display: inline-flex;
   /* ← これでアンダーラインが文字幅に合わせられる */
   align-items: center;
   gap: 8px;
   border-bottom: 2px solid #e0e0e0 !important;
   /* 文字幅に合わせたアンダーライン */
 }

 /* 横棒（三）アイコン */
 .points-icon {
   width: 18px;
   height: 2px;
   background: #333;
   position: relative;
   display: inline-block;
 }

 .points-icon::before,
 .points-icon::after {
   content: "";
   width: 18px;
   height: 2px;
   background: #333;
   position: absolute;
   left: 0;
 }

 .points-icon::before {
   top: -6px;
 }

 .points-icon::after {
   top: 6px;
 }

 /* リスト全体 */
 .points-list {
   counter-reset: number;
   list-style: none !important;
   padding-left: 0 !important;
   margin: 0 !important;
 }

 /* 各項目 */
 .points-list li {
   counter-increment: number;
   margin: 12px 0 !important;
   padding-left: 45px !important;
   position: relative;
   line-height: 1.7 !important;
   border-bottom: 1px solid #e0e0e0 !important;
   padding-bottom: 10px !important;
 }

 /* 番号の四角 */
 .points-list li::before {
   content: counter(number);
   position: absolute;
   left: 0;
   top: 0;
   width: 28px;
   height: 28px;
   background: #c8e36e !important;
   color: #333 !important;
   border-radius: 4px !important;
   display: flex;
   align-items: center;
   justify-content: center;
   font-weight: bold !important;
   font-size: 16px !important;
 }



 /* ================================

      スマホ対応（幅768px以下）

================================ */

 @media (max-width: 768px) {

   /* .logo{
    color: #fff;
    font-size: 30px !important;
} */

   /* body.home .entry-title { */
   .entry-title {
     font-size: 26px !important;
     padding: 0.2em 0.2em;
     /* line-height: 1.3 !important;
    color: #333; */
   }

   #post-1958 .entry-title,
   #post-1962 .entry-title,
   #post-1966 .entry-title {
     font-size: 22px !important;
     padding: 0.6em 0.8em;
     line-height: 1.3 !important;
     /* color: #333; */
     color: #fff;
     border: 2px solid #4da3ff;
     border-radius: 10px;
     /* border-bottom: 2px solid #4da3ff; */
     padding: 15px 10px 15px 18px;
     background-color: #003366 !important;
   }

   /* #post-15,
  #post-285,
  #post-1671,
  #post-1647 .entry-title {
    color: #333;
    background-color: #f9f9f9 !important;
    border: none;
  } */

   .header {
     background-image: url(https://www.notepcpower.com/wp-content/uploads/2026/04/df-3.png) !important;
     background-size: cover;
     background-position: center;
     /* padding-top: 0px; 
    padding-bottom: 0px; */
     height: 140px;
   }


   /* .header::after {
    background-position: left 20px center;
    background-size: auto 50%;
  } */

   安全なオーバーレイ
   /* .header-container {
  position: relative;
} */

   .header-container::before {
     content: "";
     position: absolute;
     inset: 0;
     background: rgba(0, 0, 0, 0.2);
     /* 透明度調整 */
     pointer-events: none;
     /* ← これが超重要 */
   }



   /* ボックスの余白を少し軽く */
   .article-points {
     padding: 16px !important;
     margin: 20px 0 !important;
   }

   /* タイトルの文字サイズを調整 */
   .points-title {
     font-size: 18px !important;
     gap: 6px;
   }

   /* 三本線アイコンを少し小さく */
   .points-icon,
   .points-icon::before,
   .points-icon::after {
     width: 14px;
   }

   .points-icon::before {
     top: -5px;
   }

   .points-icon::after {
     top: 5px;
   }

   /* リストの左余白を縮める */
   .points-list li {
     padding-left: 38px !important;
     margin: 10px 0 !important;
   }

   /* 番号の四角を小さく */
   .points-list li::before {
     width: 24px;
     height: 24px;
     font-size: 14px !important;
   }

   /* ================================
   箇条書き 
================================ */
   .entry-content ul {
     margin: 1.6em 0 1.6em 0em;
     padding: 1em 1em 1em 1.2em;
   }
 }


 /* パネルUI追加 */
 #slide-panel {
   position: fixed;
   top: 0;
   right: -800px;
   width: 800px;
   height: 100%;
   background: #fff;
   box-shadow: -2px 0 8px rgba(0, 0, 0, 0.2);
   transition: right 0.3s ease;
   z-index: 9999;
 }

 #slide-panel.open {
   right: 0;
 }

 #search-frame {
   width: 100%;
   height: 100%;
   border: none;
 }

 /* 本文側UI */
 .topic-box {
   border: 1px solid #ddd;
   border-radius: 10px;
   padding: 18px 20px;
   background: #fff;
   margin: 28px 0;
 }

 .topic-box .topic-title {
   font-weight: 600;
   margin-bottom: 12px;
   font-size: 16px;
 }

 .topic-box ul {
   margin: 0;
   padding-left: 1.2em;
 }

 .topic-box li {
   margin-bottom: 10px;
   cursor: pointer;
   transition: color 0.2s ease;
 }

 .topic-box li:hover {
   color: #0078ff;
 }

 /*チェックマーク用*/

 .gold-check {
   list-style: none;
   padding-left: 0;
 }

 .gold-check li {
   position: relative;
   padding-left: 32px;
   margin-bottom: 12px;
   font-size: 17px;
   line-height: 1.6;
 }

 .gold-check li::before {
   content: "✔";
   position: absolute;
   left: 0;
   top: 0;
   font-size: 20px;
   color: #d4a017;
   /* 金色 */
   font-weight: bold;
 }

 .gold-circle-check {
   list-style: none;
   padding-left: 0;
 }

 .gold-circle-check li {
   position: relative;
   padding-left: 40px;
   margin-bottom: 14px;
   font-size: 17px;
   line-height: 1.6;
 }

 .gold-circle-check li::before {
   content: "✔";
   position: absolute;
   left: 0;
   top: 2px;
   width: 24px;
   height: 24px;
   background: #d4a017;
   /* 金色 */
   color: white;
   font-size: 16px;
   font-weight: bold;
   border-radius: 50%;
   display: flex;
   align-items: center;
   justify-content: center;
 }

 /* 関連パーツ */

 .related-link-box {
   margin-top: 40px;
   padding: 16px 20px;
   border-left: 4px solid #d4a017;
   /* ゴールドライン */
   background: #fafafa;
   border-radius: 6px;
 }

 .related-label {
   font-size: 14px;
   color: #666;
   margin-bottom: 6px;
   font-weight: bold;
   display: flex;
   align-items: center;
   gap: 6px;
 }

 .related-icon-img {
   width: 18px;
   height: 18px;
   object-fit: contain;
   display: inline-block;
 }

 .related-link {
   font-size: 17px;
   color: #0066cc;
   text-decoration: none;
   line-height: 1.6;
 }

 .related-link:hover {
   text-decoration: underline;
 }

 /* カテゴリーパーツ */

 .side-cat-list {
   display: flex;
   flex-direction: column;
   gap: 12px;
 }

 .side-cat-item {
   display: flex;
   align-items: center;
   gap: 10px;
   padding: 8px;
   background: #fafafa;
   border-radius: 6px;
   text-decoration: none;
   border: 1px solid #eee;
 }

 .side-cat-item img {
   width: 60px;
   height: 60px;
   object-fit: cover;
   border-radius: 4px;
 }

 .side-cat-item span {
   font-size: 15px;
   color: #333;
   font-weight: bold;
 }

 /*
.side-cat-item span {
  display: none;
}
*/

 .side-cat-item:hover {
   background: #f0f0f0;
 }

 /* 固定ページcontact-us 楕円 */

 .page-id-207 .eye-catch img {
   border-radius: 50% / 35%;
   /* 楕円 */
   object-fit: cover;
 }

 /* contact-form1 */

 /* Contact Form 7 送信ボタンのデザイン */
 .wpcf7 form .wpcf7-submit {
   display: block;
   margin: 20px auto;
   /* 中央寄せ */
   padding: 12px 84px;
   background-color: #7ecbff;
   /* 水色 */
   color: #fff;
   /* 文字色は白 */
   border: none;
   border-radius: 6px;
   /* 少し角丸で上品に */
   font-size: 16px;
   cursor: pointer;
   width: auto;
 }


 #footer {
   background-image: url("https://www.notepcpower.com/wp-content/uploads/2026/04/c00c7c2e3150a60b0c1fe2d450f7e996.png");
   background-size: cover;
   background-position: center;
   color: #fff;
 }

 .footer-links {
   /* white-space: nowrap; */
   text-align: center;
   padding: 15px 0;
 }

 .footer-links a {
   color: #fff;
   margin: 0 10px;
   text-decoration: none;
 }

 .footer-links a:hover {
   text-decoration: underline;
 }




 /* ヘッダー画像を1920px幅に拡大表示 */
 /* .logo-header img {
  width: 1920px;
  // height: 300px;
  object-fit: cover;
} */


 /* サイトマップ全体の余白と行間 */
 .sitemap ul {
   /* margin-left: 0.2em;
  line-height: 1.2; */
   /* list-style: none;
  padding-left: 0; */
 }

 /* リストの余白 */
 .sitemap li {
   margin: 4px 0;
 }

 /* カテゴリー名を強調 */
 .sitemap>a {
   font-weight: bold;
   font-size: 1.05em;
 }

 .sitemap h2 {
   font-size: 1.3em;
   margin-top: 1.4em;
   color: #ffffff;
   /* 濃い青で統一 */
   border-bottom: 2px solid #4da3ff;
   padding-bottom: 4px;
   background-color: #003366 !important;
 }


 /* リンクのデザイン（白文字＋ホバーで淡い白背景） */
 .sitemap a {
   text-decoration: none;
   /* color: #ffffff; */
   color: #003366;
   padding: 2px 4px;
   border-radius: 3px;
 }

 .sitemap a:hover {
   /* background-color: rgba(255,255,255,0.2); */
   background-color: rgba(233, 217, 174, 0.616);
 }

 /* リストの先頭に青系丸アイコン */
 /* .sitemap li::before {
  content: "●";
  color: #66ccff;
  margin-right: 6px;
  font-size: 0.6em;
} */


 /* サイトマップをカード風に */
 .sitemap {
   background: #f9f9f9;
   padding: 20px;
   border-radius: 8px;
   border: 1px solid #ddd;
 }



 /* post-1647の余白と行間 */
 .post-1647 ul {
   margin-left: 1.2em;
   line-height: 1.8;
   /* list-style: none;
  padding-left: 0; */
 }

 /* リストの余白 */
 .post-1647 li {
   margin: 4px 0;
 }

 /* カテゴリー名を強調 */
 .post-1647>a {
   font-weight: bold;
   font-size: 1.05em;
 }

 .post-1647 h2 {
   font-size: 1.3em;
   margin-top: 1.4em;
   color: #ffffff;
   /* 濃い青で統一 */
   border-bottom: 2px solid #4da3ff;
   padding-bottom: 4px;
   background-color: #003366 !important;
 }


 /* リンクのデザイン（白文字＋ホバーで淡い白背景） */
 .post-1647 a {
   text-decoration: none;
   /* color: #ffffff; */
   color: #003366;
   padding: 2px 4px;
   border-radius: 3px;
 }

 .post-1647 a:hover {
   /* background-color: #c2b2e7; */
   background-color: rgba(233, 217, 174, 0.616);
   /* background-color: rgba(255,255,255,0.2); */
 }

 /* リストの先頭に青系丸アイコン */
 /* .post-1647 li::before {
  content: "●";
  color: #66ccff;
  margin-right: 6px;
  font-size: 0.6em;
} */


 /* サイトマップをカード風に */
 .post-1647 {
   background: #f9f9f9;
   padding: 20px;
   border-radius: 8px;
   border: 1px solid #ddd;
 }

 @media screen and (max-width: 768px) {

   .entry-content p {
     font-size: 18px;
     line-height: 1.8;
   }

   .entry-content h2 {
     font-size: 20px;
   }

   .entry-content h3 {
     font-size: 19px;
   }

   .entry-content h4 {
     font-size: 18px;
   }

   .entry-content h5 {
     font-size: 17px;
   }

   .entry-content table {
     /* display: block; */
     overflow-x: auto;
     white-space: nowrap;
   }

   .toc-box {
     padding: 0.8em;
   }

 }







 /* 記事内のテーブル1 */

 /* 基本は100%（スマホなど） */
 .half-width-table {
   width: 100% !important;
   font-size: 16px !important;
   /* フォントサイズを18pxに */
 }



 /* 画面幅が広い時（PCなど）だけ50%にする */
 @media screen and (min-width: 768px) {
   .half-width-table {
     width: 80% !important;
     margin-left: auto !important;
     margin-right: auto !important;
     font-size: 18px !important;
   }

 }

 /* テーブル自体の設定 */
 .half-width-table table {
   width: 100% !important;
   border-collapse: collapse !important;
   /* 線を一本にまとめる */
   border: 1px solid #e0e0e0 !important;
   /* 外枠の線（薄いグレー） */
 }

 /* 1行目（ヘッダー部分）の背景色 */
 .half-width-table thead tr th {
   background-color: #f5f5f5 !important;
   /* 薄いグレーの背景 */
   border: 1px solid #e0e0e0 !important;
   /* ヘッダーの枠線 */
   font-weight: bold !important;
   padding: 10px !important;
 }

 /* 各セルの枠線と余白 */
 .half-width-table tbody td {
   border: 1px solid #e0e0e0 !important;
   /* 縦線と横線（薄いグレー） */
   padding: 10px !important;
   text-align: center !important;
   /* 文字を中央寄せにする場合（不要なら削除してください） */
 }

 /* スマホ表示では横幅を100%に戻す（レスポンシブ対応） */
 @media screen and (max-width: 767px) {
   .half-width-table {
     width: 100% !important;
     font-size: 16px !important;
     /* スマホでは少し小さくすると読みやすいです */
   }
 }

 /* Cocoonスキン「COLORS（ブルー）」の見出し装飾*/


 .entry-content h2 {
   padding-bottom: 12px;
   border-radius: 6px;
   /* ← 角丸 */
   border-bottom: 2px solid #0095d9;
 }

 .article h3 {
   border-left: solid 5px var(--cocoon-light-green-color) !important;
   padding: 15px 20px;
 }

 /* H3見出しの下線をテキスト幅に合わせる */
 .entry-content h3 {
   /* display: inline-block; */
   padding-bottom: 10px;
   /* margin-bottom: 12px; */
   margin: 0px 20px 12px 0px;
   background-color: #f2faf6;
   border-radius: 6px;
   /* ← 角丸 */
   border-bottom: 2px solid var(--cocoon-light-green-color) !important;
 }

 /* H4見出しのフォントサイズを調整 */
 /* H4のフォントサイズを確実に上書き */
 .entry-content h4,
 .article h4,
 .post h4 {
   font-size: 19px;
   font-weight: 600;
   background-color: var(--cocoon-xx-thin-color);
   border-bottom: 2px solid #eaf4fc !important;
   border-left: 2px solid #eaf4fc !important;
   border-radius: 6px;
   /* ← 角丸 */
   margin: 0px 40px 1.7em 0px;
 }

 .article h5 {
   border-bottom: 2px solid var(--cocoon-thin-color);
   margin: 0px 50px 0px 0px;
 }

 /* Cocoon 囲みボックスを文字幅に合わせて短くする */


 .is-style-border-radius-l-solid {
   border: solid 2px var(--cocoon-box-border-color);
   display: inline-block;
   width: auto;
 }


 .is-style-border-double,
 /* .label-box-content, */
 .caption-box,
 /* 見出しBOX */
 :where(.editor-styles-wrapper) .is-style-border-radius-s-convex,
 .is-style-border-thin-and-thick,
 .is-style-border-convex,
 .is-style-border-radius-l-convex,
 .is-style-border-solid,
 [class*="is-style-border-radius-s-"],
 [class*=is-style-blank-box-] {
   display: inline-block;
   width: auto;
 }

 .element.style {
   display: inline-block;
   width: 700px !important;
 }


 /* ============================
カスタムリスト：1
freeアイコン＋背景色＋行間調整
============================ */

 /* カスタムリスト：freeアイコン＋背景色＋行間調整 */
 .none-list,
 .free-list,
 .free-list2 {
   list-style: none;
   /* ・を消す */
   margin: 1.2em 0;
   padding: 0;
 }

 .none-list li {
   text-indent: 1em;
   margin-bottom: 1em !important;
 }

 .free-list li,
 .free-list2 li {
   position: relative;
   padding: 5px 12px 5px 36px;
   /* 左にアイコン分の余白 */
   margin: 0 140px 2px 0px !important;
   /* 行間 */
   background: #f7faff;
   /* 背景色（淡いブルー） */
   border-radius: 6px;
   /* 角丸 */
 }

 /* 行頭のfreeアイコン */
 .free-list li::before {
   content: "✔";
   /* 好きなアイコンに変更可能 */
   position: absolute;
   left: 12px;
   top: 50%;
   transform: translateY(-50%);
   font-size: 16px;
   color: #1e73be;
   /* Cocoonブルーに合わせた色 */
 }

 /* 行頭のfreeアイコン */
 .free-list2 li::before {
   content: "✅ ";
   position: absolute;
   left: 12px;
   top: 8px;
   /* transform: translateY(-50%); */
   font-size: 16px;
   color: #1e73be;
   /* Cocoonブルーに合わせた色 */
 }

 @media screen and (max-width: 600px) {

   .free-list li,
   .free-list2 li {
     margin: 0 0px 2px 0px !important;
   }

   .entry-content h3 {
     margin: 0px 0px 12px 0px;
   }

   .entry-content h4,
   .article h4,
   .post h4 {
     margin: 0px 0px 1.7em 0px;
   }

 }

 /* ============================
修理代テーブル
============================ */

 /* PCでは普通のテーブル */
 .repair-table {
   width: 100%;
   border-collapse: collapse;
   margin: 1.5em 0;
   font-size: 15px;
 }

 /* Cocoon のストライプを無効化 */
 .repair-table tr:nth-child(odd),
 .repair-table tr:nth-child(even) {
   background: #fff !important;
 }

 /* thead のみ色を付ける */
 .repair-table thead th {
   background: #f0f4ff;
   font-weight: bold;
 }

 .repair-table th,
 .repair-table td {
   padding: 10px;
   border-bottom: 1px solid #e5e8ec;
   text-align: left;
 }

 /* スマホではカード型に変換 */
 @media screen and (max-width: 600px) {
   .repair-table thead {
     display: none;
   }

   .repair-table tr {
     display: block;
     margin-bottom: 15px;
     background: #fafbfd;
     padding: 10px;
     border-radius: 6px;
   }

   .repair-table td {
     display: block;
     padding: 6px 0;
     border: none;
     font-size: 17px;
   }

   .repair-table td::before {
     content: attr(data-label);
     font-weight: bold;
     color: #333;
     display: block;
     margin-bottom: 2px;
   }
 }


 /* body.home ul liの方を修正 
.navi-in > ul .sub-menu {
    display: inline-block !important;
}*/

 /* 用語ラベルの1行目が上にくるため */
 .p-margin p {
   margin: 0.2em 0;
 }


 /* もし本文エリアだけを狙い撃ちしたい場合（テーマによりますが一般的） 
.post-1001 {
    font-size: 1.125rem;
}
*/
 /* 元が16pxなら18pxに相当 
.post-1001 .entry-content p{
    font-size: 1.125rem; 
}*/

 @media screen and (max-width: 480px) {}