/* CSS Document */

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

/*
@import "svg.css";
*/

:root{
	--color-base:#333;
	--color-blue: #003c96;
	--color-L-blue: #e4e9ec;
	--h-head: 90px;
	--h-head-sp: 50px;
	--h-foot:60px;
}

html,.font_sizebase{font-size:min(16px,max(14px,1.6vw));}
html *{
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	word-break: break-all;
}
body{
	margin: 0px;
	padding: 0px;
	font-size:100%;
	font-family: "Noto Sans JP",'游ゴシック', YuGothic, 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', Meiryo, sans-serif;
	/* font-family: 'Zen Maru Gothic', sans-serif; */
	line-height:normal;
}
body,.col_base{color:var(--color-base);}
body > div[align="center"]{
	display: flex;
	flex-direction: column;
	min-height: 100vh;
}
h1,h2,h3,h4,h5,h6,p,form,hr{
	margin: 0;
	padding: 0;
}
span{display: inline-block;}
a{color:inherit;text-decoration:none;}
a:hover{
	/* color:#FF0; */
	/* text-decoration: underline; */
}
/*
a.ov_white,
a.ov_white_img img{transition: opacity 0.2s ease;}
*/
@media screen and (min-width: 1000px) {
	.ov_white:hover,
	.ov_white_img:hover img{opacity:0.5;}
}
a img{border:none;}
.bright:hover,.bright:hover img{
	/*
	filter:alpha(opacity=70);
	-moz-opacity:0.70;
	opacity:0.70;	
	filter: brightness(105%) contrast(105%);
	*/
	-webkit-filter: brightness(115%);
  -moz-filter: brightness(115%);
  -o-filter: brightness(115%);
  -ms-filter:brightness(115%);
  filter: brightness(115%);
}
.bright.BN110:hover,.bright.BN110:hover img{
	-webkit-filter: brightness(110%);
  -moz-filter: brightness(110%);
  -o-filter: brightness(110%);
  -ms-filter:brightness(110%);
  filter: brightness(110%);
}
.bright.BN105:hover,.bright.BN105:hover img{
	-webkit-filter: brightness(105%);
  -moz-filter: brightness(105%);
  -o-filter: brightness(105%);
  -ms-filter:brightness(105%);
  filter: brightness(105%);
}
.bright:hover > * img{
	-webkit-filter:none;
  -moz-filter:none;
  -o-filter:none;
  -ms-filter:none;
  filter:none;
}
ul,li{
	margin: 0px;
	padding: 0px;
	list-style-type: none;
}
/*
ul:after,
ul::after{clear:both;}
*/
hr{
	/* border-top:solid 1px rgba(0,0,0,0.25); */
	border:none;
	border-top:solid 1px #C8C8C8;
	margin:1em auto;
	padding:0;
}
hr.dashline{
	border-top:dashed 1px rgba(0,0,0,0.5);
	margin:3em auto;
}
img,svg{max-width:100%;display:block;}
img{min-width:10px;object-fit: cover;}
img[src*=".svg"],svg{width: 100%;}
.can_scr{
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
}
.can_scr img[src*="sp_scroll."]{
	width:160px;
	position: absolute;
	animation: anime_can_scr 2s infinite;
	transition: opacity 1s ease;
}
@keyframes anime_can_scr {
	0%{opacity: 0;}
  50%{opacity: 1;}
  100%{opacity: 0;}
}
.anchor{position: relative;}
.anchor a{
	position:absolute;
	top:calc(var(--h-head) * -1);
	left:0;
}
@media screen and (max-width: 999px) {
	.anchor a{top:calc(var(--h-head-sp) * -1);}
}

/* ----- */

img[src*="-sp."]{width:100%;}

.H_head{height:var(--h-head);}
header{
	background-color: #FFF;
	position: fixed;
	top:0;
	left:0;
	width: 100%;
	z-index: 1000;
	box-shadow: 0 0 30px 0 rgba(0,0,0,0.5);
}
header .inner{
	padding-left: min(40px,max(15px,4vw));
	display: flex;
	justify-content: space-between;
	align-items: center;
}
header .inner .logo img{height: 37px;}
header .inner .area{margin-left: 17px;margin-right: auto; gap:7px;display: flex;}
header .inner .area img{width:auto;height:27px;}
header .inner .btn{margin-right: min(58px,calc(1vw * 58 / 19.2)); gap:15px;display: flex;}
header .inner .btn img{width:auto;height:64px;}
header .inner .menubtn{cursor: pointer;height:100%;display: flex;}
header .inner .menubtn img{width:auto;height:100%;}
header:not(.active) .inner .menubtn img[src*="-close"],
header.active .inner .menubtn img:not([src*="-close"]){display: none;}
header .pop{
	position: absolute;
	top:100%;
	left:0;
	width:100%;
}
header .pop .dark{
	display: none;
	width:100%;
	background-color: rgba(0,0,0,0.9);
	position: relative;
	overflow: hidden;
}
header .pop .menu{
	margin-left: auto;
	margin-right: -100%;
	width:960px;
	max-width: calc(100% - 20px);
	height: calc(100vh - var(--h-head));
	background-color: #FFF;	
	transition: margin-right 0.5s ease;
}
header .pop .menu .in{
	padding-top: 50px;
	width:640px;
	max-width: 100%;
	gap:24px;
	display: flex;
	justify-content: space-between;
}
header .pop .menu .in ul{
	width:290px;
	gap:24px;
	display: flex;
	flex-direction: column;
}
header .pop .menu .in ul li{
	width:100%;
	padding-bottom: 8px;
	border-bottom: solid 1px #969696;
}
header .pop .menu .in ul li a{
	font-size: 18px;
	font-weight: 900;
	border-left: solid 5px var(--color-blue);
	padding-left: 0.5em;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
header .pop .menu .in ul li a img{width: auto;height:1em;}
@media screen and (max-width: 1399px){
	header .inner .btn{display: none;}
}
@media screen and (max-width: 999px) {
	.H_head{height:var(--h-head-sp);}
	header .inner .logo img{height:20px;}
	header .inner .area{margin-left:10px;gap:4px;}
	header .inner .area img{height:15px;}
	header .pop .menu{height: calc(100vh - var(--h-head-sp));}
	header .pop .menu .in{flex-direction: column; align-items: center;}
}

.sp_bottom_btn{
	position: fixed;
	bottom:calc((var(--h-foot) * -1) - 1px);
	left:0;
	width:100%;
	z-index: 990;
	border-top:solid 1px #FFF;
	background-color: #FFF;
	transition: bottom 0.3s ease;
}
.sp_bottom_btn.up{bottom:0;}
.sp_bottom_btn > *{
	width: 100%;
	display: flex;
	justify-content: space-between;
}
.sp_bottom_btn a{
	flex-grow: 1;
	background-color: #000;
	display: flex;
	justify-content: center;
	align-items: center;
}
.sp_bottom_btn a.R{background-color: #e61446;}
.sp_bottom_btn a.G{background-color: #00b900;}
.sp_bottom_btn a.B{background-color: #001e82;}
.sp_bottom_btn a.W{background-color: #FFF;}
.sp_bottom_btn img{
	width:auto;
	height:var(--h-foot);
	object-fit: cover;
}

.H_foot{height:var(--h-foot);}
.H_foot.pc_vanish{height:calc(var(--h-foot) + 1px);}
footer{background-color: #1e1e1e;margin-top: auto;}
footer img{margin: auto;}
footer img[src*="18-pc."]{height:220px;}


/* 横幅下限 */
body > div[align="center"],
header,footer{min-width:375px;}
body > div[align="center"]{overflow-x: hidden;}
body main{overflow: hidden;}

/* ----- */

.pc_vanish{}
.sp_vanish{}
.im_vanish{display:none!important;}
.pc_br_del{}
.sp_br_del{}
.vanish_branch{}
.vanish_branch_onoff{}
@media screen and (min-width: 1000px) {
	.pc_vanish,
	.pc_br_del br,
	.pc_div_del div,
	.vanish_branch img[src*="-sp."],
	.vanish_branch_onoff img[src*="-sp."]{display:none!important;}
}
@media screen and (max-width: 999px) {
	.sp_vanish,
	.sp_br_del br,
	.sp_div_del div,
	.vanish_branch img[src*="-pc."],
	.vanish_branch_onoff img:not([src*="-sp."]){display:none!important;}
}

.W100per{width:100%;}
.Wbase{
	width:100%;
	max-width:1000px;
	margin: 0 auto;
}
.Wbase.W1400{max-width:1400px;}
.Wbase.W1920{max-width:1920px;}
@media screen and (max-width: 999px) {
}

.borderbox,.borderbox *{
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

/* 印刷用CSS */
/*
@media print{
  印刷用CSSの定義を指定する
}
※印刷時は
「@media screen and (min-width: 1000px)」
「@media screen and (max-width: 999px)」内のスタイルは効かなくなる
*/
@media print{
	body > div > .H_head,.pc_vanish{display:none!important;}
	header{position:relative;}
}