@charset "utf-8";
/*=========================================================
   ハンバーガーメニュー、スタイルシート
=========================================================*/

/* 基本設定 *  /
body { margin: 0; padding: 0; font-family: sans-serif; }
ul { list-style: none; margin: 0; padding: 0; } */
a { text-decoration: none; color: #000; display: block; transition: 0.3s; }


/* ヘッダー全体 (1225px) */
.header {
    width: 100%;
    border-top: 0px solid #2891F6;
    background: #fff;
}
.header-inner {
    max-width: 1225px;
    margin: 0 auto;
    display: flex;
    align-items: center;
}

/* ロゴ (350px) */
.logo {
    width: 350px;
    padding-right: 70px;/* 80%縮小 */
/*    padding: 0 35px;/* 80%縮小 */
/*    padding: 0 35px 0 70px;/* 70%縮小 */
/*    padding: 0 35px 0 105px;/* 60%縮小 */
    flex-shrink: 0;
}
.logo img { max-width: 100%; height: auto; display: block; }

/* ロゴ (350px) */
.logo1 {
    width: 200px;
    flex-shrink: 0;
}
.logo1 img { max-width: auto; height: 100px; display: block; }

/* PC用ナビゲーション */
.gnav { flex-grow: 1; }
.gnav-list {
    display: flex;
    width: 100%;
}
.gnav-item {
    position: relative;
    width: calc((1225px - 350px) / 7); /* 875pxを7等分 = 125px */
    text-align: center;
}
.gnav-item > a {
    padding: 25px 0;
    background: #fff;
    border-left: 1px solid #eee;
    font-size: 18px; /* ←ここを追記（例: 18px） */
    font-weight: bold; /* 太字にしたい場合はこれも追加 */
}
.gnav-item:last-child { border-right: 1px solid #eee; }

/* サブメニュー (初期状態は非表示) */
.sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    width: 220px; /* サブメニューの横幅 */
    background: #fff;
    box-shadow: 0 4px 10px rgba(0,0,0,0.1);
    opacity: 0;
    visibility: hidden;
    transition: 0.2s ease-in-out;
    z-index: 1000;
}
.sub-menu li a {
    padding: 15px;
    border-bottom: 1px solid #f0f0f0;
    text-align: left;
    font-size: 16px; /* ←ここを追記（例: 14px） */
}
.sub-menu li a:hover { background: #f8f8f8; }

/* ホバーで表示（PC） */
@media screen and (min-width: 1225px) {
    .gnav-item:hover > .sub-menu {
        opacity: 1;
        visibility: visible;
    }
    .gnav-item:hover > a { background: #f0f0f0; }
    
    /* 右端（メニュー6）のサブメニューを右側に揃える */
    .gnav-item.is-right .sub-menu {
        left: auto;
        right: 0;
    }
}

/* モバイル用ハンバーガー (1225px未満) */
.menu-trigger { display: none; }

@media screen and (max-width: 1224px) {
    /* 1. ヘッダーの基準設定 */
    .header {
        position: relative; /* メニューの配置基準にする */
    }

    .header-inner { 
        padding: 10px; 
        justify-content: space-between; 
    }

    .logo { width: 350px; }

@media screen and (max-width: 850px) {
	.logo { width: 300px;
		padding-right: 50px; }
}

@media screen and (max-width: 720px) {
	.logo { width: 250px;
		padding-right: 20px; }
}

@media screen and (max-width: 500px) {
	.logo { width: 200px;
		padding-right: 0px; }
}

@media screen and (max-width: 700px) {
	.logo1 { hight: 70px; }
}

    /* 2. ナビゲーションの配置設定 */
    .gnav {
        display: none; 
        position: absolute; /* 親（.header）を基準に浮かす */
        top: 100%;          /* ヘッダーの底辺に合わせる */
        left: 0;
        width: 100%; 
        background: #fff; 
        border-top: 1px solid #ccc;
        box-shadow: 0 4px 10px rgba(0,0,0,0.1); /* 少し影を付けると境目がわかりやすくなります */
        z-index: 2000;      /* コンテンツより前面に出す */
    }

    .gnav.is-show { display: block; }
    
    .menu-trigger {
        display: block; width: 30px; height: 24px;
        position: relative; background: none; border: none; cursor: pointer;
    }
    .menu-trigger span {
        display: block; width: 100%; height: 2px;
        background: #333; position: absolute; left: 0; transition: 0.3s;
    }
    .menu-trigger span:nth-child(1) { top: 0; }
    .menu-trigger span:nth-child(2) { top: 11px; }
    .menu-trigger span:nth-child(3) { top: 22px; }

    /* ハンバーガー開閉アニメーション */
    .menu-trigger.is-open span:nth-child(1) { transform: translateY(11px) rotate(45deg); }
    .menu-trigger.is-open span:nth-child(2) { opacity: 0; }
    .menu-trigger.is-open span:nth-child(3) { transform: translateY(-11px) rotate(-45deg); }

    .gnav {
        display: none; position: absolute; top: 100%; left: 0;
        width: 100%; background: #fff; border-top: 1px solid #ccc;
    }
    .gnav.is-show { display: block; }
    .gnav-list { flex-direction: column; }
    .gnav-item { width: 100%; text-align: left; }
    .gnav-item > a { border: none; border-bottom: 1px solid #eee; padding: 15px 20px;}
    
    /* モバイル時サブメニュー：クリックで展開 */
    .sub-menu {
        position: static; opacity: 1; visibility: visible; 
        display: none; width: 100%; box-shadow: none; background: #F8F8FF;
        padding-left: 1.5em;
    }
    .gnav-item.is-active .sub-menu { display: block; }
}