@charset "utf-8";

/*-------- Google検索窓 --------*/
#srchBox {
	color: #333;
	text-align: left;
}

#srchBox * {
	margin: 0;
	padding: 0;
	font-size: 13px;
}

#srchBox #srch #srchForm {white-space:nowrap;}

#srchBox #srchInput {
	margin-right: 6px;
	vertical-align: middle;
}

#srchBox #srchBtn {
	width: 15px;
	vertical-align: middle;
}

*html #srchBox #srchBtn {padding-top:2px;}
*:first-child+html #srchBox #srchBtn {padding-top:2px;}

#srchBox ul {
	margin-top:6px;
	text-align:left;
}

#srchBox li {
	list-style-type:none;
	display:inline;
	zoom:1;
	padding-right:10px;
}

#srchBox li input {
	zoom:1;
	margin-right:2px;
	_margin:-4px 0 -4px -4px;
	vertical-align:middle;
	border:0;
}

/* *:+html #srchBox li input {margin:-4px 0 -4px -4px;} */

#srchBox #srchLogo {
	margin:6px 6px 6px 0;
	text-align:right;
}

#srchBox #srchLogo a {
	color:#666;
	text-decoration:none;
	font-size:85%;
}

#srchBox #srchLogo a:hover {text-decoration:underline;}

#srchBox.watermark #srchInput {
	width: 90%;
	padding: 10px 5%;
	border-radius: 50px;
	border: 1px solid #ccc;
}

#srchBox.watermark #srchInput.nomark {background: #fff;}

#srchBox.watermark #srchLogo {display: none;}

/* アイコンサイズ */
.gsc-search-button-v2 svg {
	width: 15px !important;
	height: 15px !important;
}

.serch-div input {
	content: "abc";
}


/*-------- パンくず --------*/
#pankuz {
	width: 980px;
	margin: 0 auto;
	color: #666;
	font-size: 80%;
}

#pankuz a {color: #272b76;}

/* navi */
header {
	width: 100%;
	margin: 0 auto;
	position: fixed;
	left: 0;
	top: 0;
	border-bottom: 2px solid #272b76;
	z-index: 100;
	background: #fff;
}

#navi {margin: 0 auto;}

#navi a,#navi {
	color: #000;
	text-decoration: none;
}

#g-nav ul {
	display: flex;
	justify-content: space-between;
	table-layout: fixed;
	text-align: center;
	list-style: none;
	position: relative;
	width: 100%;
}

#g-nav ul li {
	height: 89px;
	padding: 0 1rem;
	display: flex;
	align-items: center;
}

#g-nav ul li:hover {background: #272b76;}

#g-nav li:hover a, #g-nav li:hover a span {color: #fff;}

#g-nav ul li:first-child {
	width: 21%;
	padding: 0;
	background: #fff;
}

#g-nav ul li:last-child {
	width: 160px;
	border-right: none;
	background: #fff;
}

#g-nav ul li:nth-child(3) {position: relative;}

#g-nav li a {
	width: 100%;
	padding: 0;
	display:block;
	font-size: 0.8em;
	text-align:center;
	color: #999;
}

#g-nav li a span {
	display: block;
	font-size: 14px;
	line-height: 18px;
	color: #101010;
	letter-spacing: 1px;
}

#g-nav ul li a:hover{color: #b6b6b6; opacity: 1;}

.inner{
	max-width: 1100px;
	margin: 0 auto;
}

.inner:after{
	content: "";
	clear: both;
	display: block;
}

/*-------- 非表示 --------*/
.logo_middle {display: none;}


/*-------- Toggle Button --------*/
#nav-toggle {
	width: 30px;
	display: none;
	position: absolute;
	right: 15px;
	top: 26px;
	cursor: pointer;
	z-index: 999;
}

#nav-toggle div {position: relative;}

#nav-toggle span {
	width: 100%;
	height: 3px;
	display: block;
	background: #272b76;
	position: absolute;
	left: 0;
	border-radius: 10px; /* CSS3草案 */  
	-webkit-border-radius: 10px; /* Safari,Google Chrome用 */  
	-moz-border-radius: 10px; /* Firefox用 */  
	-webkit-transition: .3s ease-in-out;
	-moz-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}

#nav-toggle span:nth-child(1) {top: 0;}
#nav-toggle span:nth-child(2) {top: 10px;}
#nav-toggle span:nth-child(3) {top: 21px;}

/*-------- ドロップメニュー --------*/
#g-nav li ul.drop {
	width: 20%;
	margin-left: -1rem;
	padding: 0;
	list-style: none;
	display: none;
	position: absolute;
	z-index: 1;
	top: 89px;
}

#g-nav li:hover ul {display: block;}

#g-nav li ul.drop li {
	width: 100%;
	height: auto;
	padding: 0 !important;
	position: relative;
	display: block;
	border-top: 1px solid #ccc;
	border-right: none;
	background: none;
}

#g-nav li ul.drop li:first-child {border-top: none;}

#g-nav li ul.drop li i {font-size: 110%;}

#g-nav li ul.drop li a {
	padding: 13px 10px;
	color: #666;
	font-size: 95%;
	text-align: left;
	background: #fff;
}

#g-nav li ul.drop li a:hover {color: #fff; background: #272b76;}


/** middle
===================================*/
@media screen and (max-width: 990px){
header {padding: 0;}

.inner {
	max-width: 100%;
	margin: 0 auto;
}

#g-nav {border-top: 1px solid #ccc;}

#g-nav ul li{padding: 0 8px;}

#g-nav ul li:first-child {
	display: none;
}

.logo_middle {
	width: 100%;
	display: block;
	margin: 15px 0;
	text-align: center;
}

.logo_middle img {width: 200px;}

/*-------- ドロップメニュー --------*/
#g-nav li ul.drop {
	width: 200px;
	margin-left: -8px;
	left: none;
}

#g-nav li ul.drop li {padding: 0;}
}


/** mobile
===================================*/
@media screen and (max-width: 768px){
main {padding-top: 0 !important;}

/*-------- Google検索窓 --------*/
#srchBox {
	margin: 5% 0 3%;
	text-align: center;
}

#srchBox.watermark #srchInput {width: 70%;}

/* アイコンサイズ */
.gsc-search-button-v2 svg {
	width: 20px !important;
	height: 20px !important;
}


/*-------- パンくず --------*/
#sec1 #pankuz {
	width: 94%;
	margin: 0 auto;
	color: #666;
	font-size: 80%;
}

#sec1 #pankuz a {color: #272b76;}

header {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	border: none;
	position: static;
}

.logo_middle {
	margin: 0;
	padding: 15px;
	text-align: left;
}

#navi,.inner {
	width: 100%;
	padding: 0;
	position: relative;
	background: #fff;
	z-index: 999;
}

#navi {
	top: 0;
	margin-top: 0;
}

/*-------- Fixed --------*/
#navi.fixed,
#top.fixed {
	height: 55px;
	margin-top: 0;
	padding-top: 0;
	position: fixed;
	top: 0;	
	background: #000;
	background: rgba(255,255,255,1);
	transition: top 0.65s ease-in;
	-webkit-transition: top 0.65s ease-in;
	-moz-transition: top 0.65s ease-in;
}

.inner {border-bottom: 2px solid #272b76;}

#navi.fixed #g-nav ul li a,
#top.fixed #g-nav ul li a {
	padding: 0 20px;
	color: #333;
}

#mobile-head {
	width: 100%;
	background: none;
	position: absolute;
	z-index: 9999;
	top: 0;
	right: 0;
}

#g-nav {
	width: 100%;
	padding: 50px 0 10px 0;
	background: #f0f3f5;
	position: absolute;
	z-index: 999;
	opacity: 1;
	/* 開いてないときは画面外に配置 */
	top: -650px;
	-webkit-transition: .5s ease-in-out;
	-moz-transition: .5s ease-in-out;
	transition: .5s ease-in-out;
}

#g-nav ul {
	list-style: none;
	position: static;
	display: table;
	bottom: 0;
	right: 0;
}

#g-nav ul li {
	height: auto;
	padding: 0 3%;
	display: block;
	position: static;
	background: none !important;
	opacity: 1;
	border-right: none;
	border-bottom: 1px solid #272b76;
}

#g-nav ul li:last-child {
	width: 100% !important;
	border: none;
}

#g-nav ul li a span {
	margin-right: 10px;
	display: inline;
	color: #000;
	font-size: 17px;
	font-weight: bold;
}

#navi #g-nav ul li a,
#navi.fixed #g-nav ul li a,
#top #g-nav ul li a,
#top.fixed #g-nav ul li a {
	width: 100%;
	padding: 20px 0;
	display: block;
	color: #666;
	font-size: 13px;
	text-align: left;
}

#g-nav ul li:hover {background: none;}

#g-nav li:hover a, #g-nav li:hover a span {color: #000;}

#nav-toggle {display: block; height: 30px;}

/*-------- #nav-toggle 切り替えアニメーション --------*/
.open #nav-toggle span:nth-child(1) {
	top: 11px;
	-webkit-transform: rotate(315deg);
	-moz-transform: rotate(315deg);
	transform: rotate(315deg);
}

.open #nav-toggle span:nth-child(2) {
	width: 0;
	left: 50%;
}

.open #nav-toggle span:nth-child(3) {
	top: 11px;
	-webkit-transform: rotate(-315deg);
	-moz-transform: rotate(-315deg);
	transform: rotate(-315deg);
}

/*-------- #g-nav スライドアニメーション --------*/
.open #g-nav {
	/* #g-nav top + #mobile-head height */
	-moz-transform: translateY(650px);
	-webkit-transform: translateY(650px);
	transform: translateY(648px);
}

/*-------- ドロップメニュー --------*/
#g-nav li ul.drop {
	list-style: none;
	left: 0;
	margin: 0;
	padding: 0;
	display: inline;
	position: static;
}

#g-nav li ul.drop li {
	margin: 0 0 15px 0;
	padding: 0;
	border: none;
}

#g-nav li ul.drop li:last-child {margin-bottom: 20px;}

#g-nav li ul.drop li a {
	padding: 0 0 0 1em !important;
	color: #272b76 !important;
	font-size: 110% !important;
	text-align: center;
	background: none; 
}

#g-nav li ul.drop li a:hover {background: none;}
}