@charset "utf-8";


/* 「ress」のリセットcssを入れています */
/* resset.dev • v5.0.2 */

/* # =================================================================
   # Global selectors
   # ================================================================= */

   html {
    box-sizing: border-box;
    -webkit-text-size-adjust: 100%; /* Prevent adjustments of font size after orientation changes in iOS */
    word-break: normal;
    -moz-tab-size: 4;
    tab-size: 4;
    font-feature-settings: "palt"; /* 字間指定を追加しています */
    letter-spacing: 0.08em;
    line-height: 1.72;
    font-size: 16px;
  }

  *,
  ::before,
  ::after {
    background-repeat: no-repeat; /* Set `background-repeat: no-repeat` to all elements and pseudo elements */
    box-sizing: inherit;
  }

  ::before,
  ::after {
    text-decoration: inherit; /* Inherit text-decoration and vertical align to ::before and ::after pseudo elements */
    vertical-align: inherit;
  }

  * {
    padding: 0; /* Reset `padding` and `margin` of all elements */
    margin: 0;
    text-decoration: none;
    list-style: none;
  }

  /* fontも追加しています */
  body {
    color: #333;
    font-family: -apple-system, BlinkMacSystemFont, Roboto, "Segoe UI", "Helvetica Neue", HelveticaNeue, YuGothic, "Yu Gothic Medium", "Yu Gothic", Verdana, Meiryo, sans-serif;
    font-weight: 500;
    }
    body.open {
      overflow: hidden;
    }

  /* # =================================================================
     # General elements
     # ================================================================= */

  hr {
    overflow: visible; /* Show the overflow in Edge and IE */
    height: 0; /* Add the correct box sizing in Firefox */
    color: inherit; /* Correct border color in Firefox. */
  }

  details,
  main {
    display: block; /* Render the `main` element consistently in IE. */
  }

  summary {
    display: list-item; /* Add the correct display in all browsers */
  }

  small {
    font-size: 80%; /* Set font-size to 80% in `small` elements */
  }

  [hidden] {
    display: none; /* Add the correct display in IE */
  }

  abbr[title] {
    border-bottom: none; /* Remove the bottom border in Chrome 57 */
    /* Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari */
    text-decoration: underline;
    text-decoration: underline dotted;
  }

  a {
    background-color: transparent; /* Remove the gray background on active links in IE 10 */
  }

  a:active,
  a:hover {
    outline-width: 0; /* Remove the outline when hovering in all browsers */
  }

  code,
  kbd,
  pre,
  samp {
    font-family: monospace, monospace; /* Specify the font family of code elements */
  }

  pre {
    font-size: 1em; /* Correct the odd `em` font sizing in all browsers */
  }

  b,
  strong {
    font-weight: bolder; /* Add the correct font weight in Chrome, Edge, and Safari */
  }

  /* https://gist.github.com/unruthless/413930 */
  sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }

  sub {
    bottom: -0.25em;
  }

  sup {
    top: -0.5em;
  }

  table {
    border-color: inherit; /* Correct border color in all Chrome, Edge, and Safari. */
    text-indent: 0; /* Remove text indentation in Chrome, Edge, and Safari */
  }

  iframe {
    border-style: none;
  }

  /* # =================================================================
     # Forms
     # ================================================================= */

  input {
    border-radius: 0;
  }

  [type='number']::-webkit-inner-spin-button,
  [type='number']::-webkit-outer-spin-button {
    height: auto; /* Correct the cursor style of increment and decrement buttons in Chrome */
  }

  [type='search'] {
    -webkit-appearance: textfield; /* Correct the odd appearance in Chrome and Safari */
    outline-offset: -2px; /* Correct the outline style in Safari */
  }

  [type='search']::-webkit-search-decoration {
    -webkit-appearance: none; /* Remove the inner padding in Chrome and Safari on macOS */
  }

  textarea {
    overflow: auto; /* Internet Explorer 11+ */
    resize: vertical; /* Specify textarea resizability */
  }

  button,
  input,
  optgroup,
  select,
  textarea {
    font: inherit; /* Specify font inheritance of form elements */
  }

  optgroup {
    font-weight: bold; /* Restore the font weight unset by the previous rule */
  }

  button {
    overflow: visible; /* Address `overflow` set to `hidden` in IE 8/9/10/11 */
  }

  button,
  select {
    text-transform: none; /* Firefox 40+, Internet Explorer 11- */
  }

  /* Apply cursor pointer to button elements */
  button,
  [type='button'],
  [type='reset'],
  [type='submit'],
  [role='button'] {
    cursor: pointer;
  }

  /* Remove inner padding and border in Firefox 4+ */
  button::-moz-focus-inner,
  [type='button']::-moz-focus-inner,
  [type='reset']::-moz-focus-inner,
  [type='submit']::-moz-focus-inner {
    border-style: none;
    padding: 0;
  }

  /* Replace focus style removed in the border reset above */
  button:-moz-focusring,
  [type='button']::-moz-focus-inner,
  [type='reset']::-moz-focus-inner,
  [type='submit']::-moz-focus-inner {
    outline: 1px dotted ButtonText;
  }

  button,
  html [type='button'], /* Prevent a WebKit bug where (2) destroys native `audio` and `video`controls in Android 4 */
  [type='reset'],
  [type='submit'] {
    -webkit-appearance: button; /* Correct the inability to style clickable types in iOS */
  }

  /* Remove the default button styling in all browsers */
  button,
  input,
  select,
  textarea {
    background-color: transparent;
    border-style: none;
  }

  a:focus,
  button:focus,
  input:focus,
  select:focus,
  textarea:focus {
    outline-width: 0;
  }

  /* Style select like a standard input */
  select {
    -moz-appearance: none; /* Firefox 36+ */
    -webkit-appearance: none; /* Chrome 41+ */
  }

  select::-ms-expand {
    display: none; /* Internet Explorer 11+ */
  }

  select::-ms-value {
    color: currentColor; /* Internet Explorer 11+ */
  }

  legend {
    border: 0; /* Correct `color` not being inherited in IE 8/9/10/11 */
    color: inherit; /* Correct the color inheritance from `fieldset` elements in IE */
    display: table; /* Correct the text wrapping in Edge and IE */
    max-width: 100%; /* Correct the text wrapping in Edge and IE */
    white-space: normal; /* Correct the text wrapping in Edge and IE */
    max-width: 100%; /* Correct the text wrapping in Edge 18- and IE */
  }

  ::-webkit-file-upload-button {
    /* Correct the inability to style clickable types in iOS and Safari */
    -webkit-appearance: button;
    color: inherit;
    font: inherit; /* Change font properties to `inherit` in Chrome and Safari */
  }

  /* Replace pointer cursor in disabled elements */
  [disabled] {
    cursor: default;
  }

  /* # =================================================================
     # Specify media element style
     # ================================================================= */

  img {
    border-style: none; /* Remove border when inside `a` element in IE 8/9/10 */
    width: 100%;
  }

  /* Add the correct vertical alignment in Chrome, Firefox, and Opera */
  progress {
    vertical-align: baseline;
  }

  /* # =================================================================
     # Accessibility
     # ================================================================= */

  /* Specify the progress cursor of updating elements */
  [aria-busy='true'] {
    cursor: progress;
  }

  /* Specify the pointer cursor of trigger elements */
  [aria-controls] {
    cursor: pointer;
  }

  /* Specify the unstyled cursor of disabled, not-editable, or otherwise inoperable elements */
  [aria-disabled='true'] {
    cursor: default;
  }



  /* ============================================ */
/* 共通部分
/* ============================================ */
/* fonts */
.signika {
  font-family: 'Signika Negative', sans-serif;
}
.pc {
    display: block;
}
.sp {
    display: none;
}
@media only screen and (max-width: 768px) {
    .pc {
        display: none;
    }
    .sp {
        display: block;
    }
}

.w1100 {
    max-width: 1100px;
    width: 90%;
    margin: 0 auto;
}
.w850 {
    max-width: 850px;
    width: 90%;
    margin: 0 auto;
}

/* sp時のみ電話番号リンクが有効に */
@media (min-width: 768px) {
  a[href*="tel:"] {
    pointer-events: none;
    cursor: default;
    text-decoration: none;
  }
}

/* ============================================ */
/* ヘッダー
/* ============================================ */
#header {
  position: fixed;
  width: 100%;
  top: 0;
  z-index: 66;
  background-color: #fff;
}
#header.home {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
}
#header.home h1 {
  margin-left: 25px;
  width: 9.1%;
}
#header.home nav ul {
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 45px;
}
#header.home nav ul li.nav_tel {
  width: 13.54vw;
}
#header.home nav ul li.nav_mail {
  width: 4.166vw;
}
#header.home nav ul li a {
  color: #000;
  font-size: 17px;
  font-weight: bold;
  display: block;
  transition: all .5s;
}
#header.home nav ul li a:hover {
  opacity: 0.7;
}
#gototop {
  position: fixed;
  right: 2rem;
  bottom: 0;
  z-index: 11;
}
#gototop a {
  display: block;
  background: #579A00;
  width: 4.5rem;
  height: 4.5rem;
  position: relative;
}
#gototop a img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 2.3rem;
}
/*==================================================
　5-2-1 3本線が×に
===================================*/
/*ボタン外側※レイアウトによってpositionや形状は適宜変更してください*/
.h_menu{
	/*ボタン内側の基点となるためrelativeを指定。
追従するナビゲーションの場合はfixed＋top、rightといった位置をセットで指定*/
	position: relative;
	background:#579A00;
	cursor: pointer;
  width: 3rem;
  height: 3rem;
}

/*ボタン内側*/
.h_menu span{
    display: inline-block;
    transition: all .4s;/*アニメーションの設定*/
    position: absolute;
    left: 14px;
    height: 3px;
    border-radius: 2px;
    background: #fff;
    width: 45%;
  }

.h_menu span:nth-of-type(1) {
	top:15px;
}

.h_menu span:nth-of-type(2) {
	top:23px;
}

.h_menu span:nth-of-type(3) {
	top:31px;
}

/*activeクラスが付与されると線が回転して×に*/

.h_menu.active span:nth-of-type(1) {
    top: 18px;
    left: 18px;
    transform: translateY(6px) rotate(-45deg);
    width: 30%;
}

.h_menu.active span:nth-of-type(2) {
	opacity: 0;/*真ん中の線は透過*/
}

.h_menu.active span:nth-of-type(3){
    top: 30px;
    left: 18px;
    transform: translateY(-6px) rotate(45deg);
    width: 30%;
}

@media only screen and (max-width: 768px) {
  #header {
      height: 3rem;
  }
  #header.home {
    position: fixed;
  }
  #header .h_menu,
  #header .h_close {
      position: absolute;
      right: 0;
      top: 0;
      width: 3rem;
      cursor: pointer;
      z-index: 15;
  }
  .toggle_menu {
      display: none;
      position: fixed;
      top: 0;
      z-index: 12;
      left: 0;
      width: 100%;
      overflow-y: auto;
      height: 100%;
      background: #ebf2e9;
  }
  #header.home h1 {
      margin-left: 15px;
      width: 25%;
  }
  #header.home nav ul {
      display: flex;
      flex-direction: column;
      width: 100vw;
      height: 100vh;
      gap: 20px;
      justify-content: center;
  }
  #header.home nav ul li.nav_tel {
      width: 55vw;
  }
  #header.home nav ul li.nav_mail {
      width: 55vw;
  }
  #gototop {
      right: .5rem;
      bottom: 1.5rem;
  }
  #gototop a {
      border-radius: 50%;
      width: 3.5rem;
      height: 3.5rem;
  }
  #gototop a img {
      width: 1.5rem;
  }
}



/* ============================================ */
/* footer
/* ============================================ */
/*
ボタンの基本的な組み方 -st
細かな調整は各cssファイルでお願いします。
*/
.btn {
  display: block;
  text-align: center;
  background-color: #B0BF24;
  color: #fff;
  padding: 16px 5px;
  border-radius: 5px;
  transition: all .3s;
}
.btn:hover {
  background-color: #558d16;
}
.btn span {
  padding-right: 30px;
  position: relative;
  font-weight: bold;
}
.btn span::after {
  content: '';
  position: absolute;
  top: 48%; right: 0px;
  transform: translate(0, -40%);
  background: url(../../images/arrow_01.png);
  width: 6px;
  height: 12px;
  background-size: cover;
  transition: right .3s;
}


.line_btn {
  display: block;
  text-align: center;
  background-color: #39ae36;
  color: #fff;
  padding: 16px 5px;
  border-radius: 5px;
  transition: all .3s;
  margin-top: 10px;
  letter-spacing: -0.03em;
}
.line_btn:hover {
  background-color: #3f8f3c;
}
.line_btn span {
  padding-right: 30px;
  position: relative;
  font-weight: bold;
}
.line_btn span::after {
  content: '';
  position: absolute;
  top: 48%; right: 0px;
  transform: translate(0, -40%);
  background: url(../../images/arrow_01.png);
  width: 6px;
  height: 12px;
  background-size: cover;
  transition: right .3s;
}

/* -ed */

.footer_bg {
  width: 100%;
  background-color: #EBF3C9;
  padding: 56px 0 15px;
}
footer .separate {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0 0 45px 0;
}
footer .separate .left {
  width: 50%;
}
footer .separate .right {
  width: 280px;
}
footer .separate .left a.ft_logo {
  display: block;
  width: 41.272%;
  margin: 0 0 12px 0;
}
footer .separate .right p.ft_tel {
  font-size: 31px;
  font-weight: 500;
  position: relative;
  padding-left: 27px;
}
footer .separate .right p.ft_tel::before {
  position: absolute;
  content: '';
  background-image: url(../../common/images/icon_tel.png);
  top: 50%; left: 0;
  transform: translate(0, -50%);
  width: 27px;
  height: 28px;
  background-size: cover;
}
footer .separate .right p.ft_tel a {
  color: #579A00;
}
footer .separate .right span.ft_mail {
  position: relative;
  padding: 0 0 0 30px;
}
footer .separate .right span.ft_mail::before {
  position: absolute;
  content: '';
  background-image: url(../../common/images/icon_mail.png);
  background-size: cover;
  width: 22px;
  height: 16px;
  top: 50%; left: 0;
  transform: translate(0, -50%);
}

footer .separate .right span.ft_line {
  position: relative;
  padding: 0 18px 0 47px;
}
footer .separate .right span.ft_line::before {
  position: absolute;
  content: '';
  background-image: url(../../common/images/icon_line.png);
  background-size: cover;
  width: 36px;
  height: 33px;
  top: 50%; left: 0;
  transform: translate(0, -50%);
}

footer .separate .right span.ft_mail::after {
  display: none;
}
footer .ft_caption {
  text-align: center;
  font-size: 14px;
  color: #B0BF24;
}
@media only screen and (max-width: 768px) {
  .btn {
    padding: 8px 5px;
}
  .footer_bg {
      padding: 25px 0 15px;
  }
  footer .separate {
      flex-direction: column;
      gap: 10px;
      width: 311px;
      margin: 0 auto 30px;
  }
  footer .separate .left,
  footer .separate .right {
      width: 100%;
  }
  footer .separate .left a.ft_logo {
    width: 80%;
    margin: 0 auto 20px;
  }
  footer .separate .left > p {
    line-height: 1.35;
  }
  footer .separate .right p.ft_tel {
      width: 310px;
      margin: 0 auto;
      font-size: 20px;
      margin: 0 auto 15px;
      padding: 0 0 0 20px;
  }
  footer .separate .right p.ft_tel::before {
    width: 20px;
    height: 21px;
  }
  footer .btn {
      width: 311px;
      margin: 0 auto;
  }
  footer .separate .right span.ft_line::before {
    position: absolute;
    content: '';
    background-image: url(../../common/images/icon_line.png);
    background-size: cover;
    width: 28px;
    height: 25px;
    top: 50%; left: 0;
    transform: translate(0, -50%);
  }
}




/* ============================================ */
/* tel_area
/* ============================================ */
.tel_area {
  padding: 100px 0 150px;
}
.tel_area a {
  display: block;
  transition: all 0.3s;
}
.tel_area a:hover {
  opacity: 0.8;
}
@media only screen and (max-width: 768px)  {
  .tel_area {
      padding: 30px 0 50px;
  }
}






.line_area {
  padding: 70px 0 0 0;
  max-width: 850px;
  margin: 0 auto;
}
.line_area p{
  text-align: center;
  margin-bottom: 30px;
}

.line_area .line_btn {
  display: block;
  text-align: center;
  background-color: #39ae36;
  color: #fff;
  padding: 25px 5px;
  border-radius: 5px;
  transition: all .3s;
  margin: 10px auto;
  letter-spacing: -0.03em;
  width: 70%;
}
.line_area .line_btn:hover {
  background-color: #3f8f3c;
}
.line_area .line_btn span {
  padding-right: 30px;
  position: relative;
  font-weight: bold;
  font-size: 20px;
}
.line_area .line_btn span::after {
  content: '';
  position: absolute;
  top: 48%; right: 0px;
  transform: translate(0, -40%);
  background: url(../../images/arrow_01.png);
  width: 6px;
  height: 12px;
  background-size: cover;
  transition: right .3s;
}
.line_area span.ft_line {
  position: relative;
  padding: 0 30px 0 50px;
}
.line_area span.ft_line::before {
  position: absolute;
  content: '';
  background-image: url(../../common/images/icon_line.png);
  background-size: cover;
  width: 36px;
  height: 33px;
  top: 50%; left: 0;
  transform: translate(0, -50%);
}



@media only screen and (max-width: 767px){
	.line_area {
    padding: 70px 10px 0;
  }
  .line_area p{
    text-align: left;
    margin-bottom: 30px;
  }

  .line_area .line_btn {
    display: block;
    text-align: center;
    background-color: #39ae36;
    color: #fff;
    padding: 15px 5px;
    border-radius: 5px;
    transition: all .3s;
    margin: 10px auto;
    letter-spacing: -0.03em;
    width: 90%;
  }
  .line_area span.ft_line {
    position: relative;
    padding: 0 20px 0 40px;
  }
  .line_area .line_btn span {
    font-size: 16px;
  }
  .line_area span.ft_line::before {
    position: absolute;
    content: '';
    background-image: url(../../common/images/icon_line.png);
    background-size: cover;
    width: 28px;
    height: 25px;
    top: 50%; left: 0;
    transform: translate(0, -50%);
  }
}



.st{
  color: #579a00;
  text-align: center;
  font-size: 26px;
  margin-bottom: 30px;
  font-weight: bold;
}


@media only screen and (max-width: 767px){
.st{
    color: #579a00;
    text-align: center;
    font-size: 18px;
    margin-bottom: 15px;
    font-weight: bold;
  }
}