@charset "UTF-8";
/* General Styling */
body {
    font-family: "Yu Gothic", sans-serif;
    background-color: #f9f9f9;
}

.wrapper {
    /*max-width: 1000px; レスポンシブ対応のため、width:100%、height:autoに変更*/
    width: 100%;
    height: auto;
    max-width: 1000px;
    margin: 0 auto;
    padding: 20px;
    background-color: #ffffff;
}

/* Header */
header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: #ffffff;
    padding: 10px 20px;
}

header .logo {
    display: flex;
    /*align-items: center;*/
}

header .logo img {
    margin-right: 10px;
    margin-bottom: 5px;
}

header .logo span {
    color: #000000;
    font-size: 22px;
    line-height: 1.5;
    font-weight: bold;
    white-space: nowrap; /* 文字が改行されないようにする */
}

.nav .nav-list {
    display: flex;
    gap: 30px;
}

.nav .nav-list li a {
    color: #000000;
    text-decoration: none;
    font-size: 18px;
    line-height: 1;
    padding: 10px 10px 5px 10px;
    white-space: nowrap; /* 文字が改行されないようにする */
}

.nav .nav-list li a:hover {
    border-bottom: solid 5px #1791c8;
}

.mainVisual-set{
    position:relative;
}

.mainVisual-overlay {
    position: absolute;
    top: 30px; /* 画像上部からの距離 */
    left: 0%; /* 中央揃え */
    font-size: clamp(14px, 3.8vw, 40px); /* 文字サイズ */
    font-weight: bold;
    color: #ffffff;/* 文字色 */
    padding: 10px 5px;
    white-space: nowrap;
    text-shadow: 1px 1px 2px #000000;
}

/* Footer */
footer {
    margin-top: 50px;
    padding: 20px 0px;
    background-color: #1791c8;
    text-align: center;
}

footer li+li::before{
    content:"|";
    color:#ffffff
}

footer .footer-nav {
    display: flex;
    justify-content: center;
   /* gap: 15px; */
    margin-bottom: 10px;
}

footer .footer-nav li a {
    color: #ffffff;
    text-decoration: none;
    padding: 0px 10px;
}

footer .footer-nav li a:hover {
    text-decoration: underline;
}

footer p {
    color: #ffffff;
    font-size: 14px;
}

/*レスポンシブ対応*/

img {
    max-width: 100%;
    height: auto;
}

nav label,
input[type="checkbox"]{
    display: none;
}

/*カレント設定*/
#home nav .menu1 a,
#company nav .menu2 a,
#facility nav .menu3 a,
#recruit nav .menu4 a,
#inquiry nav .menu5 a{
    border-bottom: 5px solid #1791c8;
}

#home footer .menu1 a,
#company footer .menu2 a,
#facility footer .menu3 a,
#recruit footer .menu4 a,
#inquiry footer .menu5 a,
#privacy footer .menu6 a{
    text-decoration: underline;
}

/* 全体の横スクロールを防止 */
html, body {
    overflow-x: hidden;
}

/* .wrapperの余白調整 */
.wrapper {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 0 20px; /* 横幅の余白を固定幅で指定 */
    box-sizing: border-box; /* パディングが幅に含まれるよう設定 */
}

/* headerの余白調整 */
header {
    padding: 10px 0; /* 横幅の余白を削除 */
}

/* navのリストを画面幅に収める */

.nav .nav-list {
    flex-wrap: wrap; /* リストが収まらない場合は折り返す */
    justify-content: center; /* 中央揃え */
    gap: 10px; /* 隙間を調整 */
}

/* #mainVisualの画像が幅を超えないよう調整 */
#mainVisual img {
    width: 100%; /* 画面幅に収める */
    height: auto;
}

/* scroll-imagesの幅を超えないように調整 */
.scroll-images .scroll-container {
    gap: 20px; /* 画像間に隙間を追加 */
}

.scroll-images img {
    max-width: 100%; /* 画像が親幅を超えないよう設定 */
    height: auto;
}

/* footerの幅調整 */
footer {
    padding: 20px 20px;
    box-sizing: border-box; /* パディングを含めた幅計算 */
}