
/* OFFICE 141 COLUMN 資料ダウンロードの枠（.cma-dl）2026-09-29
   記事の中の資料の枠（HTMLブロック）から読み込む */
.cma-body .cma-dl{margin:44px 0 56px;border:1px solid var(--bk);background:#fff;font-size:15px;line-height:1.8}
.cma-dl .dl-hd{display:flex;justify-content:space-between;align-items:center;background:var(--bk);color:var(--wh);padding:9px 18px;font-size:12px;font-weight:700;letter-spacing:.14em}
.cma-dl .dl-hd span:first-child::before{content:"";display:inline-block;width:8px;height:8px;background:var(--lime);margin-right:10px;vertical-align:1px}
.cma-dl .dl-hd span:last-child{background:var(--lime);color:var(--bk);padding:0 8px;letter-spacing:.1em}
.cma-dl .dl-in{display:grid;grid-template-columns:210px minmax(0,1fr);column-gap:34px;padding:30px 28px 26px;border-bottom:1px solid var(--rule)}
.cma-dl .dl-cv{position:relative;height:270px}
.cma-dl .dl-cv img{position:absolute;width:176px;height:auto;border:1px solid var(--bk);box-shadow:0 1px 0 rgba(0,0,0,.04)}
.cma-dl .dl-cv .p2{left:30px;top:16px;transform:rotate(4deg);opacity:.95}
.cma-dl .dl-cv .p1{left:0;top:0;box-shadow:6px 6px 0 var(--lime)}
.cma-body .cma-dl .dl-k{margin:0;max-width:none;font-size:12.5px;font-weight:700;letter-spacing:.2em;color:var(--mid)}
.cma-body .cma-dl .dl-t{margin:4px 0 16px;padding:0;border:0;font-family:var(--mi);font-weight:600;font-size:26px;line-height:1.4;letter-spacing:.02em;color:var(--bk)}
.cma-body .cma-dl .dl-ix{list-style:none;margin:0;padding:0;border-top:1px solid var(--bk)}
.cma-body .cma-dl .dl-ix li{max-width:none;display:flex;gap:12px;align-items:baseline;padding:6px 0;border-bottom:1px solid var(--rule);font-size:13.5px;line-height:1.55;color:#33332f}
.cma-dl .dl-ix b{flex:none;width:20px;font-weight:900;font-size:12.5px;color:var(--bk)}
.cma-dl .dl-form{display:flex;gap:0;padding:22px 28px 0}
.cma-dl .dl-form input[type=email]{flex:1;min-width:0;height:52px;padding:0 16px;border:1px solid var(--bk);border-right:0;background:var(--wh);font-size:16px;font-family:var(--jp);border-radius:0;outline:none}
.cma-dl .dl-form input[type=email]:focus{background:#fff;box-shadow:inset 0 -3px 0 var(--lime)}
.cma-dl .dl-form button{flex:none;height:52px;padding:0 26px;border:1px solid var(--bk);background:var(--lime);color:var(--bk);font-family:var(--jp);font-weight:700;font-size:15.5px;cursor:pointer;border-radius:0;transition:background .2s,color .2s}
.cma-dl .dl-form button span{margin-left:8px;font-family:var(--en)}
.cma-dl .dl-form button:hover{background:var(--bk);color:var(--lime)}
.cma-body .cma-dl .dl-note{margin:0;max-width:none;padding:10px 28px 22px;font-size:12.5px;line-height:1.7;color:var(--mid)}
/* 記事中に資料ダウンロードがあるときは、読了後のメルマガの黒帯を出さない（登録フォームが続くのを避ける） */
.cm-paper:has(.cma-dl) .cma-ml{display:none}
/* 区切り線・補足の小さな文 */
.cma-body hr.cma-rule{margin:56px 0 40px;border:0;border-top:1px solid var(--bk);max-width:none}
.cma-body p.cma-note{font-size:14px;color:var(--mid)}
/* アイキャッチ → 資料の枠へ（資料の枠がある記事だけ、dl.js が .cma-eye-go を付ける） */
.cma-dl{scroll-margin-top:96px}
.cma-eye-go{cursor:pointer}
.cma-eye-go img{transition:box-shadow .2s}
.cma-eye-go:hover img,.cma-eye-go:focus-visible img{box-shadow:6px 6px 0 var(--lime)}
@media (max-width:820px){
  .cma-body .cma-dl{margin:36px 0 48px}
  .cma-dl .dl-hd{padding:8px 14px;font-size:11px}
  .cma-dl .dl-in{display:block;padding:20px 16px 16px}
  .cma-dl .dl-bd{display:contents}
  .cma-dl .dl-cv{float:left;width:112px;height:150px;margin:0 16px 14px 0}
  .cma-dl .dl-cv img{width:96px}
  .cma-dl .dl-cv .p2{left:12px;top:8px}
  .cma-dl .dl-cv .p1{left:0}
  .cma-body .cma-dl .dl-k{padding-top:18px;font-size:11.5px}
  .cma-body .cma-dl .dl-t{font-size:19px;margin:2px 0 0}
  .cma-body .cma-dl .dl-ix{clear:both;margin-top:4px}
  .cma-body .cma-dl .dl-ix li{font-size:13px;padding:5px 0;gap:10px}
  .cma-dl .dl-form{flex-direction:column;padding:16px 16px 0}
  .cma-dl .dl-form input[type=email]{border-right:1px solid var(--bk);border-bottom:0}
  .cma-body .cma-dl .dl-note{padding:10px 16px 18px}
}
