/* =====================================================
アーカイブページ
===================================================== */

/* =========================
ページタイトル（共通化ベース）
========================= */

.archive-header{
    background:
        linear-gradient(
            rgba(248,246,240,.72),
            rgba(248,246,240,.72)
        ),
        url("img/archive_header.JPG");

    background-size:cover;
    background-position:center center;
}



/* =========================
セクション
========================= */

.category_lead{
    margin-bottom:30px;

    color:#666;
    font-size:0.95rem;
}

.page-section h2{
    display:block;

    margin:60px 0 15px;
    padding-left:18px;

    border-left:5px solid #c59f4a;

    font-family:"Noto Serif JP","Yu Mincho",serif;
    font-size:1.9rem;
    font-weight:600;

    color:#5c5448;
}


/* =========================
カード一覧
========================= */

.archive_list{
    list-style:none;
    padding:0;
    margin:0;

    display:grid;
    grid-template-columns:repeat(2,1fr);

    gap:30px;
}

.archive_list li{
margin:0;
}



/* =========================
カード
========================= */

.archive_card{
display:flex;
flex-direction:column;
height:100%;

background:#fff;

border:1px solid #e6ddd0;
border-radius:12px;

overflow:hidden;

text-decoration:none;

transition:.25s;

}

.archive_card:hover{
transform:translateY(-4px);


box-shadow:
    0 8px 24px rgba(0,0,0,.08);


}

.archive_card img{
display:block;


width:100%;

aspect-ratio:16/9;

object-fit:cover;


}

/* =========================
カード本文
========================= */

.archive_info{
padding:20px;
}

.archive_name{
display:flex;
align-items:baseline;
gap:10px;
flex-wrap:wrap;
}

.archive_name strong{
font-size:1.4rem;
font-weight:bold;

color:#a77700;


}

.scientific-name{
    font-style:italic;
    color:#777;
    font-size:.95rem;
}

.archive_place{
margin-top:8px;

color:#666;
font-size:0.95rem;
line-height:1.6;


}

/* =========================
テキストカード
========================= */
.archive_textlist{
    list-style:none;
    margin:0;
    padding:0;
}

.archive_textlist li{
    margin-bottom:15px;
}

.archive_textcard{
display:block;

padding:18px 24px;

background:#fff;

border:1px solid #e6ddd0;
border-radius:12px;

text-decoration:none;

transition:.25s;


}

.archive_textcard:hover{
transform:translateX(4px);


box-shadow:
    0 6px 20px rgba(0,0,0,.08);


}

.archive_texttitle{
color:#a77700;


font-size:1.2rem;
font-weight:bold;

margin-bottom:4px;


}

.archive_textsub{
color:#666;
font-size:0.95rem;
}

/* =====================
個別ページ
======================== */

.archive_detail{
max-width:900px;
}

.archive_detail h2{
margin-top:0;
margin-bottom:25px;
}

.archive_detail h2 span{
display:block;


margin-top:8px;

font-size:1.1rem;
font-style:italic;

color:#666;


}

.main_photo{
margin:0 0 40px;
}

.main_photo img{
width:100%;
height:auto;


display:block;

border-radius:8px;


}

.main_photo figcaption{
margin-top:10px;


color:#666;
font-size:0.9rem;

}

.spec_box{
background:#fff;

border:1px solid #e5e5e5;
border-radius:8px;

padding:20px;

margin-bottom:40px;


}

.spec_box dl{
display:grid;
grid-template-columns:120px 1fr;
gap:10px;
}

.spec_box dt{
font-weight:bold;
color:#a77700;
}

.spec_table{
width:100%;


border-collapse:collapse;

margin:30px 0;

background:#fff;


}

.spec_table th,
.spec_table td{
padding:12px 16px;


border:1px solid #ddd;

text-align:left;


}

.spec_table th{
width:140px;


background:#f5f1e8;

color:#5c5448;
font-weight:bold;


}

.spec_table td em{
font-style:italic;
}

.archive_detail p{
line-height:2;
margin-bottom:1.5em;
}

/* =========================
スマホ
========================= */

@media screen and (max-width:768px){

body{
    min-width:0 !important;
}


.page-title{
    padding:50px 20px;
}

.page-title h1{
    font-size:2rem;
}

.archive_list{
      grid-template-columns:1fr;
      gap:20px;
}


.archive_card img{
    aspect-ratio:4/3;
}

.archive_name{
    flex-direction:column;
    align-items:flex-start;
    gap:4px;
}

.archive_name strong{
    font-size:1.25rem;
}

.spec_box dl{
    grid-template-columns:1fr;
}

}