@charset "utf-8";

/************************************************************************************************************************
Header：共通
*************************************************************************************************************************/
header{
	display:-webkit-flex;
	display:flex;

	-webkit-flex-direction:column;
	flex-direction:column;
	
	-webkit-align-items:center;
	align-items:center;

	-webkit-justify-content:center;
	justify-content:center;

	position: fixed;
	width:100%;
	z-index: 5;
	
	/*margin-bottom:10px ;*/
}


/************************************************************************************************************************
Header：title部
*************************************************************************************************************************/

/*header腰上 ＞ タイトル部*/
#headarea_title{
	display:-webkit-flex;
	display:flex;

	-webkit-flex-direction:column;
	flex-direction:column;

	-webkit-align-items:center;
	align-items:center;

	-webkit-justify-content:center;
	justify-content:center;

	position: relative;
	width: 100%;
	min-height:110px;
	padding-bottom:10px;

	z-index: 4;	
	background: #ffffff;
	
	-webkit-box-shadow:0 0 10px rgba(0,0,0,0.4);
    -moz-box-shadow:0 0 10px rgba(0,0,0,0.4);
    box-shadow:0 0 10px rgba(0,0,0,0.4);
	
	font-size:8px;font-size:0.8rem;
}

#headarea_title .container{
	margin: 0;
	padding: 0;
}


/*header腰上 ＞ タイトル部左側*/
#headarea_title .inner_left{
	display:-webkit-flex;
	display:flex;

	-webkit-align-items:center;
	align-items:center;

	/*bootstrap　gridで各ポイントごとに下記のflex指定*/
	/*-webkit-justify-content:center;
	justify-content:center;*/
}
#headarea_title .inner_left .headlogo{
	position: relative;
}


/*header腰上 ＞ タイトル部右側*/
#headarea_title .inner_right{
	display:-webkit-flex;
	display:flex;

	-webkit-flex-direction:column;
	flex-direction:column;

	-webkit-align-content:center;
	align-content:center;

	/*bootstrap　gridで各ポイントごとに下記のflex指定*/
	/*-webkit-justify-content:flex-end;
	justify-content:flex-end;*/

	font-size:8px;font-size:0.8rem;
}


#headarea_title #firstrow{
	display:-webkit-flex;
	display:flex;

	-webkit-flex-direction:row;
	flex-direction:row;

	-webkit-align-items:center;
	align-items:center;

	/*bootstrap　gridで各ポイントごとに下記のflex指定*/
	/*-webkit-justify-content:space-around;
	justify-content:space-around;*/
	
	height:25px;
	/*width: 100%;*/
	margin-bottom:10px;
}
#headarea_title #firstrow a{
	text-decoration: none;
	color: #314566;
}
#headarea_title #firstrow a:hover{
	color: #878e9b;
	/*background: #3F5175;*/
}
/*最後の要素を除外*/
#headarea_title #firstrow a:not(:last-child){
	margin-right: 35px;	
}
#headarea_title #firstrow i{
	margin-right: 3px;
}


#headarea_title #secondrow{
	display:-webkit-flex;
	display:flex;

	-webkit-flex-direction:row;
	flex-direction:row;
	
	/*-webkit-flex-wrap:nowrap;
	flex-wrap:nowrap;*/

	-webkit-align-items:center;
	align-items:center;

	-webkit-justify-content:flex-end;
	justify-content:flex-end;

	height:25px;
	/*width: 100%;*/
	margin-bottom:10px;
}
#headarea_title #secondrow #ch_fontsize{
	display:-webkit-flex;
	display:flex;
	
	-webkit-flex-direction:row;
	flex-direction:row;
	
	/*margin-right: 0px;*/
	/*width:200px;*/
}
#headarea_title #secondrow #ch_fontsize ul{
	margin: 0;
	padding: 0 10px 0 10px;
}
#headarea_title #secondrow #ch_fontsize li{
	margin-right:3px;
}
#headarea_title #secondrow #ch_fontsize .btn{
	cursor: pointer;
	font-size:6px;font-size:0.6rem;
	/*margin-right:8px;*/
	
	background: #314566;
	/*font-weight: 400;*/
	border: 1px solid #314566;
}
#headarea_title #secondrow #ch_fontsize .btn:hover{
	background: #878e9b;
	border: 1px solid #878e9b;
}
/*google translate位置設定*/
#headarea_title #secondrow .google_translate{
	display: block;
	margin-left:10px;
}




#headarea_title #thirdrow{
	display:-webkit-flex;
	display:flex;

	-webkit-flex-direction:row;
	flex-direction:row;

	-webkit-align-items:center;
	align-items:center;

	-webkit-justify-content:flex-end;
	justify-content:flex-end;

	height:30px;
	/*width: 100%;*/
	/*margin-bottom:5px;*/
}

/* 検索枠の設定（HTMLの場合） */
#headarea_title #thirdrow form{
	display:-webkit-flex;
	display:flex;

	-webkit-flex-direction:row;
	flex-direction:row;

	-webkit-align-items:center;
	align-items:center;
}
#searchbox{
	width:200px;
	height:30px;
	margin-right:5px;
}
/* 検索枠の設定（スクリプトの場合） */
.gsc-search-box{
	max-width:300px;
}
#gs_tti50{
	padding-top:0px;
	padding-bottom:0px;
	margin:2px 0px;
	overflow: hidden;
}



/************************************************************************************************************************
Header：グローバルメニューボタン部
*************************************************************************************************************************/

/*header腰下　＞　メニュー部*/

#headarea_nav{
	display:flex;
	display:-webkit-flex;
 	
	-webkit-align-items:center;
	align-items:center;

	-webkit-flex-wrap: wrap; /* Safari */
	flex-wrap:         wrap;

	-webkit-justify-content:center;
	justify-content:center;

	align-content:center;
	-webkit-align-content:center;
	
	background: #314566;
	
	position: relative;
	/*min-height:70px; 設定するとflexが無視されIEで上下中央に設置されないエラーが発生*/
	width: 100%;
	z-index: 3;
	transition: .3s;
	
	font-size:10px;font-size:1.0rem;
	color: #ffffff;
}


/*　トップページのHEADER */
#navcontent{
	display: block;
	/*margin: auto;*/
	padding-top:10px;
	padding-bottom:10px;
	width: 100%;/*これを設定しなければIEでflex-wrapが無視される*/
}
#topnav ul{
	margin: 0;
	padding: 0;

	display:-webkit-flex;
	display:flex;

	-webkit-flex-direction:row; /* Safari */
	flex-direction:row;
	
	-webkit-flex-wrap: wrap; /* Safari */
	flex-wrap:         wrap;

	-webkit-justify-content: space-around;
	justify-content:space-around;
	
	/*上下の配置方法*/
	-webkit-align-items:center;
	align-items:center;

	/*左右の配置方法*/
	-webkit-justify-content:center; /* Safari */
	justify-content:center;
}
#topnav ul li{
	/*padding: 5px 30px;*/
	/*line-height: 1.5;*/
	padding: 0;
}
#topnav ul li:not(:last-child){
	border-right:solid 1px #aaa;
}

#topnav ul li a{
	font-size:10px;font-size:1.0rem;
	/*font-weight: 500;*/
	letter-spacing: 0.1em;
 	color:#ffffff;

 	display: block;
 	width:100%;
 	height:100%;
 	
	line-height: 1.5;
	text-align:center;
	
	padding: 5px 35px;
	text-decoration:none;
}
#topnav ul li a:hover{
	color:#ccc;
	/*background: #2f394f;*/
	background: #3f5175;
}
#topnav ul li .en{
	color: #ddd;
	font-size:5px;font-size:0.5rem !important;
	font-weight: 200;
	letter-spacing: 0.1em;
	margin-bottom: 0;
}



#navcontent_hidden nav{
/*	display:-webkit-flex;
	display:flex;

	-webkit-justify-content:center; /* Safari *
	justify-content:center;	*/
}
#navcontent_hidden button{
/*	margin-right:auto;
	margin-left:auto;
	
	font-size:9px;font-size:0.9rem;
	border: 0.5px solid;
	border-color: #999;
	color:#666;
*/}
#navcontent_hidden button:focus{
	outline: 0;
}

#topnav_hidden ul{
	margin: 0;
	padding: 0;

	display:-webkit-flex;
	display:flex;

	-webkit-flex-direction:column; /* Safari */
	flex-direction:column;
	
	-webkit-flex-wrap: wrap; /* Safari */
	flex-wrap:         wrap;

	-webkit-justify-content: left;
	justify-content:left;
	
	/*上下の配置方法*/
	-webkit-align-items:flex-start;
	align-items:flex-start;

	/*左右の配置方法*/
	-webkit-justify-content:left; /* Safari */
	justify-content:left;
}
#topnav_hidden ul li{
	padding: 0;
	/*border-left:solid 4px #aaa;*/
	margin: 3px 0px;
	padding-top:3px;
	padding-bottom:3px;
	width:100%;
}
#topnav_hidden ul li:hover{
	border-left:solid 5px #555;
}

#topnav_hidden ul li a{
	font-size:9px;font-size:0.9rem;
	/*font-weight: 500;*/
	letter-spacing: 0.1em;
 	color:#666;

 	display: block;
 	width:100%;
 	height:100%;
 	
	line-height: 1.3;
	text-align:left;
	
	padding-left:20px;
	text-decoration:none;
}
#topnav_hidden ul li a:hover{
	/*color:#fff;*/
	/*background: #3f5175;*/
}
#topnav_hidden ul li .en{
	color: #ccc;
	font-size:5px;font-size:0.5rem !important;
	font-weight: 200;
	letter-spacing: 0.1em;
	margin-bottom: 0;
}




/*lg〜xlまで( < 1200 )の場合*/
@media screen and (max-width: 1199px) {
	#topnav ul li a{
		padding: 5px 22px;
	}
}

/*md〜lgまで( < 992 )の場合*/
@media screen and (max-width: 991px) {
	#topnav ul li a{
		padding: 5px 16px;
	}
}

/*( < 850 )の場合*/
@media screen and (max-width: 849px) {
	#topnav ul li a{
		padding: 5px 11px;
	}
}


/*md以上( 768 < )の場合*/
@media screen and (min-width: 768px) {
	/*スマホ・タブレットサイズ以上のヘッダ表示切り替え*/
	#navcontent{
		display:block;
	}
	#navcontent_hidden{
		display:none;
	}
}

/*sm〜mdまで( < 768 )の場合*/
@media screen and (max-width: 767px) {
	/*スマホ・タブレットサイズ以下のヘッダ表示切り替え*/
	#navcontent{
		display:none;
	}
	#navcontent_hidden{
		display:block;
	}

	/* スマホタブレットサイズの場合のヘッダーの調整 */
	#headarea_title{
		min-height: 90px;
		padding-bottom: 15px;
	}

	#headarea_title #firstrow a:not(:last-child){
		margin-right: 20px;	
	}
	#headarea_title .inner_right #secondrow{
		display:none;
	}
	#headarea_title .inner_right #thirdrow{
		display:none;
	}

	#headarea_nav{
		/*min-height:45px;*/
	}
}



/* マウスオンメニューの設定　250227追加 */
@media(min-width: 768px) {

	#menu-global .menu-item{
		/* サブメニューをabsoluteするために、親メニュー relativeを明示的に指定 */
		position: relative;
	}

	#menu-global .sub-menu {
    position: absolute;
    top: 45px;
    left: 60;
    /* overflow: hidden; */
    width: 260px;
    height: 0;
    transition: .8s;
    transform: translateY(-20px);
    opacity: 0;
		display: none;
  }
	
  #menu-global li:hover .sub-menu {
		height: auto;
    transform: translateY(0);
    opacity: 1;
		display: block;
  }
	
  #menu-global .sub-menu li {
		display: block;
    margin-left: 0;
		width: 260px;
    padding: 0;
		border: none !important;
    /* border-bottom: 1px solid #ddd; */
	  background-color: rgba(63, 81, 117, 1.0);
	  /* background-color: rgb(190, 193, 197); */
  }
	
  #menu-global .menu-item-has-children:nth-last-child(1) .sub-menu,
  #menu-global .menu-item-has-children:nth-last-child(2) .sub-menu {
		border: none !important;
		right: 0;
    left: auto;
  }
	
  #menu-global .sub-menu li a {
		border: none !important;
		font-size:0.8rem;
    padding: 1em;
  }
	
	/* .header-nav li {
    position: relative;
  }
 
  .header-nav .sub-menu {
    position: absolute;
    top: 30px;
    left: 0;
    overflow: hidden;
    width: 250px;
    height: 0;
    transition: .8s;
    transform: translateY(-8%);
    opacity: 0;
  }
 
  .header-nav li:hover .sub-menu {
    height: auto;
    transform: translateY(0);
    opacity: 1;
  }
 
  .header-nav .sub-menu li {
    display: block;
    margin-left: 0;
    padding: 0;
    border-bottom: 1px solid #ddd;
    background-color: rgb(255 255 255 / 90%);
  }
 
  .header-nav .menu-item-has-children:nth-last-child(1) .sub-menu,
  .header-nav .menu-item-has-children:nth-last-child(2) .sub-menu {
    right: 0;
    left: auto;
  }
 
  .header-nav .sub-menu li a {
    padding: 1em;
  } */
}
 


/*スマホ用レイアウト*/
@media(max-width: 767px) {
	#menu-global-1 .sub-menu {
		display: none;
	}

	/* #menu-global .sub-menu li a {
    position: relative;
    padding: 1rem 1rem 1rem 3em;
  }

	#menu-global .sub-menu li a::before {
    position: absolute;
    top: 1.25em;
    left: 1.75em;
    display: block;
    width: .5em;
    height: .5em;
    content: "";
    border-bottom: 1px solid #fff;
    border-left: 1px solid #fff;
  }  */

	/* .header-nav li a {
    text-align: left;
  }
 
  .header-nav .menu-item-has-children > a {
    padding-bottom: 1em;
  }
 
  .header-nav .sub-menu li a {
    position: relative;
    padding: 1rem 1rem 1rem 2.75em;
  }
 
  .header-nav .sub-menu li a::before {
    position: absolute;
    top: 1.25em;
    left: 1.75em;
    display: block;
    width: .5em;
    height: .5em;
    content: "";
    border-bottom: 1px solid #fff;
    border-left: 1px solid #fff;
  } */
}

/*ここまで マウスオンメニューの設定　250227追加 */