@charset "UTF-8";
/* CSS Document */
/*ページ読み込まれるまでメニュー非表示
.header nav{
    display: none;
}*/

@media screen and (max-width:870px) {
/* 横幅が870px以下 */	
	
/* アイコンイラスト*/
.icon{
    display: none !important;
}
/* facebookとX*/
.FandX{
	text-align: left;
	float: left;
	width: auto;
	margin: 5px 0px 0px 5px;
	display: flex; /* 横並び */
	z-index: 2;
	position: absolute;
}
.FandX a img{
	padding: 0px;
	margin: 0px;
}
.FandX,
.FandX a img{
	display: none;
}

.header {
	width: 100%;
	height: auto;
	text-align: center;
	margin: 0px 0px 20px 0px;
	padding: 0px;
	background-color: #FFF;
}

/* スマホ用メニュー*/
nav .inner .gnav .subnav,
nav .inner .gnav .subnav2{
	width: 100%;           /* 上位メニュー項目の横幅 */
	height: auto; 
	list-style-type: none;
	position: relative;    /* サブメニュー表示の基準位置にする */	
	margin: 0px;
	padding: 0px;
	border: none;
}
.gnav li a{
	font-size: 1.1em;
	line-height: 1.2em;
	text-align: left;
}
.subnav,
.subnav2{
	text-decoration: none;
	margin: 0px;
	padding: 0px;
	width: 100%;
	height: auto;
	background-color: #FFF;
}
nav {
	font-size: 1.0em;
	line-height: 1.2em;
}		
.lock {
	overflow:hidden;
	height:100%;
}	
.summary {
	position:relative;
	top:auto;
	right:auto;
	margin-top:0px;
}
#main {
	float:none;
	width:100%;
}
#sub {
	float:none;
	width:100%;
}
nav {
	font-weight: bolder;
}
nav ul {
	margin:0;
	padding:0;
	background-color: rgba( 255, 255, 255, 0.7 );/*メニューの下背景*/
	color: #FFF;
}
nav .inner > ul {
	z-index:2;
	overflow:auto;
	position:fixed;
	top:60px;/*メニュー出てくる位置*/
	right:0;
	width:100%;
	height:88%;
	height:-webkit-calc(100% - 53px);
	height:calc(100% - 53px);
}
.gnav .kai{
	position:relative;
}
nav li ul {
	position: absolute;
	top: 100%;
	left: 0;
	z-index: 3;
	top: 0px;     /*サブメニュー表示位置*/
	left: 0px;    /*サブメニュー表示位置*/	
}
ul.gnav ul li{
	width: 100%;   /* サブメニュー横幅 */
}
/*上位メニュー区切りライン*/
.container nav .inner .gnav .subnav,
.container nav .inner .gnav .subnav2{
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #FFF;
}
nav li {
	position: relative;
	width: 100%;
	float: none;
	margin: 0;
	list-style: none;
	height: auto;/*下位のサイズ*/
}
nav li:first-child {
	border-top:0;
	width: auto;
}
nav li:last-child {
	border-bottom:0;
}
/*上位メニュー文字色*/
.container nav .inner .gnav .subnav a,
.container nav .inner .gnav .subnav2 a{
	color: #FFF;
	background-color: #00498A;/*メニュー背景色*/
	font-weight: bolder;
	padding: 10px;
	height: auto;
	font-size: 18px;/*文字サイズ18余白10＋10*/
}
/*下位メニュー文字色*/
.container nav .inner .gnav .subnav ul li a{
	color: #000;
	background-color: #FFF;/*サブメニュー背景色*/
	font-weight: normal;
	padding: 10px 10px 10px 25px;
	border-top-width: 1px;  /*サブメニューライン色*/
	border-top-style: solid;
	border-top-color: #00498A;
}
/*下位メニューhover文字色*/
.container nav .inner .gnav .subnav ul li a:hover{
	color: #F00;
	background-color: #EDEDED;/*サブメニューhover背景色*/
	font-weight: normal;
}
nav li a {
	display: block;
	padding: 10px 10px 10px 25px;
	text-decoration: none;
}
nav ul ul {
	display:none;
	position:relative;
}
nav li li a {
	box-sizing: border-box;
	width: 100%;
	padding-top: 10px;
	padding-right: 50px;
	padding-bottom: 10px;
	padding-left: 30px;
}


/*ボタン飾り上位*/
nav ul li > a:before {
	display:block;
	content:"";
	position:absolute;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
	top:20px;
	right:30px;
	width:10px;
	height:10px;
	margin-top:-5px;
	background:#FFF;/*右ボタン白*/
}
nav ul li > a:after {
	display: block;
	content: "";
	position: absolute;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	top: 20px;
	right: 30px;
	width: 10px;
	height: 10px;
	margin-top: -10px;
	background-color: #00498A;/*右ボタン▽*/
}
nav ul li a:hover:after {
	background-color: #00498A;/*右ボタンhover背景色と同じ*/
}
.active > a:before {
	margin-top:0;
}
.active > a:after {
	margin-top:5px;
}
/*ボタン飾りHOMEは見えなくする*/
nav .inner .gnav .subnav2 a:before{ 
　　display:block;
	content:"";
	position:absolute;
	-webkit-transform:rotate(45deg);
	transform:rotate(45deg);
	top:20px;
	right:30px;
	width:10px;
	height:10px;
	margin-top:-5px;
	background:#00498A;/*右ボタン白*/
}
/*ボタン飾り下位*/
.subnav ul li > a:before {
	top: 30px;
	left: 4px;
    width: 7px;
    height: 1px;
	color: #00498A;/*水色*/
    background-color: #FFF;	
}
.subnav ul li > a:after {
	top: 30px;
	left: 10px;
    width: 6px;
    height: 6px;
    border-top: 2px solid #00498A;
    border-right: 2px solid #00498A;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
	background-color: #FFF/*白*/	
}
.subnav ul li a:hover:after {
	background-color: #EDEDED;/*右ボタンhover背景色と同じ*/
}


/*スマホのみで表示メニューbox左右位置*/
#spMenu {
	z-index: 2;
	position: fixed;
	top: 5px;
	right: 10px;
}
#spMenu:hover {
	cursor:pointer;
}
/*スマホのみで表示メニュー肩boxボタン*/
#navBtn {
	display: inline-block;
	position: relative;
	width: 50px;/*大きさ*/
	height: 50px;
	border-radius: 10px;/*角丸さ*/
	background-color: #00498A;/*青色*/
	border: 1px solid #FFF;
}
#navBtnIcon {
	display:block;
	position:absolute;
	top:50%;
	left:50%;
	width:20px;/*ライン幅*/
	height:3px;/*ライン太さ*/
	margin:-2px 0 0 -10px;
	background:#FFF;
	transition:.2s;
}
#navBtnIcon:before,
#navBtnIcon:after {
	display:block;
	content:'';
	position:absolute;
	top:50%;
	left:0;
	width:20px;/*ライン幅*/
	height:3px;/*ライン太さ*/
	background:#FFF;
	transition:0.3s;
}
/*#navBtnIcon::after {文字を表示
	position: absolute;
	left: 0;
	bottom: 5px;
	content: 'MENU';
	width: 100%;
	color: #fff;
	font-size: 10px;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
}
#navBtnIcon.active::after {
  content: 'CLOSE';
  bottom: -25px;
}*/

#navBtnIcon:before {
	margin-top:-9px;/*ライン位置*/
}

#navBtnIcon:after {
	margin-top:5px;/*ライン位置*/
}

#navBtn .close {
	background:transparent;
}
#navBtn .close:before,
#navBtn .close:after {
	margin-top:0;
}
#navBtn .close:before {
	transform:rotate(-45deg);
	-webkit-transform:rotate(-45deg);
}
#navBtn .close:after {
	transform:rotate(-135deg);
	-webkit-transform:rotate(-135deg);
}
.col_two_one ul {
	margin-right:0;
}
.col_two_one li {
	width:100%;
}
.col_two_one li:nth-child(2n+1) {
	clear:both;
}
}