/* ===== 全体設定 ===== */

*{
box-sizing:border-box;
margin:0;
padding:0;
}

html{
font-size:14px;
}

body{
font-family:"Noto Sans JP",sans-serif;
background:#f4f6f8;
color:#111;
line-height:1.6;
background:url(back/2.jpg);
}

/* ===== Header ===== */

header{
position:fixed;
top:0;
width:100%;
background-color:white;
z-index:1000;
display:flex;
align-items:center;
justify-content:space-between;
font-family:"Noto Serif JP",serif;
padding-left:25px;
padding-right:30px;
padding-top:10px;
background:url(back/2.jpg);
}

header .navi ul{
display:flex;
}

header li{
margin-left:2px;
padding-left:30px;
}

header .navi a{
font-family:"Noto Sans JP",sans-serif;
font-size:17px;
padding-right:2px;
}

header .mokuroku a{
font-family:"Noto Sans JP",sans-serif;
font-size:17px;
padding-right:40px;
text-decoration:underline;
font-weight:400;
}

/* ===== Main ===== */

main{
max-width:var(--max-width,1200px);
margin:15px auto;
padding:100px 12px;
background-color:rgba(255,255,255,0.30);
border-radius:8px;
box-shadow:0 6px 18px rgba(0,0,0,0.03);
}

.panel{
background:#fff;
padding:1.2rem;
border-radius:10px;
box-shadow:0 5px 15px rgba(0,0,0,0.05);
}

h1{
font-family:"Noto Serif JP",serif;
font-size:1.6rem;
margin-bottom:0.5rem;
}

.panel p{
font-family:"Noto Sans JP",sans-serif;
font-size:0.95rem;
margin-bottom:1rem;
}

/* ===== Google Sheet ===== */

iframe{
padding-top:20px;
width:100%;
height:65vh;
border:none;
border-radius:6px;
overflow-x:auto;
}

/* ===== Footer ===== */

.site-footer{
text-align:center;
font-family:"Noto Sans JP",sans-serif;
background:#1b2a3a;
color:#fff;
font-size:0.85rem;
padding:30px;
}

/* ===== Back to top ===== */

.back-to-top{
position:fixed;
bottom:30px;
right:30px;
width:55px;
height:55px;
background:#1b2a3a;
color:#fff;
text-align:center;
line-height:55px;
border-radius:50%;
text-decoration:none;
font-family:"Noto Sans JP",sans-serif;
font-size:1.2rem;
}

.back-to-top:hover{
opacity:0.7;
}