@charset "UTF-8";
body {
font-family: Arial, sans-serif;
line-height: 1.6;
margin: 0;
padding: 0;
}
body::before {
content: "";
display: block;
width: 100%;
height: 5px;
background-color: black;
position: fixed;
top: 0;
z-index: 1040;
}
header {
background: #f8f9fa;
padding: 1rem 0;
position: fixed;
top: 5px;
width: 100%;
z-index: 1030;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
h2, h3, h4, h5, h6 {
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
text-transform: uppercase;
color: #333;
}
h2 {
font-size: 2rem;
font-weight: bold;
letter-spacing: 0.05rem;
border-left: 4px solid #000;
padding-left: 0.5rem;
}
h3 {
font-size: 1.75rem;
font-weight: bold;
border-bottom: 2px dotted #aaa;
padding-bottom: 0.25rem;
}
h4 {
font-size: 1.5rem;
font-weight: bold;
}
h5 {
font-size: 1.25rem;
font-weight: bold;
letter-spacing: 0.05rem;
border-left: 2px solid #000;
padding-left: 0.5rem;
}
h6 {
font-size: 1rem;
font-weight: bold;
letter-spacing: 0.02rem;
text-transform: none;
}
h2 {
margin: 0 0 2rem 0;
}
h3 {
margin: 3rem 0 2rem 0;
}
h4 {
margin: 2rem 0 0.7rem;
}
h5 {
margin: 2rem 0 1rem;
} 
h6 {
margin: 1rem 0 0.5rem;
} 
nav {
padding-left: 0;
}
.hero {
background: url('../images/image1.jpg') no-repeat center center/cover; 
height: 450px;
display: flex;
align-items: center; 
justify-content: center;
position: relative;
color: #fff;
text-align: left;
padding: 5rem 1rem;
margin-top: 5rem;
}
.hero .text-box {
background: rgba(0, 0, 0, 0.5); /* 半透明の黒 */
padding: 5px 15px;
display: inline-block;
}
.hero p {
font-size: 1.2rem;
text-align: left;
padding:  0;
margin: 0;
font-weight: bold;
}
#navbarNav {
font-weight: bold;
}
.nav-link:hover {
text-decoration: underline;
}
.section {
padding: 3rem 0;
scroll-margin-top: 6rem;
}
.text-left {
text-align: left;
}
table th {
text-align: right;
vertical-align: top;
padding: 0 20px 0 0;
}
table td {
vertical-align: top;
}
footer {
background: #000;
color: #fff;
text-align: left;
padding: 2rem 0;
}
.footer-nav ul {
list-style: none;
padding: 0;
}
.footer-nav ul li {
display: inline;
margin-right: 1rem;
}
.footer-nav ul li a {
color: #fff;
text-decoration: none;
}
.footer-nav ul li a:hover {
text-decoration: underline;
}
button.btn-primary {
background-color: #000;
border-color: #000;
}
button.btn-primary:hover {
background-color: #444;
border-color: #444;
}

@media (max-width: 768px) {
.section {
padding: 2rem 0;
}
.hero p {
font-size: 1.2rem;
}
}
@media (max-width: 576px) {
.navbar-brand {
font-size: 1.2rem;
}
.hero p {
font-size: 1rem;
}
h2 {
font-size: 1.5rem;
}
h3 {
font-size: 1.25rem;
}
h4 {
font-size: 1.1rem;
}
}