/* === トップ === */

#luffroom .top-wrap {
  margin: 0 auto 4rem;
}
#luffroom .top-exp {
  position: relative;
  padding: 10px;
}
#luffroom .top-logo {
  position: static;
  width: 50%;
  margin: -12px -1px 6px 13px;
}
#luffroom .top-txt {
  margin: 2rem auto;
}

#luffroom .top-img01 {
  margin: 0 auto 2px;
}

/* === トップここまで === */

/* === インフォメーション === */

#luffroom .luffroom_ttl {
  text-align: center;
  margin: 3.5rem 0 2rem;
}
#luffroom .luffroom_ttl img {
  width: 18rem;
}

#luffroom .luffroom_ttl span.ttl_s {
  display: block;
  font-weight: bold;
}
#luffroom .luffroom_exp {
  font-size: 1.35rem;
}
#luffroom .sp_br {
  display: block;
}
#luffroom .pc_br {
  display: none;
}

#luffroom .item-desc__inner-sec {
  margin-bottom: 5rem;
}
.luffroom_bg {
  margin-bottom: 3rem;
  position: relative;
}
#luffroom .padding_rl {
  padding: 0 1.5rem;
  margin: 5rem auto;
}
#luffroom .luffroom-info {
  position: relative;
  z-index: -1;
}
#luffroom .luffroom-info::before {
  top: -12rem;
  background-image: url("https://www.fromfloor.com/images/floor/carpet/luffroom/bg_sp01.png");
}
#luffroom .luffroom-info::after {
  bottom: -10.5rem;
  background-image: url("https://www.fromfloor.com/images/floor/carpet/luffroom/bg_sp02.png");
}
.luffroom-info::before,
.luffroom-info::after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 80%;
  z-index: -1;
  background-size: cover;
  background-repeat: no-repeat;
}
#luffroom .marker {
  background: linear-gradient(#ffeccc, #ffeccc) no-repeat;
  background-size: 100% 0.4em; /* 下線の太さ */
  background-position: 0 100%; /* 下に寄せる */
}

/* === インフォメーションここまで === */

/* === 4つのポイント === */

#luffroom .point-desc_txt {
  margin-bottom: 2rem;
}
#luffroom .pt-ttl-en {
  margin-bottom: -10px;
}
#luffroom .pt-ttl-en2 {
  margin-bottom: -2px;
}
#luffroom .pt-ttl-en,
#luffroom .pt-ttl-en2 img {
  width: 20rem;
  display: block;
  margin: 0 auto -5px;
}
#luffroom .point-desc_head {
  font-weight: 600;
  padding-bottom: 1rem;
  margin-bottom: 1.5rem;
  border-bottom: 2px dotted #c6c6c6;
  font-size: 1.5rem;
}
#luffroom .point-ttl {
  text-align: center;
  padding-bottom: 1.5rem;
  font-size: 1.5rem;
  font-weight: 600;
  margin: 0 0 1.5rem;
  letter-spacing: 1px;
}
#luffroom .point-ttl_span {
  font-size: 2rem;
  color: #9e7171;
  padding-left: 5px;
}
#luffroom .highlight {
  font-weight: bold;
  font-size: 3rem;
}
#luffroom .vertical-divider::before {
  content: "|";
  margin: 0 0.3em;
  color: #333333;
  vertical-align: top;
}
#luffroom .shaggy-spec {
  font-size: 1.4rem;
  font-weight: bold;
}
#luffroom .shaggy-spec-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1em;
  margin: 1rem 0 2rem;
}
#luffroom .shaggy-spec-text {
  font-size: 1.4rem;
  font-weight: bold;
}
#luffroom .center {
  text-align: center;
}
#luffroom .point-wrap {
  margin-bottom: 2rem;
}
#luffroom .line {
  flex: 0 0 40px;
  height: 1px;
  background: #000;
}
#luffroom .images_sizecut {
  width: 80%;
  margin: 4rem auto 2rem;
}
#luffroom .size_link {
  text-align: center;
  font-size: 1.5rem;
  border-bottom: 1px solid #446ab7;
  padding-bottom: 0.3rem;
  color: #446ab7;
  width: 76%;
  margin: 3rem auto;
}
#luffroom .pt-01 {
  font-size: 1.5rem;
  color: #3c3c3c;
  border: 1px solid #3c3c3c;
  padding: 5px;
  margin: 1rem 0 2rem;
  position: absolute;
  left: 10px;
  background: rgb(255 255 255 / 85%);
}
#luffroom .pt-01-wrap {
  position: relative;
  display: inline-block;
}
a[target="_blank"]::after {
  content: none !important;
}

/* === 4つのポイントここまで === */

/* === 各ページへのリンクアイコン === */

#luffroom .find-rug-bg {
  position: relative;
  padding-top: 10px;
  margin-bottom: 6rem;
}

#luffroom .find-rug-bg::before {
  content: "";
  position: absolute;
  top: -20px;
  left: 0;
  width: 100%;
  height: 113%;
  background-image: url(https://www.fromfloor.com/images/floor/carpet/luffroom/bg_sp03.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
}
#luffroom .heading-find-rug_text {
  text-align: center;
  font-size: 1.7rem;
}
#luffroom .find-rug-desc {
  margin-bottom: 5px;
}
#luffroom .find-rug-desc_item {
  font-size: 1.5rem;
  text-align: center;
}
#luffroom .find-rug-buttons {
  flex-direction: row;
  display: flex;
  width: 85%;
  justify-content: space-between;
  gap: 10px;
  margin: 0 auto 2.5rem;
}
#luffroom .heading-find-rug {
  font-size: 1.6rem;
  margin-bottom: 3rem;
}
#luffroom .heading-find-rug_text {
  text-decoration: underline double #888888;
  text-underline-offset: 5px;
  font-weight: bold;
}
#luffroom .find-rug-desc_item::before {
  content: "\\";
  margin: 0 0.3em;
  color: #333333;
  vertical-align: top;
  font-family: "Consolas", "Courier New", monospace;
}
#luffroom .find-rug-desc_item::after {
  content: "/";
  margin: 0 0.3em;
  color: #333333;
  vertical-align: top;
}
#luffroom .find-rug-balloon {
  width: 200px;
  display: block;
  margin: 2rem auto 3px;
}
#luffroom .func-check {
  text-align: center;
  font-size: 1.7rem;
  font-weight: 600;
}
#luffroom .find-rug_btn a:hover {
  transform: scale(1.1);
  transition: transform 0.3s ease;
}

/* === 各ページへのリンクアイコンここまで === */

/* === コーディネートイメージ === */

#luffroom .code-wrap {
  margin: 0 auto;
}

#luffroom .code-title {
  font-size: 1.7rem;
  position: relative;
  font-weight: 600;
  margin: 4rem 0 2rem;
  text-align: center;
}

#luffroom .code-title::before,
#luffroom .code-title::after {
  content: "";
  display: inline-block;
  width: 2em; /* 線の長さ */
  height: 1px; /* 線の太さ */
  background: #000; /* 線の色 */
  vertical-align: middle;
  margin: 0 0.5em;
}

#luffroom .code-txt {
  text-align: center;
  font-size: 1.4rem;
}
#luffroom .code-wrap {
  margin-bottom: 3rem;
}
#luffroom .taste {
  font-size: 1.5rem;
  border: 1px solid #3c3c3c;
  padding: 5px;
  margin: 10px 0px 0px;
  position: absolute;
  left: 10px;
  background: rgb(255 255 255 / 70%);
}
#luffroom .taste-wrap {
  position: relative;
  display: inline-block;
}
#luffroom .divider {
  border: none;
  border-bottom: 1px solid #c9c9c9;
  margin: 32px auto;
  width: 80px;
}
#luffroom .taste-wrap02{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: -8px 0 -7px;
}

#luffroom .taste-wrap02 p {
  width: 49%;
}
#luffroom .code-mb{
  margin-bottom: -9px!important;
}

/* === コーディネートイメージここまで === */

/* === カラーバリエーション === */

#luffroom .color-wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 5px;
  flex-direction: row;
  text-align: center;
}
#luffroom .color-img {
  flex: 0 0 auto;
  width: 55px;
  height: auto;
}
#luffroom .color-num {
  font-size: 1.3rem;
}

/* === カラーバリエーションここまで === */

/* === スタイリング例 === */

#luffroom .use-idea-ttl {
    font-size: 1.65rem;
    text-align: center;
    text-decoration: underline dotted;
    text-decoration-thickness: 5px;
    text-underline-offset: 9px;
    text-decoration-color: #d3d0c2;
}




/* === スタイリング例ここまで === */

/* === 商品ページ一覧 === */

#luffroom .list-wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  text-align: center;
  margin-bottom: 2rem;
}
#luffroom .list-img {
  flex: 0 0 auto;
  width: 48.5%;
  height: auto;
}
#luffroom .list-item-name {
  font-size: 1.4rem;
  width: 100%;
  margin-bottom: 1rem;
}
#luffroom .page-list {
  font-size: 1.6rem;
  margin: 6rem 0 3rem;
  text-align: center;
  background-color: #8b8b8b;
  padding: 5px;
  color: white;
  letter-spacing: 1px;
}

/* === 商品ページ一覧ここまで === */

/* === マージン調整用 === */

.mb-0 {
  margin-bottom: 0;
}
.mb-05 {
  margin-bottom: 0.5rem;
}
.mb-1 {
  margin-bottom: 1rem;
}
.mb-15 {
  margin-bottom: 1.5rem;
}
.mb-2 {
  margin-bottom: 2rem;
}
.mb-25 {
  margin-bottom: 2.5rem;
}
.mb-3 {
  margin-bottom: 3rem;
}

/* === マージン調整用ここまで === */

/* === PC用: 960px以上 === */

@media screen and (min-width: 960px) {
  /* === トップ === */

  #luffroom .top-logo {
    width: 38%;
  }
  #luffroom .top-exp {
    padding: 0 100px;
    margin: -30px auto 0;
  }
  #luffroom .top-txt {
    margin: 3rem auto 5rem;
    font-size: 1.8rem;
    line-height: 2;
  }
  #luffroom .top-wrap {
    margin: 0 auto 8rem;
  }
#luffroom .top-logo {
    margin: -38px 0 3rem 15px;
}
  /* === トップここまで === */

  /* === インフォメーション === */

  #luffroom .luffroom_exp {
    font-size: 1.5rem;
    text-align: center;
  }
  #luffroom .luffroom_ttl img {
    width: 22rem;
  }
  #luffroom .padding_rl {
    padding: 0 1.5rem;
    margin: 6rem auto 10rem;
  }
  #luffroom .luffroom-info::before {
    top: -15rem;
    background-image: url("https://www.fromfloor.com/images/floor/carpet/luffroom/bg_pc01.png");
  }
  #luffroom .luffroom-info::after {
    bottom: -13.5rem;
    background-image: url("https://www.fromfloor.com/images/floor/carpet/luffroom/bg_pc02.png");
  }
  .luffroom-info::before,
  .luffroom-info::after {
    height: 100%;
  }
  #luffroom .luffroom_ttl {
    margin: 1rem 0 2rem;
  }

  #luffroom .luffroom-info {
    margin: 6rem 0 8rem;
  }

  #luffroom .sp_br {
    display: none;
  }
  #luffroom .pc_br {
    display: block;
  }

  /* === インフォメーションここまで === */

  /* === 4つのポイント === */

  #luffroom .point-desc_head {
    font-size: 1.7rem;
  }
  #luffroom .point-desc_txt {
    font-size: 1.6rem;
  }

  #luffroom .point-ttl {
    font-size: 2rem;
  }
  #luffroom .point-ttl_span {
    font-size: 2.8rem;
    padding-right: 0.3rem;
    position: relative;
    bottom: -0.3rem;
  }
  #luffroom .item-size_ver {
    margin-top: auto;
    margin-bottom: auto;
  }
  #luffroom .pt-ttl-en {
    margin-bottom: -3px;
  }
  #luffroom .highlight {
    font-size: 4.8rem;
  }
  #luffroom .size_link {
    width: 26%;
  }
  #luffroom .shaggy-spec-wrapper {
    margin: 4rem 0 3rem;
  }

  #luffroom .shaggy-spec-text {
    font-size: 1.6rem;
    margin: 1rem 0 0.5rem;
  }
  #luffroom .shaggy-spec-exp {
    font-size: 1.55rem;
    margin-bottom: 1.5rem;
    text-align: center;
  }
  #luffroom .images_sizecut {
    width: 50%;
  }
#luffroom .pt-01 {
    font-size: 2rem;
    margin: 1.5rem 1rem 2rem;
    padding: 8px;
}
  /* === 4つのポイントここまで === */

  /* === 各ページへのリンクアイコン === */

  #luffroom .find-rug_container {
    display: flex;
    gap: 10px;
    padding: 0 2.5rem;
    margin-bottom: 2.5rem;
    padding: 0 20rem;
  }
  #luffroom .find-rug-buttons {
    margin: 0 auto;
    width: 100%;
  }
  #luffroom .find-rug-desc_item {
    font-size: 1.65rem;
  }
  #luffroom .heading-find-rug_text {
    font-size: 1.7rem;
  }
  #luffroom .find-rug-balloon {
    width: 250px;
    margin-top: 5rem;
  }
  #luffroom .func-check {
    font-size: 2.1rem;
  }

  #luffroom .find-rug-bg::before {
    top: -35px;
    width: 100%;
    height: 125%;
    background-image: url(https://www.fromfloor.com/images/floor/carpet/luffroom/bg_pc03.png);
  }
  #luffroom .find-rug-bg {
    margin-bottom: 8rem;
  }

  /* === 各ページへのリンクアイコンここまで === */

  /* === コーディネートイメージ === */

  #luffroom .taste{
    font-size: 2.3rem;
    left: 21px;
    top: 10px;
    padding: 8px;
  }
  #luffroom .code-txt {
    font-size: 1.6rem;
  }
#luffroom .divider {
    margin: 50px auto 50px;
}
#luffroom .taste-wrap02 {
  margin: -8px 0 0;
    height: 540px;
}
#luffroom .code-title {
  margin: 8rem 0 2rem;
}


  /* === コーディネートイメージここまで === */

  /* === カラーバリエーション === */

  #luffroom .color-wrap {
    gap: 9px;
  }
  #luffroom .color-img {
    width: 125px;
  }
  #luffroom .color-num {
    font-size: 1.5rem;
  }

#luffroom .mt-25{
  margin-top: 25px;
}
  /* === カラーバリエーションここまで === */

  /* === 商品ページ一覧 === */

  #luffroom .flex-pc {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 10px;
  }
  #luffroom .list-wrap {
    width: 48.5%;
    gap: 5px;
  }
  #luffroom .list-img {
    flex: 0 0 auto;
    width: 49%;
    height: auto;
  }
  #luffroom .list-item-name {
    font-size: 1.6rem;
    width: 100%;
    margin-bottom: 1rem;
  }
  #luffroom .mt-7 {
    margin-top: 7rem;
  }
  #luffroom .page-list {
    font-size: 1.7rem;
    margin: 9rem 0 5rem;
  }

  /* === 商品ページ一覧ここまで === */
}

/* === PC用ここまで === */
