@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/* ヘッダー（グローバルメニュー含む）の上に余白を追加 */
.l-header{
  padding-top: 8px;
}


/* サムネ全般の影を消す */
.c-postThumb,
.c-postThumb__figure,
.c-postThumb__img{
  box-shadow: none !important;
  filter: none !important;
}


/* プロフィール：ウィジェット直下のタイトル */
.widget_swell_prof_widget::before{
  content: "PROFILE";
  display: block;
  margin: 0 0 12px !important;
  background: #8A8A8A;
  color: #fff !important;
  padding: 10px 16px;
  font-weight: 700;
}


/* サイドバー検索：タイトル（SEARCH）を必ず表示 */
.l-sidebar #search-10 .c-widget__title.-side,
.p-sidebar #search-10 .c-widget__title.-side,
.c-sidebar #search-10 .c-widget__title.-side{
  display: block !important;
  visibility: visible !important;
  height: auto !important;
  margin: 0 0 24px !important;
}


/* フッター：サービス一覧（2列） */
.ac-footerService__cols{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 28px;
}

.ac-footerService__list{
  list-style: none;
  padding: 0;
  margin: 0;
}

.ac-footerService__list li{
  margin: 0 0 8px;
}

.ac-footerService__list a{
  text-decoration: none;
}



/* ====== 最新1件だけ大きく表示（メインのみ）ここから ====== */
/* 記事一覧の1件目だけを大きく表示（メイン記事一覧だけ／タブレットも適用） */
@media (min-width: 600px){

  /* メインコンテンツ内の「記事一覧」だけに限定（サイドバーに影響させない） */
  .l-mainContent .p-postList.-type-list > .p-postList__item:first-child .p-postList__link{
    display: flex !important;
    flex-direction: column !important; /* 画像上／テキスト下 */
  }

  .l-mainContent .p-postList.-type-list > .p-postList__item:first-child{
    width: 100% !important;
    margin-bottom: 32px !important;
  }

  /* 1件目のサムネ：横長で大きく */
  .l-mainContent .p-postList.-type-list > .p-postList__item:first-child .c-postThumb__figure{
    aspect-ratio: 16 / 9;
    overflow: hidden;
  }

  .l-mainContent .p-postList.-type-list > .p-postList__item:first-child .p-postList__thumb{
    width: 100% !important;
  }

  /* 1件目の本文側 */
  .l-mainContent .p-postList.-type-list > .p-postList__item:first-child .p-postList__body{
    width: 100% !important;
    padding-top: 12px !important;
  }

  /* タイトルサイズ（タブレット用） */
  .l-mainContent .p-postList.-type-list > .p-postList__item:first-child .p-postList__title{
    font-size: 1.3rem !important;
    line-height: 1.4 !important;
  }
}

/* PCではもう少し大きくしたい場合（任意） */
@media (min-width: 960px){
  .l-mainContent .p-postList.-type-list > .p-postList__item:first-child .p-postList__title{
    font-size: 1.4rem !important;
  }
}

/* ====== ここまで ====== */


/* タブレット時：サイドバー「最近の記事」のタイトルを大きく */
@media (min-width: 600px) and (max-width: 1199px){
  #sidebar .widget_swell_new_posts .p-postList__title{
    font-size: 1.05rem !important; /* ← 1.0〜1.15で調整 */
    line-height: 1.45 !important;
  }

  /* 日付も少しだけ読みやすく */
  #sidebar .widget_swell_new_posts .c-postTimes__posted{
    font-size: 0.9rem !important;
  }
}


/* ====== ランダム表示 ====== */

/* フッター直前：ランダムサムネ（custom_html-8）をサムネだけに */
#before_footer_widget #custom_html-8 .p-postList__body{
  display: none !important; /* タイトル・日付など非表示 */
}

/* サムネ比率を旧ブログ(500x300=5:3)っぽく統一 */
#before_footer_widget #custom_html-8 .c-postThumb__figure{
  aspect-ratio: 5 / 3;
  overflow: hidden;
}
#before_footer_widget #custom_html-8 .c-postThumb__img{
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}

/* PC：絶対に5つ横一列（折り返しさせない） */
@media (min-width: 1200px){
  #before_footer_widget #custom_html-8 .p-postList{
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 0px !important;
  }
  #before_footer_widget #custom_html-8 .p-postList__item{
    margin: 0 !important;
    width: auto !important;
  }
}

/* タブレット：3列 */
@media (min-width: 600px) and (max-width: 1199px){
  #before_footer_widget #custom_html-8 .p-postList{
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0px !important;
  }
}

/* スマホ：2列（すでに -sp-col2 がありますが念のため固定） */
@media (max-width: 599px){
  #before_footer_widget #custom_html-8 .p-postList{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0px !important;
  }
}

#before_footer_widget #custom_html-8 .p-postList__item,
#before_footer_widget #custom_html-8 .p-postList__link{
  margin: 0 !important;
  padding: 0 !important;
}

/* フッター直前：ランダムサムネ（custom_html-8）を隙間なく敷き詰める */
#before_footer_widget #custom_html-8 .textwidget,
#before_footer_widget #custom_html-8 .p-blogParts,
#before_footer_widget #custom_html-8 .p-postListWrap{
  margin: 0 !important;
  padding: 0 !important;
}

/* 列数（SP=2 / Tab=3 / PC=5）+ gap=0 */
#before_footer_widget #custom_html-8 ul.p-postList{
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}
@media (min-width: 600px){
  #before_footer_widget #custom_html-8 ul.p-postList{
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}
@media (min-width: 1200px){
  #before_footer_widget #custom_html-8 ul.p-postList{
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  }
}

/* 中身を「列幅100%」で伸ばす */
#before_footer_widget #custom_html-8 .p-postList__item,
#before_footer_widget #custom_html-8 .p-postList__link,
#before_footer_widget #custom_html-8 .p-postList__thumb,
#before_footer_widget #custom_html-8 .c-postThumb,
#before_footer_widget #custom_html-8 .c-postThumb__figure{
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
}

/* 画像を列幅いっぱいに（1pxスキマ対策でblock化） */
#before_footer_widget #custom_html-8 .c-postThumb__figure{
  aspect-ratio: 5 / 3;   /* 旧ブログの500x300相当 */
  overflow: hidden;
}
#before_footer_widget #custom_html-8 .c-postThumb__img{
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

/* ランダムサムネ（custom_html-8）：サムネ上のカテゴリラベルを非表示 */
#before_footer_widget #custom_html-8 .c-postThumb__cat{
  display: none !important;
}

/* ====== ここまで ====== */


/* キーワードから探すとの間隔調整 */
#before_footer_widget #tag_cloud-2{
  padding-top: 24px !important;
}


/* スマホ：トップの投稿一覧の抜粋（本文の一部）を非表示 */
@media (max-width: 599px){
  .l-mainContent .p-homeContent .p-postList .p-postList__excerpt{
    display: none !important;
  }
}


/* スマホ：トップ記事一覧を「画像上／タイトル下」にする（サイドバー除外） */
@media (max-width: 599px){
  .l-mainContent .p-homeContent .p-postList.-type-list > .p-postList__item .p-postList__link{
    display: flex !important;
    flex-direction: column !important;
  }

  .l-mainContent .p-homeContent .p-postList.-type-list > .p-postList__item .p-postList__thumb{
    width: 100% !important;
    margin: 0 !important;
  }

  .l-mainContent .p-homeContent .p-postList.-type-list > .p-postList__item .p-postList__body{
    width: 100% !important;
    padding: 12px 0 0 !important;
  }
}

/* 既存記事の q_button をSWELLでもボタン表示にする */
a.q_button{
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 12px 16px !important;
  border-radius: 26px !important;
  text-decoration: none !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
  border: none !important;
}

/* 緑ボタン */
a.q_button.bt_green{
  background: #038489 !important; /* 好みで変更 */
  color: #fff !important;
}

/* 中央寄せ */
a.q_button.center{
  margin: 12px auto !important;
  width: fit-content !important;
}

/* ホバー */
a.q_button:hover{
  opacity: .8 !important;
}
