@charset "utf-8";
/* common */
html{
	width:100%;
	height:100vh;height: 100lvh;
	_height: calc(var(--vh, 1vh) * 100);
	-webkit-overflow-scrolling: touch;
}

html body{
	font-size:13pt;
	line-height:150%;
	font-family:'Roboto','Noto Sans JP',"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;
	font-weight:400;
	color:#221814;
	width:100%;
	height:100vh;height: 100lvh;
	_height: calc(var(--vh, 1vh) * 100);
	-webkit-overflow-scrolling: touch;
	margin:0;
	padding:0;
}

.fb{
	font-family:'Roboto','Noto Sans JP',"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif !important;
	font-weight:500 !important;
}

.fn{
	font-family:'Roboto','Noto Sans JP',"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif !important;
	font-weight:400 !important;
}

.fl{
	_font-family:'Noto Serif JP',"Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif !important;
	font-weight:400 !important;
}

.txt_wrap{
	word-wrap: break-word;
	overflow-wrap: break-word;
}

.ls03{ letter-spacing:0.3rem; }

@media only screen and (max-width: 768px) {
	html body{
		font-size:12pt;
	}
}	/* @media only screen and (max-width: 768px) { */

h1,h2,h3,h4,h5,h6{ line-height: 150%; }

a{
	color:#013c97;
	text-decoration: none;
	transition: 0.3s ease-in-out;
}

a:hover{ opacity: 0.75; }
.color_a{ color:#013c97; }
.back_a{ background: #013c97; }
.body_on{	overflow: hidden; }
.hr_a{ border-top: 1px dotted #c8161e; }
.box_b{ border:1px solid rgba(200,22,30,1.0);background:rgba(255,255,255,1.0); }
.box_bw{ border:1px solid rgba(255,255,255,1.0);background:rgba(200,22,30,1.0); }
.box_bb{ border:1px solid #ccc; }

/* scroll bar */
.scroll_bar::-webkit-scrollbar{
	width:5px;
	background:#ed5a6c;
}

.scroll_bar::-webkit-scrollbar-button{
	width:5px;
	height:5px;
	background:#d8303d;
}

.scroll_bar::-webkit-scrollbar-piece{
	background:#d8303d;
}

.scroll_bar::-webkit-scrollbar-piece:start{
	background:#d8303d;
}

.scroll_bar::-webkit-scrollbar-thumb{
	background:#d8303d;
}

.scroll_bar::-webkit-scrollbar-corner{
	background:#d8303d;
}

.arrow_cright{
	display: inline-block;
	transform: rotate(90deg);
	background: #1e2c5c;
	padding: 5px 5px 5px 5px;
	border-radius: 50%;
	color: #fff;
	line-height: 100%;
	margin-top: 2px;
	margin-right: 5px;
}

/* top slider */
#top_fixed{
	position: fixed;
	z-index: -1;
	overflow: hidden;
	top:0;
	left: 0;
	width: 100%;
	height:100vh;height: 100lvh;
}

#top_contents{
	margin-top:100vh;margin-top:100lvh;
	position: relative;
	z-index: 1;
	background: #fff;
}

.top_slider{
	opacity: 0.0;
	position: relative;
	z-index: 1;
}
.top_slider.page_load{
	animation: fadeIn 0.5s linear 0s normal both;
}
.div_img{
	width: 100%;
	height: 100vh;height: 100lvh;
}

.pre_slider{
	position: fixed;
	z-index: 101;
	top:0;
	left: 0;
	width: 100%;
	height: 100vh;height: 100lvh;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(255,255,255,1.0) !important;
}

.pre_slider.pl{
	animation: fadeOut 0.5s linear 0s normal both;
	z-index: -1;
}

@keyframes zoomUp {
	0% { transform: scale(1); }
	100% { transform: scale(1.10); }
}

.add-animation .div_img{
	animation: zoomUp 10s linear 0s normal both;
}

@keyframes fadeIn {
	0% { opacity: 0.0; }
	100% { opacity: 1.0; }
}

@keyframes fadeOut {
	0% { opacity: 1.0; }
	100% { opacity: 0.0; }
}

.ts_txt{
	position: absolute;
	z-index: 2;
	top:0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	flex-wrap: wrap;
	opacity: 0.0;
}

.ts_txt .100{
	position: relative;
	z-index: 1;
}

.ts_txt h1{
	position: absolute;
	z-index: 1;
	top: 60px;
	left: -100%;
	transition: 0.6s ease-in-out;
}

.ts_txt h1.ani{ left:20px; }
.ts_txt h1 img{ max-width:150px; }

.ts_txt h2{
	position: absolute;
	z-index: 1;
	top: 70px;
	right: -100%;
	transition: 0.6s ease-in-out;
}

.ts_txt h2.ani{ right:20px; }
.ts_txt h2 img{ max-width:305px; }

.ts_txt h3{
	margin-top:160px;
	margin-left:-50%;
	transition: 0.5s 0.2s ease-in-out;
}

.ts_txt h3.ani{ margin-left:0px; }

.ts_txt span{
	display: inline-block;
	background: rgba(1,60,151,0.85);
	padding:10px 20px;
}

.scross{
	font-family:'Roboto' !important;
	font-weight:300 !important;
}

.sec_title{
	display: inline-block;
	letter-spacing: 0.1rem;
	border-bottom:1px solid #999;
	padding-bottom:3px;
	padding-left:10%;
}

.abtn{
	display: block;
	text-align: center;
	padding:10px;
	border:1px solid #013c97;
	border-radius: 20px;
	background: #fff;
}
/* animation */
.ani_sli {
	overflow: hidden;
	position: relative;
	z-index: 1;
}

.ani_sli::after {
	background: #013c97;
	position: absolute;
	top: 0;
	left: 0;
	content: '';
	width: 100%;
	height: 100%;
	transform: scale(0, 1);
	transform-origin: left top;
	transition: .2s cubic-bezier(0.45, 0, 0.55, 1);
	z-index: -1;
}

.ani_sli:hover {
	color: #fff;
	letter-spacing: 0.02rem;
}
.ani_sli:hover::after {
	transform: scale(1, 1);
}

.btp{ background: rgba(1,60,151,1.0) !important; }
section:nth-child(odd){
	background: rgba(1,60,151,0.02);
}

.pmv video{
	width:50%;
	margin-left:25%;
}

.pmv button{
	top:-50px;
	font-size:30pt;
	color:#fff !important;
}

.pmv button:active{ top:-50px !important; }

.div_mv,
.mv_thumb{
	position: relative;
	z-index: 1;
}

.mv_icon {
	position: absolute;
	z-index: 2;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.mv_icon img{ max-width:80px;transition: 0.3s ease-in-out; }

a:hover .mv_icon img{ opacity:0.0; }

.img_hover{
	margin:0 auto;
	overflow:hidden;
}

.img_hover img{ transition:1s all;vertical-align:top;}

.img_hover img:hover,
a:hover .img_hover img
{
	transform:scale(1.2,1.2);
	transition:0.3s all;
}

.hline{
	padding-bottom:3px;
	border-bottom:1px solid #013c97;
}

.box_b{ border:1px solid #ccc; }

footer article{ background: rgba(1,60,151,0.90); }
footer .sec_title{ border-color:#fff; }
footer .company_info{ background: rgba(1,60,151,0.75); }

.sns_icon{
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}

.sns_icon li{
	width:60px;
	margin-left:10px;
	margin-right:10px;
}

.sns_icon li.ic_txt{ width:105px; }

.ul_marker{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.ul_marker li{
	display: block;
	min-width: 50px;
	padding:1px 5px;
	border-left:1px solid #fff;
	text-align: center;
	line-height: 100%;
}

.ul_marker li:last-child{
	border-right:1px solid #fff;
}

.scroll{
	position: fixed;
	z-index: 10;
	bottom:10px;
	right: 10px;
}

.scroll a{
	width:100px;
	height: 100px;
	display: flex;
	align-items: center;
	justify-content: center;
	border:1px solid #013c97;
	border-radius: 50%;
	text-align: center;
	transition: 0.3s ease-in-out;
	background: #013c97;
	color:#fff;
}

.scroll a:hover{
	transform: scale(1.10);
	background: #fff;
	color:#013c97;
}

.animated{ opacity:0.0; }

/* page-top */
#page-top {
	position: fixed;
	bottom: -100px;
	right: 0px;
	z-index:100;
	transition: 0.3s ease-in-out;
	-webkit-overflow-scrolling: touch;
}

#page-top.ptbtn_on{ bottom:0px;transition: 0.3s ease-in-out; }

#page-top a {
	display:block;
	background:#141414;
	color:#fff;
	text-align: center;
	padding:15px 10px;
	border-top-left-radius: 10px;
	border-top-right-radius: 10px;
}

#page-top a:hover{
	background:rgba(255,255,255,0.95);
	color:#141414;
	opacity: 1.0;
}

#page-top.hidden_top{
	z-index: -1;
}

.header_fixed{
	position: fixed;
	z-index: 100;
	top:-100%;
	left: 0;
	width: 100%;
	background: rgba(255,255,255,0.95);
	transition: 0.3s ease-in-out;
}
.header_fixed.header_scrl{ top:0; }


header nav ul{
	display: flex;
	justify-content: flex-end;
	padding:10px;
	margin-left:-5px;
	margin-right:-5px;
}

header nav ul li a{
	margin-left:2.5px;
	margin-right:2.5px;
	padding:0 5px;
}

header nav ul li a:hover.ani_sli{
	letter-spacing:0;
}

.btn{ display:none; }

/* loading */
.sk-cube-grid {
	width: 50px;
	height: 50px;
	margin: 0px auto;
}

.sk-cube-grid .sk-cube {
	width: 33%;
	height: 33%;
	background-color: #013c97;
	float: left;
	-webkit-animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
	animation: sk-cubeGridScaleDelay 1.3s infinite ease-in-out;
}
.sk-cube-grid .sk-cube1 {
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s; }
.sk-cube-grid .sk-cube2 {
	-webkit-animation-delay: 0.3s;
	animation-delay: 0.3s; }
.sk-cube-grid .sk-cube3 {
	-webkit-animation-delay: 0.4s;
	animation-delay: 0.4s; }
.sk-cube-grid .sk-cube4 {
	-webkit-animation-delay: 0.1s;
	animation-delay: 0.1s; }
.sk-cube-grid .sk-cube5 {
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s; }
.sk-cube-grid .sk-cube6 {
	-webkit-animation-delay: 0.3s;
	animation-delay: 0.3s; }
.sk-cube-grid .sk-cube7 {
	-webkit-animation-delay: 0s;
	animation-delay: 0s; }
.sk-cube-grid .sk-cube8 {
	-webkit-animation-delay: 0.1s;
	animation-delay: 0.1s; }
.sk-cube-grid .sk-cube9 {
	-webkit-animation-delay: 0.2s;
	animation-delay: 0.2s; }

@-webkit-keyframes sk-cubeGridScaleDelay {
	0%, 70%, 100% {
		-webkit-transform: scale3D(1, 1, 1);
		transform: scale3D(1, 1, 1);
	} 35% {
		-webkit-transform: scale3D(0, 0, 1);
		transform: scale3D(0, 0, 1);
	}
}

@keyframes sk-cubeGridScaleDelay {
	0%, 70%, 100% {
		-webkit-transform: scale3D(1, 1, 1);
		transform: scale3D(1, 1, 1);
	} 35% {
		-webkit-transform: scale3D(0, 0, 1);
		transform: scale3D(0, 0, 1);
	}
}