/* 各共通のスタイル */

body {
  background: rgb(255, 255, 255);
  font-size: 12px;
  font-family: "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Meiryo, メイリオ, Osaka, "MS PGothic", arial,
    helvetica, sans-serif;
  margin: 0;
  color: #000000;
}

header,
section,
footer {
  width: 100%;
  padding: 0;
  margin: 0;
}

.container {
  width: 96%;
  padding: 0;
  margin: 0 auto;
}

i {
  margin: 0 8px 0 0;
  font-size: 11px;
}

ul {
  padding: 0px;
  margin: 0 0 5px;
}

li {
  list-style: none;
}

p,
h1,
h2,
h3,
h4 {
  padding: 0;
  margin: 0;
}

/* p,li{
  font-size: 11px;
} */

/* .fa-tshirt {
  font-size: 14px;
} */

/* ヘッダー */

.for-header {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

.top-icon {
  /* width: 160px; */
  height: 60px;
  /* background-color: orange; */
}

.top-icon img {
  height: 100%;
  /* padding-left: 10px; */
}

.mini-info-box {
  display: none;
}

.tel {
  margin-left: auto;
  width: 150px;
}

.tel ul {
  margin: 5px 0;
}

.tel li {
  height: 13px;
  font-size: 6px;
  text-align: end;
}

.email-icon-header {
  height: 40px;
  margin: 10px 0 10px 4px;
  border-radius: 6px;
}

/* メニューバー_ドロップダウン */

/* ドロップダウンシステム */

#menu_bar {
  display: none;
}

/* メインエリア */

.top-body {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  /* flex-wrap: wrap; */
}

/* サイドメニュー */

.side-menus {
  display: none;
}

.midium-size-index-menubar {
  display: none;
}

/* メインメニュー */
/* メインインフォ */

#main_info {
  width: 100%;
}

/* スライダー */
.slider-wrapper {
  width: 310px;
  margin: 0 auto;
  /* background-color: teal; */
}

.slider {
  margin: 0 auto 30px;
  width: 100%;
}
.slider img {
  height: auto;
  width: 100%;
}

/* トピックス */
.topics-wrapper {
  margin: 0 auto 15px;
  width: 100%;
}

.top-topic {
  background-color: rgb(255, 255, 255);
  margin-bottom: 5px;
}

.top-topic h1 {
  font-size: 12px;
  padding: 0 0 0 5px;
  margin: 0;
  color: rgb(87, 87, 87);
}

.top-topic p {
  font-size: 11px;
  padding: 0 0 5px 5px;
  margin: 0;
  color: rgb(104, 104, 104);
}

.corona {
  background-color: lightcyan;
  margin: 14px 0 12px;
}

.corona p {
  font-size: 13px;
}

.second-topic {
  background-color: rgb(152, 214, 255);
  margin-bottom: 5px;
}

.second-topic h1 {
  font-size: 12px;
  padding: 5px 0 0 15px;
  margin: 0;
  color: rgb(0, 42, 255);
  opacity: 0.7;
}

.second-topic h3 {
  font-size: 11px;
  padding: 0 0 0 25px;
  margin: 0;
  color: rgb(0, 42, 255);
  opacity: 0.7;
}

.second-topic p {
  font-size: 11px;
  padding: 0 0 0 25px;
  margin: 0;
  color: rgb(0, 42, 255);
  opacity: 0.7;
}

.topics {
  color: rgb(60, 60, 60);
  font-weight: bold;
  margin: 35px auto 15px;
  border-top: double 3px orange;
  border-bottom: double 3px orange;
}

.topics h2 {
  color: rgb(0, 0, 0);
  font-size: 12px;
  font-weight: normal;
  margin: 8px 0 5px 0;
}

.topics ul {
  margin-left: 11px;
}

.modifed-day {
  margin-left: 20px;
  font-weight: normal;
}

.ms-info-midium-screen {
  margin-bottom: 20px;
}

.ms-info-big-screen {
  display: none;
}

.ms-info {
  border-bottom: double 3px #482b00;
  /* opacity: 0.8;
  padding-top: 10px; */
}

.ms-info h1 {
  background-color: #482b00;
  color: white;
  border-radius: 16px;
  text-align: center;
  font-size: 18px;
  margin-bottom: 12px;
}

.ms-info2 {
  text-align: center;
  margin-bottom: 16px;
}

.ms-info2 img {
  width: 280px;
}

.ms-info2 h2 {
  color: #482b00;
}

.ms-info2-img-middle {
  display: none;
}

/* カレンダー */
.main-right {
  display: none;
}

.main-right-big-screen {
  display: none;
}

/* セカンドエリア共通 */
.second-container {
  width: 100%;
  padding: 18px 0 10px;
}

.title-item {
  width: 95%;
  border-left: solid 5px #ff9900;
  border-bottom: solid 1px #ff9900;
  margin-bottom: 8px;
}

.second-container h1 {
  font-size: 20px;
  color: black;
  padding-left: 8px;
}

.second-container h2 {
  font-size: 16px;
  color: #333333;
}

.item-lists-container {
  width: 100%;
}

/* アイテム紹介エリア */

.item-info {
  display: none;
  margin-bottom: 20px;
}

.item-info-small {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-bottom: 30px;
}

.item-image {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  margin-left: 8px;
}

.item-picture {
  border-radius: 8px;
  border: solid 2px #ff9900;
  width: 75px;
  height: 75px;
  margin: 5px 4px;
}

.item-image-info {
  margin: 4px 2px;
}

.item-image-info li {
  margin: 0 0 0 18px;
}

.item-image-info p {
  font-size: 11px;
  margin: 0 0 0 20px;
}

.item-image-info a {
  color: rgb(21, 91, 221);
  font-weight: bold;
  font-size: 16px;
}

.item-image-info,
.fas,
.far {
  font-size: 16px;
}

.item-image-info .fa-running,
.fa-pied-piper-hat {
  font-size: 16px;
}

.item-link :hover {
  color: orange;
  opacity: 0.9;
  -webkit-filter: drop-shadow(4px 4px 2px #b1b1b1);
  -moz-filter: drop-shadow(4px 4px 2px #c4c4c4);
  -ms-filter: drop-shadow(4px 4px 2px #c4c4c4);
  filter: drop-shadow(4px 4px 2px #b1b1b1);
}

/* 見積もりエリア */

.estimate-item {
  margin-top: 10px;
  margin-bottom: 15px;
}

.estimate-item h3 {
  color: rgba(255, 0, 0, 0.7);
}

.cost-image {
  width: 300px;
  margin: 8px 0;
}

.cost-image img {
  width: 100%;
  border-radius: 10px;
  border: solid 2px rgba(255, 180, 180, 0.7);
}

/* オーダー */

.order-flow-image {
  margin: 8px 12px;
}

.order-flow-image img {
  width: 100%;
  border-radius: 10px;
}

.more {
  display: block;
  text-align: right;
}

/* instagram */
.insta-container {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}

/* アクセス */

#access {
  width: 100%;
  margin-bottom: 20px;
  /* display: flex; */
}

.access-left {
  display: none;
}

.access-main {
  margin-left: 8px;
}

.iframe-wrapper {
  width: 100%;
  height: 0;
  padding-bottom: 50%;
  position: relative;
}

iframe {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.shop-picture {
  width: 300px;
}

/* カレンダー　スマホ画面 */
.calender-small {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.month {
  margin: 5px;
}

/* リンク */

#links {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-pack: distribute;
  justify-content: space-around;
  border-top: double 3px orange;
  border-bottom: double 3px orange;
  padding: 10px 0;
  /* margin: 20px 0; */
}

#links p {
  font-weight: bold;
}

#links li {
  margin-left: 6px;
}

/* フッター */

footer .container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  height: 80px;
  background-color: lightgray;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
}

/* 各詳細ページ */
/* アイテムページ共通 */

#contents_detail {
  padding: 0 30px;
  width: 100%;
}

#contents_detail h1 {
  font-size: 24px;
}

#contents_detail h2 {
  font-size: 20px;
}

.content-title {
  width: 480px;
  border-left: solid 5px #ff9900;
  border-bottom: solid 1px #ff9900;
  margin-bottom: 8px;
}

.infomation {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}

/* how_to_orderページ */
/* 注文手順 */
#how_to_order {
  margin: 10px 0 20px 10px;
}

#how_to_order ul {
  margin: 10px 0 10px;
}

.order-image {
  width: 100%;
}

.order-image img {
  width: 100%;
}

.order-message {
  display: inline-block;
  background-color: aliceblue;
}

.title-item-4 {
  border-left: solid 5px #009b46;
  display: inline-block;
  border-bottom: solid 1px #009b46;
  margin: 0 0 8px;
  margin-bottom: 10px;
}

.flex-wrapper {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 30px;
}

.email-icon-order-page {
  width: 100px;
  border-radius: 10px;
}

/* ryokinページ */
.explain {
  margin-bottom: 30px;
}

.print-info-container {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-wrap: wrap;
  margin: 8px 0 35px;
  /* justify-content: space-around; */
}

.print-info-left {
  width: 300px;
  margin-left: 12px;
}

.print-info-right {
  width: 300px;
  margin: 8px auto 0;
}

.print-info-right img {
  width: 300px;
  background-color: aqua;
}

.fig-price {
  margin: 4px 0 8px 12px;
}

.print-explain {
  margin: 4px 0 0 12px;
}

.print-item {
  width: 260px;
  border-left: solid 5px #009b46;
  border-bottom: solid 1px #009b46;
  margin: 0 0 0 8px;
}

.print-fig {
  width: 260px;
  border-left: solid 5px #9b9b00;
  border-bottom: solid 1px #9b9b00;
  margin: 0 0 12px 8px;
}

.print-list {
  margin: 0 auto 30px;
}

.print-cost-info tr,
th,
td {
  border-collapse: collapse;
}

.print-cost-info th {
  background-color: #ffda9a;
}

.print-cost-info td {
  background-color: #dbfeff;
}

/* faq よくある質問 */

.faq-container {
  width: 98%;
  margin: 0 auto;
  font-size: 11px;
}

.faq-title {
  display: inline-block;
  border-left: solid 5px #009b46;
  border-bottom: solid 1px #009b46;
  padding-right: 20px;
  margin: 20px 0 10px 16px;
}

.message-area {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 310px;
}

.message-baloon {
  width: 280px;
  border-radius: 12px;
  text-align: center;
  display: table;
}

.talking {
  display: table-cell;
  vertical-align: middle;
}

.talking h4 {
  font-size: 14px;
  font-weight: bold;
}

.cat2 h4 {
  margin-bottom: 10px;
}

.cat {
  width: 60px;
}

.cat2 {
  padding: 20px 0;
}

.right-baloon {
  height: 80px;
  background-color: rgb(222, 242, 255);
}
.left-baloon {
  background-color: rgb(255, 246, 222);
}

.question {
  margin-left: auto;
  margin-bottom: 15px;
  -webkit-filter: drop-shadow(5px 5px 2px #c4c4c4);
  -moz-filter: drop-shadow(5px 5px 2px #c4c4c4);
  -ms-filter: drop-shadow(5px 5px 2px #c4c4c4);
  filter: drop-shadow(5px 5px 2px #c4c4c4);
}
.answer {
  margin: 0 0 30px;
  -webkit-filter: drop-shadow(5px 5px 2px #c4c4c4);
  -moz-filter: drop-shadow(5px 5px 2px #c4c4c4);
  -ms-filter: drop-shadow(5px 5px 2px #c4c4c4);
  filter: drop-shadow(5px 5px 2px #c4c4c4);
}

.email-link-faq {
  display: block;
}

/* 納期*/
.title-term {
  margin: 30px 0 0 5px;
}

.title-term-info {
  margin: 5px 0 0 25px;
}

.term-info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.term-for-item {
  width: 360px;
  margin: 10px;
  border-radius: 8px;
  background-color: #ffe5be;
}

/* アイテム紹介ページ
共通 */

.title-item-2 {
  width: 100%;
  margin-bottom: 20px;
}

.title-item-2 img {
  width: 100%;
}

.title-item-3 {
  width: 280px;
  border-left: solid 5px #009b46;
  border-bottom: solid 1px #009b46;
  margin: 0 0 8px;
  margin-bottom: 10px;
}

.item-use0 {
  width: 300px;
  margin: 15px 10px 20px;
  background-color: aliceblue;
  position: relative;
  border-radius: 8px;
}

.item-use-blank-small {
  width: 280px;
  height: 120px;
  margin: 5px 0 20px 40px;
  position: relative;
  border-radius: 8px;
}

.item-use {
  border-radius: 8px;
  position: absolute;
  top: -15px;
  left: -30px;
  -webkit-transform: rotate(-10deg);
  transform: rotate(-10deg);
  font-family: oswald, "noto", Verdana, Geneva, sans-serif;
  display: inline-block;
  color: rgb(234, 0, 164);
  font-weight: bold;
  margin: 5px 20px;
  background-color: rgba(255, 255, 255, 0.8);
}

.item-use1 {
  position: absolute;
  top: -15px;
  left: -30px;
  -webkit-transform: rotate(-10deg);
  transform: rotate(-10deg);
  font-family: oswald, "noto", Verdana, Geneva, sans-serif;
  display: inline-block;
  font-weight: bold;
  margin: 5px 20px;
}

.item-use p {
  font-size: 23px;
}

.message {
  font-size: 21px;
  color: rgb(234, 133, 0);
}

.item-detail-image {
  width: 250px;
  height: 250px;
  text-align: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  background-color: rgb(255, 255, 255);
  margin: 15px auto 15px;
}

.item-detail-image img {
  width: 250px;
}

.item-detail-image0 {
  width: 200px;
  background-color: rgb(255, 255, 255);
  margin: 15px 20px 15px;
}

.tips_of_choice {
  margin: 5px 10px 15px;
}

.tips-sign {
  display: inline-block;
  background-color: #6c6c6c;
  border-radius: 4px;
}

.tips-sign-feat {
  height: 90px;
}

.tips-sign h4 {
  display: inline-block;
  color: white;
  font-size: 12px;
  font-weight: bold;
  margin: 1px 11px;
}

.seel-and-sheet {
  text-align: center;
}

.item-catalog {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  display: none;
  -ms-flex-pack: distribute;
  justify-content: space-around;
}

.item-detail {
  width: 100%;
}

.company-name {
  width: 200px;
  /* border-left: solid 5px #6c6c6c; */
  border-bottom: solid 1px #6c6c6c;
  margin: 0 0 8px;
  margin-bottom: 8px;
}

.company-name p {
  font-family: oswald, "noto", Verdana, Geneva, sans-serif;
  margin: 3px 0px;
  font-size: 18px;
  font-weight: bold;
}

.company-image {
  /* width: 280px; */
  height: 80px;
  /* justify-content: center; */
  margin: 10px 0;
}

.company-image img {
  height: 70px;
}

.catalog-choice {
  margin: 5px 35px 15px 0;
}

.catalog-choice li {
  margin: 2px 0 0 10px;
  font-weight: bold;
}

.catalog-detail-link-small {
  margin: 5px 5px 15px;
}

.catalog-link {
  margin: 5px 5px 15px;
}

.catalog-link li {
  margin: 5px 0 5px 10px;
}

.catalog-link h3 {
  margin: 15px 0 0 5px;
  font-size: 11px;
}

/* タブ設定 */

.cp_tab label {
  color: #0014ef;
}

.cp_tab *,
.cp_tab *:before,
.cp_tab *:after {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.cp_tab {
  margin: 10px 0;
}
.cp_tab > input[type="radio"] {
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 0;
  outline: none;
  background: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  display: none;
}
.cp_tab .cp_tabpanel {
  display: none;
}
.cp_tab > input:first-child:checked ~ .cp_tabpanels > .cp_tabpanel:first-child,
.cp_tab > input:nth-child(3):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(2),
.cp_tab > input:nth-child(5):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(3),
.cp_tab > input:nth-child(7):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(4),
.cp_tab > input:nth-child(9):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(5),
.cp_tab > input:nth-child(11):checked ~ .cp_tabpanels > .cp_tabpanel:nth-child(6) {
  display: block;
}
.cp_tab > label {
  position: relative;
  display: inline-block;
  padding: 6px;
  cursor: pointer;
  border: 1px solid transparent;
  border-bottom: 0;
  font-weight: bold;
}
.cp_tab > label:hover,
.cp_tab > input:focus + label {
  color: #0066cc;
}
.cp_tab > input:checked + label {
  margin-bottom: -1px;
  border-color: #cccccc;
  border-bottom: 1px solid #ffffff; /*背景色と同じ*/
  border-radius: 6px 6px 0 0;
}
.cp_tab .cp_tabpanel {
  padding: 0.5em 1em;
  border-top: 1px solid #cccccc;
}

.use-example-small {
  font-size: 11px;
}

/* デザイン（色見本） */

.color-sample {
  margin: 0 auto;
  width: 80%;
}

.color-sample img {
  width: 100%;
}

.color-sample-message {
  width: 80%;
  margin: 8px auto;
  font-size: 12px;
  text-align: center;
  padding: 10px;
  border-radius: 10px;
  background-color: aliceblue;
}

/* ブレイクポイント */
/* ミディアム560px以上 */

@media screen and (min-width: 560px) {
  body {
    font-size: 14px;
  }

  .top-icon {
    height: 70px;
  }
  .mini-info-box {
    display: block;
    margin: 13px auto 0;
    font-size: 8px;
  }

  /* スライダー */
  .slider-wrapper {
    width: 550px;
  }

  /* topics */
  .topics {
    margin: 35px auto 25px;
  }

  .topics li {
    font-size: 16px;
  }

  .top-topic h1 {
    font-size: 16px;
  }

  .modifed-day {
    font-size: 12px;
  }

  /* エムズの特徴 */

  .ms-info h1 {
    border-radius: 16px;
    font-size: 22px;
    margin-bottom: 25px;
  }

  .ms-info2-img-small {
    display: none;
  }

  .ms-info2-img-middle {
    display: block;
  }

  .ms-info2 {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: distribute;
    justify-content: space-around;
  }

  .ms-info2-img,
  .ms-info2-img-middle {
    width: 45%;
    -webkit-filter: drop-shadow(5px 5px 2px #c4c4c4);
    -moz-filter: drop-shadow(5px 5px 2px #c4c4c4);
    -ms-filter: drop-shadow(5px 5px 2px #c4c4c4);
    filter: drop-shadow(5px 5px 2px #c4c4c4);
    -webkit-filter: drop-shadow();
    filter: drop-shadow();
  }

  .ms-info2 img {
    width: 100%;
  }

  .ms-info2-comment {
    display: block;
    width: 55%;
    margin: auto;
    background-color: rgb(255, 238, 205);
    /* border-radius: 12px;
    -webkit-filter: drop-shadow(5px 5px 2px #c4c4c4);
    -moz-filter: drop-shadow(5px 5px 2px #c4c4c4);
    -ms-filter: drop-shadow(5px 5px 2px #c4c4c4);
          filter: drop-shadow(5px 5px 2px #c4c4c4);filter: drop-shadow() */
  }

  .ms-info2-comment h2 {
    font-size: 16px;
    margin-bottom: 10px;
  }

  .ms-info2-comment p {
    font-size: 14px;
  }

  /* サイドメニューバー */
  .flex-wrapper-midium {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: distribute;
    justify-content: space-around;
  }

  .midium-size-index-menubar {
    display: block;
    width: 30%;
  }

  .midium-size-index-right {
    width: 65%;
  }

  .side-menu-container {
    width: 95%;
    /* width: 90%; */
  }

  .title-item {
    width: 80%;
  }

  .side-menu {
    width: 100%;
    margin-bottom: 20px;
    /* background-color: chartreuse; */
  }

  .side-menu img {
    width: 100%;
    border: solid 2px lightgray;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }

  .items li {
    font-size: 14px;
    font-weight: bold;
    border-right: solid 2px lightgray;
    border-left: solid 2px lightgray;
    border-bottom: solid 2px lightgray;
    background-color: aliceblue;
  }

  .group-name {
    font-size: 14px;
    font-weight: bold;
    border-radius: 10px 10px 0 0;
    padding: 5px 0 5px 20px;
    background: -webkit-gradient(
      linear,
      left top,
      left bottom,
      color-stop(1%, rgb(255, 199, 120)),
      color-stop(99%, rgb(248, 145, 116))
    );
    background: linear-gradient(to bottom, rgb(255, 199, 120) 1%, rgb(248, 145, 116) 99%);
  }

  .items a {
    padding: 5px 0 5px 8px;
    display: block;
    text-decoration: none;
    color: #333333;
  }

  .items a:hover {
    /* opacity: 0.7; */
    background-color: rgba(255, 226, 131, 0.7);
    color: #333333;
  }

  .faq {
    margin-top: 30px;
  }

  .petit-info {
    background-color: lightsalmon;
    padding: 8px 0;
    display: block;
    font-size: 14px;
    text-align: center;
    border: dotted 3px rgb(155, 148, 125);
    margin-top: 45px;
    margin-bottom: 12px;
  }

  .email-link {
    width: 300px;
    margin: 10px 0 0;
  }

  .email-icon-index-page {
    width: 100%;
  }

  /* アイテム説明ページ */
  /* 共通 */

  /* タブ設定 */
  .cp_tab > label {
    font-size: 18px;
  }

  /* カタログ（メーカー特徴） */
  .flex-wrapper-catalog {
    /* display: flex; */
  }

  /* デジタルカタログ */
  .digital-catalog {
    display: flex;
    flex-wrap: wrap;
  }

  .digital-catalog ul {
    margin-right: 30px;
  }

  .digital-catalog h3 {
    font-size: 20px;
  }

  .item-detail h4 {
    font-size: 18px;
  }

  /* HOW TO ORDER */

  .order-image {
    width: 42%;
    margin-left: 15px;
  }
  .order-explain {
    width: 52%;
    margin-left: 15px;
  }

  /* faq よくある質問*/
  .faq-container {
    width: 95%;
    font-size: 14px;
  }

  .faq-title {
    margin: 20px auto 10px 16px;
  }

  .message-area {
    width: 530px;
  }

  .message-baloon {
    width: 380px;
  }

  .talking h4 {
    font-size: 16px;
  }

  .cat2 h4 {
    /* margin-bottom: 10px; */
  }

  .cat {
    width: 80px;
  }

  .cat2 {
    /* padding: 20px 0; */
  }

  /* デザイン（色見本） */
  .color-sample-message {
    font-size: 16px;
  }
}

/* ブレイクポイント */
/* 960以上 */

@media screen and (min-width: 960px) {
  .container {
    margin: 0 auto;
    width: 960px;
    font-size: 14px;
  }

  .top-icon {
    height: 120px;
  }

  .mini-info-box {
    font-size: 12px;
    margin: auto 0 10px;
  }

  .tel {
    width: 250px;
    margin-top: auto;
  }

  .tel li {
    height: 16px;
    font-size: 14px;
  }

  .email-icon-header {
    height: 80px;
    margin: 33px 0 0 4px;
    border-radius: 8px;
  }

  /* メニューバー（TOP) */
  #menu_bar {
    display: block;
    width: 100%;
    padding: 5px 0 15px;
    font-weight: bold;
    /* background-color: cadetblue; */
  }

  .dropmenu {
    width: 100%;
    border-radius: 7px;
    background: -webkit-gradient(
      linear,
      left top,
      left bottom,
      color-stop(1%, rgb(255, 199, 120)),
      color-stop(99%, rgb(248, 145, 116))
    );
    background: linear-gradient(to bottom, rgb(255, 199, 120) 1%, rgb(248, 145, 116) 99%);
    margin: 5px auto 10px;
    padding: 0;
  }

  .dropmenu:before,
  .dropmenu:after {
    content: "";
    display: table;
  }

  .dropmenu:after {
    clear: both;
  }

  .dropmenu li {
    position: relative;
    width: 16.49%;
    float: left;
    margin: 0;
    padding: 0;
    text-align: center;
  }

  .dropmenu > li:not(:last-child) {
    border-right: solid 2px rgb(226, 171, 69);
  }

  .dropmenu li a {
    display: block;
    margin: 0;
    padding: 15px 0 11px;
    color: rgb(63, 32, 3);
    font-size: 16px;
    line-height: 1;
    text-decoration: none;
  }

  .dropmenu li ul {
    list-style: none;
    position: absolute;
    z-index: 10;
    top: 100%;
    left: 0;
    margin: 0;
    padding: 0;
  }

  .dropmenu li ul li {
    width: 100%;
    background: -webkit-gradient(
      linear,
      left top,
      left bottom,
      color-stop(1%, rgb(255, 199, 120)),
      color-stop(99%, rgb(248, 145, 116))
    );
    background: linear-gradient(to bottom, rgb(255, 199, 120) 1%, rgb(248, 145, 116) 99%);
  }
  .dropmenu li ul li a {
    padding: 13px 6px;
    border-top: 1px solid #ffda9a;
    text-align: left;
  }
  .dropmenu li:hover > a {
    opacity: 0.7;
    background-color: rgba(255, 255, 255, 0.7);
  }
  .dropmenu li a:hover {
    opacity: 0.7;
    background-color: rgba(255, 255, 255, 0.7);
  }

  #flip2 li ul {
    visibility: hidden;
    -webkit-perspective: 400px;
    perspective: 400px;
  }
  #flip2 li:hover ul {
    visibility: visible;
  }

  #flip2 ul li {
    -webkit-transform: rotateY(90deg);
    transform: rotateY(90deg);
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
    -webkit-transition: 0.3s;
    transition: 0.3s;
  }
  #flip2 li:hover li {
    -webkit-transform: rotateY(0);
    transform: rotateY(0);
  }
  #flip2 ul li:nth-child(2) {
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
  }
  #flip2 ul li:nth-child(3) {
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;
  }
  #flip2 ul li:nth-child(4) {
    -webkit-transition-delay: 0.3s;
    transition-delay: 0.3s;
  }
  #flip2 ul li:nth-child(5) {
    -webkit-transition-delay: 0.4s;
    transition-delay: 0.4s;
  }
  #flip2 ul li:nth-child(6) {
    -webkit-transition-delay: 0.5s;
    transition-delay: 0.5s;
  }
  #flip2 ul li:nth-child(7) {
    -webkit-transition-delay: 0.6s;
    transition-delay: 0.6s;
  }
  #flip2 ul li:nth-child(8) {
    -webkit-transition-delay: 0.7s;
    transition-delay: 0.7s;
  }
  #flip2 ul li:nth-child(9) {
    -webkit-transition-delay: 0.8s;
    transition-delay: 0.8s;
  }
  #flip2 ul li:nth-child(10) {
    -webkit-transition-delay: 0.9s;
    transition-delay: 0.9s;
  }
  #flip2 ul li:nth-child(11) {
    -webkit-transition-delay: 1s;
    transition-delay: 1s;
  }
  #flip2 ul li:nth-child(12) {
    -webkit-transition-delay: 1s;
    transition-delay: 1s;
  }

  /* エムズの特徴 */
  .ms-info2-comment h2 {
    font-size: 20px;
  }

  .ms-info2-comment p {
    font-size: 16px;
  }

  /* サイドメニューバー */
  .side-menus {
    display: block;
    width: 210px;
  }

  .group-name {
    font-size: 16px;
  }

  .fas,
  .far {
    font-size: 14px;
  }

  .items li {
    font-size: 16px;
  }

  /* カレンダー */
  .main-right {
    display: block;
    width: 200px;
    margin-right: 10px;
  }

  .main-right p {
    padding-top: 8px;
    display: block;
    text-align: right;
    font-size: 12px;
  }

  .main-right table {
    margin-bottom: 20px;
    font-size: 12px;
  }

  .calender {
    padding: 8px 0;
    display: block;
    text-align: center;
    border: dotted 3px rgb(155, 148, 125);
    margin-bottom: 12px;
  }

  .calender-small {
    display: none;
  }

  /* スライダー */
  .slider-wrapper {
    width: 740px;
  }

  /* topics */
  .topics li {
    font-size: 18px;
  }

  .top-topic h1 {
    font-size: 18px;
  }

  .midium-size-index-menubar {
    display: none;
  }

  .midium-size-index-right {
    width: 100%;
  }

  /* 取扱いアイテムエリア */

  .title-item {
    width: 70%;
  }

  .item-big-screen {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -ms-flex-pack: distribute;
  }

  .item-image {
    width: 360px;
    margin-left: 8px;
    margin-bottom: 10px;
  }

  .item-image-info li {
    margin: 0 0 0 10px;
  }

  .item-image-info p {
    font-size: 14px;
    margin: 0 0 0 10px;
  }

  .item-picture {
    width: 85px;
    height: 85px;
    border-radius: 10px;
    margin: 2px;
  }

  /* インスタリンク画像 */
  .order-flow-image img {
    width: 300px;
    border-radius: 10px;
  }

  #access {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  .access-left {
    display: block;
    width: 210px;
    margin-right: 10px;
    border-right: dotted 5px rgb(155, 148, 125);
  }

  .access-left h1 {
    font-size: 24px;
  }

  .iframe-wrapper {
    width: 740px;
    height: 0;
    padding-bottom: 50%;
    position: relative;
  }

  /* HOW TO ORDER */
  .order-image {
    width: 400px;
  }
  .order-explain {
    width: 510px;
  }

  /* faq よくある質問*/

  .faq-container-middle {
    margin-right: auto;
  }

  .faq-container {
    width: 720px;
    font-size: 14px;
    margin: 0 30px;
  }

  .message-baloon h4 {
    font-size: 18px;
  }

  /* デザイン（色見本） */
  .color-sample-wrapper {
    display: flex;
    flex-wrap: wrap;
  }

  .color-sample {
    width: 460px;
    margin: 20px 10px;
  }

  .position-modify1 {
    margin-top: 24px;
  }

  .position-modify2 {
    margin-top: 38px;
  }

  /* instagram */
  .insta-container {
    flex-wrap: nowrap;
  }
}

/* ブレイクポイント */
/* 1180px以上 */

@media screen and (min-width: 1180px) {
  .container {
    margin: 0 auto;
    width: 1180px;
    font-size: 16px;
  }

  .top-icon {
    height: 120px;
  }

  .mini-info-box {
    font-size: 12px;
    margin: auto 0 10px;
  }

  .tel {
    font-size: 14px;
    width: 250px;
    margin-top: auto;
  }

  /* 左サイドメニュー */
  .side-menus {
    width: 240px;
    margin-right: 8px;
  }

  .ms-info-midium-screen {
    display: none;
  }

  .ms-info-big-screen {
    display: block;
  }

  #main_info {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
  }

  /* スライダー */
  .slider-wrapper {
    width: 758px;
  }

  /* カレンダー */
  .main-right-big-screen {
    display: block;
    margin-left: auto;
  }

  .main-right-big-screen h1 {
    font-size: 16px;
  }

  .main-right-big-screen p {
    padding-top: 8px;
    display: block;
    text-align: right;
    font-size: 14px;
  }

  .main-right-big-screen table {
    margin-bottom: 20px;
    font-size: 13px;
  }

  .main-right {
    display: none;
  }

  /* アイテム紹介エリア */
  .item-big-screen {
    -webkit-box-pack: left;
    -ms-flex-pack: left;
    justify-content: left;
  }

  .item-picture {
    width: 95px;
    height: 95px;
    border-radius: 10px;
    margin: 5px;
  }
}