@charset "utf-8";
/* ============================================================
   /security セキュリティ：多層防御を章立てで刷新（名前空間 .sec-）
   2025のデザイン言語に統一（navy #073b52 / accent #01a0e9）
   ============================================================ */

/* 共通 */
.sec-sec{ padding:64px 0; }
.sec-sec--tint{ background:#f3f9fd; }
.sec-lead{ max-width:720px; margin:14px auto 0; text-align:center; color:#5a6b75; font-size:.98rem; line-height:1.85; }

/* ---- FV 信頼チップ ---- */
.sec-chips{ display:flex; flex-wrap:wrap; gap:9px; margin-top:20px; }
.sec-chip{ display:inline-flex; align-items:center; gap:7px; background:#eaf6fe; color:#0561c5;
  border:1px solid #cfe8fa; border-radius:99px; padding:7px 15px; font-size:.82rem; font-weight:700; }
.sec-chip svg{ width:15px; height:15px; stroke:#0575c4; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

/* ---- カード（共通） ---- */
.sec-grid{ max-width:1000px; margin:40px auto 0; display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.sec-card{ background:#fff; border:1px solid #e3eef5; border-radius:18px; padding:30px 24px 28px; text-align:center;
  box-shadow:0 22px 50px -38px rgba(1,160,233,.5); transition:transform .18s, box-shadow .18s; }
.sec-card:hover{ transform:translateY(-4px); box-shadow:0 26px 54px -34px rgba(1,160,233,.55); }
.sec-card__ic{ width:62px; height:62px; margin:0 auto; border-radius:16px; background:linear-gradient(135deg,#01a0e9,#0575c4);
  display:flex; align-items:center; justify-content:center; box-shadow:0 12px 24px -12px rgba(1,160,233,.7); }
.sec-card__ic svg{ width:30px; height:30px; stroke:#fff; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.sec-card h3{ margin:18px 0 0; font-size:1.1rem; font-weight:800; color:#073b52; line-height:1.5; }
.sec-card p{ margin:11px 0 0; font-size:.9rem; color:#5a6b75; line-height:1.8; text-align:left; }
.sec-card__badge{ display:block; margin:14px auto 0; height:54px; width:auto; }

/* ---- 決済：非保持の宣言バナー ---- */
.sec-pay__statement{ max-width:780px; margin:34px auto 0; text-align:center; color:#fff;
  background:linear-gradient(135deg,#073b52,#0a587a); border-radius:18px; padding:28px 26px;
  box-shadow:0 26px 60px -34px rgba(7,59,82,.7); }
.sec-pay__statement b{ display:block; font-size:1.32rem; font-weight:800; line-height:1.55; }
.sec-pay__statement span{ display:block; margin-top:8px; font-size:.9rem; color:#bfe0f1; }

/* ---- データセンター 6項目 ---- */
.sec-dc__grid{ max-width:920px; margin:40px auto 0; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.sec-dc__item{ background:#fff; border:1px solid #e3eef5; border-radius:16px; padding:24px 18px; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:14px; transition:transform .18s, border-color .18s; }
.sec-dc__item:hover{ transform:translateY(-3px); border-color:#bfe0f6; }
.sec-dc__ic{ width:52px; height:52px; border-radius:14px; background:#eaf6fe; display:flex; align-items:center; justify-content:center; }
.sec-dc__ic svg{ width:26px; height:26px; stroke:#0575c4; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.sec-dc__item p{ margin:0; font-size:.9rem; font-weight:700; color:#39474f; line-height:1.6; }

/* ---- アプリ機能セキュリティ（横並びカード） ---- */
.sec-feat__grid{ max-width:1000px; margin:40px auto 0; display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.sec-feat__item{ display:flex; gap:16px; background:#fff; border:1px solid #e3eef5; border-radius:16px; padding:22px 22px;
  transition:transform .18s, border-color .18s; }
.sec-feat__item:hover{ transform:translateY(-3px); border-color:#bfe0f6; }
.sec-feat__ic{ flex:0 0 46px; width:46px; height:46px; border-radius:12px; background:#eaf6fe;
  display:flex; align-items:center; justify-content:center; }
.sec-feat__ic svg{ width:24px; height:24px; stroke:#0575c4; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.sec-feat__item h3{ margin:2px 0 0; font-size:1rem; font-weight:800; color:#073b52; line-height:1.5; }
.sec-feat__item p{ margin:8px 0 0; font-size:.86rem; color:#5a6b75; line-height:1.8; }

/* ---- ガイドブックCTA ---- */
.sec-guide{ max-width:840px; margin:0 auto; background:#fff; border:1px solid #e3eef5; border-radius:20px;
  padding:36px 30px; text-align:center; box-shadow:0 24px 56px -40px rgba(1,160,233,.5); }
.sec-guide__ic{ width:60px; height:60px; margin:0 auto 16px; border-radius:16px; background:#eaf6fe;
  display:flex; align-items:center; justify-content:center; }
.sec-guide__ic svg{ width:30px; height:30px; stroke:#0575c4; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.sec-guide h2{ font-size:1.3rem; font-weight:800; color:#073b52; }
.sec-guide p{ margin:10px 0 22px; font-size:.92rem; color:#5a6b75; line-height:1.8; }
.sec-guide .button{ display:inline-flex; align-items:center; gap:9px; }
.sec-guide .button svg{ width:18px; height:18px; stroke:currentColor; fill:none; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

/* ---- レスポンシブ ---- */
@media (max-width:991px){
  .sec-grid{ grid-template-columns:1fr; max-width:480px; }
  .sec-dc__grid{ grid-template-columns:repeat(2,1fr); max-width:560px; }
}
@media (max-width:767px){
  .sec-sec{ padding:48px 0; }
  .sec-feat__grid{ grid-template-columns:1fr; max-width:480px; }
}
@media (max-width:575px){
  .sec-dc__grid{ grid-template-columns:1fr 1fr; gap:12px; }
  .sec-pay__statement b{ font-size:1.12rem; }
}

/* ---- FV見出し（既存security_lowを軽く調整） ---- */
#fv_low.security_low .fv_low_head > p{ line-height:2.05em; }