@charset "UTF-8";

:root {
  --color_gr01a: #017d31; /* サブ01カラー　濃 */
  --color_gr01b: #03903a; /* メイン01カラー ↑ */
  --color_gr01c: #017d31; /* メイン02カラー ↓ */
  --color_gr01d: #ddeecc; /* サブ02カラー  薄 */
}

/* :root {
  --color_gr01a: #298801; 
  --color_gr01b: #599f3d; 
  --color_gr01c: #669944; 
  --color_gr01d: #ddeecc; 
}  */

/*
GREEN
*/
.gr {
  #mv {
    background: url(../img/bg_pattern_gr.webp) repeat;
  }
  #mv::before,
  #mv::after {
    background: url(../img/bg_wing_gr.svg) no-repeat top center / cover;
  }
  .navigation {
    background-color: var(--color_gr01b);
  }
  .navigation ul li.has-child .menu-dropdown li a {
    background-color: var(--color_gr01b);
  }
  .navigation ul#page_link li a:hover {
    background: var(--color_gr01a);
  }
  .ttl_deco {
    background-image: url("../img/midashi_left_gr.webp"),
      url("../img/midashi_right_gr.webp");
    background-color: var(--color_gr01b);
  }
  .side_contact {
    background: linear-gradient(var(--color_gr01c), var(--color_gr01a));
  }
  .side_contact_reserve {
    top: 480px;
    background: linear-gradient(135deg, #8bc34a, #8bc34a);
  }
  .date::before {
    background: url(../img/svg/icn_cal_gr.svg) no-repeat;
  }
  .link_area a {
    background: linear-gradient(90deg, var(--color_gr01a), var(--color_gr01c));
  }
  #greeting {
    background: var(--color_gr01d);
  }
  #greeting h2 span {
    color: var(--color_gr01b);
  }
  #greeting::before,
  #greeting::after {
    background: url(../img/bg_wing_gr.svg) no-repeat top center / cover;
  }
  .more__btn {
    background: var(--color_gr01b);
  }
  #itemlist {
    background: url(../img/bg_pattern_gr.webp) repeat;
  }
  .itemlist_box p {
    background-color: var(--color_gr01b);
  }
  .method_ttl {
    background-color: var(--color_gr01b);
  }
  .method_box .osusume p {
    color: var(--color_gr01b);
    border-bottom-color: var(--color_gr01b);
  }
  .method_txt a {
    background-color: var(--color_gr01b);
  }
  .info_table {
    border-top-color: var(--color_gr01b);
  }
  .info_table dl {
    border-bottom-color: var(--color_gr01b);
  }
  .info_table dl dt {
    background: var(--color_gr01b);
  }
  footer {
    background: var(--color_gr01d);
  }
  footer .copyright {
    background: var(--color_gr01b);
  }
  #page_top a {
    background: var(--color_gr01a);
  }

  #pagetitle {
    background: url(../img/bg_pattern_gr.webp) repeat;
  }
  #pagetitle::before,
  #pagetitle::after {
    background: url(../img/bg_wing_gr.svg) no-repeat top center / cover;
  }

  .purchase_flow_wrap::after {
    background-image: url("../img/svg/icn_arw_down_gr.svg");
  }
  /*STEPエンブレム*/
  .purchase_flow_box dt {
    border-bottom-color: var(--color_gr01b);
  }
  .purchase_flow_box dt span {
    background: var(--color_gr01b);
  }
  .purchase_flow_box dt span::before {
    border-bottom-color: var(--color_gr01a);
  }
  .purchase_flow_box dt span:after {
    border-top-color: var(--color_gr01b);
  }
  .store_address {
    background: var(--color_gr01d);
    > p {
      border-bottom-color: var(--color_gr01a);
    }
  }
  .store_address .form_link a {
    background: linear-gradient(var(--color_gr01c), var(--color_gr01a));
  }

  .phone_num a:before {
    background: url(../img/svg/icn_tel_gr.svg) no-repeat;
  }
  .access_box .access_txt::before {
    color: var(--color_gr01b);
  }
  #faq .faq_item {
    background: var(--color_gr01d);
  }
  #faq .question::before {
    background: var(--color_gr01b);
  }
  #mailformpro button[type="submit"] {
    background: var(--color_gr01b);
  }
  #mfp_phase_confirm_inner .mfp_buttons #mfp_button_send {
    background: var(--color_gr01b);
  }

  .pagination li a {
    color: var(--color_gr01b);
    border-color: var(--color_gr01b);
  }
  .pagination li.active a {
    color: #fff;
    background: var(--color_gr01b);
  }
}
@media (max-width: 599.98px) {
  .gr {
    .sp_fixed_bnr li:nth-of-type(2) {
      background: linear-gradient(var(--color_gr01c), var(--color_gr01a));
    }
    .sp_fixed_bnr li:nth-of-type(3) {
      background: linear-gradient(135deg, #8bc34a, #8bc34a);
    }
    .sp_fixed_bnr li:nth-of-type(4) {
      background: var(--color_gr01a);
    }
    .menu-btn span.txt {
      color: var(--color_gr01b);
    }
    .menu-btn span.bar,
    .menu-btn span.bar:before,
    .menu-btn span.bar:after {
      background-color: var(--color_gr01b);
    }
  }
}