@charset "UTF-8";

/**********************************************************************
  フッター用css
**********************************************************************/

/* page-top追従ボタン Start */
#page-top { 
  position: fixed;
  bottom: 30px;
  right: 30px;
  z-index: 99999;
  
  a {
    @media (any-hover: hover) {
      &:hover {
        opacity: 0.8;
        transition: 0.7s;
      }
    }
  }
}
/* page-top追従ボタン End */

/* footerコンテナ Start */
.footer-container {
  margin-top: 5.0rem;
  padding: 0px;
  font-size: 0.8rem;
  line-height: 1.2rem;
  color: var(--color-white);
  background-color: var(--color-black);

  .container .footer-in { padding: 20px 0px 10px 0px;  }
  .container .footer-in .footer-contents {
    display: flex;
    justify-content: space-between;
    align-items: start;
    flex-direction: row;
    gap: 20px;
    margin-bottom: 1.0rem;
    height: 380px;

    .footer-left {
      padding: 0px 20px 0px 0px;
      height: 100%;
      width: 35%;
      border-right: 1px solid var(--color-white);

      .footer-logo { margin-bottom: 1.0rem; }
    }
    .footer-center {
      padding: 86px 0px 0px 0px;
      height: 100%;
      width: 25%;
      border-right: 1px solid var(--color-white);
    }
    .footer-right {
      padding: 0px; 
      height: 100%;
      width: 40%;
    }
    * ul li a {
      color: var(--color-white);

      @media (any-hover: hover) {
        &:hover { opacity: 0.7; }
      }
    }
  }
}
/* footerコンテナ End */

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/
/* 1279px（タブレット）以下 */
@media screen and (max-width: 1279px) {
  /* footerコンテナ Start */
  .footer-container .container .footer-in .footer-contents {
    display: none;
  }
  /* footerコンテナ End */

  /* page-top追従ボタン Start */
  #page-top img {
    position: fixed;
    bottom: 40px;
    right: 10px;
    width: 72px;
  }
  /* page-top追従ボタン End */
}

/* 767px（スマホ）以下 */
@media screen and (max-width: 767px) {
  /* */
}