@media screen and (min-width: 900px) {
  .fs-l-main .wrapper .color_index .color_list li h3, .fs-l-main .wrapper .form_index .form_list li h3, .fs-l-main .wrapper .material_index .material_list li h3 {
    display: none;
  }
  
  .fs-l-main .wrapper .color_index .color_list li .color_info, .fs-l-main .wrapper .form_index .form_list li .form_info {
    position: absolute;
    top: 176.25px;
    left: 0;
    right: 0;
    bottom: 0;
  }
  
  .fs-l-main .wrapper .color_index .color_list li .color_info p.desc, .fs-l-main .wrapper .form_index .form_list li .form_info p.desc {
    margin: 0 auto 0;
  }

  .fs-l-main .wrapper .color_index h2, .fs-l-main .wrapper .form_index h2, .fs-l-main .wrapper .material_index h2 {
    width: auto;
    height: auto;
    text-indent: inherit;
    background: none;
    text-align: center;
  }
  
  .wrapper .menu_select .mens_menu {
    background: #ccc;
  }
  
  .wrapper .menu_select .mens_menu img {
    opacity: 0.8;
  }
  
  .wrapper .menu_select .mens_menu a:hover img {
    visibility: visible;
    opacity: 1;
  }
}

.new-category-list.yellow a {
  background-color: #ffa81c;
}

.new-category-list.blue a {
  background-color: #6871b4;
}

.new-category-list a {
  padding: 18px 10px;
  text-decoration: none;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  color: #FFFFFF;
}

[data-element-id] #kichijitsu_day::after {
    content: "次の吉日は〇〇月〇〇日（〇〇）〇〇です。";
}

.new_page_hl {
  margin: 0 auto 20px;
  padding-top: 50px;
  border-top: dotted 1px #C8C8C8;
  border-bottom: 4px solid #AA9738;
  font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝", "Sawarabi Mincho", serif;
  line-height: 1.2;
}

.new_page_hl .title {
  font-size: 34px;
}

.new_page_hl .sub_title {
  font-size: 17px;
  font-weight: bold;
  margin-left: 8px;
}

.new-h2 {
  display: flex;
  justify-content: center;
  align-items: center;
}

.new-h2 .title {
  font-size: 28px;
  font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝", "Sawarabi Mincho", serif;
  margin-left: 10px;
}

.color-list-wrapper {
  background-color: #F8D2EC;
  padding: 3% 3% 0;
}

.spring .color-list-wrapper {
  background-color: #fed8cf;
}

.material-index .color-list-wrapper {
    padding: 3% 10% 0;
}

.color-list .box {
  display: flex;
  flex-direction: column;
  position: relative;
  border-left: 1px solid var(--stripe-color);
  border-right: 1px solid var(--stripe-color);
  background-color: #fff;
}

.color-list .box.border-none {
  border-left: none;
  border-right: none;
}

.color-list .box:before {
  content: "";
  padding-top: 100%;
}

.material-index .color-list .box:before {
  padding-top: 61%;
}

:root {
  --stripe-color: #FDE351;
}

.color-list .yellow {
  --stripe-color: #FDE351;
}
.color-list .brown {
  --stripe-color: #7C5033;
}
.color-list .black {
  --stripe-color: #302833;
}
.color-list .white {
  --stripe-color: #D8CFA7;
}
.color-list .pink {
  --stripe-color: #F0A293;
}
.color-list .blue {
  --stripe-color: #325187;
}
.color-list .green {
  --stripe-color: #609833;
}
.color-list .glay {
  --stripe-color: #C2BDAA;
}
.color-list .flower {
  --stripe-color: #F86A84;
}

.color-list .border-top {
  width: 100%;
  height: 5px;
  background: repeating-linear-gradient(-45deg, var(--stripe-color) 0 2px, #ffffff 2px 3px);
  position: absolute;
  top: 0;
  left: 0;
}

.color-list .border-middle {
  height: calc(100% - 15px);
  width: 100%;
  position: absolute;
  left: 0;
  top: 5px;
  background-color: #fff;
}

.color-list .border-bottom {
  height: 10px;
  background: repeating-linear-gradient(-45deg, var(--stripe-color) 0 2px, #ffffff 2px 3px);
  width: 100%;
  position: absolute;
  left: 0;
  bottom: 0;
}

.color-list .content-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 15px 10px 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.form-index .color-list .content-wrapper {
  padding: 12px 10px 15px;
}

.color-list .title {
  text-align: center;
  position: relative;
  font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝", "Sawarabi Mincho", serif;
  margin-bottom: 10px;
  font-weight: 600;
}

.color-list .title2 {
  text-align: center;
  font-family: "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝", "Sawarabi Mincho", serif;
  margin-bottom: 10px;
  font-weight: 600;
  line-height: 1.3;
}

.color-list .title:after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translate(-50%, 100%);
  width: 80px;
  height: 4px;
  background-color: var(--stripe-color);
}

.color-list .title .ja {
  font-size: 26px;
}

.color-list .title2 .ja {
  font-size: 26px;
  display: block
}

.color-list .title .en {
  font-size: 18px;
  margin-left: 10px;
}

.color-list .title2 .en {
  font-size: 18px;
  margin-left: 10px;
  color: #A2A2A2;
  display: block;
}

.material-index .color-list .title2 .en,
.material-index .color-list .title2 .ja {
  display: inline;
}

.color-list .img {
  margin-bottom: 10px;
}

.color-list .btn {
  text-align: center;
  margin-top: 10px;
}

.color-list .btn2 {
  text-align: center;
  margin-top: 10px;
}

.color-list .btn a {
  width: 161px;
  padding: 5px;
  color: #4D4D4D;
  display: inline-block;
  background: var(--stripe-color)
}

.color-list .btn2 a {
  width: 164px;
  display: inline-block;
  line-height: 28px;
  text-decoration: none;
  color: #4D4D4D;
  border: 1px solid #4D4D4D;
}

.color-list .btn.white-color a {
  color: #fff;
}

.dotted-box {
  padding-top: 50px;
  border-top: dotted 1px #C8C8C8;
}