@charset "utf-8";
header{}

.wrap_header{
display: flex;		/*flexボックスを使う指定*/
	flex-wrap: wrap;	/*折り返す指定*/
	justify-content: start;	/*並びかたの種類の指定*/
	width:1200px;
}
    
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.logo{margin-top:32px;}
.drop_m{margin-top:25px;}

/* ナビゲーションメニュー */
.nav-menu {  
  color: #171C61; /* メニューテキストの色 */
}
.nav-menu ul{
list-style-type:none;
}
.nav-menu ul li{
font-size:19px;font-weight:600;
}

.menu-list {
  display: flex;
  justify-content: center; /* メニューアイテムを中央揃えに */
  height:90px;padding-top:20px;
}
.menu-item {
  border-left: ; /* メニューアイテムの左ボーダー */
  position: relative;
}
.menu-item:last-child {
  border-right: ; /* 最後のメニューアイテムの右ボーダー */
}

/* メニューアイテムのホバースタイル */
.menu-item:hover .drop-menu-list {
  visibility: visible; /* 下層メニューを表示 */
}
.menu-item a {
  align-items: center;
  color: #171C61; /* メニューアイテム内のリンクテキストの色 */
  display: flex;
  height: 50px;
  justify-content: center;
  text-decoration: none; /* リンクの下線を非表示 */
  width: 120px;
}

/* ドロップダウンメニュー */
.drop-menu {
  position: relative;
}
.drop-menu-list {
  background-color: #171C61; /* ドロップダウンメニューの背景色 */  
  left: -20px;
  position: absolute;
  top: 100%;
  visibility: hidden; /* 下層メニューを非表示 */
  width: max-content;
  z-index: 1;
}


.drop-menu-item{border-bottom:1px solid #fff;}
.drop-menu-item:last-child{border-bottom:none;}
.drop-menu-item a{color:#FFF;font-weight:normal;font-size:16px;width:220px;text-align:left;}
.drop-menu-item a:hover{background-color: #333;}

@media screen and (max-width:1300px) {
.wrap_header{width:90%;margin:0 auto;}
}
@media screen and (max-width:1200px) {
.logo{margin-top:0px;}
.drop_m{margin-top:-10px;}

}

@media screen and (max-width:1100px) {

}
@media screen and (max-width:1000px) {


}
@media screen and (max-width:900px) {
.nav-menu { display:none;}
.wrap_header{justify-content:space-between;}

/* ---------------------------------------------- */
/* ハンバーガーメニュー */
/* ------------------------- */
#header-hamburger {
    /* 見た目のCSS */
    background:rgba(30,23,75,1.0);
    cursor: pointer;
    width: 50px;
    aspect-ratio: 1/1;
    margin-left: auto;
    /* ボタンがハンバーガーウィンドウの下に隠れないようにする指定 */
    position: relative;
    z-index: 10;
}

/* ----------------- */
/* 三本線 */
/* ----------------- */
#header-hamburger span {
    /* 見た目のCSS */
    display: inline-block;
    background: #fff;
    width: 50%;
    height: 2px;
    /* バーガー線の太さ */
    /*アニメーションの設定*/
    transition: all .4s;
    position: absolute;
    left: 50%;
    /* バーガー線の位置 */
    transform: translateX(-50%);
}

/* １本目 */
#header-hamburger span:nth-of-type(1) {
    top: 30%;
}

/* ２本目 */
#header-hamburger span:nth-of-type(2) {
    top: 50%;
}

/* ３本目 */
#header-hamburger span:nth-of-type(3) {
    top: 70%;
}
.hamburger-window__nav-list{margin-top:82px;width:100%;margin-left:0;}


/* ------------------ */
/* ×印 */
/* ------------------ */
/*activeクラスが付与されると線が回転して×になる*/
#header-hamburger.active span:nth-of-type(1) {
    top: 50%;
    left: 25%;
    transform: rotate(-45deg);
    width: 50%;
}

#header-hamburger.active span:nth-of-type(2) {
    opacity: 0;
}

#header-hamburger.active span:nth-of-type(3) {
    top: 50%;
    left: 25%;
    transform: rotate(45deg);
    width: 50%;
}

/* ----------------------------------------------- */
/* メニューウィンドウ */
/* -------------------------- */
#hamburger-window {
    transition: 0.3s;background:rgba(25,68,142,0.5); #19448e;
    text-align: center;
    /* 初期状態は非表示 */
    visibility: hidden;
    position: fixed;
    top: 0px;
    right: -100dvw;
    z-index: 1;
    /* 画面いっぱいに表示されるサイズに設定 */
    width: 100%;
    height: calc(100vh - 0px);
    /* 画面からはみ出したらスクロール可能にする */
    overflow-y: scroll;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/*スクロールバー非表示（Chrome・Safari）*/
.content::-webkit-scrollbar{
    display:none;
}

#hamburger-window.open {
    visibility: visible;
    right: 0;
}

.hamburger-window__link {
    display: block;
    margin: 0 auto;
    width: 100%;margin-top:0;
}

.hamburger-window__link:first-child .acordion-btn {
    border-top: 1px solid #ccc;
}


/* ----------------------------------
アコーディオン部分
--------------------- */
.acordion-menu-wrapper {
    background-color: rgba(25,68,142,0.7); #19448e;
}    

#hamburger-window ul li{list-style-type:none;padding-left:0px;margin-left:0px;text-indent:0px;}
.acordion{padding-left:0px;margin-left:0px;text-indent:0px;margin-bottom:0 !important;width:100%;margin-right:0;}

.acordion-menu-wrapper p{line-height:1;margin-bottom:0;padding-bottom:0;}

.acordion-btn {
    display: flex;
    align-items: center;
    border-bottom: 1px solid #ccc;
    padding-left: 5%;text-decoration:none;
    padding-bottom:20px;
    padding-top:20px;
}    

.acordion-btn:hover {
    background-color:  rgba(23,28,97,0.5);
}

.pls0::after {
    /* fontawesomeアイコンを表示 */
    content: '';
    font-weight: 900;
    font-family: "Font Awesome 6 Free";
    display: inline-block;
    position: absolute;
    right: 5%;
    width: 10px;
    aspect-ratio: 1/1;
    color: #fff;
} 

.pls2::after {
    /* fontawesomeアイコンを表示 */
    content: '\2b';
    font-weight: 900;
    font-family: "Font Awesome 6 Free";
    display: inline-block;
    position: absolute;
    right: 5%;
    width: 10px;
    aspect-ratio: 1/1;
    color: #fff;
}    

.acordion-btn.is-open::after {
    /* fontawesomeアイコンを表示 */
    content: '\f068';
}

.hamburger-window__title {
    color: #fff;
}

.hamburger-window__title span{display:inline-block;margin-left:10px;font-size:0.8em;}    

.acordion>.acordion__item {
    position: relative;
    text-align: left;
    width: 100%;
    background-color:gba(25,68,142,0.5);
    /* 閉じている状態 */
    border-top: 0 #ccc solid;
    line-height: 0;
    /* 閉じるアニメーション */
    transition:
        border-top .1s ease-out,
}

.acordion.is-open>.acordion__item {
    background-color:rgba(153,153,153,0.5);
    /* 開いている状態 */
    border-top: 1px #ccc solid;
    /* 開くアニメーション */
    transition:
        border-top .1s ease-out,
}

.acordion.is-open>.acordion__item:first-child {
    border-top: none;
}

.acordion.is-open>.acordion__item::after {
    /* fontawesomeアイコンを表示 */
    content: '\f054';
    font-weight: 900;
    font-family: "Font Awesome 6 Free";
    display: inline-block;
    position: absolute;
    top: 50%;
    right: 10%;
    width: 10px;
    aspect-ratio: 1/1;
    color: #fff;
}

.acordion>.acordion__item>.acordion__link {
    color: #fff;
    display: block;
    padding-left: 7%;
    /* 閉じている状態 */
    padding-top: 0;
    padding-bottom: 0;
    line-height: 0;
    opacity: 0;
    visibility: hidden;
    /* 閉じるアニメーション */
    transition:
        padding-top .3s ease-out,
        padding-bottom .3s ease-out,
        line-height .3s ease-out,
        opacity .1s linear,
        visibility .1s linear;text-decoration:none;
}

.acordion.is-open>.acordion__item>.acordion__link {
    display: block;
    padding-left: 7%;
    /* 開いている状態 */
    padding-top: 15px;
    padding-bottom: 15px;
    line-height: 1.5;
    opacity: 1;list-style-type:none;
    visibility: visible;
    /* 開くアニメーション */
    transition:
        padding-top .3s ease-out,
        padding-bottom .3s ease-out,
        line-height .3s ease-out,
        opacity .1s linear,
        visibility .1s linear;
}


}

@media screen and (max-width:800px) {


}
@media screen and (max-width:700px) {


}

@media screen and (max-width:600px) {


}

}

@media screen and (max-width:550px) {

}
@media screen and (max-width:500px) {


}

@media screen and (max-width:450px) {


}


@media screen and (max-width:400px) {


}

@media screen and (max-width:370px) {
.logo{width:80%;height:auto;}

}

@media screen and (min-width:901px) {
#header{display:none;}
}
@media screen and (min-width:601px) {

}
@media screen and (min-width:551px) {

}

@media screen and (min-width:521px) {

}

@media screen and (min-width:401px) {

}

@media print{
    #header{
        display: none;
    }
    .logo_sp,.logo_tb{display: none;}
    .img-wrap,.img-wrap2{overflow: visible;}
    .js-animation{opacity: 1;
    visibility: visible;
    transform: translateY(0px);}
}