@charset "UTF-8";
/* CSS Document */
#body {
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	line-height: 180%;
	font-size:16px;
	position:relative;
	color:#000;
	word-break: break-all;
	margin:0 auto;
	letter-spacing: 0.1em;
	background-image: url(../img/bg_body.jpg);
	background-repeat: no-repeat;
	background-position: center top;
	background-size: 100% auto;
}
@media only screen and (max-width: 1600px) {
	#body { background-size: 1600px auto;}
}

@media only screen and (-webkit-min-device-pixel-ratio: 2),(min-resolution: 2dppx) {
	#body { background-image: url(../img/bg_body@2x.jpg);}
}
#body,
#global,
#lnavi,
#main,
#footer {
	min-width: 960px;
}
.sp { display:none;}
.inner { margin-left:auto; margin-right:auto; max-width: 960px; width:95%;position: relative;}
@keyframes flash {
	 0% { opacity: 1; }
    10% { opacity: 0.6; }
	100% { opacity: 1; }
}
@keyframes bright {
	 0% { filter: brightness(115%); }
    10% { filter: brightness(110%); }
	100% { filter: brightness(100%); }
}
@keyframes huwa {
	 0% { transform: translateY(0px);}
    40% { transform: translateY(7px);}
	80% { transform: translateY(-1px);}
	100% { transform: translateY(0px);}
}

@media only screen and (max-width: 767px) {
	#body { font-size: 13px; line-height: 155%;}
	.inner { width:90%;}
	.pc { display:none;}
	.sp { display:block;}
	span.sp { display:inline;}
	table.sp { display:table;}
	/*.showMenu #body,
	.showMenu #header{ left: calc(60px - 100%);}*/
	.showMenu #body { position: fixed; width:100%; height: 100%; z-index: 6;}
	/*
	#body,
	#global,
	#lnavi,
	#main,
	#footer {
		min-width: 100%;
	}*/
}

.inner:before, .inner:after {
  content: "";
  display: table;
}

.inner:after {
  clear: both;
}

.inner{
  zoom: 1;
}

p { margin:2em 0 0 0;}
a { color: #0059ED;text-decoration:none;}
p a {text-decoration:underline;}
p a:hover {text-decoration:none;}
main, section, article, nav { display: block;}
img { max-width: 100%;}

.mt0 {
	margin-top:0px !important;
}

a:hover img.alpha { opacity: 0.8;}

#global {
	position: fixed;
	top:0;
	left:0;
	z-index: 100;
	width:100%;
	background: #042e60;
	line-height: 100%;
	font-size:14px;
}
#global, #logo, #gnavi, #go2database { height: 80px;}
#global_flex {
	display: flex;
	justify-content: center;
}
#logo, #gnavi, #go2database { position: relative; z-index: 2;}
#logo {display: flex; justify-content: flex-start; align-items: center; margin-right: 120px; margin-left: 20px; position: relative;}
#logo img { max-width: inherit; height: auto; position: relative; z-index: 2;}
#logo a:hover img { animation:flash 1s; }
#logo::after {
	content: "";
	position: absolute;
	display: block;
	right: -140px;
	top:0;
	width:1593px;
	height: 100%;
	background:url(../img/bg_logo.png) no-repeat right top;
	background-size: auto 100%;
	z-index: 1;
}
#gnavi { display: flex; flex-wrap: wrap;justify-content: flex-start; align-items: center; align-content: center;}
#gnavi li a { color: #fff; margin:8px 0; display: inline-block; padding: 0 15px; border-right: #677c9a 1px dotted; position: relative;}
#gnavi li a:hover { text-decoration: none; color: #ffff33;}

#gnavi li.on a::after {
	content: "";
	width:10px;
	height: 10px;
	border:transparent 5px solid;
	border-top:#ffff33 5px solid;
	position: absolute;
	left:calc(50% - 5px);
	top:1.3em;
	box-sizing: border-box;
	display: block;
}
#gnavi li.on a { color: #ffff33;}
#gnavi li.on a::after {
	border-top:#ffff33 5px solid;
}
#gnavi li:last-child a { border-right: none;}
#go2database{ display: flex; justify-content: center; align-items: center;}
#go2database a { color:#032d61; background: #dfe4ea; padding: 15px 25px; border-radius: 10px; white-space: nowrap; margin:0 20px;}
#go2database a:hover { text-decoration: none; animation:flash 1s;}
/*@media only screen and (max-width: 980px) {
	#global, #logo, #gnavi, #go2database { height: 80px;}
	#logo { margin-right: 12.2%;}
	#logo img { width: 150px;}
	#logo::after {}
	#gnavi li { font-size: 1.5vw;}
	#go2database a { font-size: 1.5vw; padding: 10px 15px;}
}*/
/*
@media only screen and (max-width: 767px) {
	#global, #logo, #gnavi, #go2database { height: 100px;}
	#logo { margin-right: 3%;}
	#logo::after { right: -80px;}
	#gnavi li { font-size: 2.2vw;}
	#gnavi li a { margin:10px 0;}
	#go2database a{ font-size: 2.2vw; line-height: 150%; font-weight: bold; text-align: center;}
}*/

#main { padding-top:80px;}
#footer {
	background: #042e60;
	color: #fff;
	padding:15px 0;
	margin-top:70px;
}
#footer #copy { margin:0; font-size: 12px; text-align: center; line-height: 150%;}

.flash:hover{ animation: flash 1s 1 ease;}
.bright:hover{ animation: bright 1s 1 ease;}

.page_title { color: #fff; font-weight: normal; font-size: 26px; margin: 50px 0;}

.page_title .note {
	display: inline-block;
	font-size: 14px;
	float: right;
}
.page_title .note::before { content: "― ";}
.page_title .note::after { content: " ―";}
h2.page_title {  font-size: 26px; margin: 70px 0 30px;}
.bg_begie { background-color:#f2eeea;}
.bg_white_alpha { background-color:rgba(255,255,255,0.75);padding: 3em 3em; border-radius:10px;}
h2.h201 { color: #062496; color: #424242; font-size: 26px; margin-top:70px;}
p strong { text-shadow: 2px 2px 3px #ccc; color: #0E0ED5; color:#FF2600;}

.fadeBlock .fade {transition: opacity 0.5s ease, transform 0.5s ease;}
.fadeBlock .fade + .fade{ transition-delay: 0.2s;}
.fadeBlock .fade + .fade + .fade { transition-delay: 0.4s;}
.fadeBlock + .fadeBlock .fade { transition-delay: 0.2s;}

.fadeBlock.hide .fade { opacity: 0; transform: translateY(30px);}
#lnavi {
	background-color:rgba(16,46,93,0.35);
	position: fixed;
	left:0;
	top:80px;
	height: 40px;
	line-height: 40px;
	width: 100%;
	z-index: 2;
	font-size: 14px;
	color: #83c9da;
}
#lnavi_animation #lnavi {
	top:40px;
	animation: lnavi_anim 0.5s ease;
	animation-fill-mode: forwards;
}
@keyframes lnavi_anim {
	 0% { top: 40px; }
	100% { top: 80px; }
}
#lnavi ul { display: flex; justify-content: center;}
#lnavi a { display: block; color: #fff; padding:0 1.5em; height: 40px; line-height: 40px;}
#lnavi li { position: relative;}
#lnavi li.on a { color: #ffff33;}
#lnavi li .arrow { display: none;}
#lnavi li.on .arrow,
#lnavi li a:hover + .arrow {
	display: block;
	position: absolute;
	width:20px;
	height: 20px;
	border:transparent 10px solid;
	/*border-top:rgba(16,46,93,0.35) 10px solid;*/
	top:40px;
	left:50%;
	margin-left: -10px;
	box-sizing: border-box;
}
#anchor {
	border-radius: 10px 10px 0 0;
}
#anchor ul { display: flex; justify-content: space-between;}
#anchor ul li {
	display: flex;
	justify-content: center;
	width:25%;
}
#anchor ul li a {
	display: flex;
	justify-content: center;
	flex-direction: column;
	background:rgba(0,0,0,0.35);
	text-align: center;
	width:100%;
	color: #fff;
	line-height: 130%;
	font-size: 14px;
	margin-right: 1px;
	padding:10px 30px 10px 35px;
	position: relative;
	cursor: pointer;
}
#anchor ul li:first-child a { border-radius: 10px 0 0 10px;}
#anchor ul li:last-child a { border-radius: 0 10px 10px 0;margin-right:0;}
#anchor ul li a::before {
	content: "";
	background:url(../img/guide/bg_num.png) repeat left bottom;
	background-attachment: fixed;
	background-size:30px auto;
	width:18px;
	height: 18px;
	line-height: 18px;
	text-align: center;
	border-radius: 50%;
	margin-right: 5px;
	font-family: Arial, Helvetica, "sans-serif";
	font-weight: bold;
	color: #214d85;
	letter-spacing: 0;
	font-size: 90%;
	position: absolute;
	left:10px;
	top:50%;
	margin-top:-9px;
}
#anchor ul li a:hover { background:rgba(0,0,0,0.5);}
#anchor ul li a:hover::before { background: #fffe61;}
#anchor ul li a::after {
	width:10px;
	height: 10px;
	content: "";
	box-sizing: border-box;
	border:transparent 5px solid;
	border-top:#25556e 5px solid;
	position: absolute;
	left: 14px;
	top:50%;
	margin-top:-2px;
}
.anchor {
	margin-top:-120px;
	padding-top:120px;
	display: block;
}
.pdf {
	display: inline-block;
	padding-left: 28px;
	background:url(../img/pdf.png) no-repeat left 50%;
	background-size: 25px auto;
	min-height: 25px;
}
.xls {
	display: inline-block;
	padding-left: 28px;
	background:url(../img/xls.png) no-repeat left 50%;
	background-size: 25px auto;
	min-height: 25px;
}

.bg_white_inline {
	background:#fff;
	border-radius: 5px;
	padding:4px 8px;
	min-height: 25px;
	display: inline-block;
	margin:0 3px;
}
.bg_white_inline { color:#555; font-size:90%; letter-spacing:0;}
.bg_white_inline a { letter-spacing: 0.1em;}
.bg_white_inline .pdf,
.bg_white_inline .xls { padding-left: 33px;}
.bg_white_inline + br + .bg_white_inline { margin-top:5px;}