@media screen and (min-width: 1109px) and (max-width: 1260px) {
  .header .telBox {
    display: block;
    top: 1rem
  }
  .header .telBox p img {
    margin: 0 auto
  }
  .header .telBox .tel {
    padding: 0 0 0.5rem
  }
}
@media screen and (min-width: 1110px) {
  .pcNone {
    display: none !important
  }
  html {
    width: 100%;
    height: 100%;
    font-size: 16px
  }
  body {
    width: 100%;
    height: 100%;
    font-size: 1rem
  }
  img {
    display: block;
    height: auto
  }
  .header .menu, .header .sp-tel {
    display: none
  }
  .header .nav {
    display: flex;
    justify-content: space-between;
    width: 740px;
    position: absolute;
    right: 4.75rem;
    top: 6.5rem
  }
  .col2 .contents {
    display: flex;
    justify-content: space-between;
    margin-top: 2.25em
  }
  .col2 .contents .left {
    width: 787px
  }
  .col2 .contents .sideBox {
    width: 248px;
    position: relative;
    z-index: 2
  }
  .col2 .contents .sideBox .writer {
    margin: -236px 0 0
  }
  .col2 .contents .sideBox .categoryList {
    margin: 1em 0 0;
    padding: 0;
    border-bottom: none
  }
  .col2 .contents .sideBox .categoryList ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
  }
  .col2 .contents .sideBox .categoryList li {
    width: calc((100% - 1em) / 2);
    margin: 1em 0 0
  }
  .col2 .contents .sideBox .topicsList {
    display: block
  }
  .col2 .contents .sideBox .topicsList li {
    width: 100%;
    margin: 2.5em 0 0
  }
  .col2 .contents .sideBox .topicsList li:first-child {
    margin-top: 1.5rem
  }
  .topicsList::before {
    content: "";
    display: block;
    width: calc((100% - 7.5em) / 4);
    order: 1
  }
  .topicsList::after {
    content: "";
    display: block;
    width: calc((100% - 7.5em) / 4)
  }
  .productsList::after {
    content: "";
    display: block;
    width: calc((100% - 5em) / 3)
  }
  #index #index01 .img {
    width: calc((640/ 1280) * 100vw);
    height: calc((400 / 1280) * 100vw)
  }
  #index #index01 .box {
    width: calc(100% - 4.75em);
    display: flex;
    justify-content: space-between
  }
  #index #index01 .box .txtBox {
    width: calc((510/ 1280) * 100vw)
  }
  #index #index01 .box2 {
    width: 860px;
    margin-left: auto
  }
  #index #index02 .box {
    width: calc((620/ 1280) * 100vw)
  }
  #index #index02 .img {
    width: calc((640/ 1280) * 100vw);
    height: calc((400 / 1280) * 100vw);
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    z-index: 2
  }
  #index #index03 .body {
    display: flex;
    justify-content: space-between
  }
  #index #index03 .body .left {
    width: 450px
  }
  #index #index03 .body .right {
    width: calc(100% - 450px - 2.75em)
  }
  #index #index03 .body .right h2:last-of-type {
    margin-top: 2.75rem
  }
  #index #about .body {
    display: flex;
    justify-content: space-between
  }
  #index #about .body .left {
    order: 1;
    width: calc(100% - 454px - 2.75em)
  }
  #index #about .body .right {
    order: 2;
    width: 454px
  }
  #products .message p {
    width: 666px;
    text-align: center
  }
  #blog .header .breadcrumb {
    margin-top: 5rem
  }
  #blog .contents {
    margin-top: 5.75rem
  }
  #blog .contents .left {
    border-top: 6px solid #DE734D
  }
  #blog .contents .left .topicsList::after {
    width: calc((100% - 2.75em) / 3)
  }
  #blog .contents .left .topicsList li {
    width: calc((100% - 2.75em) / 3)
  }
}