@charset "utf-8";

html {
  margin: 0;
  padding: 0;
  font-size: 62.5%;
}
body {
  font-family: 'Noto Serif JP', 'ヒラギノ明朝 ProN', 'Hiragino Mincho ProN', '游明朝体', 'Yu Mincho', YuMincho, 'ＭＳ Ｐ明朝', 'MS PGothic', sans-serif;
  margin: 0;
  padding: 0;
  color: #434343;
  -webkit-text-size-adjust: 100%;
  font-size: 1.8rem;
}
header, section, footer {
  /*transform: translate3d(0, 0, 0);*/
}
body, div, dl, dt, dd, ul, ol, li,
h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend,
input, textarea,
p, blockquote, th, td {
  margin: 0;
  padding: 0;
  margin-block-start: 0;
  margin-block-end: 0;
  margin-inline-start: 0;
  margin-inline-end: 0;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
fieldset,
img {
  border: 0;
}

address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
  font-style: normal;
  font-weight: normal;
}

ol,
ul {
  list-style: none;
}

caption,
th {
  text-align: left;
}

h1, h2, h3, h4, h5,h6 {
  font-size: 100%;
  font-weight: normal;
}

q:before, q:after {
  content: "";
}

abbr, acronym {
  border: 0;
  font-variant: normal;
}

sup {
  vertical-align: text-top;
}

sub {
  vertical-align: text-bottom;
}

input, textarea, select, button {
  font-family: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  font-size: 100%;
}

legend {
  color: #000;
}


/* base */
/* ---------------- */
* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
a {
  text-decoration: none;
  color: inherit;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all  0.3s ease;
}
img {
  width: 100%;
  height: auto;
  vertical-align: bottom;
}
.cf:before,
.cf:after {
  content: "";
  display: table;
}
.cf:after {
  clear: both;
}
p {
  margin-block-start: 0;
  margin-block-end: 0;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
}
a:hover {
  opacity: 0.8;
}
.pc { display: block !important; }
.pc_tab { display: block !important; }
.tab { display: none !important; }
.sp { display: none !important; }
.tab_sp { display: none !important; }

/* Page Top */
#page_top {
  width: 65px;
  height: 65px;
  position: fixed;
  right: 0;
  bottom: 0;
  opacity: 0.8;
  z-index: 20;
}

#page_top a {
  position: relative;
  display: block;
  width: 65px;
  height: 65px;
  text-decoration: none;
  background: #000;
}

#page_top a::before {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  content: '\f106';
  font-size: 20px;
  color: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  margin: auto;
  transform: translate(-50%, -50%);
}

/* Loading */
#loading-wrapper {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  transition: all 1s;
  z-index: 9999;
}

.loader {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: url("../images/loading-animation.gif") #fff center / 90px 90px no-repeat;
}

.completed {
  opacity: 0;
  visibility: hidden;
}

/* Footer */
footer {
  background-color: #004ea2;
  width: 100%;
  height: 65px;
  display: flex;
  align-items: center;
  justify-content: center;
}

footer .inner {
}

.copyright {
  font-size: 1.3rem;
  color: #fff;
}


@media only screen and (min-width:768px) and (max-width:1023px) {
  .pc { display: none !important; }
  .tab { display: block !important; }
  .sp { display: none !important; }
  .pc_tab { display: block !important; }
  .tab_sp { display: block !important; }
}


@media only screen and (max-width:767px) {
  body {
    font-size: 1.5rem;
  }

  .pc { display: none !important; }
  .tab { display: none !important; }
  .sp { display: block !important; }
  .pc_tab { display: none !important; }
  .tab_sp { display: block !important; }

  /* Page Top */
  /* Page Top */
  #page_top {
    width: 50px;
    height: 50px;
  }

  #page_top a {
    width: 50px;
    height: 50px;
  }

  /* Footer */
  footer {
    height: 50px;
  }

  footer .inner {

  }

  .copyright {
    font-size: 1.2rem;
  }
}

@media only screen and (max-width:320px) {
  /* Header */
}