@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Template: cocoon-master
Version: 1.1.3
*/

/************************************
** Base（全体）
************************************/
body{
  background:#fff;
  color:#222;
  font-family:"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;
}

a{ color:#0f2d4d; }
a:hover{ color:#163e6a; }

.entry-title{ font-weight:700; }

.entry-content{
  line-height:1.9;
  font-size:17px;
}
.kurekatsumi-grid .new-entry-card,
.front-page .entry-content ul li a{
  box-shadow:0 12px 32px rgba(0,0,0,0.08) !important;
}
/* 記事本文の見出し（記事ページ向け） */
.entry-content h2{
  margin-top:2.0em;
  padding-left:0.6em;
  border-left:4px solid #0f2d4d;
  font-weight:700;
}
.entry-content h3{
  margin-top:1.6em;
  border-bottom:1px solid #eee;
  padding-bottom:0.3em;
  font-weight:700;
}

/* 投稿カード（一覧系） */
.a-wrap{
  border-radius:12px;
  background:#fff;
  box-shadow:0 4px 12px rgba(0,0,0,0.05);
}
.a-wrap:hover{
  transform:translateY(-3px);
  transition:0.2s ease;
}

.site-title{
  font-weight:700;
  letter-spacing:1px;
}

/************************************
** Top page（固定フロント：front-page / home 両対応）
************************************/

/* トップの横幅：スカスカ解消 */
.front-page .entry-content,
.home .entry-content{
  max-width:1040px;
  margin:0 auto;
  padding-top:28px;
}

/* トップのh2：左線を消してメディア寄り */
.front-page .entry-content h2,
.home .entry-content h2{
  border-left:none;
  padding-left:0;
  font-size:28px;
  margin-top:56px;
}
.front-page .hero,
.home .hero{
  background:#f7f9fc;
  border-radius:12px;
}
/* トップのh3：セクション見出し（ここは左寄せの方が自然） */
.front-page .entry-content h3,
.home .entry-content h3{
  border-bottom:none;
  font-size:18px;
  font-weight:700;
  letter-spacing:.6px;
  margin:72px 0 18px;
}

/* トップ本文少し大きめ */
.front-page .entry-content p,
.home .entry-content p{
  font-size:18px;
  line-height:1.8;
}

/* Hero（heroクラスが付いたグループだけ） */
.front-page .hero,
.home .hero{
  text-align:center;
  padding:90px 20px 56px;
  border-bottom:1px solid #eee;
}

.front-page .hero p,
.home .hero p{
  margin:14px 0 0;
  font-size:18px;
}

.front-page .hero p:first-child,
.home .hero p:first-child{
  font-size:36px;
  font-weight:700;
  margin:0 0 18px;
  letter-spacing:.4px;
}

/* トップのシェア/フォローは消す */
.front-page .sns-share,
.front-page .sns-follow,
.home .sns-share,
.home .sns-follow{
  display:none !important;
}
.front-page .entry-content h3,
.home .entry-content h3{
  position:relative;
  padding-left:14px;
}

.front-page .entry-content h3::before,
.home .entry-content h3::before{
  content:"";
  position:absolute;
  left:0;
  top:6px;
  width:4px;
  height:16px;
  background:#0f2d4d;
}
/************************************
** 証券会社比較（ulリンク）をカード化＆2列
************************************/
.front-page .entry-content ul,
.home .entry-content ul{
  list-style:none;
  padding-left:0;
  margin:0;
}

.front-page .entry-content ul li,
.home .entry-content ul li{
  margin:0 0 12px 0;
}

.front-page .entry-content ul li a,
.home .entry-content ul li a{
  display:block;
  padding:18px 18px;
  background:#fff;
  border-radius:14px;
  box-shadow:0 8px 24px rgba(0,0,0,0.06);
  text-decoration:none;
  min-height:86px;
}

.front-page .entry-content ul li a:hover,
.home .entry-content ul li a:hover{
  transform:translateY(-3px);
  transition:0.2s ease;
}

@media screen and (min-width: 900px){
  .front-page .entry-content ul,
  .home .entry-content ul{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:16px 18px;
    justify-content:center;
  }
  .front-page .entry-content ul li,
  .home .entry-content ul li{
    margin:0;
  }
}

/************************************
** ショートコード版：新着記事を2列カード化
************************************/
@media screen and (min-width: 900px){
  .front-page .entry-content .new-entry-cards,
  .home .entry-content .new-entry-cards{
    display:grid !important;
    grid-template-columns:repeat(2, 1fr) !important;
    gap:20px 18px !important;
  }

  .front-page .entry-content .new-entry-cards::after,
  .home .entry-content .new-entry-cards::after{
    content:none !important;
  }

  .front-page .entry-content .new-entry-cards .a-wrap,
  .home .entry-content .new-entry-cards .a-wrap{
    float:none !important;
    width:100% !important;
    display:block !important;
    margin:0 !important;
  }
}
/************************************
** カードを縦型（サムネ上・テキスト下）に変更
************************************/
@media screen and (min-width: 900px){
  .front-page .new-list-box .new-entry-card,
  .home .new-list-box .new-entry-card{
    display:flex !important;
    flex-direction:column !important;
    padding:0 !important;
    overflow:hidden !important;
  }

  .front-page .new-list-box .new-entry-card-thumb,
  .home .new-list-box .new-entry-card-thumb{
    float:none !important;
    width:100% !important;
    margin:0 !important;
  }

  .front-page .new-list-box .new-entry-card-thumb img,
  .home .new-list-box .new-entry-card-thumb img{
    width:100% !important;
    height:auto !important;
    border-radius:14px 14px 0 0 !important;
    display:block !important;
  }

  .front-page .new-list-box .new-entry-card-content,
  .home .new-list-box .new-entry-card-content{
    padding:14px 16px !important;
  }

  .front-page .new-list-box .new-entry-card-title,
  .home .new-list-box .new-entry-card-title{
    font-size:15px !important;
  }
}


/************************************
** Responsive
************************************/
@media screen and (max-width: 1023px){
  .front-page .entry-content,
  .home .entry-content{
    padding-left:16px;
    padding-right:16px;
  }
}

@media screen and (max-width: 834px){
  .entry-content{ font-size:16px; }

  .front-page .hero p:first-child,
  .home .hero p:first-child{
    font-size:30px;
  }
}

@media screen and (max-width: 480px){
  .front-page .entry-content h2,
  .home .entry-content h2{
    font-size:24px;
  }

  .a-wrap:hover{ transform:none; }
}