@media screen and (min-width: 961px) and (max-width: 1060px) {
  html {
    font-size: 12.25px;
  }
  header {
    font-size: 16px;
  }
  header h2 {
    font-size: 2.2em;
  }

  .gMenu .menu .nav-list {
    width: 23%;
  }
  
  .first-view {
    animation: fadeAnimation 1s ease-in-out forwards; /* 0.5秒かけてふわっと表示するアニメーションを適用 */
  }
  .top-page h2 {
    font-size: 2.6em;
  }
  .top-page .infour {
    font-size: 3.9em;
  }
  .link-list {
    animation: fadeAnimation 1.5s ease-in-out forwards;
  }
  .address {
    color : #ffe;
    font-size: 1.6rem;
    position: absolute;
    left: 8%;
    top: 10%;
  }
  #company-name {
    color: #ffe;
    font-size: 4rem;
    position:absolute;
    right: 5%;
    bottom: 25%;
    letter-spacing: -0.1rem;
  }
  #company-name small {
    font-size: 65%;
  }
  .instagram-icon {
    position: absolute;
    left: 14.5%;
    bottom: 15%;
  }
  .twitter-icon {
    position: absolute;
    left: 20%;
    bottom: 16%;
  }
  .pinterest-icon {
    position: absolute;
    left: 25%;
    bottom: 14%;
  }
  .base-icon {
    position: absolute;
    left: 30%;
    bottom: 9%;
  }
}

@media screen and (min-width: 1061px) and (max-width: 1160px) {
  html {
    font-size: 13.42px;
  }
  header {
    font-size: 16px;
  }
  header h2 {
    font-size: 2.2em;
  }

  .gMenu .menu .nav-list {
    width: 21%;
  }
  
  .top-page h2 {
    font-size: 2.4em;
  }
  .top-page .infour {
    font-size: 3.9em;
  }

  .address {
    color : #ffe;
    font-size: 1.6rem;
    position: absolute;
    left: 8%;
    top: 10%;
  }
  #company-name {
    color: #ffe;
    font-size: 4rem;
    position:absolute;
    right: 5%;
    bottom: 25%;
    letter-spacing: -0.1rem;
  }
  #company-name small {
    font-size: 65%;
  }
  .instagram-icon {
    position: absolute;
    left: 14.5%;
    bottom: 15%;
  }
  .twitter-icon {
    position: absolute;
    left: 20%;
    bottom: 16%;
  }
  .pinterest-icon {
    position: absolute;
    left: 25%;
    bottom: 14%;
  }
  .base-icon {
    position: absolute;
    left: 30%;
    bottom: 9%;
  }
}

@media screen and (min-width: 1161px) and (max-width: 1260px) {
  html {
    font-size: 14.6px;
  }
  header {
    font-size: 16px;
  }
  header h2 {
    font-size: 2.2em;
  }
  .top-page h2 {
    font-size: 2.3em;
  }
  .top-page .infour {
    font-size: 3.9em;
  }

  .instagram-icon {
    position: absolute;
    left: 14.5%;
    bottom: 15%;
  }
  .twitter-icon {
    position: absolute;
    left: 20%;
    bottom: 16%;
  }
  .pinterest-icon {
    position: absolute;
    left: 25%;
    bottom: 14%;
  }
  .base-icon {
    position: absolute;
    left: 30%;
    bottom: 9%;
  }
  .copyrights {  
    text-align: center;
    font-size: 0.8rem;
    background-color: #555;
    color:#fff;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 0.1% 0;
  }
}

@media screen and (min-width: 1367px) {
  header {
    max-width: 1366px; /* 画面幅が1366pxを超えても最大幅は1366pxに制限 */
    margin: 0 auto; /* 左右の余白を中央に寄せる */
    position: sticky;
  }
  .gMenu .menu-icon {
    right: calc(50% - 645px); /* 画面幅が1366pxの場合、中央から左に683pxの位置に配置 */;
  }
  .top-page {
    max-width: 1366px; /* 画面幅が1366pxを超えても最大幅は1366pxに制限 */
    margin: 0 auto; /* 左右の余白を中央に寄せる */
  }
  .top-page main {
   padding-top: 10px;
  }
  .top-page h2 {
    width: 50%;
    left:calc(50% - 510px);;
  }
  
  .top-page .infour {
    left: calc(50% - -140px);;
  }
  

  .caution {
    max-width: 1366px; /* 画面幅が1366pxを超えても最大幅は1366pxに制限 */
    margin: 0 auto; /* 左右の余白を中央に寄せる */
  }

  .caution main {
    padding-top: 10px;
  }
  .color-test {
    width: 500px;
  }

  .product{
    max-width: 1366px; /* 画面幅が1366pxを超えても最大幅は1366pxに制限 */
    margin: 0 auto; /* 左右の余白を中央に寄せる */
  }
  .product main {
    padding-top: 10px;
  }
  .shinzen-section {
    margin: 10px auto 0;
  }

  .question {
    max-width: 1366px; /* 画面幅が1366pxを超えても最大幅は1366pxに制限 */
    margin: 0 auto; /* 左右の余白を中央に寄せる */
  }
  .question main{
    padding-top: 10px;
  }
  .contact {
    max-width: 1366px; /* 画面幅が1366pxを超えても最大幅は1366pxに制限 */
    margin: 0 auto; /* 左右の余白を中央に寄せる */
  }


  .other-pages p {
    width: unset;
  }

  .instagram-icon {
    position: absolute;
    left: 14.5%;
    bottom: 15%;
  }
  .twitter-icon {
    position: absolute;
    left: 20%;
    bottom: 16%;
  }
  .pinterest-icon {
    position: absolute;
    left: 25%;
    bottom: 14%;
  }
  .base-icon {
    position: absolute;
    left: 30%;
    bottom: 9%;
  }
  .copyrights {  
    text-align: center;
    font-size: 0.8rem;
    background-color: #555;
    color:#fff;
    position: absolute;
    bottom: 0;
    width: 100%;
    padding: 0.1% 0;
  }
  
  .arrow-wrapper {
    right: calc(50% - 672px);
  }
}