@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{ list-style: none;}
ul 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;
}


/*		font-style
-------------------------------------------------- */
body {
	font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;
/*	font-family: "游ゴシック","Yu Gothic","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3", "メイリオ","Meiryo",sans-serif;*/
	font-size: 16px;
	*font-size:small;
	*font:x-small;
	line-height: 1.6;
}
input, textarea {font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3","メイリオ","Meiryo","ＭＳ Ｐゴシック",sans-serif;}

.eng {font-family: 'Slackey', cursive;}
.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{ /zoom: 1; clear: both;}
.cf:after{ content: ''; display: block; clear: both;}

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

#wrapper{ position: relative;}
#hd { position: absolute; left: 0; top: 60px;}
.cloud { position: fixed; top: 0; left: 0; z-index: 1; width: 100%; height: 100vh; background: url(./img/cloud.png); background-size: cover;}
#ft { position: relative; z-index: 2; padding: 20px 0; text-align: center;}
#ft p { margin-bottom: 20px;}
#ft address{ font-size: 16px; font-style: normal;}
#ft .hide-link { position: relative; display: block; width: 34px; margin: 0 auto 20px;}
#ft .hide-link:hover {
 animation: shake 0.1s infinite ease;
 -webkit-animation: shake 0.1s infinite ease;
}
@keyframes shake {
    0%  { transform:translate(0, 0);}
    50% { transform:translate(0, -3px);}
    100%{ transform:translate(0, 0);}
}
@-webkit-keyframes shake {
    0% {-webkit-transform:translate(0, 0);}
    50% {-webkit-transform:translate(0, -3px);}
    100% {-webkit-transform:translate(0, 0);}
}

#kv { width: 100%; padding-top: 20px;}
#kv p{ text-align: center; text-indent: 120px;}

.wrap{ position: relative; z-index: 3; width: 100%; padding: 100px 0;}
.inner-wrap{ width: 88%; max-width: 1200px; margin: 0 auto;}
.gNav { margin: 0 auto 60px;}
.gNav ul { font-size: 0; text-align: center;}
.gNav ul li { display: inline-block; width: 12.5%;}
.gNav ul li span { display: block; width: 90%; margin: 0 auto; background: #000; color: #fff; font-size: 20px;}
.gNav ul li.on span,
.gNav ul li span:hover { background: #008aac; color: #000;}
.index-ctn .ctn-inner{ width: 100%; display: flex; justify-content: space-between; margin: 0 auto 40px;}
.index-ctn .ctn-inner div{ width: 32%;}
.index-ctn ul.th { width: 96%; margin: 0 auto;}
.index-ctn ul.th li { margin: 0 auto 30px;}
.index-ctn ul.th li a { display: block; border: solid 2px #000; }
.index-ctn ul.th li a img{ width: 100%;}
.index-ctn .btn { width: 60%; max-width: 284px; margin: 0 auto;}
.index-ctn .btn a{ display: block; padding: 10px 0; background: #000; color: #fff; font-size: 18px; text-align: center; text-decoration: none;
 transition: 0.3s ease;
}
.index-ctn .btn a:hover{ opacity: 0.8; }