body{
    background:#f3fafa;
    font-family: "Yu Gothic", sans-serif;
    margin:0;
}

header{
    text-align:center;
    padding:20px;
}

.container{
    width:90%;
    margin:auto;
}

.section{
    background:white;
    padding:20px;
    margin:20px 0;
    border-radius:10px;
    box-shadow:0 2px 5px rgba(0,0,0,0.1);
}

.flex{
    display:flex;
    gap:20px;
}

.flex > div{
    flex:1;
}

h2{
    background:#0066cc;
    color:white;
    padding:10px;
    border-radius:5px;
}

a{
    text-decoration:none;
    color:#0066cc;
}

a:hover{
    color:red;
}

@media(max-width:768px){
    .flex{
        flex-direction:column;
    }
}
.result{
    background:#f0fff0;
}
.result-box{
    background:white;
    padding:15px;
    border-radius:8px;
    margin-bottom:15px;
}

.result-box .date{
    font-weight:bold;
    color:#666;
}

.result-box .title{
    font-size:18px;
    font-weight:bold;
    margin:5px 0 10px 0;
}

.result-box ul{
    padding-left:20px;
}
table.schedule{
    width:100%;
    border-collapse:collapse;
}

table.schedule th{
    background:#0066cc;
    color:white;
    padding:10px;
}

table.schedule td{
    border:1px solid #ddd;
    padding:8px;
}

table.schedule tr:nth-child(even){
    background:#f9f9f9;
}

@media(max-width:768px){
    table.schedule{
        font-size:12px;
    }
}
.info {
    margin: 5px 0;
    font-size: 0.95em;
    color: #555;
}
.main-nav{
    background:#0066cc;
    text-align:center;
    padding:10px 0;
}

.main-nav a{
    color:white;
    margin:0 12px;
    font-weight:bold;
}

.main-nav a:hover{
    text-decoration:underline;
}
.notice{
    color:red;
}
header {
    text-align: center;
    padding: 40px 10px;
    background: linear-gradient(135deg, #003366, #0066cc);
    color: white;
}

header h1 {
    font-size: 2.8em;
    letter-spacing: 4px;
    font-weight: 800;
    margin: 10px 0;
    text-shadow: 3px 3px 6px rgba(0,0,0,0.3);
}

.subtitle {
    font-size: 1em;
    letter-spacing: 3px;
    opacity: 0.9;
}

header p {
    font-size: 1.1em;
    margin-top: 5px;
}

.notice {
    font-size: 0.5em;
    color: #ffdede;
}
.mail-button {
    display: inline-block;
    background-color: #0066cc;
    color: white;
    padding: 10px 18px;
    border-radius: 6px;
    text-decoration: none;
    font-weight: bold;
}

.mail-button:hover {
    background-color: #004999;
}
.card{
    background:white;
    padding:20px;
    margin:20px 0;
    border-radius:10px;
    box-shadow:0 2px 5px rgba(0,0,0,0.1);
}
.mail-button {
    display: inline-block;
    background-color: #0066cc;
    color: white;
    padding: 10px 18px;
    border-radius: 6px;
    text-decoration: none;
    font-weight: bold;
}

.mail-button:hover {
    background-color: #004999;
}
h1{
  text-align:center;
  font-size:32px;
}

h2{
  text-align:center;
  margin-bottom:30px;
}

.kiyaku-list{
  list-style:none;
  padding:0;
}

.kiyaku-list{
list-style:none;
padding:0;
width:100%;
}
.kiyaku-list li{
margin:12px 0;
}

.kiyaku-list a{
display:block;
padding:18px;
background:#f5f7fb;
border-left:6px solid #003399;
border-radius:6px;
text-decoration:none;
font-size:18px;
color:#333;
transition:0.2s;
}

.kiyaku-list a:hover{
background:#e6ecff;
}
.container{
padding-top:20px;
}