@charset "utf-8";
/* ==================================================================
CSS information
style info :RESET
================================================================== */
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
	margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent;
}
body { line-height:1; }
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section { display:block; }
nav ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after,q:before, q:after { content:''; content:none; }
a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
ins { background-color:#ff9; color:#000; text-decoration:none; }
mark { background-color:#ff9; color:#000;  font-style:italic; font-weight:bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }
table { border-collapse:collapse; border-spacing:0; }
hr { display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0; }
input, select { vertical-align:middle; }

h1 , h2 , h3 , h4 { line-height:1; }
ul { list-style:none; }
p { line-height:1; }
img { vertical-align:bottom; border:none; }
table { font-size:inherit; font:100%;}




/* ==================================================================
CSS information
style info :共通
================================================================== */
html,body { -webkit-text-size-adjust: none; }
html { font-size: 62.5%; }
body { font-size: 14px; font-size: 1.4rem; }
div, h1, h2, h3, h4, h5, p { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
table, table *, ul, li, ol, dl, dt, dd, a, span { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
header, section, aside, article { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }
*::before, *::after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; -ms-box-sizing: border-box; box-sizing: border-box; }

body { font-family: 'Noto Sans JP', 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', 'Yu Gothic Medium', '游ゴシック Medium', YuGothic, '游ゴシック体', 'Meiryo', 'Helvetica Neue', Arial, sans-serif; }
img { max-width: 100%; height: auto; }


/* --------------------------------------------------------
#nowloading
-------------------------------------------------------- */
#nowloading { position: fixed; width: 100%; height: 100%; top: 0; left: 0; background: #fff; z-index: 9998; }
#nowloading_icon { width: 80px; height: 80px; position: absolute; top: 50%; left: 50%; margin-top: -40px; margin-left: -40px; }
#nowloading_icon .nl_i_cube { background-color: #d3dee5; width: 20px; height: 20px; position: absolute; top: 0; left: 0;
	animation: nlAnime 2.2s infinite ease-in-out; }
#nowloading_icon .nl_i_cube.-cb2 { animation-delay: -1.1s; }
@keyframes nlAnime {
	25% { transform: translateX(60px) rotate(-90deg) scale(0.5); } 
	50% { transform: translateX(60px) translateY(60px) rotate(-179deg); } 
	50.1% { transform: translateX(60px) translateY(60px) rotate(-180deg); } 
	75% { transform: translateX(0px) translateY(60px) rotate(-270deg) scale(0.5); } 
	100% { transform: rotate(-360deg); }
}



/* --------------------------------------------------------
#bg
-------------------------------------------------------- */
#bg { display: block; width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: -1; }
#bg canvas { display: block; vertical-align: bottom; }
#particles-js { position: absolute; width: 100%; height: 100%; background-color: #fff; }

  

/* --------------------------------------------------------
.header
-------------------------------------------------------- */
.header { width: 100%; position: fixed; top: 0; left: 0; z-index: 100; 
	background: linear-gradient(to bottom,  rgba(255,255,255,0.95) 0%,rgba(255,255,255,0.95) 70%,rgba(255,255,255,0.7) 100%); }
.header .secInner { padding: 0; }

.hd__gnav { width: 100%; }
.gnavList { display: -webkit-box; display: flex; flex-wrap: wrap; -webkit-box-pack: center; justify-content: center; }
.gL__btn { margin: 0 calc(15/750*100%); position: relative; }
.gL__btn img { position: relative; }
.gL__btn.-gnb1 { width: calc(114/750*100%); }
.gL__btn.-gnb2 { width: calc(143/750*100%); }
.gL__btn.-gnb3 { width: calc(161/750*100%); }
.gL__btn.-gnb4 { width: calc(155/750*100%); }

.gL__btn::before { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #d3dee5; -webkit-transform: translateY(-100%); transform: translateY(-100%); }
.gL__btn.current::before { -webkit-transform: translateY(0); transform: translateY(0); }

@media screen and (min-width: 641px) {
	.header { background: linear-gradient(to bottom,  rgba(255,255,255,0.95) 0%,rgba(255,255,255,0.8) 60%,rgba(255,255,255,0) 100%); }

	.gnavList {}
	.gL__btn { margin: 0 calc(15/1260*100%); }
	.gL__btn.-gnb1 { width: calc(114/1260*100%); }
	.gL__btn.-gnb2 { width: calc(143/1260*100%); }
	.gL__btn.-gnb3 { width: calc(161/1260*100%); }
	.gL__btn.-gnb4 { width: calc(155/1260*100%); }

	.agL__btn.current::before { content: ""; display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #d3dee5; }
	.agL__btn::before { -webkit-transition: .5s ease-in-out; transition: .1s ease-in-out; }
	.agL__btn:hover::before { opacity: 1; }

	.gL__btn::before { -webkit-transform: translateY(-100%); transform: translateY(-100%); -webkit-transition: .1s ease-in-out; transition: .1s ease-in-out; -webkit-backface-visibility: hidden; display: block; }
	.gL__btn.current::before, 
	.gL__btn:hover::before { -webkit-transform: translateY(0); transform: translateY(0); }


}
@media screen and (min-width: 1361px) {
}


/* --------------------------------------------------------
.footer
-------------------------------------------------------- */
.footer { width: 100%; background: #eef2f5; padding: 1em 0 3em; }
.ft__copyright { text-align: center; font-size: calc(18/750*100vw); color: #364f65; }
@media screen and (min-width: 641px) {
	.ft__copyright { font-size: calc(14/1360*100vw); }
}
@media screen and (min-width: 1361px) {
	.ft__copyright { font-size: 1.4rem; }
}


/* --------------------------------------------------------
#contents
-------------------------------------------------------- */
#contents::before ,
#contents::after { content: ""; display: block; clear: both; }
#contents { zoom:1; overflow: hidden; position: relative; }
@media screen and (min-width: 641px) {
}
@media screen and (min-width: 1361px) {
}


/* --------------------------------------------------------
.secBlock
-------------------------------------------------------- */
.secBlock { position: relative; width: 100%; margin: auto; }


/* --------------------------------------------------------
.secInner
-------------------------------------------------------- */
.secInner { position: relative; }
@media screen and (min-width: 641px) {
	.secInner { width: calc(1260/1360*100%); margin: auto; }
}
@media screen and (min-width: 1361px) {
	.secInner { width: 1260px; }
}



/* --------------------------------------------------------
.btn_ov
-------------------------------------------------------- */
@media screen and (min-width: 641px) {
	.btn_ov a { -webkit-transform: scale(1.0); transform: scale(1.0); -webkit-transition: .1s ease-in-out; transition: .1s ease-in-out; -webkit-backface-visibility: hidden; display: block; }
	.btn_ov a:hover { -webkit-transform: scale(1.05); transform: scale(1.05); }
}



/* --------------------------------------------------------
.nosp	.nopc
-------------------------------------------------------- */
.nosp { display: none; }
@media screen and (min-width: 641px) {
	.nosp { display: inline-block; }
	.nopc { display: none; }
}


