@charset "utf-8";

/*============================================================
normalize
============================================================*/

/* normalize.css v8.0.1 */
html{line-height:1.15;-webkit-text-size-adjust:100%}body{margin:0}main{display:block}h1{font-size:2em;margin:.67em 0}hr{box-sizing:content-box;height:0;overflow:visible}pre{font-family:monospace,monospace;font-size:1em}a{background-color:transparent}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}img{border-style:none}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0}button,input{overflow:visible}button,select{text-transform:none}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText}fieldset{padding:.35em .75em .625em}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}details{display:block}summary{display:list-item}template{display:none}[hidden]{display:none}

/* local setting */
*,::before,::after{box-sizing:border-box;background-repeat:no-repeat;z-index:2}a{text-decoration:none;color:inherit;cursor:pointer}button{background-color:transparent;color:inherit;border-width:0;padding:0;cursor:pointer}figure{margin:0}input::-moz-focus-inner{border:0;padding:0;margin:0}ul,ol,dl,dd{margin:0;padding:0;list-style:none}h1,h2,h3,h4,h5,h6{margin:0;font-size:inherit;font-weight:inherit}p{margin:0}p,li{max-height:100%}cite{font-style:normal}fieldset{border-width:0;padding:0;margin:0}small{font-size:inherit}

/*============================================================
base
============================================================*/

:root {
  --COL-BLK: #000;
  --COL-WHT: #fff;

  --COL-PRI: #0eacc8;
  --COL-SEC: #3dc7d2;
  --COL-TER: #dcf5f7;

  --COL-ORG: #ffa728;
  --COL-POR: #ffb953;
  --COL-BLU: #1e73bd;
  --COL-DBL: #19609e;
  --COL-GRN: #518e55;
  --COL-RED: #ea6182;
  --COL-YEL: #ffff00;
  --COL-GRY: #4c4c4c;
  --COL-PGR: #e5e5e5;
  
  --FNT-ZG: 'Zen Kaku Gothic New', sans-serif;
  --FNT-BL: 'Barlow', sans-serif;
}

html {
  height: 100%;
  overflow: auto;
  font-family: var(--FNT-ZG);
  font-weight: 400;
  font-style: normal;
  line-height: 1;
}

body {
  width: 100%;
  min-height: 100%;
  position: relative;
  line-height: 1;
  color: var(--COL-BLK);
}

a:link,
a:visited,
a:hover,
a:active { color: inherit; text-decoration: none; outline: none; }

button,
button:hover,
button:active { color: inherit; text-decoration: none; outline: none; vertical-align : middle; }

img {
  max-width: 100%;
  height: auto;
}

input,
textarea,
select,
button {
  font-family: sans-serif;
  font-size: 100%;
}

input[type="text"],
input[type="email"],
input[type="tel"],
textarea,
input[type="submit"] {
  display: inline-block;
  background-color: transparent;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  vertical-align: middle;
  outline: none;
  padding: 0;
  border: none;
  border-radius: 0;
  resize: none;
}

::-moz-focus-inner { border: 0; }
input::-ms-clear { display: none; }
input::-ms-reveal { display: none; }
input::-ms-expand { display: none; }

:-moz-placeholder { color: var(--COL-RED); font-size: 16px; }
::-moz-placeholder { opacity: 1; color: var(--COL-RED); font-size: 16px; }
::-webkit-input-placeholder { color: var(--COL-RED); font-size: 16px; }
::placeholder { color: var(--COL-RED); font-size: 16px; }

:focus:-moz-placeholder { color: transparent; }
:focus::-moz-placeholder { color: transparent; }
:focus::-webkit-input-placeholder { color: transparent; }
:focus::placeholder { color: transparent; }

label[for] {
  cursor: pointer;
  user-select: none;
}

/*============================================================
effect
============================================================*/

.eff-fade {
  opacity: 0;
  visibility: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

.eff-fade.is-active {
  opacity: 1;
  visibility: visible;
  transition-property: opacity;
  transition-duration: 1.5s;
  transition-timing-function: ease;
}

.eff-fadeup {
  opacity: 0;
  visibility: hidden;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform: translateY( 80rem );
}

.eff-fadeup.is-active {
  opacity: 1;
  visibility: visible;
  transform: translateY( 0 );
  transition-property: opacity, transform;
  transition-duration: 0.5s, 0.5s;
  transition-delay: 0.3s, 0.3s;
  transition-timing-function: linear, ease;
}