/* ==========================================
   layout.css
   レイアウト
========================================== */

.container{

    padding:0;
}

/* -------------------------
   Card
------------------------- */

.card{

    background:#ffffff;

    border:2px solid #e5e5e5;

    border-radius:12px;

    box-shadow:0 4px 10px rgba(0,0,0,.08);

    padding:15px 20px;

    margin-bottom:12px;

    line-height:1.4;
}

.card__title{

    font-size:1.25rem;
}

.card-section{

    margin-bottom:0;
}

.separator-rownormal{

    border-top:2px solid #cccccc;

    margin:12px 0;

    padding-top:15px;
}

/* -------------------------
   投稿一覧
------------------------- */

.card h2{

    margin-bottom:0px;

}

.record-count{

    margin:2px 0 0;

}

/* -------------------------
   Flex
------------------------- */

.flex{

    display:flex;

    gap:10px;

    flex-wrap:wrap;
}

.row-flex{

    display:flex;

    justify-content:space-between;

    align-items:center;

    white-space:nowrap;
}

/* ==========================================
   検索フォーム
========================================== */

.search-form{

    display:flex;

    flex-direction:column;

    gap:8px;

}

.search-row{

    display:flex;

    align-items:center;

    gap:4px;

    margin-bottom:8px;

}

.search-row label{

    width:58px;

    font-weight:600;

    flex-shrink:0;

}

#searchLake,
#searchLocation,
#searchEmail{

    width:220px;

}

#searchDateFrom,
#searchDateTo{

    width:145px;

}

.date-range{

    padding:0 4px;

    font-weight:bold;

}

.search-buttons{

    margin-left:0px;

    display:flex;

    gap:10px;

}

/* ==========================================
   about.html
========================================== */

/* ---------- 箇条書き ---------- */

.about-list{

    margin:15px 0 10px;

    padding-left:24px;

}

.about-list li{

    margin-bottom:10px;

    font-size:14px;

    line-height:1.7;

}

/* ---------- 操作説明 ---------- */

.about-steps{

    display:flex;

    flex-direction:column;

    gap:12px;

    margin-top:15px;

}

.about-step{

    display:grid;

    grid-template-columns:120px minmax(0,1fr);

    gap:15px;

    align-items:start;

}

.about-step-button{

    display:flex;

    justify-content:center;

    align-items:center;

    min-height:40px;

    padding:8px 10px;

    border-radius:8px;

    background:#007aff;

    color:#ffffff;

    font-size:14px;

    font-weight:bold;

    box-shadow:0 3px 8px rgba(0,0,0,.15);

    white-space:nowrap;

}

.about-step-text{

    padding:7px 0;

    font-size:14px;

    line-height:1.7;

}

/* ---------- 説明文 ---------- */

.about-list li,
.about-step-text,
.about-description{

    font-size:14px;

}

@media (max-width:768px){

    .about-step{

        grid-template-columns:100px minmax(0,1fr);

        gap:10px;

    }

    .about-step-button{

        font-size:13px;

        padding:8px 6px;

    }

    .about-step-text{

        font-size:14px;

        line-height:1.6;

    }

    .about-list{

        padding-left:22px;

    }

    .about-list li{

        font-size:14px;

        line-height:1.6;

        margin-bottom:10px;

    }

}