body {
    font-family: "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    margin: 0;
    line-height: 1.8;
    font-size: 17px; 
    color: #333;
}

header {
    background: #6cc4a1;
    color: white;
    text-align: center;
    padding: 5px 10px;
}

footer {
text-align: center;
padding: 20px;
background: #f4f4f4;
}


nav {
background: #eaf7f2;
text-align: center;
padding: 10px;
}

nav a {
margin: 5px;
display: inline-block;
font-size: 17px;
}

.icon-medicine::before{
    content:"💊";
}

.icon-online::before{
    content:"💻";
}

.icon-document::before{
    content:"📄";
}

.icon-shield::before{
    content:"🛡";
}

.icon-dx::before{
    content:"🏥";
}

.icon-refill::before{
    content:"📝";
}

.notice-area{
    max-width:700px;
    margin:auto;
    padding:15px;
}

.notice-title{
    text-align:center;
    color:var(--main);
    font-size:26px;
    margin-bottom:15px;
}

.notice-list{
    display:grid;
    gap:15px;
}

.notice-card{
    display:flex;
    align-items:center;
    text-decoration:none;
    color:var(--text);
    background:#fff;
    border:1px solid var(--border);
    border-radius:14px;
    padding:16px;
    box-shadow:0 2px 8px rgba(0,0,0,.05);
    transition:.2s;
}

.notice-card:hover{
    background:var(--main-light);
    transform:translateY(-2px);
}

.notice-icon{
    width:48px;
    height:48px;
    min-width:48px;
    margin-right:16px;
    border-radius:50%;
    background:var(--main-light);
    display:flex;
    align-items:center;
    justify-content:center;
    color:var(--main);
    font-size:22px;
}

.notice-text{
    flex:1;
    font-size:18px;
    font-weight:500;
}

.notice-arrow{
    color:var(--main);
    font-size:28px;
}

/* トップへボタン */
#topBtn {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 18px;
    padding: 10px 15px;
    border: none;
    background: #4CAF50;
    color: white;
    border-radius: 5px;
    cursor: pointer;
}

/* フッター */
#menuFooter {
    background-color: #0d0d0d;
    text-align: center;
/*    padding: 80px 80px 30px 80px;
  position: sticky; */
  position: fixed;
  bottom: 0;
  width: 100%;
  font-size: 16px;
/*  align-items: center; */
}

#footer-link {
    display: flex;
    justify-content: center;
    gap: 20px; /* メニュー項目間のスペース */
    margin-top: 5px;
    margin-bottom: 5px;
    align-items: center;
    justify-content: space-evenly;
    width: 100%; /* スクリーンの幅まで伸ばす */
}

#footer-link > a {
    text-decoration: none;
    color: #ffffff;
}

#footer-link > a:hover {
    text-decoration: underline;
}

#s-footer {
    display: flex;
    justify-content: space-between;
    align-items: center; /* 縦方向の中央合わせ */
    margin-top: 20px;
}