@charset "utf-8";
/* --------------------------------------------------
	reset
-------------------------------------------------- */
* { margin: 0; padding: 0; box-sizing: border-box;}

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
form, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0; padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}

img{ vertical-align: bottom;}
ul, ol{ list-style: none;}
ul li,
ol li { list-style-type: none;}
figure { margin: 0;}


/* =============================================================================
   Forms
   ========================================================================== */
form { margin: 0;}
fieldset { border: 1px solid #c0c0c0; margin: 0 2px; padding: 0.35em 0.625em 0.75em;}
legend { border: 0;}
button,
input,
select,
textarea { font-size: 100%; margin: 0; vertical-align: baseline;}
button,
input { line-height: normal;}
button,
input[type="button"],
input[type="reset"],
input[type="submit"] { cursor: pointer; -webkit-appearance: button; }
input[type="checkbox"],
input[type="radio"] { box-sizing: border-box; padding: 0;}
input[type="search"] {
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}
input[type="search"]::-webkit-search-decoration { -webkit-appearance: none;}

button::-moz-focus-inner,
input::-moz-focus-inner { border: 0; padding: 0; }
textarea { overflow: auto; vertical-align: top;}
input[type="search"]:focus { outline: none;}

table {
    border-collapse: collapse;
    border-spacing: 0;
}



@media (max-width: 481px) {
}



/*		font-style
-------------------------------------------------- */
body {
	font-family: 'Noto Sans JP', "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;
	font-size: 16px;
	*font-size:small;
	*font:x-small;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
body.fixed { position: fixed;}
input, textarea {font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;}

.min {font-family: "游明朝", "Yu Mincho", "YuMincho", serif;}

::selection{ background: #feffaf; color: #000;}
::-moz-selection{ background: #feffaf; color: #000;}


a { color:#002159; text-decoration: underline;}
a:link   { color:#002159;}
a:visited{ color:#002159;}
a:hover  { color:#002159;}
a:active { color:#002159;}

em{ font-style: normal;}


/*		utility
-------------------------------------------------- */
.cf{ clear: both;}
.cf:after{ content: ''; display: block; clear: both;}

@media (max-width: 641px) {
}


#contact ul li label.error {
	position: absolute; top: -30px; left: -10px;
	padding: 5px 8px;
	background: #d00; border-radius: 5px;
	color: #fff; font-size: 12px;
	opacity: 0;
	animation: .5s showError linear forwards .2s;
}
#contact ul li label.error:before{ content: ''; display: block; width: 8px; height: 8px; background: #d00;
	transform: rotate(45deg);
	position: absolute; bottom: -4px; left: 20px;
}
@keyframes showError{
	100%{ opacity: 1;}
}


#hd { position: absolute; left: 0; top: 0; width: 100%; z-index: 100; background: #fff; box-shadow: 0px 0px 8px #7e98b8;}
#hd .inner-hd { width: 96%; max-width: 1540px; margin: 0 auto; padding: 18px 0;}
#hd .hd-flex { position: relative; display: flex; justify-content: space-between; align-items: center; width: 100%; margin: 0 auto;}
#hd .logo { width: calc(100% - 940px);}
#hd .logo h1 { line-height: 1;}
#hd .logo h1 img { width: 100%; max-width: 450px;}
#hd .nav { width: 940px;}
#hd .nav ul { font-size: 0; text-align: right;}
#hd .nav ul li { display: inline-block; padding: 0 14px; font-size: 14px; line-height: 1.25; vertical-align: middle;}
#hd .nav ul li.contact-1 { padding: 0px 8px;}
#hd .nav ul li.contact-2 { padding: 0px;}

#hd .nav ul li a { position: relative; display: block; color: #000; letter-spacing: 0.05rem; font-weight: 700; text-decoration: none;}
#hd .nav ul li.contact-1 a,
#hd .nav ul li.contact-2 a { padding: 8px 20px; border-radius: 50px; letter-spacing: 0rem;}
#hd .nav ul li.contact-1 a { background: #985858; color: #fff; text-align: center;}
#hd .nav ul li.contact-2 a { background: #0f2b6c; color: #fff; text-align: center;}

#hd .nav ul li.beginner a:before{ left: 0px;
 background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 100 100"><g fill="%230c66a5"><path d="M71.8,2.7l-21.8,17.2L28.2,2.7c-5.4-4.2-12.8,0-12.8,7.4v52.3c0,7.5,3.3,14.6,8.8,18.9l19.7,15.5c1.8,1.4,4,2.2,6.1,2.2s4.3-.7,6.1-2.2l19.7-15.5c5.5-4.3,8.8-11.4,8.8-18.9V10.1c0-7.3-7.4-11.6-12.8-7.4ZM49.8,94.1c-1.1,0-2.2-.4-3.1-1.1l-19.7-15.5c-4.3-3.4-6.9-9.1-6.9-15.1V10.1c0-2.1,1.1-3.4,2.1-3.9.4-.2.8-.3,1.1-.3.6,0,1.1.2,1.6.6l24.8,19.5v68Z"/></g></svg>');
 background-size: 100% auto; background-repeat: no-repeat; background-position: 50% 50%;
}

#hd .nav ul li.worker a:before{ left: 0px;
 background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 100 100"><g fill="%230c66a5"><path d="M59.5,54.7c7.7-3.6,13-11.3,13-20.3s-10.1-22.5-22.5-22.5-22.5,10.1-22.5,22.5,5.3,16.8,13,20.3c-14.5,4.1-25.2,17.5-25.2,33.4h69.3c0-15.9-10.7-29.3-25.2-33.4Z"/></g></svg>');
 background-size: 100% auto; background-repeat: no-repeat; background-position: 50% 50%;
}
#hd .nav ul li.contact-1 a:before { left: 12px;
 background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 100 100"><g fill="%23ffffff"><path d="M81.4,28.3H18.6c-.8,0-1.6.3-2.2.9l31.3,25.8c1.3,1,3.3,1,4.6,0l31.3-25.8c-.6-.5-1.3-.9-2.2-.9Z"/><path d="M52.5,59.1c-1.4,1.1-3.6,1.1-4.9,0L15.3,32.6v35.8c0,1.8,1.5,3.2,3.2,3.2h62.8c1.8,0,3.3-1.5,3.3-3.2v-35.8l-32.2,26.6ZM35.3,54.4l-15.2,14.4c-.3.2-.6.4-.9.4s-.7-.1-1-.4c-.5-.5-.5-1.4,0-1.9l15.2-14.4c.5-.5,1.4-.5,1.9,0,.5.5.5,1.4,0,1.9ZM81.8,68.8c-.3.3-.6.4-1,.4s-.7-.1-.9-.4l-15.2-14.4c-.5-.5-.6-1.4,0-1.9.5-.5,1.4-.6,1.9,0l15.2,14.4c.5.5.6,1.4,0,1.9Z"/></g></svg>');
 background-size: 100% auto; background-repeat: no-repeat; background-position: 50% 50%;
}
#hd .nav ul li.contact-2 a:before { left: 12px;
 background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 100 100"><g fill="%23ffffff"><path d="M81.4,28.3H18.6c-.8,0-1.6.3-2.2.9l31.3,25.8c1.3,1,3.3,1,4.6,0l31.3-25.8c-.6-.5-1.3-.9-2.2-.9Z"/><path d="M52.5,59.1c-1.4,1.1-3.6,1.1-4.9,0L15.3,32.6v35.8c0,1.8,1.5,3.2,3.2,3.2h62.8c1.8,0,3.3-1.5,3.3-3.2v-35.8l-32.2,26.6ZM35.3,54.4l-15.2,14.4c-.3.2-.6.4-.9.4s-.7-.1-1-.4c-.5-.5-.5-1.4,0-1.9l15.2-14.4c.5-.5,1.4-.5,1.9,0,.5.5.5,1.4,0,1.9ZM81.8,68.8c-.3.3-.6.4-1,.4s-.7-.1-.9-.4l-15.2-14.4c-.5-.5-.6-1.4,0-1.9.5-.5,1.4-.6,1.9,0l15.2,14.4c.5.5.6,1.4,0,1.9Z"/></g></svg>');
 background-size: 100% auto; background-repeat: no-repeat; background-position: 50% 50%;
}

#hd .nav ul li a span { display: inline-block; color: #000; font-weight: 700; vertical-align: middle;}

#hd .nav ul li.contact-1 a span { color: #fff;}
#hd .nav ul li.contact-2 a span { color: #fff;}
#hd .nav ul li a:hover {  opacity: 0.8;}
#hd .nav ul li a:hover span{ text-decoration: underline; opacity: 0.8;}
#hd .nav ul li.contact-1 a span { text-decoration: none;}
#hd .nav ul li.contact-2 a span { text-decoration: none;}


#hd .sp-btn { display: none; width: 40%;}
#hd .sp-btn a { display: block; width: 100%; margin: 0 auto; padding: 8px 0; background: linear-gradient(#0f2b6c,#2e4887); border-radius: 50px;
 color: #fff; font-size: 14px; font-weight: 700; text-align: center; text-decoration: none;
}
#hd .sp-menu { display: none; position: absolute; right: 15px; top: 50%; width: 32px; height: 32px; transform: translateY(-50%);}
#hd .sp-menu div { position: relative; width: 100%; height: 100%;}
#hd .sp-menu div span { display: block; width: 100%; height: 2px; position: absolute; left: 0; opacity: 1; background: #102d6d; transition: 0.4s all;}
#hd .sp-menu div span:nth-of-type(1) { top: 7px;}
#hd .sp-menu div span:nth-of-type(2) { top: 16px;}
#hd .sp-menu div span:nth-of-type(3) { top: 25px;}
#hd .sp-menu.active div span:nth-of-type(1) { transform: translateY(9px) rotate(-45deg);}
#hd .sp-menu.active div span:nth-of-type(2) { transform: translateX(10px); opacity: 0; animation: active-bar .8s forwards;}
#hd .sp-menu.active div span:nth-of-type(3) { transform: translateY(-9px) rotate(45deg);}
@media (max-width: 1401px) {
	#hd .nav ul li { padding: 0 8px; }
}
@media (max-width: 1201px) {
	#hd .inner-hd { padding: 12px 0;}
	#hd .logo { width: calc(100% - 860px);}
	#hd .nav { width: 860px;}

	#hd .nav ul li.contact-1 { padding: 0 4px; font-size: 12px;}
	#hd .nav ul li.contact-2 { padding: 0px; font-size: 12px;}

	#hd .nav ul li a:before { width: 24px;}
	#hd .nav ul li.contact-1 a:before { width: 28px;}
	#hd .nav ul li.contact-2 a:before { width: 28px;}
}
@media (max-width: 1001px) {
	#hd .logo { width: calc(100% - 700px);}
	#hd .nav { width: 700px;}

	#hd .nav ul li { padding: 0 6px; font-size: 12px;}
	#hd .nav ul li.contact-1 { padding: 0 8px; font-size: 10px;}
	#hd .nav ul li.contact-2 { padding: 0px; font-size: 10px;}
	#hd .nav ul li.contact-1 a,
	#hd .nav ul li.contact-2 a { padding: 6px 12px;}

	#hd .nav ul li a:before { width: 20px;}
	#hd .nav ul li.contact-1 a:before { width: 24px;}
	#hd .nav ul li.contact-2 a:before { width: 24px;}	
}
@media (max-width: 801px) {
	#hd .inner-hd { width: 100%; padding: 14px 0;}
	#hd .hd-flex { padding-left: 30px; padding-right: 60px;}
	#hd .logo { width: 70%;}
	#hd .sp-btn { display: block;}
	#hd .nav { display: none;}
	#hd .sp-menu { display: block;}
}
@media (max-width: 481px) {
	#hd .inner-hd { padding: 12px 0;}
	#hd .hd-flex { padding-left: 20px; padding-right: 50px;}
	#hd .sp-btn a { padding: 4px 0; font-size: 12px;}
}
@keyframes active-bar {
  100% { height: 0;}
}


.sp-nav { position: fixed; top: -800px; left: 0; z-index: 99; width: 100%; background: #c2e9fb; transition: 0.4s linear;}
.sp-nav.open { top: 0;}
.sp-nav .inner { width: 100%; padding: 120px 0 60px; background: url('../img/bg-nav.png') no-repeat 50% 0% / 540px auto;}
.sp-nav ul { width: 92%; margin: 0 auto; text-align: center;}
.sp-nav ul li { padding: 12px 0; font-size: 20px;}
.sp-nav ul li a { display: block; padding: 4px 0; color: #000; text-decoration: none;}
.sp-nav ul li.contact-1,
.sp-nav ul li.contact-2 { font-size: 18px; line-height: 1.4;}
.sp-nav ul li.contact-1 { padding-top: 24px;}
.sp-nav ul li.contact-1 a,
.sp-nav ul li.contact-2 a { width: 80%; margin: 0 auto; padding: 8px 20px; border-radius: 50px; color: #fff;}
.sp-nav ul li.contact-1 a { background: #0f2b6c;}
.sp-nav ul li.contact-2 a { background: #985858;}
.sp-nav ul li.contact-2 a span ,
.sp-nav ul li.contact-1 a span { display: inline-block; vertical-align: middle;}
/*
.sp-nav ul li.contact-1 a:before,
.sp-nav ul li.contact-2 a:before { content: '';
 display: inline-block; vertical-align: middle; width: 32px; height: 32px; margin-right: 15px;
 background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 100 100"><g fill="%23ffffff"><path d="M81.4,28.3H18.6c-.8,0-1.6.3-2.2.9l31.3,25.8c1.3,1,3.3,1,4.6,0l31.3-25.8c-.6-.5-1.3-.9-2.2-.9Z"/><path d="M52.5,59.1c-1.4,1.1-3.6,1.1-4.9,0L15.3,32.6v35.8c0,1.8,1.5,3.2,3.2,3.2h62.8c1.8,0,3.3-1.5,3.3-3.2v-35.8l-32.2,26.6ZM35.3,54.4l-15.2,14.4c-.3.2-.6.4-.9.4s-.7-.1-1-.4c-.5-.5-.5-1.4,0-1.9l15.2-14.4c.5-.5,1.4-.5,1.9,0,.5.5.5,1.4,0,1.9ZM81.8,68.8c-.3.3-.6.4-1,.4s-.7-.1-.9-.4l-15.2-14.4c-.5-.5-.6-1.4,0-1.9.5-.5,1.4-.6,1.9,0l15.2,14.4c.5.5.6,1.4,0,1.9Z"/></g></svg>');
 background-size: 100% auto; background-repeat: no-repeat; background-position: 50% 50%;
}
*/
@media (max-width: 641px) {
	.sp-nav .inner { background-size: 100% auto;}
}
@media (max-width: 481px) {
	.sp-nav .inner { padding: 80px 0 60px;}
	.sp-nav ul li { padding: 8px 0; font-size: 16px;}
	.sp-nav ul li.contact-1,
	.sp-nav ul li.contact-2 { font-size: 14px;}
	.sp-nav ul li.contact-1 { padding-top: 18px;}
	.sp-nav ul li a { padding: 2px 0;}
}



.btn-entry { width: 80%; max-width: 620px; margin: 0 auto;}
.btn-entry a { position: relative; display: block; padding: 18px 0 20px; background: linear-gradient(#0f2b6c,#2e4887); border-radius: 50px;
 color: #fff; font-size: 28px; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none;
}
.btn-entry a:after { content: ''; display: inline-block; width: 0px; height: 0px; border: solid 10px transparent; border-left: solid 18px #fff; border-right: 0; vertical-align: middle;}
.btn-entry a span { display: inline-block; margin-right: 20px; vertical-align: middle;}
.btn-entry a br { display: none;}
.btn-entry a:hover { opacity: 0.8;}
.btn-entry span.fin { position: relative; display: block; padding: 18px 0 20px; background: #ccc; border-radius: 50px;
 color: #fff; font-size: 28px; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none;
}
@media (max-width: 641px) {
	.btn-entry a,
	.btn-entry span.fin { font-size: 3.4vw;}
}
@media (max-width: 481px) {
	.btn-entry a { padding: 10px 0 12px; font-size: 21px;}
	.btn-entry a:after { border: solid 8px transparent; border-left: solid 12px #fff; border-right: 0; position: absolute; right: 20px; top: 50%; transform: translateY(-50%);}
	.btn-entry a span { margin-right: 0px;}
	.btn-entry a br { display: block;}
	.btn-entry span.fin { padding: 10px 0 12px; font-size: 16px;}
}


.fix-btn { position: fixed; right: 2%; bottom: 4%; width: 18%; max-width: 180px; z-index: 10;}
.fix-btn a { display: block; width: 100%; border-radius: 50%; box-shadow: 0 0 12px #e5eaf1; overflow: hidden;transition: 0.2s linear;}
.fix-btn a img { width: 100%;}
.fix-btn a:hover { opacity: 0.8;}
@media (max-width: 481px) {
	.fix-btn { bottom: 15px;}
	.fix-btn a { box-shadow: 0 0 8px #e5eaf1;}
}

.pagetop { width: 60px; position: fixed; left: 2%; bottom: 30px; z-index: 99;}
.pagetop a { display: block; width: 100; height: 100%; background: #fff; overflow: hidden; border-radius: 50%;}
.pagetop a img { width: 100%;}
.pagetop a:hover img { opacity: 0.8;}
@media (max-width: 641px) {
	.pagetop { width: 40px; bottom: 15px;}
}

#ft { position: relative; /* background: url('../img/bg-ft.png') no-repeat 50% 0 / 2000px auto; */ z-index: 2;}
#ft h3 { margin-bottom: 20px; color: #0f2b6c; font-size: 42px; font-weight: 900; text-align: center;}
#ft h3 span.box { display: block; width: 84%; max-width: 680px; margin: 12px auto 0; padding: 10px 0 24px; border-top: solid 4px #6b6a6b; border-bottom: solid 4px #6b6a6b;
 color: #6b6b6b; font-size: 54px; line-height: 1;
}
#ft h3 span.box span.year { display: inline-block; margin-right: 10px; font-size: 52px;}
#ft h3 span.box em { display: inline-block; font-size: 76px; vertical-align: text-bottom;}
#ft p.read { margin-bottom: 30px; color: #333; font-size: 24px; text-align: center;}
#ft .btn-entry { margin: 0 auto 60px;}
#ft .btn-entry a { box-shadow: 0 8px 12px #cdd7e3;}
#ft .copyright { padding: 20px 0;}
#ft .copyright p { font-size: 11px; text-align: center;}
@media (max-width: 1001px) {
	#ft p.read { font-size: 2.0vw;}
}
@media (max-width: 801px) {
	#ft { /* background: url('../img/bg-ft-sp.png') no-repeat 50% 0 / 100% auto;*/}
}
@media (max-width: 641px) {
	#ft h3 { font-size: 30px;}
	#ft h3 span.box { padding: 10px 0 14px; border-width: 3px; font-size: 4.6vw;}
	#ft h3 span.box span.year { margin-right: 6px; font-size: 5.0vw;}
	#ft h3 span.box em { font-size: 7.8vw;}
	#ft p.read { font-size: 2.6vw;}
	#ft .copyright p span { display: block;}
}
@media (max-width: 481px) {
	#ft h3 { margin-bottom: 16px; font-size: 24px;}
	#ft h3 span.box { padding: 8px 0 12px; border-width: 2px; font-size: 24px;}
	#ft h3 span.box span.year { font-size: 26px;}
	#ft h3 span.box em { font-size: 48px;}
	#ft p.read { margin-bottom: 20px; font-size: 13px;}
	#ft p.read span { display: block;}
	#ft .btn-entry { margin: 0 auto 20px;}
	#ft .copyright { padding: 12px 0;}
	#ft .copyright p { font-size: 10px;}
}







#oage-ttl { position: relative;}
#oage-ttl .inner { padding: 220px 0 80px;}
#oage-ttl h1 { background: linear-gradient(#001e60,#566aa3); -webkit-background-clip:text; -webkit-text-fill-color: transparent;
 color: #001e60; font-size: clamp(33px,6.4vw,62px); font-weight: 700; line-height: 1; text-align: center;
}
@media (max-width: 801px) {
	#oage-ttl .inner { padding: 30vw 0 6vw;}
}
@media (max-width: 641px) {
}
@media (max-width: 481px) {
}


.ttl h2 { color: #0f2b6c; font-size: clamp( 21px,4.2vw, 42px); font-weight: 900; line-height: 1.4; text-align: center;}
.ttl h2 span { display: inline-block; padding-bottom: 16px; background: url('../img/bg-ttl.png') repeat-x 50% 100% / 10px auto;}
.ttl h2 br.sp { display: none;}
@media (max-width: 801px) {
}
@media (max-width: 641px) {
	.ttl h2 br.sp { display: block;}
}
@media (max-width: 481px) {
	.ttl h2 span { padding-bottom: 10px; background-size: 8px auto;}
}