@charset "utf-8";
/*
Theme Name: なかい予備校グループ
Theme URI: https://nakaiyobikou.jp/
Description: なかい予備校グループのテーマです
*/





/* 見出し */
.section-title {
    font-size: clamp(18px, 2.5vw, 30px);
    margin-bottom: 2rem;
}

/* 共通リスト */
.list {
    display: grid;
    gap: 2rem;
}

/* 人気記事6列 */
.popular_list_wrapper {
	margin-bottom:9rem;
}

.popular_list_wrapper h2 {
	text-align:center;
	margin-bottom:6rem;
	font-size: clamp(22px, 2.4vw, 30px);
}

.popular_list_wrapper h2:after {
	content:"";
	width:60px;
	height:3px;
	background:#f07a8b;
	display:block;
	margin:2rem auto 0 auto;
}

.popular_list {
    grid-template-columns: repeat(6, 1fr);
}
@media (max-width: 1200px) {
    .popular_list {
        grid-template-columns: repeat(4, 1fr);
    }
}
@media (max-width: 900px) {
	.popular_list_wrapper {
	margin-bottom:4.5rem;
    }
    .popular_list {
        grid-template-columns: repeat(2, 1fr);
    }
}
@media (max-width: 600px) {
    .popular_list {
        grid-template-columns: 1fr;
    }
	.popular_list .list_item a {
		display:flex;
	-webkit-flex-wrap: wrap; /* Safari */
	flex-wrap:         wrap;
	-webkit-justify-content: space-between;
	justify-content: space-between;
	background:#FFF;
	padding:1rem;
	}
	.popular_list .list_item a figure {
		width:30%;
	}
	.popular_list .list_item a .text {
		width:65%;
	}
}

/* 記事一覧3列 */
.article_list {
    grid-template-columns: repeat(3, 1fr);
	margin-bottom:9rem;
}
@media (max-width: 980px) {
.article_list {
	grid-template-columns: repeat(2, 1fr);
	margin-bottom:4.5rem;
}
}
@media (max-width: 600px) {
    .article_list {
        /*grid-template-columns: 1fr;*/
    }
}

/* 各アイテム */
.list_item {
    display: flex;
    flex-direction: column;
}

/* 画像 */
.list_item figure {
    width: 100%;
    aspect-ratio: 4/3;
    overflow: hidden;
    margin-bottom: 1.5rem; /* 画像下余白増加 */
}
.list_item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* カテゴリータグ */
.category_tag {
    display: inline-block;
    font-size: 15px; /* 少し大きめ */
    color: #fff;
    padding: 0.3rem 0.6rem;
    margin-bottom: 0.8rem; /* タイトルとの間隔 */
    line-height: 1.4;
}

/* タイトル */
.list_item h3 {
    font-size: clamp(16px, 2vw, 18px);
    margin: 0.8rem 0 1.2rem 0; /* 上下余白広め */
    line-height: 1.5;
}

/* 日付 */
.list_item time {
    font-size: 14px; /* 少し大きめに変更 */
    color: #666;
    line-height: 1.4;
	display:block;
	text-align:right;
}

/* リンク下線なし */
.list_item a {
    text-decoration: none;
}

/* デフォルト 3列 */
.article_list .list_item:nth-child(n+4) {
  margin-top: 3rem;
}

/* 2列（幅900px以下）の場合 3番目以降に余白 */
@media (max-width: 900px) {
  .article_list .list_item:nth-child(n+3) {
    margin-top: 3rem;
  }
  .category_tag {
    font-size: 13px; /* 少し大きめ */
  }
}

/* 1列（幅600px以下）の場合 2番目以降に余白 */
@media (max-width: 600px) {
  .article_list .list_item:nth-child(n+2) {
    margin-top: 0;
  }
}