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

/* 基本設定 */
a { text-decoration: none; color: #000; display: block; transition: 0.3s; }


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

/* ロゴ (350px) */
.logo {
    width: 350px;
    padding-right: auto;
    flex-shrink: 0;
}

/* ロゴ表示（PC） */
@media screen and (max-width: 1250px) {
    .logo {
    	width: auto;
    	margin: 0em auto 0em 1em;
    }
}

.logo img { max-width: auto; height: auto; display: block; }

/* ロゴ (350px) */
.logo1 {
    width: 200px;
    flex-shrink: 0;
}

.logo1 img { max-width: auto; height: 100px; display: block; }

/* PC用ナビゲーション */
.gnav { flex-grow: 0; margin: 0 0.5em 0 auto;}
.gnav-list {
    display: flex;
    width: 100%;
}
.gnav-item {
    position: relative;
    width: calc((1200px - 350px) / 6); /* 875pxを7等分 = 125px */
    text-align: center;
}
.gnav-item > a {
    padding: 16px 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: 1000px) {
    .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;
    }
}

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

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

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

    .logo { width: 350px; }

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


    /* 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: 4px;/* ハンバーガー横線太さ */
        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%; right: 0.5em;
        width: 20em; 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; }
}