@charset "UTF-8";
/* CSS Document */

/*記号用フォント snsアイコンなど*/
@import url(https://use.fontawesome.com/releases/v6.3.0/css/all.css);

/* PC HEADER */
#header { width:100%; padding: 0; box-sizing: border-box; margin: 0 auto; background-color: #0a3e6f; position: relative; background-image: url(
"../../img/bg_navi.webp"); background-position: center; background-repeat: repeat-y; box-shadow: 0 0 10px hsla(0,0%,0%,0.5); }
#gNavi { width: 100%; padding:0 20px; box-sizing: border-box; }
#gNavi ul { width:100%; padding: 10px 0 0 0; box-sizing: border-box;  margin: 0 auto; height: 80px; display: flex; justify-content:center; align-items: center; flex-wrap: wrap; align-content: center; }
#gNavi ul li { font-size: 1.8rem; padding: 0 1em 10px; position: relative; font-weight: 500; } 
#gNavi ul li:after{ content: ''; position: absolute; width: 1px; height: 20px; background-color: #fff; top: 50%; right: 0; transform: translateY(-70%);}
#gNavi ul li:nth-of-type(1){ padding-left: 0;}
#gNavi ul li:nth-last-of-type(1){ padding-right: 0;}
#gNavi ul li:nth-last-of-type(1):after{ display: none;}
#gNavi ul li:nth-of-type(7){ padding-right: 2em;}
#gNavi ul li:nth-of-type(7):after{ display: none;}
#gNavi ul li a{ text-decoration: none; line-height: 1.5; display: flex; align-items: center; color: #fff;/* padding: 10px 0;*/ transition: all 0.5s;} 
#gNavi ul li a:hover{ text-shadow: 0 0 10px #fff;}
#gNavi ul li.x,#gNavi ul li.youtubelink{ padding: 0 0.4em 10px;}
/* #gNavi ul li.x:after{ display: none;} */
#gNavi ul li.txt a img{transition: all 0.5s; width: 29px;}
#gNavi ul li.x a:hover img{ filter: drop-shadow(0 0 5px #fff);}
#gNavi ul li.youtube:after{ display: none;}
#gNavi ul li.youtubelink a img{transition: all 0.5s; width: 29px;}
#gNavi ul li.youtubelink a:hover img{ filter: drop-shadow(0 0 5px #fff);}

/*ヘッダー固定後*/
#header.nav_fixed{ position: fixed; top:0; z-index: 999999; transform: translateY(-120%);}
#header.nav_fixed.is-show {transform: translateY(0); box-shadow: 0px 5px 10px hsla(0,0%,0%,0.10); animation: DownAnime 2s forwards; display: block !important;}
#header.nav_fixed .inbox{ display: none; }

/* SP HEADER for CONTENT PAGE */
#spHeader { display:none; position:fixed; width:100%; top:0; left:0; z-index:99999; overflow:visible; }
#spHeader #spHeaderBox { padding:60px 0 0 0; position:relative; background-color:#fff; background-image:url("../../img/bg01.webp"); background-repeat: repeat; z-index:99999;}
#spHeader #spHeaderBox h2 { display:block; position:absolute; width:220px; left:20px; top: 0; height: 100%; max-width: calc( 100% - 170px); }
#spHeader #spHeaderBox h2 a { display:block;}
#spHeader #spHeaderBox p.x {position: absolute; right: 105px; z-index:99999; top: 50%; }
#spHeader #spHeaderBox p.x a{ display: block; width: 29px; height: 29px; transform: translateY(-50%);}
#spHeader #spHeaderBox p.youtubelink {position: absolute; right: 65px; z-index:99999; top: 50%; }
#spHeader #spHeaderBox p.youtubelink a{ display: block; width: 29px; height: 29px; transform: translateY(-50%);}

#spHeader #spHeaderBox p a { display:block; position:relative; padding:6.15% 0 0 0;}
#spHeader #spHeaderBox h2 img { display:block; width:100%; height:auto; position:absolute; top:50%; left:50%; transform: translateY(-50%) translateX(-50%); }
#spHeader #spHeaderBox p img { display:block; width:100%; height:100%; position:absolute; top:0; left:0; }
#spHeader #spNavi { top:0; left:0; width:100%; height:0px; margin:0 0 0 0; overflow:hidden; position:fixed; transition:opacity 0.5s ease-in 0s; z-index:99998; padding:0 0 0 0; box-sizing:border-box; opacity:0; background:hsla(0,0%,100%,0.90); }
#spHeader #spNavi.open { height:100%; padding:60px 0 0 0; opacity:1; }
#spHeader #spNavi ul { box-sizing:border-box; padding:50px 20px; height:100%;overflow:auto; }
#spHeader #spNavi ul li { display:block; width:100%; float:none; box-sizing:border-box; position:relative; z-index:9999; font-weight: bold; margin-bottom: 1em}
#spHeader #spNavi ul li a { font-size:1.8rem; text-align:left; color:#000; line-height:1.2em; text-decoration:none; }
#spHeader #spNavi ul li a:hover{ color: #0a3e6f; border-bottom: 1px solid #0a3e6f;}
#spHeader #spHeaderBox .spMenu {position:absolute; display:block; width:auto; height:24px; top:50%; right:20px; transform: translateY(-50%) ; z-index:99999; }

/*ハンバーガーメニューアニメーション*/
#spHeaderBox li a.menu-trigger:hover,#spHeaderBox li a.menu-trigger span:hover{ opacity: 1;}
.menu-trigger,.menu-trigger span { display: inline-block; transition: all .6s; box-sizing: border-box; z-index: 9999; }
.menu-trigger { position: relative; width: 30px; height: 26px; cursor: pointer;}
.menu-trigger span { position: absolute; left: 0; width: 100%;  height: 2px; background-color: #000;}
.menu-trigger span:nth-of-type(1) { top: 0; }
.menu-trigger span:nth-of-type(2) { top: 12px; }
.menu-trigger span:nth-of-type(3) { bottom: 0; }
.menu-trigger.open span {background-color: #000; }
.menu-trigger.open span:nth-of-type(1) { -webkit-transform: translateY(12px) rotate(-43deg); transform: translateY(12px) rotate(-43deg); }
.menu-trigger.open span:nth-of-type(2) { opacity: 0;}
.menu-trigger.open span:nth-of-type(2):hover{ opacity: 0 !important;}
.menu-trigger.open span:nth-of-type(3) { -webkit-transform: translateY(-12px) rotate(43deg); transform: translateY(-12px) rotate(43deg); }

/* FOOTER */
#page-top { position: fixed; width: 50px; height: 50px; bottom: 20px; right: 20px; z-index: 999;}
#page-top a{ display: block; transition: all .3s; }
#page-top a:hover{ transform: translate(0,-5px); }
#page-top span{ display: table-cell; vertical-align: middle;}
#footer { width: 100%; font-size: 1.2rem; text-align: center; box-sizing: border-box; margin:-50px 0 0; color: #fff; }
#footer .logo{ width: 140px; margin: 0 auto 15px; max-width: 20%; }
#footer .linkBox{ background-color: #0a3e6f; padding: 13px; justify-content: center; }
#footer .linkBox li{ padding: 0 1em; border-right: 1px solid #fff;}
#footer .linkBox li:nth-last-of-type(1){border-right: none;}
#footer .linkBox a{ color: #fff; text-decoration: none; }
#footer .linkBox a:hover{ opacity: 0.6}
#footer p.copy{ padding: 10px; color: #666;}

/* COMMON PAGE */
body { background-image: url("../../img/bg01.webp"); background-repeat: repeat;}
h3{ text-align: center; font-weight: 700; padding-bottom: 0.8em; border-bottom: 2px solid #333; margin:0 auto 1em; max-width: 100%; line-height: 1.4;}
h3.title{ border-bottom: none;}
h3 .subTxt{ display: block; font-size: 1.8rem; margin-top: 5px;}
h3 .txt{display: block; font-size: 1.8rem; margin-top: 10px; color: #333;}
.commonContent { padding:0 50px; max-width: 100%; }
.title01{ text-align: center; color: #fff; font-size: 2.4rem; margin-bottom: 0.5em; background-color: #0a3e6f; font-weight: 600;}
h3.title02{ font-size: 3rem; color: #0a3e6f; border-bottom: none; padding-bottom: 0; margin-bottom: 80px;}
h3.title02.subTitle{ margin-bottom: 10px;}
h3.title02 .subTxt{ color: #666666; font-weight: 500;}
h4.tit_gray{ background-image: url("../../img/title_bg_gray.webp"); background-size: 100% 100%; padding:15px 20px; margin-bottom: 15px; font-weight: 600; font-size: 1.8rem;}
.sub_con{ margin-bottom: 30px;}
.sub_con .pdf_download {display:flex; align-items: center;}
.sub_con .pdf_download span {padding-right: 5px; display: grid;}
#pageTitle{ margin-top: 80px;}
.local_navi{ margin: 0 auto 60px; width: 1100px; max-width: 100%; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap; font-weight: 500; }
.local_navi a{ font-size: 1.8rem; line-height: 1.5; font-weight: 600; text-align: center; width: calc(( 100% - 20px)/3); margin-right: 10px; display: flex; justify-content: center; align-items: center; align-content: center; flex-wrap: wrap; transition: all 0.3s ease-in 0s; color: #fff; padding: 10px; text-decoration: none; background-color: #0a3e6f;}
.local_navi a:last-child{margin-right: 0 !important;}
.local_navi a:hover,.local_navi a.active{background-color: #0083c6; color: #fff;}

@media screen and (max-width:1300px) {
#gNavi ul li { font-size: 1.38vw; padding: 0 0.9em 10px; } 
#gNavi ul li:after{ height: 1.4vw; }
#gNavi ul li.x a img{width: 1.5em;}
#gNavi ul li.youtubelink a img{width: 1.5em;}

}
@media screen and (max-width:810px) {
body { padding:60px 0 0 0 !important; }
#archive2024 .flexBox .item,#archive2223 .flexBox .item { width : 100% !important; }
/* HEADER */
#header { display:none !important; }	
#header.nav_fixed.is-show { display:none !important; }	

/* SP HEADER for CONTENT PAGE */
#spHeader { display:block; }

/* COMMON PAGE */
.commonContent { padding:0 40px; }
	
/* FOOTER */
#footer { width: 100%; }
#footer a{ display: block; margin: 0;}
}

@media screen and (max-width:600px) {
h3.title02{ margin-bottom: 40px;}
}

@media screen and (max-width:480px) {
/* COMMON PAGE */
.commonContent { padding:0 20px; }
.title01{ font-size: 2rem; }
h3 .subTxt{ font-size: 1.4rem; }
h3.title02{ font-size: 2.2rem;}
	
.local_navi a{ font-size: 1.6rem; width: calc(( 100% - 10px)/3); margin-right: 5px; }
	
/* FOOTER */
#page-top {width: 40px; height: 40px; bottom: 10px; right: 10px;}
#footer { font-size: 1rem;}

}