@charset "UTF-8";

/* --------------------------------------------------
TABLET AND MOBILE SCREENS
--------------------------------------------------*/
/*===============================================================
991px
===============================================================*/
@media (max-width: 991px) {
  .tw-new-line-large {
    display: none;
  }

  #tw-function .wood-item {
    padding: 80px 0px 80px 20px;
  }

  #tw-function-intro .vr-title {
    padding: 71px 0px 0px 20px;
  }

  #tw-function .function-list {
    width: auto;
    height: auto;
  }

  #tw-function .function-list .item-row > img {
    width: auto;
    height: 252px;
  }
}

/*===============================================================
768px
===============================================================*/
@media (max-width: 768px) {
  #tw-function .wood-item {
    padding: 80px 0px 80px 0px;
  }

  #tw-function .function-list .item-row > img {
    height: 190px;
  }
  #tw-function .content {
    font-size: 15px;
  }

  #tw-function .list {
    width: 100%;
    display: flex;
    flex-wrap: nowrap;
    margin-top: -1px;
    height: 1500px;
    flex-direction: column;
  }

  #tw-function .list .item {
    align-items: flex-start;
    padding: 0px 0px 20px 15px;
    justify-content: flex-start;
    flex-wrap: nowrap;
  }

  #tw-function .monotone,
  #tw-function .wood,
  #tw-function .color {
    background-size: calc(42.3vh) auto;
    background-position: bottom -35px right 0px;
  }

  #tw-function .function-wood-icon {
    transform: rotate(90deg);
    padding-top: 80px;
    margin-left: -5px;
  }

  #tw-function .function-color-icon {
    transform: rotate(90deg);
    padding-top: 170px;
    margin-left: -5px;
  }

  #tw-function .function-detail-icon {
    display: block;
  }

  #tw-function .empty-flex-item {
    display: block;
    flex-grow: 1;
  }
}
/*===============================================================
576px
===============================================================*/
@media (max-width: 576px) {
  #tw-function .function-list .item-row > img {
    height: 160px;
  }
}

/*===============================================================
500px
===============================================================*/
@media (max-width: 500px) {
}
/*===============================================================
450px
===============================================================*/
@media (max-width: 450px) {
  /* #tw-function {
        margin-top: 20px;
    } */

  #tw-function h4.title {
    font-size: 29px;
  }
  #tw-function .function-list .item-row {
    display: flex;
    flex-wrap: nowrap;
    justify-content: flex-start;
    align-items: center;
  }

  #tw-function .function-list .item-row {
    overflow: auto;
    max-width: 100vw;
  }
  #tw-function .function-list .item-row > img {
    height: 75vw;
  }
  #tw-function .function-list .item-row:first-child {
    padding-left: 12vw;
  }

  #tw-function .bg {
    width: 150vw;
  }

  #tw-function .wood-1-panel {
    width: 100%;
  }
  #tw-function .wood-2-panel {
    width: 100%;
  }
  #tw-function .wood-1 {
    width: 60vw;
  }
  #tw-function .wood-2 {
    width: 60vw;
  }
  #tw-function .color-item {
    width: 100%;
  }
  #tw-function .close-x-icon {
    right: 20px;
  }
  #tw-function .wood-design {
    flex-direction: column;
  }

  #tw-function .color-design {
    flex-direction: column;
  }

  #tw-function .color-img {
    width: 70vw;
  }

  #tw-function .monotone,
  #tw-function .wood,
  #tw-function .color {
    background-size: 277px auto;
  }

  #tw-function .content-function {
    font-size: 14px;
    text-align: center;
    margin: auto;
  }

  #tw-function .wood-1 {
    width: 70vw;
    content: url(../../images/telebooth-wire/20231115_TELEBOOTH-LIGHTWOOD2P_TEST.png);
  }

  #tw-function .wood-2 {
    width: 70vw;
    content: url(../../images/telebooth-wire/20231115_TELEBOOTH-DARKWOOD2P_TEST.png);
  }

  #tw-function .color-1 {
    content: url(../../images/telebooth-wire/20231115_TELEBOOTH-BLUE2P_TEST.png);
  }

  #tw-function .color-2 {
    content: url(../../images/telebooth-wire/20231115_TELEBOOTH-GREEN2P_TEST.png);
  }

  #tw-function .color-3 {
    content: url(../../images/telebooth-wire/20231115_TELEBOOTH-IVORY2P_TEST.png);
  }

  #tw-function .function-monotone-icon {
    height: 36px;
  }
  #tw-function .function-detail-icon {
    height: 36px;
  }

  #tw-function .function-wood-icon {
    height: 121px;
    margin-left: 3px;
  }

  #tw-function .function-color-icon {
    width: 180px;
    margin-left: 14px;
  }
  #tw-function .monotone title-en,
  #tw-function .wood title-en,
  #tw-function .color title-en {
    font-size: 40px;
  }

  #tw-function .list .item {
    max-height: 375px;
  }

  #tw-function .content {
    margin: 10px 0px;
  }

  #tw-function .content title-katakana,
  #tw-function .modal-title title-katakana {
    text-align: left;
  }

  #tw-function .list {
    height: 1125px;
  }

  #tw-function .monotone,
  #tw-function .wood,
  #tw-function .color {
    background-position: bottom -35px right -25px;
  }
}
/*===============================================================
376px
===============================================================*/
@media (max-width: 376px) {
}