✏️ 编辑：_faq.scss

路径：/virtual/emerald/public_html/emerald.jpn.com/wp2020/wp-content/themes/cocoon-master/scss/_faq.scss

大小：2.71 KB · 修改：2026-06-11 17:11:56 · 权限：0747 · 可写

.faq-wrap{
  --cocoon-custom-question-color:#b7282e;
  --cocoon-custom-answer-color:#007bbb;
  --cocoon-custom-border-color: transparent;
  --cocoon-custom-background-color: transparent;
  --cocoon-custom-text-color: var(--cocoon-text-color);
  border-color: var(--cocoon-custom-border-color);
  background-color: var(--cocoon-custom-background-color);
  color: var(--cocoon-custom-text-color);
}

.faq-item{
  display: flex;
}

.faq-item-label{
  font-size: 24px;
  margin-right: 0.6em;
}
.is-style-square:not(.not-nested-style) .faq-item-label{
  color: #fff !important;
  background-color: var(--cocoon-custom-question-color);
  font-size: 20px;
  padding: 5px 8px;
  height: 100%;
}

.is-style-square:not(.not-nested-style) .faq-answer-label{
  background-color: var(--cocoon-custom-answer-color);
}

.faq-item-content{
  flex: 1 1 auto;
  width: calc(60%);
}

.faq-question{
  margin-bottom: 1.8em;
  align-items: center;
}
.faq-question-label{
  color: var(--cocoon-custom-question-color);
}
.faq-question-content{
  font-weight: 700;
  margin-right: 30px;
}

.faq .faq-answer{
  margin-left: 0;
}

.faq-answer-content {
  margin-top: 6px;
}

.faq-answer-label{
  color: var(--cocoon-custom-answer-color);
}

//スクエアラベル
.is-style-square{
  .faq-item-label{
    font-size: 20px;
    padding: 5px 8px;
    height: 100%;
  }
}

//アコーディオンスタイル
.is-style-accordion{
  padding: 0;
  background-color:transparent;

&.has-border-color{
    .faq-question{
      border: none;
    }
  }

&:not(.not-nested-style) {

&.has-border-color{
      .faq-question{
        color: var(--cocoon-white-color);
      }
    }
  }

>.faq{
    >.faq-question{
      padding: .5em;
      margin: 0;
      cursor: pointer;
      position: relative;
      background-color: #e8ecef;
      border-color: var(--cocoon-three-d-border-colors);
      // align-items: center;

&::before{
        content: "+";
        position: absolute;
        right: 1em;
        opacity: 0.5;
      }

&.active::before{
        content: "-";
      }
    }

>.faq-answer{
      padding: 1em .5em;
      background-color: var(--cocoon-custom-background-color);
    }
  }
}

//ブロックネスト時のスタイル
.faq-wrap.is-style-square.not-nested-style > .faq > * > .faq-item-label{
  color: #fff;
}

.faq-wrap.is-style-square.not-nested-style > .faq > * > .faq-question-label{
  background-color: var(--cocoon-custom-question-color);
}

.faq-wrap.is-style-square.not-nested-style > .faq > * > .faq-answer-label{
  background-color: var(--cocoon-custom-answer-color);
}

.faq-wrap.is-style-accordion.has-border-color.not-nested-style > .faq > .faq-question {
  color: var(--cocoon-white-color);
  background-color: var(--cocoon-custom-border-color);
}

404 NOT FOUND | 人工芝販売・施工【大阪・近畿】人工芝エメラルド

404 NOT FOUND

お探しのページは見つかりませんでした。