@charset "UTF-8";

/* 共通CSS ------------------------------*/
 * {
   margin: 0;
   padding: 0;
   box-sizing: border-box;
 }
 html {
   overflow-y: scroll;
   height: 100%; overflow-x: hidden;
   font-family: "Noto Serif JP", "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
 }
 body { width: 100%; overflow-x: hidden;}

 div, dl, dt, dd, ul, ul li, ol, ol li, h1, h2, h3, h4, h5, h6,
 pre, form, fieldset, p, blockquote, th, td,
 section, nav, article, aside, hgroup, header, address,
 figure, figcaption {
   margin: 0;
   padding: 0;
 }
 address, caption, cite, code, dfn, em, strong, th, var {
   font-style: normal;
   font-weight: normal;
 }
 table {
   border-collapse: collapse;
   border-spacing: 0;
   width: 100%;
 }
 caption, th {
   text-align: left;
 }
 q::before, q::after {
   content: '';
 }
 object, embed {
   vertical-align: top;
 }
 h1, h2, h3, h4, h5, h6 {
   font-size: 100%;
 }
 img, abbr, acronym, fieldset {
   border: 0;
 }
 img {
   -ms-interpolation-mode: bicubic;
   border: none;
   vertical-align: top;
   line-height: 0;
 }
 ul li, ol li {
   list-style-type: none;
 }
 select {
   background-color: #FFF;
   border: 1px solid #A9A9A9;
   box-sizing: border-box;
 }
 textarea {
   border: 1px solid #A9A9A9;
   box-sizing: border-box;
   padding: 2%;
 }
 a {
   outline: none;
   text-decoration: none;
 }
 a:link {
   text-decoration: none;
 }
 a:visited {
   text-decoration: none;
 }
 a:hover {
   color: #E0C684;
   text-decoration: none;
 }
 a:hover img {
   opacity: .70;
   filter: alpha(opacity=70);
   -ms-filter: "Noto Serif JP", "游明朝体", "YuMincho", "游明朝", "Yu Mincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN W3", HiraMinProN-W3, "ヒラギノ明朝 ProN", "Hiragino Mincho ProN", "ヒラギノ明朝 Pro", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", serif;
   -khtml-opacity: .70;
   -moz-opacity: .70;
   cursor: pointer;
   transition: opacity .3s;
 }
 img {
   max-width: 100%;
   height: auto;
   width: auto;
 }
 .fade-in {
   opacity: 0;
   transform: translateY(150px);
   transition: opacity 1.3s ease-out, transform 1.3s ease-out;
 }
 .fade-in.visible {
   opacity: 1;
   transform: translateY(0);
 }
 .fade-in2 {
   opacity: 0;
   transform: translateY(150px);
   transition: opacity 1.3s ease-out, transform 1.3s ease-out;
 }
 .fade-in2.visible {
   opacity: 1;
   transform: translateY(0);
 }
 .mt-5 { margin-top:15px;}
.break {
      display: block;
  }
.back-to-top {
    position: fixed;
    visibility: hidden;
    opacity: 0;
    right: 10px;
    bottom: 5px;
    z-index: 998;
    border-radius: 50px;
    transition: all 0.4s;
    text-align: center;
    text-decoration: none;
}
.back-to-top.active {
    visibility: visible;
    opacity: 1;
}
.back-to-top.active {
    visibility: visible;
    opacity: 1;
}
.displayBtn-image {
  position: fixed;
  bottom: 20px;
  left: 20px;
  width: 110px;
  height: auto;
  opacity: 0;
  transition: opacity 2s ease-in-out;
  z-index:100px
}
.header-iCon-image {
  position: absolute;
  top: 20.5px;
  left: 0px;
  width: 280px;
  height: auto;
  opacity: 0;
  transition: opacity 2s ease-in-out;
  z-index:100px;
  overflow:hidden;
}
.info-btn-image {
  position: absolute;
  top: 80px;
  right: 20px;
  width: 110px;
  height: auto;
  opacity: 0;
  transition: opacity 2s ease-in-out;
  z-index:100px;
}
.displayBtn { opacity: 1;}

@media (max-width: 579px) {
  .fixed-button { display: none;}
  .break-mobile { display: block;}
}