@charset "UTF-8";
@media screen and (max-width: 1280px) {
  .pc_hide {
    display: none;
  }
}
@media screen and (max-width: 820px) {
  .tab_hide {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .sp_hide {
    display: none;
  }
}
@media screen and (min-width: 1281px) {
  .pca_block {
    display: none;
  }
}
@media screen and (min-width: 821px) {
  .taba_block {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  .spa_block {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

.container {
  overflow: hidden;
  line-height: 2;
  font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  color: #464646;
}

.openbtn span:nth-of-type(3)::after {
  content: "Menu";
  /*3つ目の要素のafterにMenu表示を指定*/
  position: absolute;
  top: 5px;
  left: 3.5px;
  color: #2AB210;
  font-size: 20px;
  text-transform: uppercase;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3)::after {
    font-size: 16px;
  }
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 60%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

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

.openbtn.active span:nth-of-type(3)::after {
  content: "Close";
  /*3つ目の要素のafterにClose表示を指定*/
  transform: translateY(0) rotate(-45deg);
  top: 10px;
  left: 25px;
}
@media screen and (max-width: 820px) {
  .openbtn.active span:nth-of-type(3)::after {
    left: 23px;
  }
}

/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: #ffffff;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
}

#g-nav li a {
  color: #2AB210;
  padding: 10px;
  text-decoration: none;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  #g-nav li a {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav li a {
    font-size: 12px;
  }
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9999;
  /*ボタンを最前面に*/
  top: 50px;
  right: 15%;
  cursor: pointer;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 820px) {
  .openbtn {
    right: 5%;
    top: 40px;
    width: 80px;
    height: 80px;
  }
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 5px;
  border-radius: 5px;
  background-color: #2AB210;
  width: 60%;
}

.openbtn span:nth-of-type(1) {
  top: 0;
}

.openbtn span:nth-of-type(2) {
  top: 18px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(2) {
    top: 15px;
  }
}

.openbtn span:nth-of-type(3) {
  top: 36px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3) {
    top: 30px;
  }
}

#g-nav-list ul {
  width: 700px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #g-nav-list ul {
    width: 500px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav-list ul {
    width: 400px;
  }
}
#g-nav-list ul li {
  width: 50%;
}

.zenmaru {
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #2AB210;
}

header {
  position: fixed;
  background-color: #ffffff;
  z-index: 1000;
  width: 100%;
}
header h1 img {
  width: 100px;
  margin-left: 15%;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  header h1 img {
    width: 80px;
    margin-left: 5%;
  }
}

.viewmore {
  position: relative;
  line-height: 1;
}

.viewmore_a {
  position: relative;
  display: inline-block;
}
.viewmore_a::after {
  content: url(../img/viewmore_arrow.svg);
  position: absolute;
  right: -30px;
  top: 0;
  line-height: 1;
}

.viewmore_right {
  text-align: right;
}

footer .footer1 {
  margin-left: 5%;
  margin-right: 30px;
  width: 4.427vw;
}
@media screen and (max-width: 820px) {
  footer .footer1 {
    margin-right: 10px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer1 {
    width: 9vw;
  }
}
footer .footer2 {
  width: 7.382vw;
}
@media screen and (max-width: 480px) {
  footer .footer2 {
    width: 15vw;
  }
}
footer .footer_wrapper {
  background-color: #FFE498;
}
footer .footer_wrapper .footer_content {
  padding-top: 5.208vw;
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content {
    width: 80%;
  }
}
footer .footer_wrapper .footer_content .company_name {
  font-family: "游明朝", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
footer .footer_wrapper .footer_content .company_name span {
  font-size: 48px;
}
footer .footer_wrapper .footer_content nav {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content nav {
    width: 60%;
  }
}
footer .footer_wrapper .footer_content nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
footer .footer_wrapper small {
  margin: 50px auto 0 auto;
  padding-bottom: 10px;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 820px) {
  footer .footer_wrapper small {
    margin-top: 10px;
    margin-right: 5%;
  }
}

@media screen and (max-width: 1280px) {
  .pc_hide {
    display: none;
  }
}
@media screen and (max-width: 820px) {
  .tab_hide {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .sp_hide {
    display: none;
  }
}
@media screen and (min-width: 1281px) {
  .pca_block {
    display: none;
  }
}
@media screen and (min-width: 821px) {
  .taba_block {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  .spa_block {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

.container {
  overflow: hidden;
  line-height: 2;
  font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  color: #464646;
}

.openbtn span:nth-of-type(3)::after {
  content: "Menu";
  /*3つ目の要素のafterにMenu表示を指定*/
  position: absolute;
  top: 5px;
  left: 3.5px;
  color: #2AB210;
  font-size: 20px;
  text-transform: uppercase;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3)::after {
    font-size: 16px;
  }
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 60%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

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

.openbtn.active span:nth-of-type(3)::after {
  content: "Close";
  /*3つ目の要素のafterにClose表示を指定*/
  transform: translateY(0) rotate(-45deg);
  top: 10px;
  left: 25px;
}
@media screen and (max-width: 820px) {
  .openbtn.active span:nth-of-type(3)::after {
    left: 23px;
  }
}

/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: #ffffff;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
}

#g-nav li a {
  color: #2AB210;
  padding: 10px;
  text-decoration: none;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  #g-nav li a {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav li a {
    font-size: 12px;
  }
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9999;
  /*ボタンを最前面に*/
  top: 50px;
  right: 15%;
  cursor: pointer;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 820px) {
  .openbtn {
    right: 5%;
    top: 40px;
    width: 80px;
    height: 80px;
  }
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 5px;
  border-radius: 5px;
  background-color: #2AB210;
  width: 60%;
}

.openbtn span:nth-of-type(1) {
  top: 0;
}

.openbtn span:nth-of-type(2) {
  top: 18px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(2) {
    top: 15px;
  }
}

.openbtn span:nth-of-type(3) {
  top: 36px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3) {
    top: 30px;
  }
}

#g-nav-list ul {
  width: 700px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #g-nav-list ul {
    width: 500px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav-list ul {
    width: 400px;
  }
}
#g-nav-list ul li {
  width: 50%;
}

.zenmaru {
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #2AB210;
}

header {
  position: fixed;
  background-color: #ffffff;
  z-index: 1000;
  width: 100%;
}
header h1 img {
  width: 100px;
  margin-left: 15%;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  header h1 img {
    width: 80px;
    margin-left: 5%;
  }
}

.viewmore {
  position: relative;
  line-height: 1;
}

.viewmore_a {
  position: relative;
  display: inline-block;
}
.viewmore_a::after {
  content: url(../img/viewmore_arrow.svg);
  position: absolute;
  right: -30px;
  top: 0;
  line-height: 1;
}

.viewmore_right {
  text-align: right;
}

footer .footer1 {
  margin-left: 5%;
  margin-right: 30px;
  width: 4.427vw;
}
@media screen and (max-width: 820px) {
  footer .footer1 {
    margin-right: 10px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer1 {
    width: 9vw;
  }
}
footer .footer2 {
  width: 7.382vw;
}
@media screen and (max-width: 480px) {
  footer .footer2 {
    width: 15vw;
  }
}
footer .footer_wrapper {
  background-color: #FFE498;
}
footer .footer_wrapper .footer_content {
  padding-top: 5.208vw;
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content {
    width: 80%;
  }
}
footer .footer_wrapper .footer_content .company_name {
  font-family: "游明朝", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
footer .footer_wrapper .footer_content .company_name span {
  font-size: 48px;
}
footer .footer_wrapper .footer_content nav {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content nav {
    width: 60%;
  }
}
footer .footer_wrapper .footer_content nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
footer .footer_wrapper small {
  margin: 50px auto 0 auto;
  padding-bottom: 10px;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 820px) {
  footer .footer_wrapper small {
    margin-top: 10px;
    margin-right: 5%;
  }
}

.toppage_top {
  display: flex;
  align-items: flex-start;
  margin: 300px 15% 0 15%;
  justify-content: space-between;
}
@media screen and (max-width: 480px) {
  .toppage_top {
    margin-top: 200px;
    margin-left: 10%;
    margin-right: 10%;
  }
}
.toppage_top .toppage_topimage_wrapper {
  position: relative;
}
.toppage_top .toppage_topimage_wrapper .toppage_greencircle {
  position: absolute;
  left: -2.604vw;
  width: 9.427vw;
}
@media screen and (max-width: 480px) {
  .toppage_top .toppage_topimage_wrapper .toppage_greencircle {
    width: 15vw;
    height: 15vw;
    top: 2.083vw;
    left: -4vw;
  }
}
.toppage_top .toppage_topimage_wrapper .toppage_orangecircle {
  position: absolute;
  bottom: -13.021vw;
  right: 2.604vw;
  width: 14.271vw;
}
@media screen and (max-width: 480px) {
  .toppage_top .toppage_topimage_wrapper .toppage_orangecircle {
    width: 17vw;
    bottom: -15vw;
  }
}
.toppage_top .toppage_topimage_wrapper .toppage_main_image {
  width: 53.49vw;
}
@media screen and (max-width: 480px) {
  .toppage_top .toppage_topimage_wrapper .toppage_main_image {
    width: 70vw;
  }
}
.toppage_top .toppage_topimage_wrapper::before {
  content: "";
  width: 9.375vw;
  height: 9.375vw;
  border-radius: 50%;
  background-color: #C0E5B9;
  position: absolute;
  top: -1.563vw;
  left: -1.563vw;
  display: block;
  opacity: 0.5;
}
@media screen and (max-width: 480px) {
  .toppage_top .toppage_topimage_wrapper::before {
    width: 15vw;
    height: 15vw;
  }
}
.toppage_top .toppage_topimage_wrapper::after {
  content: "";
  width: 16.667vw;
  height: 16.667vw;
  border-radius: 50%;
  background-color: #FFE498;
  display: block;
  position: absolute;
  opacity: 0.5;
  bottom: -5.208vw;
  right: -5.208vw;
}
@media screen and (max-width: 480px) {
  .toppage_top .toppage_topimage_wrapper::after {
    width: 20vw;
    height: 20vw;
  }
}
.toppage_top p {
  font-size: 38px;
  writing-mode: vertical-rl;
  line-height: 1.5;
  letter-spacing: 0.5em;
  position: relative;
  z-index: 10;
}
@media screen and (max-width: 1280px) {
  .toppage_top p {
    font-size: 24px;
  }
}
@media screen and (max-width: 480px) {
  .toppage_top p {
    font-size: 16px;
  }
}
.toppage_top p span {
  margin-top: 1em;
}

.toppage_sec1 {
  margin-bottom: 30vw;
}
@media screen and (max-width: 480px) {
  .toppage_sec1 {
    margin-bottom: 100px;
  }
}
.toppage_sec1 .toppage_sec1_image1 {
  margin-left: 15%;
  display: block;
  width: 13.646vw;
}
@media screen and (max-width: 820px) {
  .toppage_sec1 .toppage_sec1_image1 {
    width: 18.293vw;
  }
}
.toppage_sec1 .toppage_sec1_image2 {
  width: 13.646vw;
  margin-left: 32.5%;
  margin-top: -2.604vw;
}
@media screen and (max-width: 820px) {
  .toppage_sec1 .toppage_sec1_image2 {
    width: 18.293vw;
  }
}
.toppage_sec1 .top_sec1_text_wrapper {
  width: 30%;
  margin-left: auto;
  margin-right: 15%;
  margin-top: -9vw;
}
@media screen and (max-width: 480px) {
  .toppage_sec1 .top_sec1_text_wrapper {
    margin-top: 50px;
    width: 80%;
    margin-right: 10%;
    margin-left: 10%;
  }
}
.toppage_sec1 .top_sec1_text_wrapper h2 {
  font-size: 40px;
  line-height: 1.5;
  margin-bottom: 30px;
}
@media screen and (max-width: 1280px) {
  .toppage_sec1 .top_sec1_text_wrapper h2 {
    font-size: 32px;
  }
}
@media screen and (max-width: 820px) {
  .toppage_sec1 .top_sec1_text_wrapper h2 {
    font-size: 20px;
  }
}
.toppage_sec1 .top_sec1_text_wrapper .top_sec1_text {
  margin-bottom: 30px;
}

.toppage_production_flow {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media screen and (max-width: 480px) {
  .toppage_production_flow {
    flex-direction: column-reverse;
    align-items: flex-end;
  }
}
.toppage_production_flow .toppage_production_flow_text_wrapper {
  width: 30%;
  position: relative;
  margin-left: 15%;
}
@media screen and (max-width: 480px) {
  .toppage_production_flow .toppage_production_flow_text_wrapper {
    width: 80%;
    margin-left: 10%;
    margin-right: 10%;
  }
}
.toppage_production_flow .toppage_production_flow_text_wrapper::before {
  content: "";
  width: 58.854vw;
  height: 58.854vw;
  background-color: #FFE498;
  border-radius: 50%;
  opacity: 0.5;
  display: block;
  position: absolute;
  left: -20.833vw;
  z-index: -1;
  bottom: 50%;
  transform: translateY(50%);
}
@media screen and (max-width: 820px) {
  .toppage_production_flow .toppage_production_flow_text_wrapper::before {
    width: 67.073vw;
    height: 67.073vw;
  }
}
@media screen and (max-width: 480px) {
  .toppage_production_flow .toppage_production_flow_text_wrapper::before {
    width: 85vw;
    height: 85vw;
  }
}
.toppage_production_flow .toppage_production_flow_text_wrapper::after {
  content: "";
  background-image: url(../img/toppage_production_flow1.png);
  width: 21.979vw;
  height: 15.208vw;
  position: absolute;
  top: -15.625vw;
  right: -15.625vw;
  background-size: cover;
}
@media screen and (max-width: 480px) {
  .toppage_production_flow .toppage_production_flow_text_wrapper::after {
    right: 15vw;
    top: -5vw;
    background-repeat: no-repeat;
  }
}
.toppage_production_flow .toppage_production_flow_text_wrapper h2 {
  font-size: 40px;
  line-height: 1.5;
  margin-bottom: 30px;
}
@media screen and (max-width: 1280px) {
  .toppage_production_flow .toppage_production_flow_text_wrapper h2 {
    font-size: 32px;
  }
}
@media screen and (max-width: 820px) {
  .toppage_production_flow .toppage_production_flow_text_wrapper h2 {
    font-size: 20px;
  }
}
.toppage_production_flow .toppage_production_flow_text_wrapper .toppage_production_flow_text {
  margin-bottom: 30px;
}
.toppage_production_flow .toppage_production_flow_rightside {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  margin-right: 15%;
  position: relative;
}
@media screen and (max-width: 480px) {
  .toppage_production_flow .toppage_production_flow_rightside {
    margin-bottom: 100px;
  }
}
.toppage_production_flow .toppage_production_flow_rightside .toppage_production_flow_horse {
  width: 5.848vw;
}
@media screen and (max-width: 480px) {
  .toppage_production_flow .toppage_production_flow_rightside .toppage_production_flow_horse {
    width: 10vw;
  }
}
.toppage_production_flow .toppage_production_flow_rightside .toppage_production_flow2 {
  width: 24.115vw;
}
@media screen and (max-width: 480px) {
  .toppage_production_flow .toppage_production_flow_rightside .toppage_production_flow2 {
    width: 35vw;
  }
}
.toppage_production_flow .toppage_production_flow_rightside::before {
  content: "";
  background-image: url(../img/toppage_production_flow3.png);
  width: 21.979vw;
  height: 15.208vw;
  position: absolute;
  background-size: cover;
  bottom: -11vw;
  left: -11vw;
  z-index: -1;
}

.toppage_blog {
  margin-top: 30vw;
  display: flex;
  /*==================================================
  スライダーのためのcss
  ===================================*/
  /*slickのJSで書かれるタグ内、スライド左右の余白調整*/
  /*矢印の設定*/
  /*戻る、次へ矢印の位置*/
  /*ドットナビゲーションの設定*/
}
.toppage_blog .toppage_blog_textside {
  margin-left: 15%;
}
@media screen and (max-width: 480px) {
  .toppage_blog .toppage_blog_textside {
    margin-left: 10%;
  }
}
.toppage_blog .toppage_blog_textside h2 {
  font-size: 40px;
  position: relative;
  line-height: 1.5;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  .toppage_blog .toppage_blog_textside h2 {
    font-size: 32px;
  }
}
.toppage_blog .toppage_blog_textside h2::before {
  content: "";
  background-image: url(../img/orange_line.svg);
  background-size: cover;
  width: 36.17px;
  height: 3px;
  position: absolute;
  top: 0;
}
@media screen and (max-width: 820px) {
  .toppage_blog .toppage_blog_textside h2::before {
    width: 30px;
  }
}
.toppage_blog .toppage_blog_textside .toppage_blog_textside_text {
  margin-bottom: 30px;
}
@media screen and (max-width: 1280px) {
  .toppage_blog .toppage_blog_textside .toppage_blog_textside_text {
    width: 50%;
  }
}
@media screen and (max-width: 820px) {
  .toppage_blog .toppage_blog_textside .toppage_blog_textside_text {
    width: 70%;
  }
}
@media screen and (max-width: 480px) {
  .toppage_blog .toppage_blog_textside .toppage_blog_textside_text {
    width: 80%;
  }
}
.toppage_blog .slider {
  /*横幅94%で左右に余白を持たせて中央寄せ*/
  width: 60%;
  margin: 0 auto;
}
@media screen and (max-width: 480px) {
  .toppage_blog .slider {
    width: 50%;
  }
}
.toppage_blog .slider img {
  width: 100%;
  /*スライダー内の画像を横幅100%に*/
  height: auto;
}
.toppage_blog .slider .slick-slide {
  margin: 0 10px;
}
.toppage_blog .slick-prev,
.toppage_blog .slick-next {
  position: absolute;
  /*絶対配置にする*/
  top: -10%;
  cursor: pointer;
  /*マウスカーソルを指マークに*/
  outline: none;
  /*クリックをしたら出てくる枠線を消す*/
  border-top: 2px solid #2AB210;
  /*矢印の色*/
  border-right: 2px solid #2AB210;
  /*矢印の色*/
  height: 15px;
  width: 15px;
}
@media screen and (max-width: 820px) {
  .toppage_blog .slick-prev,
  .toppage_blog .slick-next {
    height: 10px;
    width: 10px;
  }
}
.toppage_blog .slick-prev {
  /*戻る矢印の位置と形状*/
  right: 15%;
  transform: rotate(-135deg);
}
.toppage_blog .slick-next {
  /*次へ矢印の位置と形状*/
  right: 5%;
  transform: rotate(45deg);
}
.toppage_blog .slick-dots {
  text-align: center;
  margin: 20px 0 0 0;
}
.toppage_blog .slick-dots li {
  display: inline-block;
  margin: 0 5px;
}
.toppage_blog .slick-dots button {
  color: transparent;
  outline: none;
  width: 8px;
  /*ドットボタンのサイズ*/
  height: 8px;
  /*ドットボタンのサイズ*/
  display: block;
  border-radius: 50%;
  background: #ccc;
  /*ドットボタンの色*/
}
.toppage_blog .slick-dots .slick-active button {
  background: #333;
  /*ドットボタンの現在地表示の色*/
}
.toppage_blog .toppage_blog_content_text {
  padding: 30px;
  background-color: #C0E5B9;
  border-radius: 0 0 50px 50px;
}
@media screen and (max-width: 1280px) {
  .toppage_blog .toppage_blog_content_text {
    border-radius: 0 0 30px 30px;
  }
}
@media screen and (max-width: 820px) {
  .toppage_blog .toppage_blog_content_text {
    padding: 20px;
  }
}
.toppage_blog .toppage_blog_content_text .toppage_blog_title {
  font-size: 20px;
  line-height: 1;
}
@media screen and (max-width: 820px) {
  .toppage_blog .toppage_blog_content_text .toppage_blog_title {
    font-size: 16px;
  }
}
@media screen and (max-width: 820px) {
  .toppage_blog .toppage_blog_content_text .toppage_blog_date {
    font-size: 12px;
  }
}
.toppage_blog .toppage_blog_content_text .toppage_blog_text {
  font-size: 14px;
}

.toppage_news {
  margin-top: 20vw;
  margin-left: 15%;
  width: 70%;
  margin-bottom: 10.417vw;
}
@media screen and (max-width: 480px) {
  .toppage_news {
    margin-left: 10%;
    width: 80%;
  }
}
.toppage_news h2 {
  font-size: 40px;
  position: relative;
  line-height: 1.5;
  margin-bottom: 30px;
}
@media screen and (max-width: 820px) {
  .toppage_news h2 {
    font-size: 32px;
  }
}
.toppage_news h2::before {
  content: "";
  background-image: url(../img/orange_line.svg);
  background-size: cover;
  width: 36.17px;
  height: 3px;
  position: absolute;
  top: 0;
}
@media screen and (max-width: 820px) {
  .toppage_news h2::before {
    width: 30px;
  }
}
.toppage_news table {
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 30px;
}
.toppage_news table tr {
  border-top: #2AB210 solid 1px;
  border-bottom: #2AB210 solid 1px;
}
@media screen and (max-width: 820px) {
  .toppage_news table tr {
    font-size: 12px;
  }
}
.toppage_news table th {
  padding: 30px 0;
  display: flex;
}
@media screen and (max-width: 480px) {
  .toppage_news table th {
    padding: 15px 0;
  }
}
@media screen and (max-width: 480px) {
  .toppage_news table th {
    width: 90%;
  }
}
.toppage_news table th span {
  padding-left: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
@media screen and (max-width: 480px) {
  .toppage_news table th span {
    padding-left: 10px;
  }
}
@media screen and (max-width: 820px) {
  .toppage_news table th span img {
    width: 80px;
  }
}
.toppage_news table th span p {
  position: absolute;
  color: #ffffff;
}
.toppage_news table td {
  padding: 30px 0;
}
@media screen and (max-width: 820px) {
  .toppage_news table td {
    width: 40%;
  }
}
@media screen and (max-width: 480px) {
  .toppage_news table td {
    padding: 15px 0;
  }
}

@media screen and (max-width: 1280px) {
  .pc_hide {
    display: none;
  }
}
@media screen and (max-width: 820px) {
  .tab_hide {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .sp_hide {
    display: none;
  }
}
@media screen and (min-width: 1281px) {
  .pca_block {
    display: none;
  }
}
@media screen and (min-width: 821px) {
  .taba_block {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  .spa_block {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

.container {
  overflow: hidden;
  line-height: 2;
  font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  color: #464646;
}

.openbtn span:nth-of-type(3)::after {
  content: "Menu";
  /*3つ目の要素のafterにMenu表示を指定*/
  position: absolute;
  top: 5px;
  left: 3.5px;
  color: #2AB210;
  font-size: 20px;
  text-transform: uppercase;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3)::after {
    font-size: 16px;
  }
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 60%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

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

.openbtn.active span:nth-of-type(3)::after {
  content: "Close";
  /*3つ目の要素のafterにClose表示を指定*/
  transform: translateY(0) rotate(-45deg);
  top: 10px;
  left: 25px;
}
@media screen and (max-width: 820px) {
  .openbtn.active span:nth-of-type(3)::after {
    left: 23px;
  }
}

/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: #ffffff;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
}

#g-nav li a {
  color: #2AB210;
  padding: 10px;
  text-decoration: none;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  #g-nav li a {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav li a {
    font-size: 12px;
  }
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9999;
  /*ボタンを最前面に*/
  top: 50px;
  right: 15%;
  cursor: pointer;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 820px) {
  .openbtn {
    right: 5%;
    top: 40px;
    width: 80px;
    height: 80px;
  }
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 5px;
  border-radius: 5px;
  background-color: #2AB210;
  width: 60%;
}

.openbtn span:nth-of-type(1) {
  top: 0;
}

.openbtn span:nth-of-type(2) {
  top: 18px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(2) {
    top: 15px;
  }
}

.openbtn span:nth-of-type(3) {
  top: 36px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3) {
    top: 30px;
  }
}

#g-nav-list ul {
  width: 700px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #g-nav-list ul {
    width: 500px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav-list ul {
    width: 400px;
  }
}
#g-nav-list ul li {
  width: 50%;
}

.zenmaru {
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #2AB210;
}

header {
  position: fixed;
  background-color: #ffffff;
  z-index: 1000;
  width: 100%;
}
header h1 img {
  width: 100px;
  margin-left: 15%;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  header h1 img {
    width: 80px;
    margin-left: 5%;
  }
}

.viewmore {
  position: relative;
  line-height: 1;
}

.viewmore_a {
  position: relative;
  display: inline-block;
}
.viewmore_a::after {
  content: url(../img/viewmore_arrow.svg);
  position: absolute;
  right: -30px;
  top: 0;
  line-height: 1;
}

.viewmore_right {
  text-align: right;
}

footer .footer1 {
  margin-left: 5%;
  margin-right: 30px;
  width: 4.427vw;
}
@media screen and (max-width: 820px) {
  footer .footer1 {
    margin-right: 10px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer1 {
    width: 9vw;
  }
}
footer .footer2 {
  width: 7.382vw;
}
@media screen and (max-width: 480px) {
  footer .footer2 {
    width: 15vw;
  }
}
footer .footer_wrapper {
  background-color: #FFE498;
}
footer .footer_wrapper .footer_content {
  padding-top: 5.208vw;
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content {
    width: 80%;
  }
}
footer .footer_wrapper .footer_content .company_name {
  font-family: "游明朝", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
footer .footer_wrapper .footer_content .company_name span {
  font-size: 48px;
}
footer .footer_wrapper .footer_content nav {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content nav {
    width: 60%;
  }
}
footer .footer_wrapper .footer_content nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
footer .footer_wrapper small {
  margin: 50px auto 0 auto;
  padding-bottom: 10px;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 820px) {
  footer .footer_wrapper small {
    margin-top: 10px;
    margin-right: 5%;
  }
}

.products_top {
  margin-top: 200px;
  display: flex;
  align-items: center;
}
.products_top h2 {
  font-size: 40px;
  writing-mode: vertical-rl;
  letter-spacing: 0.5em;
  margin-left: 15%;
  position: relative;
  line-height: 1.5;
}
@media screen and (max-width: 1280px) {
  .products_top h2 {
    font-size: 32px;
  }
}
@media screen and (max-width: 480px) {
  .products_top h2 {
    font-size: 24px;
  }
}
.products_top h2::before {
  content: "";
  width: 12.188vw;
  height: 12.188vw;
  background-color: #C0E5B9;
  position: absolute;
  border-radius: 50%;
  opacity: 0.5;
  z-index: -1;
  top: -6.25vw;
  left: -2.604vw;
}
@media screen and (max-width: 820px) {
  .products_top h2::before {
    width: 20vw;
    height: 20vw;
    top: -10vw;
    left: -9vw;
  }
}
.products_top h2::after {
  content: "";
  background-image: url(../img/orange_line_vertical.svg);
  width: 3px;
  height: 1em;
  position: absolute;
  top: 3px;
  right: 0;
}
.products_top img {
  margin-left: auto;
  display: block;
  width: 67.917vw;
}

.products_sec1 {
  margin-top: 15.625vw;
}
.products_sec1 .products_sec1_contents {
  display: flex;
  justify-content: space-between;
  position: relative;
  align-items: center;
}
@media screen and (max-width: 480px) {
  .products_sec1 .products_sec1_contents {
    flex-direction: column-reverse;
  }
}
.products_sec1 .products_sec1_contents::before {
  content: "";
  background-color: #FFE498;
  width: 13.646vw;
  height: 13.646vw;
  position: absolute;
  border-radius: 50%;
  opacity: 0.5;
  top: -15.625vw;
  left: 10.417vw;
}
@media screen and (max-width: 480px) {
  .products_sec1 .products_sec1_contents::before {
    width: 23vw;
    height: 23vw;
  }
}
.products_sec1 .products_sec1_contents::after {
  content: "";
  background-color: #FFE498;
  width: 11.771vw;
  height: 11.771vw;
  position: absolute;
  border-radius: 50%;
  opacity: 0.5;
  top: -7vw;
  left: 5vw;
}
@media screen and (max-width: 480px) {
  .products_sec1 .products_sec1_contents::after {
    width: 18vw;
    height: 18vw;
    top: 0vw;
    left: 5vw;
    z-index: -1;
  }
}
.products_sec1 .products_sec1_contents img {
  width: 18.542vw;
  margin-left: 15%;
  margin-top: 50px;
}
@media screen and (max-width: 820px) {
  .products_sec1 .products_sec1_contents img {
    width: 25vw;
    margin-left: 10%;
  }
}
@media screen and (max-width: 480px) {
  .products_sec1 .products_sec1_contents img {
    width: 35vw;
    margin-left: auto;
    margin-right: 10%;
    margin-top: 0;
  }
}
.products_sec1 .products_sec1_contents .products_sec1_text_side {
  width: 30%;
  margin-right: 20%;
}
@media screen and (max-width: 820px) {
  .products_sec1 .products_sec1_contents .products_sec1_text_side {
    margin-right: 10%;
    width: 40%;
  }
}
@media screen and (max-width: 480px) {
  .products_sec1 .products_sec1_contents .products_sec1_text_side {
    margin-right: 0;
    width: 80%;
  }
}
.products_sec1 .products_sec1_contents .products_sec1_text_side h2 {
  font-size: 38px;
  line-height: 1.5;
  margin-bottom: 30px;
}
@media screen and (max-width: 1280px) {
  .products_sec1 .products_sec1_contents .products_sec1_text_side h2 {
    font-size: 32px;
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 820px) {
  .products_sec1 .products_sec1_contents .products_sec1_text_side h2 {
    text-align: center;
  }
}
@media screen and (max-width: 480px) {
  .products_sec1 .products_sec1_contents .products_sec1_text_side h2 {
    font-size: 24px;
  }
}
.products_sec1 .products_sec1image2 {
  width: 13.646vw;
  margin-left: 45%;
  margin-top: -2.604vw;
}
@media screen and (max-width: 1280px) {
  .products_sec1 .products_sec1image2 {
    margin-left: 30%;
  }
}
@media screen and (max-width: 820px) {
  .products_sec1 .products_sec1image2 {
    width: 15vw;
    margin-top: -5vw;
  }
}
@media screen and (max-width: 480px) {
  .products_sec1 .products_sec1image2 {
    width: 25vw;
    margin-left: 35%;
    margin-top: -50px;
  }
}

.products_oem {
  margin-top: 10.417vw;
}
.products_oem .products_oem_image_contents {
  display: flex;
  align-items: center;
  justify-content: space-around;
}
@media screen and (max-width: 480px) {
  .products_oem .products_oem_image_contents {
    flex-direction: column;
    justify-content: center;
  }
}
.products_oem .products_oem_image_contents .products_oem1_wrapper {
  position: relative;
}
.products_oem .products_oem_image_contents .products_oem1_wrapper .products_oem1 {
  width: 14.896vw;
  margin-top: -100px;
}
@media screen and (max-width: 480px) {
  .products_oem .products_oem_image_contents .products_oem1_wrapper .products_oem1 {
    margin-top: 0px;
    margin-left: 150px;
    width: 25vw;
  }
}
.products_oem .products_oem_image_contents .products_oem1_wrapper::after {
  content: "";
  background-color: #FFE498;
  width: 8.229vw;
  height: 8.229vw;
  position: absolute;
  border-radius: 50%;
  opacity: 0.5;
  top: -7.813vw;
  right: -2.604vw;
  z-index: -1;
}
@media screen and (max-width: 480px) {
  .products_oem .products_oem_image_contents .products_oem1_wrapper::after {
    width: 15vw;
    height: 15vw;
    right: -8vw;
    top: 35vw;
  }
}
.products_oem .products_oem_image_contents .products_oem2 {
  margin-top: 200px;
  width: 12.5vw;
}
@media screen and (max-width: 480px) {
  .products_oem .products_oem_image_contents .products_oem2 {
    margin-top: -50px;
    margin-right: 200px;
    width: 20vw;
  }
}
.products_oem .products_oem_image_contents .products_oem3_wrapper {
  position: relative;
}
.products_oem .products_oem_image_contents .products_oem3_wrapper::before {
  content: "";
  width: 9.635vw;
  height: 9.635vw;
  background-color: #FFE498;
  position: absolute;
  border-radius: 50%;
  opacity: 0.5;
  bottom: -5.208vw;
  left: -2.604vw;
  z-index: -1;
}
@media screen and (max-width: 480px) {
  .products_oem .products_oem_image_contents .products_oem3_wrapper::before {
    width: 20vw;
    height: 20vw;
    left: -20vw;
    bottom: 25vw;
  }
}
.products_oem .products_oem_image_contents .products_oem3_wrapper .products_oem3 {
  width: 14.896vw;
}
@media screen and (max-width: 480px) {
  .products_oem .products_oem_image_contents .products_oem3_wrapper .products_oem3 {
    width: 25vw;
    margin-right: 100px;
    margin-top: 30px;
  }
}
.products_oem .products_oem_image_contents .products_oem4 {
  width: 12.5vw;
  margin-top: 150px;
}
@media screen and (max-width: 480px) {
  .products_oem .products_oem_image_contents .products_oem4 {
    margin-top: 0px;
    width: 20vw;
    margin-left: 200px;
  }
}
.products_oem .products_oem_image_contents .products_oem_main_contents {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.products_oem .products_oem_image_contents .products_oem_main_contents img {
  width: 20.938vw;
}
@media screen and (max-width: 820px) {
  .products_oem .products_oem_image_contents .products_oem_main_contents img {
    width: 200px;
  }
}
.products_oem .products_oem_image_contents .products_oem_main_contents h2 {
  position: absolute;
  font-size: 38px;
  text-align: center;
  line-height: 1.5;
}
@media screen and (max-width: 1280px) {
  .products_oem .products_oem_image_contents .products_oem_main_contents h2 {
    font-size: 24px;
  }
}
.products_oem table {
  width: 70%;
  margin: 5.208vw auto 0 auto;
  border-collapse: collapse;
  position: relative;
}
@media screen and (max-width: 480px) {
  .products_oem table {
    width: 80%;
  }
}
.products_oem table::before {
  content: "";
  width: 9.427vw;
  height: 9.427vw;
  background-color: #C0E5B9;
  position: absolute;
  border-radius: 50%;
  opacity: 0.5;
  bottom: -13.021vw;
  right: -10.417vw;
}
@media screen and (max-width: 480px) {
  .products_oem table::before {
    width: 20vw;
    height: 20vw;
    bottom: -25vw;
    right: 0;
  }
}
.products_oem table::after {
  content: "";
  width: 6.927vw;
  height: 6.927vw;
  background-color: #C0E5B9;
  position: absolute;
  border-radius: 50%;
  opacity: 0.5;
  bottom: -16.667vw;
  right: -5.729vw;
}
@media screen and (max-width: 480px) {
  .products_oem table::after {
    width: 15vw;
    height: 15vw;
    right: 10vw;
    bottom: -30vw;
  }
}
.products_oem table tr {
  border-top: solid 1px #2AB210;
  border-bottom: solid 1px #2AB210;
}
.products_oem table th,
.products_oem table td {
  padding: 30px 0;
  vertical-align: middle;
}
@media screen and (max-width: 1280px) {
  .products_oem table th,
  .products_oem table td {
    padding: 10px 0;
  }
}
.products_oem table th {
  font-size: 40px;
  width: 10%;
  text-align: right;
  padding-right: 30px;
}
@media screen and (max-width: 1280px) {
  .products_oem table th {
    font-size: 24px;
  }
}
.products_oem table td {
  font-size: 24px;
}
@media screen and (max-width: 1280px) {
  .products_oem table td {
    font-size: 16px;
  }
}

.products_all {
  width: 70%;
  margin: 18vw auto 0 auto;
}
@media screen and (max-width: 820px) {
  .products_all {
    width: 50%;
  }
}
@media screen and (max-width: 480px) {
  .products_all {
    width: 70%;
  }
}
.products_all h2 {
  font-size: 38px;
}
@media screen and (max-width: 1280px) {
  .products_all h2 {
    font-size: 32px;
  }
}
@media screen and (max-width: 820px) {
  .products_all h2 {
    margin-bottom: 50px;
  }
}
@media screen and (max-width: 480px) {
  .products_all h2 {
    font-size: 24px;
  }
}
.products_all .products_all_wrapper {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media screen and (max-width: 820px) {
  .products_all .products_all_wrapper {
    display: block;
  }
}
.products_all .products_all_wrapper li {
  width: 25.729vw;
  margin-bottom: 10.417vw;
}
@media screen and (max-width: 820px) {
  .products_all .products_all_wrapper li {
    width: 100%;
  }
}
.products_all .products_all_wrapper li img {
  width: 100%;
}
.products_all .products_all_wrapper li:last-of-type {
  margin-bottom: 0;
}
@media screen and (max-width: 820px) {
  .products_all .products_all_wrapper li:last-of-type {
    margin-bottom: 10.417vw;
  }
}
.products_all .products_all_wrapper li .product_name {
  font-size: 20px;
  margin-top: 30px;
  margin-bottom: 10px;
}
.products_all .products_all_wrapper li .cartjs_product_table table {
  margin: 0 0 15px 0 !important;
}
@media screen and (max-width: 1280px) {
  .products_all .products_all_wrapper li .cartjs_product_table table {
    width: 80% !important;
  }
}
.products_all .products_all_wrapper li .cartjs_product_num td input {
  border: solid 1px #464646 !important;
  border-radius: 10px !important;
}
.products_all .products_all_wrapper li .cartjs_product_num td input:focus {
  outline: #464646 solid 2px !important;
}
.products_all .products_all_wrapper li .cartjs_cart_in input {
  background-color: #464646 !important;
}
@media screen and (max-width: 1280px) {
  .products_all .products_all_wrapper li .cartjs_cart_in input {
    height: 40px !important;
  }
}

.products_horse {
  margin-left: 5%;
  margin-top: -10.417vw;
  margin-bottom: 10.417vw;
  width: 26.042vw;
}

@media screen and (max-width: 1280px) {
  .pc_hide {
    display: none;
  }
}
@media screen and (max-width: 820px) {
  .tab_hide {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .sp_hide {
    display: none;
  }
}
@media screen and (min-width: 1281px) {
  .pca_block {
    display: none;
  }
}
@media screen and (min-width: 821px) {
  .taba_block {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  .spa_block {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

.container {
  overflow: hidden;
  line-height: 2;
  font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  color: #464646;
}

.openbtn span:nth-of-type(3)::after {
  content: "Menu";
  /*3つ目の要素のafterにMenu表示を指定*/
  position: absolute;
  top: 5px;
  left: 3.5px;
  color: #2AB210;
  font-size: 20px;
  text-transform: uppercase;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3)::after {
    font-size: 16px;
  }
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 60%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

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

.openbtn.active span:nth-of-type(3)::after {
  content: "Close";
  /*3つ目の要素のafterにClose表示を指定*/
  transform: translateY(0) rotate(-45deg);
  top: 10px;
  left: 25px;
}
@media screen and (max-width: 820px) {
  .openbtn.active span:nth-of-type(3)::after {
    left: 23px;
  }
}

/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: #ffffff;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
}

#g-nav li a {
  color: #2AB210;
  padding: 10px;
  text-decoration: none;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  #g-nav li a {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav li a {
    font-size: 12px;
  }
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9999;
  /*ボタンを最前面に*/
  top: 50px;
  right: 15%;
  cursor: pointer;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 820px) {
  .openbtn {
    right: 5%;
    top: 40px;
    width: 80px;
    height: 80px;
  }
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 5px;
  border-radius: 5px;
  background-color: #2AB210;
  width: 60%;
}

.openbtn span:nth-of-type(1) {
  top: 0;
}

.openbtn span:nth-of-type(2) {
  top: 18px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(2) {
    top: 15px;
  }
}

.openbtn span:nth-of-type(3) {
  top: 36px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3) {
    top: 30px;
  }
}

#g-nav-list ul {
  width: 700px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #g-nav-list ul {
    width: 500px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav-list ul {
    width: 400px;
  }
}
#g-nav-list ul li {
  width: 50%;
}

.zenmaru {
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #2AB210;
}

header {
  position: fixed;
  background-color: #ffffff;
  z-index: 1000;
  width: 100%;
}
header h1 img {
  width: 100px;
  margin-left: 15%;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  header h1 img {
    width: 80px;
    margin-left: 5%;
  }
}

.viewmore {
  position: relative;
  line-height: 1;
}

.viewmore_a {
  position: relative;
  display: inline-block;
}
.viewmore_a::after {
  content: url(../img/viewmore_arrow.svg);
  position: absolute;
  right: -30px;
  top: 0;
  line-height: 1;
}

.viewmore_right {
  text-align: right;
}

footer .footer1 {
  margin-left: 5%;
  margin-right: 30px;
  width: 4.427vw;
}
@media screen and (max-width: 820px) {
  footer .footer1 {
    margin-right: 10px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer1 {
    width: 9vw;
  }
}
footer .footer2 {
  width: 7.382vw;
}
@media screen and (max-width: 480px) {
  footer .footer2 {
    width: 15vw;
  }
}
footer .footer_wrapper {
  background-color: #FFE498;
}
footer .footer_wrapper .footer_content {
  padding-top: 5.208vw;
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content {
    width: 80%;
  }
}
footer .footer_wrapper .footer_content .company_name {
  font-family: "游明朝", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
footer .footer_wrapper .footer_content .company_name span {
  font-size: 48px;
}
footer .footer_wrapper .footer_content nav {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content nav {
    width: 60%;
  }
}
footer .footer_wrapper .footer_content nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
footer .footer_wrapper small {
  margin: 50px auto 0 auto;
  padding-bottom: 10px;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 820px) {
  footer .footer_wrapper small {
    margin-top: 10px;
    margin-right: 5%;
  }
}

.production_flow_top {
  margin-top: 140px;
}
.production_flow_top .production_flow_top_image {
  width: 100vw;
}
@media screen and (max-width: 480px) {
  .production_flow_top .production_flow_top_image {
    height: 50vh;
    width: auto;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: -500px;
       object-position: -500px;
  }
}
.production_flow_top .production_flow_title_wrapper {
  background-color: #2AB210;
  width: 22.031vw;
  height: 22.031vw;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 10%;
  margin-top: -11.458vw;
  position: relative;
  z-index: 10;
}
@media screen and (max-width: 1280px) {
  .production_flow_top .production_flow_title_wrapper {
    width: 250px;
    height: 250px;
  }
}
@media screen and (max-width: 480px) {
  .production_flow_top .production_flow_title_wrapper {
    margin-bottom: 50px;
  }
}
.production_flow_top .production_flow_title {
  text-align: center;
  color: #ffffff;
}
.production_flow_top .production_flow_title h2 {
  font-size: 38px;
  color: #ffffff;
}
@media screen and (max-width: 1280px) {
  .production_flow_top .production_flow_title h2 {
    font-size: 32px;
  }
}
@media screen and (max-width: 820px) {
  .production_flow_top .production_flow_title h2 {
    font-size: 24px;
  }
}

.production_flow_main .production_flow_content {
  width: 25.677vw;
  height: 25.677vw;
  background-color: #FFE498;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
@media screen and (max-width: 820px) {
  .production_flow_main .production_flow_content {
    background-color: #ffffff;
    width: 40%;
    height: auto;
    margin-bottom: 50px;
  }
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_content {
    width: 80%;
  }
}
.production_flow_main .production_flow_content .production_flow_content_inner {
  width: 70%;
}
@media screen and (max-width: 820px) {
  .production_flow_main .production_flow_content .production_flow_content_inner {
    width: 100%;
  }
}
.production_flow_main .production_flow_content .production_flow_content_inner h3 {
  font-size: 24px;
}
@media screen and (max-width: 1280px) {
  .production_flow_main .production_flow_content .production_flow_content_inner h3 {
    font-size: 20px;
  }
}
.production_flow_main .production_flow_content .production_flow_content_inner h3 span {
  font-size: 40px;
  margin-right: 20px;
  position: relative;
}
@media screen and (max-width: 1280px) {
  .production_flow_main .production_flow_content .production_flow_content_inner h3 span {
    font-size: 24px;
  }
}
.production_flow_main .production_flow_content .production_flow_content_inner h3 span::after {
  content: "";
  background-image: url(../img/orange_line.svg);
  width: 1em;
  height: 3px;
  position: absolute;
  bottom: 0;
  left: 0;
}
.production_flow_main .production_flow_first_wrapper {
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_first_wrapper {
    flex-direction: column-reverse;
    width: 80%;
  }
}
.production_flow_main .production_flow_first_wrapper .production_flow1_wrapper {
  position: relative;
}
.production_flow_main .production_flow_first_wrapper .production_flow1_wrapper::before {
  content: "";
  width: 9.427vw;
  height: 9.427vw;
  background-color: #C0E5B9;
  position: absolute;
  bottom: -5.208vw;
  left: -5.208vw;
  border-radius: 50%;
  opacity: 0.5;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_first_wrapper .production_flow1_wrapper::before {
    width: 20vw;
    height: 20vw;
    left: -10vw;
    bottom: 10vw;
  }
}
.production_flow_main .production_flow_first_wrapper .production_flow1_wrapper img {
  width: 21.979vw;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_first_wrapper .production_flow1_wrapper img {
    width: 50vw;
    margin-bottom: 100px;
  }
}
.production_flow_main .production_flow_first_wrapper .production_flow_horse1 {
  position: absolute;
  top: 2.604vw;
  right: 0;
  width: 6.075vw;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_first_wrapper .production_flow_horse1 {
    width: 10vw;
  }
}
.production_flow_main .production_flow_content2 {
  margin-left: 35%;
  position: relative;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_content2 {
    margin-left: 20%;
    width: 60%;
  }
}
.production_flow_main .production_flow_content3 {
  margin-left: 15%;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_content3 {
    width: 60%;
    margin-left: 0;
  }
}
.production_flow_main .production_flow_flex2 {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_flex2 {
    flex-direction: column;
    justify-content: flex-start;
  }
}
.production_flow_main .production_flow_flex2 .production_flow2_wrapper {
  margin-right: 15%;
  position: relative;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_flex2 .production_flow2_wrapper {
    margin-right: 0;
  }
}
.production_flow_main .production_flow_flex2 .production_flow2_wrapper::after {
  content: "";
  width: 9.427vw;
  height: 9.427vw;
  background-color: #C0E5B9;
  border-radius: 50%;
  opacity: 0.5;
  position: absolute;
  bottom: -10.417vw;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_flex2 .production_flow2_wrapper::after {
    bottom: 10vw;
    right: -10vw;
    width: 20vw;
    height: 20vw;
  }
}
.production_flow_main .production_flow_flex2 .production_flow2_wrapper img {
  width: 26.458vw;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_flex2 .production_flow2_wrapper img {
    width: 40vw;
    margin-bottom: 100px;
  }
}
.production_flow_main .production_flow_content4 {
  margin-left: 35%;
  position: relative;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_content4 {
    margin-bottom: 35vw;
  }
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_content4 {
    margin-left: 20%;
    width: 60%;
  }
}
.production_flow_main .production_flow_content4 img {
  position: absolute;
  bottom: -10.417vw;
  left: -15vw;
  width: 14.896vw;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_content4 img {
    width: 25vw;
    left: 25vw;
    bottom: -25vw;
  }
}
.production_flow_main .production_flow_content5 {
  margin-left: 55%;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_content5 {
    margin-left: 20%;
    width: 60%;
  }
}
.production_flow_main .production_flow4_wrapper {
  display: flex;
  flex-direction: column;
  margin-right: 50px;
  position: relative;
  margin-top: -7.813vw;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow4_wrapper {
    margin-right: 0;
  }
}
.production_flow_main .production_flow4_wrapper::before {
  content: "";
  width: 9.427vw;
  height: 9.427vw;
  background-color: #C0E5B9;
  position: absolute;
  border-radius: 50%;
  opacity: 0.5;
  bottom: -7.813vw;
  left: -10.417vw;
}
@media screen and (max-width: 820px) {
  .production_flow_main .production_flow4_wrapper::before {
    left: 0;
  }
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow4_wrapper::before {
    display: none;
  }
}
.production_flow_main .production_flow4_wrapper .production_flow_horse2 {
  width: 6.382vw;
  margin-left: 3%;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow4_wrapper .production_flow_horse2 {
    width: 12vw;
    margin-left: 10%;
  }
}
.production_flow_main .production_flow4_wrapper .production_flow4 {
  width: 26.302vw;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow4_wrapper .production_flow4 {
    width: 50vw;
    margin-bottom: 50px;
  }
}
.production_flow_main .production_flow_6_wrapper {
  display: flex;
  margin-left: 15%;
}
@media screen and (max-width: 820px) {
  .production_flow_main .production_flow_6_wrapper {
    margin-left: 5%;
  }
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_6_wrapper {
    flex-direction: column-reverse;
    align-items: center;
    margin-left: 0;
  }
}
.production_flow_main .production_flow_content6 {
  position: relative;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_content6 {
    width: 60%;
  }
}
.production_flow_main .production_flow_content6 .production_flow5_wrapper {
  position: absolute;
  right: -20.833vw;
  bottom: 2.064vw;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_content6 .production_flow5_wrapper {
    display: none;
  }
}
.production_flow_main .production_flow_content6 .production_flow5_wrapper::before {
  content: "";
  width: 6.094vw;
  height: 6.094vw;
  background-color: #C0E5B9;
  border-radius: 50%;
  opacity: 0.5;
  position: absolute;
  bottom: -2.604vw;
  left: -1.563vw;
  z-index: -1;
}
.production_flow_main .production_flow_content6 .production_flow5_wrapper img {
  width: 12.5vw;
}
.production_flow_main .production_flow_content7 {
  margin-left: 20%;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_content7 {
    width: 60%;
    margin-bottom: 20.833vw;
  }
}
.production_flow_main .production_flow_content8 {
  margin-left: 40%;
  position: relative;
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_content8 {
    margin-left: 20%;
    width: 60%;
  }
}
.production_flow_main .production_flow_content8 img {
  position: absolute;
  top: -13.021vw;
  right: -26.042vw;
  width: 21.203vw;
}
@media screen and (max-width: 820px) {
  .production_flow_main .production_flow_content8 img {
    right: -10vw;
  }
}
@media screen and (max-width: 480px) {
  .production_flow_main .production_flow_content8 img {
    width: 30vw;
  }
}

@media screen and (max-width: 1280px) {
  .pc_hide {
    display: none;
  }
}
@media screen and (max-width: 820px) {
  .tab_hide {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .sp_hide {
    display: none;
  }
}
@media screen and (min-width: 1281px) {
  .pca_block {
    display: none;
  }
}
@media screen and (min-width: 821px) {
  .taba_block {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  .spa_block {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

.container {
  overflow: hidden;
  line-height: 2;
  font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  color: #464646;
}

.openbtn span:nth-of-type(3)::after {
  content: "Menu";
  /*3つ目の要素のafterにMenu表示を指定*/
  position: absolute;
  top: 5px;
  left: 3.5px;
  color: #2AB210;
  font-size: 20px;
  text-transform: uppercase;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3)::after {
    font-size: 16px;
  }
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 60%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

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

.openbtn.active span:nth-of-type(3)::after {
  content: "Close";
  /*3つ目の要素のafterにClose表示を指定*/
  transform: translateY(0) rotate(-45deg);
  top: 10px;
  left: 25px;
}
@media screen and (max-width: 820px) {
  .openbtn.active span:nth-of-type(3)::after {
    left: 23px;
  }
}

/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: #ffffff;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
}

#g-nav li a {
  color: #2AB210;
  padding: 10px;
  text-decoration: none;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  #g-nav li a {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav li a {
    font-size: 12px;
  }
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9999;
  /*ボタンを最前面に*/
  top: 50px;
  right: 15%;
  cursor: pointer;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 820px) {
  .openbtn {
    right: 5%;
    top: 40px;
    width: 80px;
    height: 80px;
  }
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 5px;
  border-radius: 5px;
  background-color: #2AB210;
  width: 60%;
}

.openbtn span:nth-of-type(1) {
  top: 0;
}

.openbtn span:nth-of-type(2) {
  top: 18px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(2) {
    top: 15px;
  }
}

.openbtn span:nth-of-type(3) {
  top: 36px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3) {
    top: 30px;
  }
}

#g-nav-list ul {
  width: 700px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #g-nav-list ul {
    width: 500px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav-list ul {
    width: 400px;
  }
}
#g-nav-list ul li {
  width: 50%;
}

.zenmaru {
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #2AB210;
}

header {
  position: fixed;
  background-color: #ffffff;
  z-index: 1000;
  width: 100%;
}
header h1 img {
  width: 100px;
  margin-left: 15%;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  header h1 img {
    width: 80px;
    margin-left: 5%;
  }
}

.viewmore {
  position: relative;
  line-height: 1;
}

.viewmore_a {
  position: relative;
  display: inline-block;
}
.viewmore_a::after {
  content: url(../img/viewmore_arrow.svg);
  position: absolute;
  right: -30px;
  top: 0;
  line-height: 1;
}

.viewmore_right {
  text-align: right;
}

footer .footer1 {
  margin-left: 5%;
  margin-right: 30px;
  width: 4.427vw;
}
@media screen and (max-width: 820px) {
  footer .footer1 {
    margin-right: 10px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer1 {
    width: 9vw;
  }
}
footer .footer2 {
  width: 7.382vw;
}
@media screen and (max-width: 480px) {
  footer .footer2 {
    width: 15vw;
  }
}
footer .footer_wrapper {
  background-color: #FFE498;
}
footer .footer_wrapper .footer_content {
  padding-top: 5.208vw;
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content {
    width: 80%;
  }
}
footer .footer_wrapper .footer_content .company_name {
  font-family: "游明朝", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
footer .footer_wrapper .footer_content .company_name span {
  font-size: 48px;
}
footer .footer_wrapper .footer_content nav {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content nav {
    width: 60%;
  }
}
footer .footer_wrapper .footer_content nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
footer .footer_wrapper small {
  margin: 50px auto 0 auto;
  padding-bottom: 10px;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 820px) {
  footer .footer_wrapper small {
    margin-top: 10px;
    margin-right: 5%;
  }
}

.blog_top {
  margin-top: 140px;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
}
@media screen and (max-width: 480px) {
  .blog_top {
    flex-direction: column-reverse;
  }
}
.blog_top h2 {
  font-size: 40px;
  width: 20%;
  padding-bottom: 10.417vw;
  position: relative;
  line-height: 1.5;
}
@media screen and (max-width: 480px) {
  .blog_top h2 {
    font-size: 24px;
    margin-right: auto;
    margin-left: 10%;
    margin-top: 50px;
  }
}
.blog_top h2::before {
  content: "";
  background-image: url(../img/orange_line.svg);
  width: 1em;
  height: 3px;
  position: absolute;
}
.blog_top .blog_top_image {
  width: 59.583vw;
}
@media screen and (max-width: 480px) {
  .blog_top .blog_top_image {
    height: 50vh;
    width: auto;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: 100px;
       object-position: 100px;
  }
}

.blog_main {
  margin-top: 10.417vw;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1280px) {
  .blog_main {
    width: 80%;
  }
}
@media screen and (max-width: 480px) {
  .blog_main {
    width: 60%;
  }
}
.blog_main ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media screen and (max-width: 480px) {
  .blog_main ul {
    display: block;
  }
}
.blog_main ul li {
  margin-bottom: 5.208vw;
  width: 30%;
}
@media screen and (max-width: 820px) {
  .blog_main ul li {
    width: 45%;
  }
}
@media screen and (max-width: 480px) {
  .blog_main ul li {
    width: 100%;
  }
}
.blog_main ul li img {
  width: 100%;
}
.blog_main ul li .toppage_blog_content_text {
  padding: 30px;
  background-color: #C0E5B9;
  border-radius: 0 0 50px 50px;
}
@media screen and (max-width: 1280px) {
  .blog_main ul li .toppage_blog_content_text {
    border-radius: 0 0 30px 30px;
  }
}

@media screen and (max-width: 1280px) {
  .pc_hide {
    display: none;
  }
}
@media screen and (max-width: 820px) {
  .tab_hide {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .sp_hide {
    display: none;
  }
}
@media screen and (min-width: 1281px) {
  .pca_block {
    display: none;
  }
}
@media screen and (min-width: 821px) {
  .taba_block {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  .spa_block {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

.container {
  overflow: hidden;
  line-height: 2;
  font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  color: #464646;
}

.openbtn span:nth-of-type(3)::after {
  content: "Menu";
  /*3つ目の要素のafterにMenu表示を指定*/
  position: absolute;
  top: 5px;
  left: 3.5px;
  color: #2AB210;
  font-size: 20px;
  text-transform: uppercase;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3)::after {
    font-size: 16px;
  }
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 60%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

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

.openbtn.active span:nth-of-type(3)::after {
  content: "Close";
  /*3つ目の要素のafterにClose表示を指定*/
  transform: translateY(0) rotate(-45deg);
  top: 10px;
  left: 25px;
}
@media screen and (max-width: 820px) {
  .openbtn.active span:nth-of-type(3)::after {
    left: 23px;
  }
}

/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: #ffffff;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
}

#g-nav li a {
  color: #2AB210;
  padding: 10px;
  text-decoration: none;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  #g-nav li a {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav li a {
    font-size: 12px;
  }
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9999;
  /*ボタンを最前面に*/
  top: 50px;
  right: 15%;
  cursor: pointer;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 820px) {
  .openbtn {
    right: 5%;
    top: 40px;
    width: 80px;
    height: 80px;
  }
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 5px;
  border-radius: 5px;
  background-color: #2AB210;
  width: 60%;
}

.openbtn span:nth-of-type(1) {
  top: 0;
}

.openbtn span:nth-of-type(2) {
  top: 18px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(2) {
    top: 15px;
  }
}

.openbtn span:nth-of-type(3) {
  top: 36px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3) {
    top: 30px;
  }
}

#g-nav-list ul {
  width: 700px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #g-nav-list ul {
    width: 500px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav-list ul {
    width: 400px;
  }
}
#g-nav-list ul li {
  width: 50%;
}

.zenmaru {
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #2AB210;
}

header {
  position: fixed;
  background-color: #ffffff;
  z-index: 1000;
  width: 100%;
}
header h1 img {
  width: 100px;
  margin-left: 15%;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  header h1 img {
    width: 80px;
    margin-left: 5%;
  }
}

.viewmore {
  position: relative;
  line-height: 1;
}

.viewmore_a {
  position: relative;
  display: inline-block;
}
.viewmore_a::after {
  content: url(../img/viewmore_arrow.svg);
  position: absolute;
  right: -30px;
  top: 0;
  line-height: 1;
}

.viewmore_right {
  text-align: right;
}

footer .footer1 {
  margin-left: 5%;
  margin-right: 30px;
  width: 4.427vw;
}
@media screen and (max-width: 820px) {
  footer .footer1 {
    margin-right: 10px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer1 {
    width: 9vw;
  }
}
footer .footer2 {
  width: 7.382vw;
}
@media screen and (max-width: 480px) {
  footer .footer2 {
    width: 15vw;
  }
}
footer .footer_wrapper {
  background-color: #FFE498;
}
footer .footer_wrapper .footer_content {
  padding-top: 5.208vw;
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content {
    width: 80%;
  }
}
footer .footer_wrapper .footer_content .company_name {
  font-family: "游明朝", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
footer .footer_wrapper .footer_content .company_name span {
  font-size: 48px;
}
footer .footer_wrapper .footer_content nav {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content nav {
    width: 60%;
  }
}
footer .footer_wrapper .footer_content nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
footer .footer_wrapper small {
  margin: 50px auto 0 auto;
  padding-bottom: 10px;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 820px) {
  footer .footer_wrapper small {
    margin-top: 10px;
    margin-right: 5%;
  }
}

.news_top {
  width: 59.583vw;
}
@media screen and (max-width: 480px) {
  .news_top {
    height: 50vh;
    width: auto;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: 50px;
       object-position: 50px;
  }
}

.news_main {
  margin-top: 10.417vw;
  width: 70%;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 10.417vw;
}
@media screen and (max-width: 480px) {
  .news_main {
    width: 80%;
  }
}
.news_main table {
  border-collapse: collapse;
  width: 100%;
  margin-bottom: 30px;
}
.news_main table tr {
  border-top: #2AB210 solid 1px;
  border-bottom: #2AB210 solid 1px;
}
@media screen and (max-width: 820px) {
  .news_main table tr {
    font-size: 12px;
  }
}
.news_main table th {
  padding: 30px 0;
  display: flex;
}
@media screen and (max-width: 480px) {
  .news_main table th {
    padding: 15px 0;
  }
}
@media screen and (max-width: 480px) {
  .news_main table th {
    width: 90%;
  }
}
.news_main table th span {
  padding-left: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}
@media screen and (max-width: 480px) {
  .news_main table th span {
    padding-left: 10px;
  }
}
@media screen and (max-width: 820px) {
  .news_main table th span img {
    width: 80px;
  }
}
.news_main table th span p {
  position: absolute;
  color: #ffffff;
}
.news_main table td {
  padding: 30px 0;
}
@media screen and (max-width: 820px) {
  .news_main table td {
    width: 40%;
  }
}
@media screen and (max-width: 480px) {
  .news_main table td {
    padding: 15px 0;
  }
}

@media screen and (max-width: 1280px) {
  .pc_hide {
    display: none;
  }
}
@media screen and (max-width: 820px) {
  .tab_hide {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .sp_hide {
    display: none;
  }
}
@media screen and (min-width: 1281px) {
  .pca_block {
    display: none;
  }
}
@media screen and (min-width: 821px) {
  .taba_block {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  .spa_block {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

.container {
  overflow: hidden;
  line-height: 2;
  font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  color: #464646;
}

.openbtn span:nth-of-type(3)::after {
  content: "Menu";
  /*3つ目の要素のafterにMenu表示を指定*/
  position: absolute;
  top: 5px;
  left: 3.5px;
  color: #2AB210;
  font-size: 20px;
  text-transform: uppercase;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3)::after {
    font-size: 16px;
  }
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 60%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

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

.openbtn.active span:nth-of-type(3)::after {
  content: "Close";
  /*3つ目の要素のafterにClose表示を指定*/
  transform: translateY(0) rotate(-45deg);
  top: 10px;
  left: 25px;
}
@media screen and (max-width: 820px) {
  .openbtn.active span:nth-of-type(3)::after {
    left: 23px;
  }
}

/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: #ffffff;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
}

#g-nav li a {
  color: #2AB210;
  padding: 10px;
  text-decoration: none;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  #g-nav li a {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav li a {
    font-size: 12px;
  }
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9999;
  /*ボタンを最前面に*/
  top: 50px;
  right: 15%;
  cursor: pointer;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 820px) {
  .openbtn {
    right: 5%;
    top: 40px;
    width: 80px;
    height: 80px;
  }
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 5px;
  border-radius: 5px;
  background-color: #2AB210;
  width: 60%;
}

.openbtn span:nth-of-type(1) {
  top: 0;
}

.openbtn span:nth-of-type(2) {
  top: 18px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(2) {
    top: 15px;
  }
}

.openbtn span:nth-of-type(3) {
  top: 36px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3) {
    top: 30px;
  }
}

#g-nav-list ul {
  width: 700px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #g-nav-list ul {
    width: 500px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav-list ul {
    width: 400px;
  }
}
#g-nav-list ul li {
  width: 50%;
}

.zenmaru {
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #2AB210;
}

header {
  position: fixed;
  background-color: #ffffff;
  z-index: 1000;
  width: 100%;
}
header h1 img {
  width: 100px;
  margin-left: 15%;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  header h1 img {
    width: 80px;
    margin-left: 5%;
  }
}

.viewmore {
  position: relative;
  line-height: 1;
}

.viewmore_a {
  position: relative;
  display: inline-block;
}
.viewmore_a::after {
  content: url(../img/viewmore_arrow.svg);
  position: absolute;
  right: -30px;
  top: 0;
  line-height: 1;
}

.viewmore_right {
  text-align: right;
}

footer .footer1 {
  margin-left: 5%;
  margin-right: 30px;
  width: 4.427vw;
}
@media screen and (max-width: 820px) {
  footer .footer1 {
    margin-right: 10px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer1 {
    width: 9vw;
  }
}
footer .footer2 {
  width: 7.382vw;
}
@media screen and (max-width: 480px) {
  footer .footer2 {
    width: 15vw;
  }
}
footer .footer_wrapper {
  background-color: #FFE498;
}
footer .footer_wrapper .footer_content {
  padding-top: 5.208vw;
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content {
    width: 80%;
  }
}
footer .footer_wrapper .footer_content .company_name {
  font-family: "游明朝", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
footer .footer_wrapper .footer_content .company_name span {
  font-size: 48px;
}
footer .footer_wrapper .footer_content nav {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content nav {
    width: 60%;
  }
}
footer .footer_wrapper .footer_content nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
footer .footer_wrapper small {
  margin: 50px auto 0 auto;
  padding-bottom: 10px;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 820px) {
  footer .footer_wrapper small {
    margin-top: 10px;
    margin-right: 5%;
  }
}

.company_top {
  margin-top: 140px;
  width: 100vw;
}
@media screen and (max-width: 480px) {
  .company_top {
    height: 50vh;
    width: auto;
    -o-object-fit: cover;
       object-fit: cover;
    -o-object-position: -500px;
       object-position: -500px;
  }
}

.message {
  margin-top: 10.417vw;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 480px) {
  .message {
    width: 80%;
  }
}
.message h2 {
  font-size: 40px;
  position: relative;
  line-height: 1.5;
}
@media screen and (max-width: 1280px) {
  .message h2 {
    font-size: 32px;
  }
}
@media screen and (max-width: 480px) {
  .message h2 {
    font-size: 24px;
  }
}
.message h2::before {
  content: "";
  background-image: url(../img/orange_line.svg);
  width: 1em;
  height: 3px;
  position: absolute;
}
.message .message_wrapper {
  margin-top: 5.208vw;
  display: flex;
  align-items: center;
}
@media screen and (max-width: 820px) {
  .message .message_wrapper {
    flex-direction: column;
  }
}
.message .message_wrapper .message_image {
  position: relative;
  margin-right: 5.208vw;
}
.message .message_wrapper .message_image img {
  width: 22.76vw;
}
@media screen and (max-width: 480px) {
  .message .message_wrapper .message_image img {
    width: 40vw;
  }
}
.message .message_wrapper .message_image::after {
  content: "";
  width: 9.427vw;
  height: 9.427vw;
  background-color: #C0E5B9;
  border-radius: 50%;
  opacity: 0.5;
  position: absolute;
  bottom: -2.604vw;
  left: -2.604vw;
  z-index: -1;
}
@media screen and (max-width: 480px) {
  .message .message_wrapper .message_image::after {
    width: 20vw;
    height: 20vw;
    bottom: -5vw;
    left: -10vw;
  }
}
.message .message_wrapper .message_text .name {
  font-size: 24px;
  position: relative;
  margin-bottom: 10px;
}
@media screen and (max-width: 480px) {
  .message .message_wrapper .message_text .name {
    font-size: 20px;
  }
}
.message .message_wrapper .message_text .name::after {
  content: "";
  background-image: url(../img/orange_line.svg);
  width: 1.5em;
  height: 3px;
  position: absolute;
  left: 0;
  bottom: 0;
}

.company_info {
  margin-top: 15.625vw;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 480px) {
  .company_info {
    width: 80%;
  }
}
.company_info h2 {
  font-size: 40px;
  position: relative;
  line-height: 1.5;
}
@media screen and (max-width: 1280px) {
  .company_info h2 {
    font-size: 32px;
  }
}
@media screen and (max-width: 480px) {
  .company_info h2 {
    font-size: 24px;
  }
}
.company_info h2::before {
  content: "";
  background-image: url(../img/orange_line.svg);
  width: 1em;
  height: 3px;
  position: absolute;
}
.company_info .company_info_contents {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}
.company_info .company_info_contents img {
  width: 6.382vw;
}
@media screen and (max-width: 480px) {
  .company_info .company_info_contents img {
    width: 10vw;
  }
}
.company_info .company_info_contents table {
  width: 100%;
  border-collapse: collapse;
}
.company_info .company_info_contents table tr {
  border-top: #2AB210 solid 1px;
  border-bottom: #2AB210 solid 1px;
}
.company_info .company_info_contents table tr th {
  font-size: 24px;
  background-color: #FFE498;
  width: 25%;
}
@media screen and (max-width: 1280px) {
  .company_info .company_info_contents table tr th {
    font-size: 16px;
  }
}
@media screen and (max-width: 820px) {
  .company_info .company_info_contents table tr th {
    width: 30%;
  }
}
.company_info .company_info_contents table tr th,
.company_info .company_info_contents table tr td {
  padding: 30px 0 30px 50px;
  vertical-align: middle;
}
@media screen and (max-width: 1280px) {
  .company_info .company_info_contents table tr th,
  .company_info .company_info_contents table tr td {
    padding: 10px 0 10px 50px;
  }
}
@media screen and (max-width: 820px) {
  .company_info .company_info_contents table tr th,
  .company_info .company_info_contents table tr td {
    padding-left: 30px;
  }
}
@media screen and (max-width: 480px) {
  .company_info .company_info_contents table tr th,
  .company_info .company_info_contents table tr td {
    padding-left: 10px;
  }
}

.access {
  width: 60%;
  margin-top: 10.417vw;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 480px) {
  .access {
    width: 80%;
  }
}
.access h2 {
  font-size: 40px;
  position: relative;
  line-height: 1.5;
  margin-bottom: 5.208vw;
}
@media screen and (max-width: 1280px) {
  .access h2 {
    font-size: 32px;
  }
}
@media screen and (max-width: 480px) {
  .access h2 {
    font-size: 24px;
  }
}
.access h2::before {
  content: "";
  background-image: url(../img/orange_line.svg);
  width: 1em;
  height: 3px;
  position: absolute;
}
.access iframe {
  margin-bottom: 5.208vw;
}
@media screen and (max-width: 820px) {
  .access iframe {
    height: 400px;
  }
}
.access table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 5.208vw;
}
.access table tr {
  border-top: #2AB210 solid 1px;
  border-bottom: #2AB210 solid 1px;
}
.access table tr th {
  font-size: 24px;
  background-color: #FFE498;
  width: 25%;
}
@media screen and (max-width: 1280px) {
  .access table tr th {
    font-size: 16px;
  }
}
@media screen and (max-width: 820px) {
  .access table tr th {
    width: 30%;
  }
}
.access table tr th,
.access table tr td {
  padding: 30px 0 30px 50px;
  vertical-align: middle;
}
@media screen and (max-width: 1280px) {
  .access table tr th,
  .access table tr td {
    padding: 10px 0 10px 50px;
  }
}
@media screen and (max-width: 820px) {
  .access table tr th,
  .access table tr td {
    padding-left: 30px;
  }
}
@media screen and (max-width: 480px) {
  .access table tr th,
  .access table tr td {
    padding-left: 10px;
  }
}

@media screen and (max-width: 1280px) {
  .pc_hide {
    display: none;
  }
}
@media screen and (max-width: 820px) {
  .tab_hide {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .sp_hide {
    display: none;
  }
}
@media screen and (min-width: 1281px) {
  .pca_block {
    display: none;
  }
}
@media screen and (min-width: 821px) {
  .taba_block {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  .spa_block {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

.container {
  overflow: hidden;
  line-height: 2;
  font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  color: #464646;
}

.openbtn span:nth-of-type(3)::after {
  content: "Menu";
  /*3つ目の要素のafterにMenu表示を指定*/
  position: absolute;
  top: 5px;
  left: 3.5px;
  color: #2AB210;
  font-size: 20px;
  text-transform: uppercase;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3)::after {
    font-size: 16px;
  }
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 60%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

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

.openbtn.active span:nth-of-type(3)::after {
  content: "Close";
  /*3つ目の要素のafterにClose表示を指定*/
  transform: translateY(0) rotate(-45deg);
  top: 10px;
  left: 25px;
}
@media screen and (max-width: 820px) {
  .openbtn.active span:nth-of-type(3)::after {
    left: 23px;
  }
}

/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: #ffffff;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
}

#g-nav li a {
  color: #2AB210;
  padding: 10px;
  text-decoration: none;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  #g-nav li a {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav li a {
    font-size: 12px;
  }
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9999;
  /*ボタンを最前面に*/
  top: 50px;
  right: 15%;
  cursor: pointer;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 820px) {
  .openbtn {
    right: 5%;
    top: 40px;
    width: 80px;
    height: 80px;
  }
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 5px;
  border-radius: 5px;
  background-color: #2AB210;
  width: 60%;
}

.openbtn span:nth-of-type(1) {
  top: 0;
}

.openbtn span:nth-of-type(2) {
  top: 18px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(2) {
    top: 15px;
  }
}

.openbtn span:nth-of-type(3) {
  top: 36px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3) {
    top: 30px;
  }
}

#g-nav-list ul {
  width: 700px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #g-nav-list ul {
    width: 500px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav-list ul {
    width: 400px;
  }
}
#g-nav-list ul li {
  width: 50%;
}

.zenmaru {
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #2AB210;
}

header {
  position: fixed;
  background-color: #ffffff;
  z-index: 1000;
  width: 100%;
}
header h1 img {
  width: 100px;
  margin-left: 15%;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  header h1 img {
    width: 80px;
    margin-left: 5%;
  }
}

.viewmore {
  position: relative;
  line-height: 1;
}

.viewmore_a {
  position: relative;
  display: inline-block;
}
.viewmore_a::after {
  content: url(../img/viewmore_arrow.svg);
  position: absolute;
  right: -30px;
  top: 0;
  line-height: 1;
}

.viewmore_right {
  text-align: right;
}

footer .footer1 {
  margin-left: 5%;
  margin-right: 30px;
  width: 4.427vw;
}
@media screen and (max-width: 820px) {
  footer .footer1 {
    margin-right: 10px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer1 {
    width: 9vw;
  }
}
footer .footer2 {
  width: 7.382vw;
}
@media screen and (max-width: 480px) {
  footer .footer2 {
    width: 15vw;
  }
}
footer .footer_wrapper {
  background-color: #FFE498;
}
footer .footer_wrapper .footer_content {
  padding-top: 5.208vw;
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content {
    width: 80%;
  }
}
footer .footer_wrapper .footer_content .company_name {
  font-family: "游明朝", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
footer .footer_wrapper .footer_content .company_name span {
  font-size: 48px;
}
footer .footer_wrapper .footer_content nav {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content nav {
    width: 60%;
  }
}
footer .footer_wrapper .footer_content nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
footer .footer_wrapper small {
  margin: 50px auto 0 auto;
  padding-bottom: 10px;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 820px) {
  footer .footer_wrapper small {
    margin-top: 10px;
    margin-right: 5%;
  }
}

.business_top {
  width: 60%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 140px;
}
@media screen and (max-width: 820px) {
  .business_top {
    width: 80%;
  }
}
.business_top .business_top_title_content {
  display: flex;
  align-items: center;
}
.business_top .business_top_title_content h2 {
  font-size: 40px;
  position: relative;
  line-height: 1.5;
  width: 40%;
  margin-top: -5.208vw;
}
@media screen and (max-width: 1280px) {
  .business_top .business_top_title_content h2 {
    font-size: 32px;
  }
}
@media screen and (max-width: 480px) {
  .business_top .business_top_title_content h2 {
    font-size: 24px;
  }
}
.business_top .business_top_title_content h2::before {
  content: "";
  background-image: url(../img/orange_line.svg);
  width: 1em;
  height: 3px;
  position: absolute;
}
.business_top .business_top_title_content img {
  width: 24.479vw;
}
@media screen and (max-width: 820px) {
  .business_top .business_top_title_content img {
    width: 40vw;
  }
}
.business_top .business_top2_wrapper {
  position: relative;
}
.business_top .business_top2_wrapper img {
  width: 14.896vw;
}
@media screen and (max-width: 820px) {
  .business_top .business_top2_wrapper img {
    width: 20vw;
    margin-left: 10%;
  }
}
.business_top .business_top2_wrapper::after {
  content: "";
  width: 9.635vw;
  height: 9.635vw;
  background-color: #FFE498;
  position: absolute;
  border-radius: 50%;
  opacity: 0.5;
  bottom: -3vw;
  left: -3vw;
  z-index: -1;
}
@media screen and (max-width: 820px) {
  .business_top .business_top2_wrapper::after {
    width: 12vw;
    height: 12vw;
    bottom: -3vw;
    left: 3vw;
  }
}

.business_middle {
  width: 60%;
  margin-top: 10.417vw;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 820px) {
  .business_middle {
    width: 80%;
  }
}
.business_middle h2 {
  font-size: 38px;
  position: relative;
  margin-bottom: 2.604vw;
  line-height: 1.5;
}
@media screen and (max-width: 1280px) {
  .business_middle h2 {
    font-size: 24px;
  }
}
@media screen and (max-width: 480px) {
  .business_middle h2 {
    font-size: 16px;
  }
}
.business_middle h2 img {
  position: absolute;
  top: -10.417vw;
  right: 5vw;
  width: 12.5vw;
}
@media screen and (max-width: 820px) {
  .business_middle h2 img {
    width: 15vw;
  }
}
@media screen and (max-width: 480px) {
  .business_middle h2 img {
    right: 3vw;
    top: -15vw;
  }
}
.business_middle p {
  line-height: 3;
}
@media screen and (max-width: 480px) {
  .business_middle p {
    line-height: 2;
    font-size: 14px;
  }
}

.business_strongpoint {
  width: 60%;
  margin-top: 10.417vw;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 820px) {
  .business_strongpoint {
    width: 80%;
  }
}
.business_strongpoint h2 {
  font-size: 40px;
  position: relative;
  line-height: 1.5;
}
@media screen and (max-width: 1280px) {
  .business_strongpoint h2 {
    font-size: 32px;
  }
}
@media screen and (max-width: 480px) {
  .business_strongpoint h2 {
    font-size: 24px;
  }
}
.business_strongpoint h2::before {
  content: "";
  background-image: url(../img/orange_line.svg);
  width: 1em;
  height: 3px;
  position: absolute;
}
.business_strongpoint ul {
  margin-top: 5.208vw;
}
@media screen and (max-width: 480px) {
  .business_strongpoint ul {
    margin-top: 50px;
  }
}
.business_strongpoint ul li {
  display: flex;
  align-items: center;
  margin-bottom: 10.714vw;
  justify-content: space-between;
}
@media screen and (max-width: 480px) {
  .business_strongpoint ul li {
    flex-direction: column;
  }
}
.business_strongpoint ul li .strong_point_left_side {
  position: relative;
  width: 26.198vw;
}
@media screen and (max-width: 480px) {
  .business_strongpoint ul li .strong_point_left_side {
    width: 100%;
    margin-bottom: 10px;
  }
}
.business_strongpoint ul li .strong_point_left_side img {
  width: 26.198vw;
}
@media screen and (max-width: 480px) {
  .business_strongpoint ul li .strong_point_left_side img {
    width: 100%;
  }
}
.business_strongpoint ul li .strong_point_left_side p {
  font-size: 40px;
  background-color: #2AB210;
  border-radius: 50%;
  display: inline-block;
  width: 81px;
  height: 81px;
  color: #ffffff;
  text-align: center;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: -40px;
}
@media screen and (max-width: 1280px) {
  .business_strongpoint ul li .strong_point_left_side p {
    font-size: 24px;
    width: 50px;
    height: 50px;
    top: -25px;
  }
}
.business_strongpoint ul li .strong_point_right_side {
  width: 45%;
}
@media screen and (max-width: 820px) {
  .business_strongpoint ul li .strong_point_right_side {
    width: 60%;
  }
}
@media screen and (max-width: 480px) {
  .business_strongpoint ul li .strong_point_right_side {
    width: 100%;
  }
}
.business_strongpoint ul li .strong_point_right_side .strong_point_title {
  font-size: 24px;
  position: relative;
  margin-bottom: 10px;
}
@media screen and (max-width: 1280px) {
  .business_strongpoint ul li .strong_point_right_side .strong_point_title {
    font-size: 20px;
  }
}
.business_strongpoint ul li .strong_point_right_side .strong_point_title::after {
  content: "";
  background-image: url(../img/orange_line.svg);
  width: 1.5em;
  height: 3px;
  position: absolute;
  left: 0;
  bottom: 0;
}

@media screen and (max-width: 1280px) {
  .pc_hide {
    display: none;
  }
}
@media screen and (max-width: 820px) {
  .tab_hide {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .sp_hide {
    display: none;
  }
}
@media screen and (min-width: 1281px) {
  .pca_block {
    display: none;
  }
}
@media screen and (min-width: 821px) {
  .taba_block {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  .spa_block {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

.container {
  overflow: hidden;
  line-height: 2;
  font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  color: #464646;
}

.openbtn span:nth-of-type(3)::after {
  content: "Menu";
  /*3つ目の要素のafterにMenu表示を指定*/
  position: absolute;
  top: 5px;
  left: 3.5px;
  color: #2AB210;
  font-size: 20px;
  text-transform: uppercase;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3)::after {
    font-size: 16px;
  }
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 60%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

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

.openbtn.active span:nth-of-type(3)::after {
  content: "Close";
  /*3つ目の要素のafterにClose表示を指定*/
  transform: translateY(0) rotate(-45deg);
  top: 10px;
  left: 25px;
}
@media screen and (max-width: 820px) {
  .openbtn.active span:nth-of-type(3)::after {
    left: 23px;
  }
}

/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: #ffffff;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
}

#g-nav li a {
  color: #2AB210;
  padding: 10px;
  text-decoration: none;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  #g-nav li a {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav li a {
    font-size: 12px;
  }
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9999;
  /*ボタンを最前面に*/
  top: 50px;
  right: 15%;
  cursor: pointer;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 820px) {
  .openbtn {
    right: 5%;
    top: 40px;
    width: 80px;
    height: 80px;
  }
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 5px;
  border-radius: 5px;
  background-color: #2AB210;
  width: 60%;
}

.openbtn span:nth-of-type(1) {
  top: 0;
}

.openbtn span:nth-of-type(2) {
  top: 18px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(2) {
    top: 15px;
  }
}

.openbtn span:nth-of-type(3) {
  top: 36px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3) {
    top: 30px;
  }
}

#g-nav-list ul {
  width: 700px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #g-nav-list ul {
    width: 500px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav-list ul {
    width: 400px;
  }
}
#g-nav-list ul li {
  width: 50%;
}

.zenmaru {
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #2AB210;
}

header {
  position: fixed;
  background-color: #ffffff;
  z-index: 1000;
  width: 100%;
}
header h1 img {
  width: 100px;
  margin-left: 15%;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  header h1 img {
    width: 80px;
    margin-left: 5%;
  }
}

.viewmore {
  position: relative;
  line-height: 1;
}

.viewmore_a {
  position: relative;
  display: inline-block;
}
.viewmore_a::after {
  content: url(../img/viewmore_arrow.svg);
  position: absolute;
  right: -30px;
  top: 0;
  line-height: 1;
}

.viewmore_right {
  text-align: right;
}

footer .footer1 {
  margin-left: 5%;
  margin-right: 30px;
  width: 4.427vw;
}
@media screen and (max-width: 820px) {
  footer .footer1 {
    margin-right: 10px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer1 {
    width: 9vw;
  }
}
footer .footer2 {
  width: 7.382vw;
}
@media screen and (max-width: 480px) {
  footer .footer2 {
    width: 15vw;
  }
}
footer .footer_wrapper {
  background-color: #FFE498;
}
footer .footer_wrapper .footer_content {
  padding-top: 5.208vw;
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content {
    width: 80%;
  }
}
footer .footer_wrapper .footer_content .company_name {
  font-family: "游明朝", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
footer .footer_wrapper .footer_content .company_name span {
  font-size: 48px;
}
footer .footer_wrapper .footer_content nav {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content nav {
    width: 60%;
  }
}
footer .footer_wrapper .footer_content nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
footer .footer_wrapper small {
  margin: 50px auto 0 auto;
  padding-bottom: 10px;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 820px) {
  footer .footer_wrapper small {
    margin-top: 10px;
    margin-right: 5%;
  }
}

.customer_reviews_main {
  width: 80%;
  margin-top: 5.208vw;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 480px) {
  .customer_reviews_main {
    width: 90%;
  }
}
.customer_reviews_main ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.customer_reviews_main ul li {
  background-color: #FFE498;
  width: 45%;
  padding: 50px 30px 30px 0;
  margin-bottom: 5.208vw;
}
@media screen and (max-width: 820px) {
  .customer_reviews_main ul li {
    width: 100%;
  }
}
@media screen and (max-width: 480px) {
  .customer_reviews_main ul li {
    margin-bottom: 50px;
  }
}
.customer_reviews_main ul li h2 {
  font-size: 24px;
  color: #ffffff;
  background-color: #FFC219;
  display: inline-block;
  padding: 0 30px 0 150px;
  position: relative;
}
@media screen and (max-width: 1280px) {
  .customer_reviews_main ul li h2 {
    font-size: 20px;
  }
}
.customer_reviews_main ul li h2 span {
  width: 100px;
  height: 100px;
  background-color: #FFE498;
  border-radius: 50%;
  color: #FFC219;
  border: #FFC219 solid 7px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 30px;
  text-align: center;
  line-height: 1;
  font-size: 16px;
  padding: 24px 0;
}
.customer_reviews_main ul li h2 span .voice_number {
  font-size: 24px;
}
.customer_reviews_main ul li p {
  padding-left: 30px;
  margin-top: 30px;
}
.customer_reviews_main ul li p span {
  color: #2AB210;
}

@media screen and (max-width: 1280px) {
  .pc_hide {
    display: none;
  }
}
@media screen and (max-width: 820px) {
  .tab_hide {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .sp_hide {
    display: none;
  }
}
@media screen and (min-width: 1281px) {
  .pca_block {
    display: none;
  }
}
@media screen and (min-width: 821px) {
  .taba_block {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  .spa_block {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

.container {
  overflow: hidden;
  line-height: 2;
  font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  color: #464646;
}

.openbtn span:nth-of-type(3)::after {
  content: "Menu";
  /*3つ目の要素のafterにMenu表示を指定*/
  position: absolute;
  top: 5px;
  left: 3.5px;
  color: #2AB210;
  font-size: 20px;
  text-transform: uppercase;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3)::after {
    font-size: 16px;
  }
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 60%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

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

.openbtn.active span:nth-of-type(3)::after {
  content: "Close";
  /*3つ目の要素のafterにClose表示を指定*/
  transform: translateY(0) rotate(-45deg);
  top: 10px;
  left: 25px;
}
@media screen and (max-width: 820px) {
  .openbtn.active span:nth-of-type(3)::after {
    left: 23px;
  }
}

/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: #ffffff;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
}

#g-nav li a {
  color: #2AB210;
  padding: 10px;
  text-decoration: none;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  #g-nav li a {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav li a {
    font-size: 12px;
  }
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9999;
  /*ボタンを最前面に*/
  top: 50px;
  right: 15%;
  cursor: pointer;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 820px) {
  .openbtn {
    right: 5%;
    top: 40px;
    width: 80px;
    height: 80px;
  }
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 5px;
  border-radius: 5px;
  background-color: #2AB210;
  width: 60%;
}

.openbtn span:nth-of-type(1) {
  top: 0;
}

.openbtn span:nth-of-type(2) {
  top: 18px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(2) {
    top: 15px;
  }
}

.openbtn span:nth-of-type(3) {
  top: 36px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3) {
    top: 30px;
  }
}

#g-nav-list ul {
  width: 700px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #g-nav-list ul {
    width: 500px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav-list ul {
    width: 400px;
  }
}
#g-nav-list ul li {
  width: 50%;
}

.zenmaru {
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #2AB210;
}

header {
  position: fixed;
  background-color: #ffffff;
  z-index: 1000;
  width: 100%;
}
header h1 img {
  width: 100px;
  margin-left: 15%;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  header h1 img {
    width: 80px;
    margin-left: 5%;
  }
}

.viewmore {
  position: relative;
  line-height: 1;
}

.viewmore_a {
  position: relative;
  display: inline-block;
}
.viewmore_a::after {
  content: url(../img/viewmore_arrow.svg);
  position: absolute;
  right: -30px;
  top: 0;
  line-height: 1;
}

.viewmore_right {
  text-align: right;
}

footer .footer1 {
  margin-left: 5%;
  margin-right: 30px;
  width: 4.427vw;
}
@media screen and (max-width: 820px) {
  footer .footer1 {
    margin-right: 10px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer1 {
    width: 9vw;
  }
}
footer .footer2 {
  width: 7.382vw;
}
@media screen and (max-width: 480px) {
  footer .footer2 {
    width: 15vw;
  }
}
footer .footer_wrapper {
  background-color: #FFE498;
}
footer .footer_wrapper .footer_content {
  padding-top: 5.208vw;
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content {
    width: 80%;
  }
}
footer .footer_wrapper .footer_content .company_name {
  font-family: "游明朝", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
footer .footer_wrapper .footer_content .company_name span {
  font-size: 48px;
}
footer .footer_wrapper .footer_content nav {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content nav {
    width: 60%;
  }
}
footer .footer_wrapper .footer_content nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
footer .footer_wrapper small {
  margin: 50px auto 0 auto;
  padding-bottom: 10px;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 820px) {
  footer .footer_wrapper small {
    margin-top: 10px;
    margin-right: 5%;
  }
}

.contact_flow_top {
  margin-top: 300px;
  width: 60%;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1280px) {
  .contact_flow_top {
    width: 80%;
  }
}
@media screen and (max-width: 820px) {
  .contact_flow_top {
    margin-top: 200px;
  }
}
.contact_flow_top h2 {
  font-size: 40px;
  position: relative;
  line-height: 1.5;
}
@media screen and (max-width: 1280px) {
  .contact_flow_top h2 {
    font-size: 32px;
  }
}
@media screen and (max-width: 480px) {
  .contact_flow_top h2 {
    font-size: 24px;
  }
}
.contact_flow_top h2::before {
  content: "";
  background-image: url(../img/orange_line.svg);
  width: 1em;
  height: 3px;
  position: absolute;
}
.contact_flow_top h2::after {
  content: "";
  width: 12.188vw;
  height: 12.188vw;
  background-color: #C0E5B9;
  border-radius: 50%;
  opacity: 0.5;
  position: absolute;
  top: -5.208vw;
  left: -5.208vw;
  z-index: -1;
}
@media screen and (max-width: 480px) {
  .contact_flow_top h2::after {
    width: 20vw;
    height: 20vw;
    top: -8vw;
  }
}

.contact_flow_main {
  width: 60%;
  margin-top: 10.17vw;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 1280px) {
  .contact_flow_main {
    width: 80%;
  }
}
.contact_flow_main ul li {
  display: flex;
  align-items: center;
  background-color: #FFE498;
  padding: 50px;
  margin-bottom: 5.208vw;
  position: relative;
}
@media screen and (max-width: 1280px) {
  .contact_flow_main ul li {
    padding: 30px;
  }
}
@media screen and (max-width: 820px) {
  .contact_flow_main ul li {
    align-items: flex-start;
  }
}
@media screen and (max-width: 480px) {
  .contact_flow_main ul li {
    flex-direction: column;
    align-items: center;
    margin-bottom: 50px;
  }
}
.contact_flow_main ul li .contact_flow_number {
  font-size: 40px;
  width: 112px;
  height: 112px;
  border-radius: 50%;
  border: #2AB210 dashed 3px;
  text-align: center;
  line-height: 2.5;
  margin-right: 5.208vw;
  margin-left: 5.208vw;
}
@media screen and (max-width: 820px) {
  .contact_flow_main ul li .contact_flow_number {
    font-size: 32px;
    width: 80px;
    height: 80px;
    line-height: 2.2;
    margin-left: 0;
  }
}
@media screen and (max-width: 480px) {
  .contact_flow_main ul li .contact_flow_number {
    margin-right: 0;
    width: 50px;
    height: 50px;
    line-height: 1.3;
    margin-bottom: 10px;
  }
}
.contact_flow_main ul li .contact_flow_text_side {
  width: 50%;
}
@media screen and (max-width: 820px) {
  .contact_flow_main ul li .contact_flow_text_side {
    width: 80%;
  }
}
@media screen and (max-width: 480px) {
  .contact_flow_main ul li .contact_flow_text_side {
    width: 100%;
  }
}
.contact_flow_main ul li .contact_flow_title {
  font-size: 24px;
}
@media screen and (max-width: 480px) {
  .contact_flow_main ul li .contact_flow_title {
    font-size: 20px;
  }
}
.contact_flow_main ul .down_arrow::after {
  content: "";
  width: 30px;
  height: 30px;
  border-top: 4px solid #2AB210;
  border-right: 4px solid #2AB210;
  position: absolute;
  left: 50%;
  transform: translateX(-50%) rotate(135deg);
  bottom: -3vw;
}
@media screen and (max-width: 820px) {
  .contact_flow_main ul .down_arrow::after {
    border-top: 3px solid #2AB210;
    border-right: 3px solid #2AB210;
    width: 20px;
    height: 20px;
  }
}
@media screen and (max-width: 480px) {
  .contact_flow_main ul .down_arrow::after {
    bottom: -30px;
  }
}

@media screen and (max-width: 1280px) {
  .pc_hide {
    display: none;
  }
}
@media screen and (max-width: 820px) {
  .tab_hide {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .sp_hide {
    display: none;
  }
}
@media screen and (min-width: 1281px) {
  .pca_block {
    display: none;
  }
}
@media screen and (min-width: 821px) {
  .taba_block {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  .spa_block {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

.container {
  overflow: hidden;
  line-height: 2;
  font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  color: #464646;
}

.openbtn span:nth-of-type(3)::after {
  content: "Menu";
  /*3つ目の要素のafterにMenu表示を指定*/
  position: absolute;
  top: 5px;
  left: 3.5px;
  color: #2AB210;
  font-size: 20px;
  text-transform: uppercase;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3)::after {
    font-size: 16px;
  }
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 60%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

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

.openbtn.active span:nth-of-type(3)::after {
  content: "Close";
  /*3つ目の要素のafterにClose表示を指定*/
  transform: translateY(0) rotate(-45deg);
  top: 10px;
  left: 25px;
}
@media screen and (max-width: 820px) {
  .openbtn.active span:nth-of-type(3)::after {
    left: 23px;
  }
}

/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: #ffffff;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
}

#g-nav li a {
  color: #2AB210;
  padding: 10px;
  text-decoration: none;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  #g-nav li a {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav li a {
    font-size: 12px;
  }
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9999;
  /*ボタンを最前面に*/
  top: 50px;
  right: 15%;
  cursor: pointer;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 820px) {
  .openbtn {
    right: 5%;
    top: 40px;
    width: 80px;
    height: 80px;
  }
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 5px;
  border-radius: 5px;
  background-color: #2AB210;
  width: 60%;
}

.openbtn span:nth-of-type(1) {
  top: 0;
}

.openbtn span:nth-of-type(2) {
  top: 18px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(2) {
    top: 15px;
  }
}

.openbtn span:nth-of-type(3) {
  top: 36px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3) {
    top: 30px;
  }
}

#g-nav-list ul {
  width: 700px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #g-nav-list ul {
    width: 500px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav-list ul {
    width: 400px;
  }
}
#g-nav-list ul li {
  width: 50%;
}

.zenmaru {
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #2AB210;
}

header {
  position: fixed;
  background-color: #ffffff;
  z-index: 1000;
  width: 100%;
}
header h1 img {
  width: 100px;
  margin-left: 15%;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  header h1 img {
    width: 80px;
    margin-left: 5%;
  }
}

.viewmore {
  position: relative;
  line-height: 1;
}

.viewmore_a {
  position: relative;
  display: inline-block;
}
.viewmore_a::after {
  content: url(../img/viewmore_arrow.svg);
  position: absolute;
  right: -30px;
  top: 0;
  line-height: 1;
}

.viewmore_right {
  text-align: right;
}

footer .footer1 {
  margin-left: 5%;
  margin-right: 30px;
  width: 4.427vw;
}
@media screen and (max-width: 820px) {
  footer .footer1 {
    margin-right: 10px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer1 {
    width: 9vw;
  }
}
footer .footer2 {
  width: 7.382vw;
}
@media screen and (max-width: 480px) {
  footer .footer2 {
    width: 15vw;
  }
}
footer .footer_wrapper {
  background-color: #FFE498;
}
footer .footer_wrapper .footer_content {
  padding-top: 5.208vw;
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content {
    width: 80%;
  }
}
footer .footer_wrapper .footer_content .company_name {
  font-family: "游明朝", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
footer .footer_wrapper .footer_content .company_name span {
  font-size: 48px;
}
footer .footer_wrapper .footer_content nav {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content nav {
    width: 60%;
  }
}
footer .footer_wrapper .footer_content nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
footer .footer_wrapper small {
  margin: 50px auto 0 auto;
  padding-bottom: 10px;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 820px) {
  footer .footer_wrapper small {
    margin-top: 10px;
    margin-right: 5%;
  }
}

.q_and_a_main {
  width: 60%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 300px;
}
@media screen and (max-width: 820px) {
  .q_and_a_main {
    margin-top: 200px;
    width: 80%;
  }
}
@media screen and (max-width: 480px) {
  .q_and_a_main {
    width: 90%;
    margin-top: 250px;
  }
}
.q_and_a_main h2 {
  font-size: 40px;
  writing-mode: vertical-rl;
  letter-spacing: 0.3em;
  position: absolute;
  line-height: 1.5;
}
@media screen and (max-width: 1280px) {
  .q_and_a_main h2 {
    font-size: 32px;
  }
}
@media screen and (max-width: 480px) {
  .q_and_a_main h2 {
    font-size: 24px;
    writing-mode: horizontal-tb;
    letter-spacing: 0;
    line-height: 1;
    padding-left: 10px;
    top: 180px;
  }
}
.q_and_a_main h2::before {
  content: "";
  width: 12.188vw;
  height: 12.188vw;
  background-color: #C0E5B9;
  border-radius: 50%;
  opacity: 0.5;
  position: absolute;
  z-index: -1;
  top: -5.208vw;
  right: -3vw;
}
@media screen and (max-width: 480px) {
  .q_and_a_main h2::before {
    width: 20vw;
    height: 20vw;
    top: -12vw;
    right: -10vw;
  }
}
.q_and_a_main h2::after {
  content: "";
  background-image: url(../img/orange_line_vertical.svg);
  width: 3px;
  height: 1em;
  position: absolute;
  top: 0;
}
@media screen and (max-width: 480px) {
  .q_and_a_main h2::after {
    left: 0;
  }
}
.q_and_a_main ul {
  width: 80%;
  margin-left: auto;
}
@media screen and (max-width: 480px) {
  .q_and_a_main ul {
    width: 100%;
    margin-right: auto;
  }
}
.q_and_a_main ul li {
  background-color: #FFE498;
  padding: 50px;
  margin-bottom: 50px;
}
@media screen and (max-width: 480px) {
  .q_and_a_main ul li {
    padding: 30px;
  }
}
.q_and_a_main ul li .q_and_a_wrapper {
  display: flex;
  align-items: flex-start;
}
.q_and_a_main ul li .q_and_a_wrapper .q_and_a_title {
  font-size: 38px;
  line-height: 1;
  margin-right: 50px;
}
@media screen and (max-width: 1280px) {
  .q_and_a_main ul li .q_and_a_wrapper .q_and_a_title {
    font-size: 32px;
  }
}
@media screen and (max-width: 480px) {
  .q_and_a_main ul li .q_and_a_wrapper .q_and_a_title {
    font-size: 28px;
    line-height: 1.2;
    margin-right: 30px;
  }
}
.q_and_a_main ul li .q_and_a_wrapper .q_and_a_text {
  width: 70%;
}
@media screen and (max-width: 820px) {
  .q_and_a_main ul li .q_and_a_wrapper .q_and_a_text {
    width: 100%;
  }
}
.q_and_a_main ul li .q_and_a_wrapper1 {
  margin-bottom: 50px;
}

@media screen and (max-width: 1280px) {
  .pc_hide {
    display: none;
  }
}
@media screen and (max-width: 820px) {
  .tab_hide {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .sp_hide {
    display: none;
  }
}
@media screen and (min-width: 1281px) {
  .pca_block {
    display: none;
  }
}
@media screen and (min-width: 821px) {
  .taba_block {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  .spa_block {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

.container {
  overflow: hidden;
  line-height: 2;
  font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  color: #464646;
}

.openbtn span:nth-of-type(3)::after {
  content: "Menu";
  /*3つ目の要素のafterにMenu表示を指定*/
  position: absolute;
  top: 5px;
  left: 3.5px;
  color: #2AB210;
  font-size: 20px;
  text-transform: uppercase;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3)::after {
    font-size: 16px;
  }
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 60%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

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

.openbtn.active span:nth-of-type(3)::after {
  content: "Close";
  /*3つ目の要素のafterにClose表示を指定*/
  transform: translateY(0) rotate(-45deg);
  top: 10px;
  left: 25px;
}
@media screen and (max-width: 820px) {
  .openbtn.active span:nth-of-type(3)::after {
    left: 23px;
  }
}

/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: #ffffff;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
}

#g-nav li a {
  color: #2AB210;
  padding: 10px;
  text-decoration: none;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  #g-nav li a {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav li a {
    font-size: 12px;
  }
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9999;
  /*ボタンを最前面に*/
  top: 50px;
  right: 15%;
  cursor: pointer;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 820px) {
  .openbtn {
    right: 5%;
    top: 40px;
    width: 80px;
    height: 80px;
  }
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 5px;
  border-radius: 5px;
  background-color: #2AB210;
  width: 60%;
}

.openbtn span:nth-of-type(1) {
  top: 0;
}

.openbtn span:nth-of-type(2) {
  top: 18px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(2) {
    top: 15px;
  }
}

.openbtn span:nth-of-type(3) {
  top: 36px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3) {
    top: 30px;
  }
}

#g-nav-list ul {
  width: 700px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #g-nav-list ul {
    width: 500px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav-list ul {
    width: 400px;
  }
}
#g-nav-list ul li {
  width: 50%;
}

.zenmaru {
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #2AB210;
}

header {
  position: fixed;
  background-color: #ffffff;
  z-index: 1000;
  width: 100%;
}
header h1 img {
  width: 100px;
  margin-left: 15%;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  header h1 img {
    width: 80px;
    margin-left: 5%;
  }
}

.viewmore {
  position: relative;
  line-height: 1;
}

.viewmore_a {
  position: relative;
  display: inline-block;
}
.viewmore_a::after {
  content: url(../img/viewmore_arrow.svg);
  position: absolute;
  right: -30px;
  top: 0;
  line-height: 1;
}

.viewmore_right {
  text-align: right;
}

footer .footer1 {
  margin-left: 5%;
  margin-right: 30px;
  width: 4.427vw;
}
@media screen and (max-width: 820px) {
  footer .footer1 {
    margin-right: 10px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer1 {
    width: 9vw;
  }
}
footer .footer2 {
  width: 7.382vw;
}
@media screen and (max-width: 480px) {
  footer .footer2 {
    width: 15vw;
  }
}
footer .footer_wrapper {
  background-color: #FFE498;
}
footer .footer_wrapper .footer_content {
  padding-top: 5.208vw;
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content {
    width: 80%;
  }
}
footer .footer_wrapper .footer_content .company_name {
  font-family: "游明朝", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
footer .footer_wrapper .footer_content .company_name span {
  font-size: 48px;
}
footer .footer_wrapper .footer_content nav {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content nav {
    width: 60%;
  }
}
footer .footer_wrapper .footer_content nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
footer .footer_wrapper small {
  margin: 50px auto 0 auto;
  padding-bottom: 10px;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 820px) {
  footer .footer_wrapper small {
    margin-top: 10px;
    margin-right: 5%;
  }
}

.contact_main {
  width: 60%;
  margin-top: 300px;
  margin-left: auto;
  margin-right: auto;
}
@media screen and (max-width: 820px) {
  .contact_main {
    width: 80%;
  }
}
@media screen and (max-width: 480px) {
  .contact_main {
    width: 90%;
    margin-top: 200px;
  }
}
.contact_main h2 {
  font-size: 40px;
  position: relative;
  line-height: 1.5;
}
@media screen and (max-width: 1280px) {
  .contact_main h2 {
    font-size: 32px;
  }
}
@media screen and (max-width: 480px) {
  .contact_main h2 {
    font-size: 24px;
  }
}
.contact_main h2::before {
  content: "";
  width: 12.188vw;
  height: 12.188vw;
  background-color: #C0E5B9;
  border-radius: 50%;
  opacity: 0.5;
  position: absolute;
  z-index: -1;
  top: -5.208vw;
  left: -5.208vw;
}
@media screen and (max-width: 480px) {
  .contact_main h2::before {
    width: 20vw;
    height: 20vw;
    top: -10vw;
    left: 20vw;
  }
}
.contact_main h2::after {
  content: "";
  background-image: url(../img/orange_line.svg);
  width: 1em;
  height: 3px;
  position: absolute;
  left: 0;
}
.contact_main .wpcf7-form {
  width: 100% !important;
  margin-top: 10.417vw !important;
  margin-bottom: 5.208vw !important;
  background-color: #FFE498 !important;
  padding-top: 5.208vw !important;
  padding-bottom: 5.208vw !important;
}
@media screen and (max-width: 480px) {
  .contact_main .wpcf7-form {
    margin-bottom: 50px !important;
  }
}
.contact_main .wpcf7-form label {
  margin-bottom: 30px !important;
  width: 80% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block !important;
}
.contact_main .wpcf7-form label input {
  height: 3em !important;
}
.contact_main .wpcf7-form label input,
.contact_main .wpcf7-form label textarea {
  padding-left: 10px !important;
  width: 100% !important;
  background-color: #ffffff !important;
  border-radius: 10px !important;
}
.contact_main .wpcf7-form label input:focus,
.contact_main .wpcf7-form label textarea:focus {
  outline: 2px solid #FFC219 !important;
}
.contact_main .wpcf7-form .wpcf7-submit {
  border-radius: 10px !important;
  margin-top: 2.604vw !important;
  padding: 10px 30px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
@media screen and (max-width: 820px) {
  .contact_main .wpcf7-form .wpcf7-submit {
    padding: 0 30px !important;
  }
}
@media screen and (max-width: 480px) {
  .contact_main .wpcf7-form .wpcf7-submit {
    padding: 5px 20px !important;
  }
}
.contact_main .wpcf7-form .wpcf7-response-output {
  border: none !important;
  color: #dc3232 !important;
  text-align: center !important;
}
.contact_main .wpcf7-form .accept_submit {
  text-align: center !important;
}
.contact_main .wpcf7-form .accept_submit span {
  display: none !important;
}
.contact_main .wpcf7-form .accept_submit input {
  background-color: #2AB210 !important;
  color: #ffffff !important;
  font-size: 24px !important;
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif !important;
}
@media screen and (max-width: 820px) {
  .contact_main .wpcf7-form .accept_submit input {
    font-size: 20px !important;
  }
}
.contact_main .wpcf7-form .contact_title_set {
  color: #2AB210 !important;
  display: flex !important;
  font-size: 24px !important;
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif !important;
}
@media screen and (max-width: 480px) {
  .contact_main .wpcf7-form .contact_title_set {
    font-size: 20px !important;
  }
}
.contact_main .wpcf7-form .contact_title_set .must {
  color: #FFC219 !important;
  padding-left: 10px !important;
}

@media screen and (max-width: 1280px) {
  .pc_hide {
    display: none;
  }
}
@media screen and (max-width: 820px) {
  .tab_hide {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .sp_hide {
    display: none;
  }
}
@media screen and (min-width: 1281px) {
  .pca_block {
    display: none;
  }
}
@media screen and (min-width: 821px) {
  .taba_block {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  .spa_block {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

.container {
  overflow: hidden;
  line-height: 2;
  font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  color: #464646;
}

.openbtn span:nth-of-type(3)::after {
  content: "Menu";
  /*3つ目の要素のafterにMenu表示を指定*/
  position: absolute;
  top: 5px;
  left: 3.5px;
  color: #2AB210;
  font-size: 20px;
  text-transform: uppercase;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3)::after {
    font-size: 16px;
  }
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 60%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

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

.openbtn.active span:nth-of-type(3)::after {
  content: "Close";
  /*3つ目の要素のafterにClose表示を指定*/
  transform: translateY(0) rotate(-45deg);
  top: 10px;
  left: 25px;
}
@media screen and (max-width: 820px) {
  .openbtn.active span:nth-of-type(3)::after {
    left: 23px;
  }
}

/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: #ffffff;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
}

#g-nav li a {
  color: #2AB210;
  padding: 10px;
  text-decoration: none;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  #g-nav li a {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav li a {
    font-size: 12px;
  }
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9999;
  /*ボタンを最前面に*/
  top: 50px;
  right: 15%;
  cursor: pointer;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 820px) {
  .openbtn {
    right: 5%;
    top: 40px;
    width: 80px;
    height: 80px;
  }
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 5px;
  border-radius: 5px;
  background-color: #2AB210;
  width: 60%;
}

.openbtn span:nth-of-type(1) {
  top: 0;
}

.openbtn span:nth-of-type(2) {
  top: 18px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(2) {
    top: 15px;
  }
}

.openbtn span:nth-of-type(3) {
  top: 36px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3) {
    top: 30px;
  }
}

#g-nav-list ul {
  width: 700px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #g-nav-list ul {
    width: 500px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav-list ul {
    width: 400px;
  }
}
#g-nav-list ul li {
  width: 50%;
}

.zenmaru {
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #2AB210;
}

header {
  position: fixed;
  background-color: #ffffff;
  z-index: 1000;
  width: 100%;
}
header h1 img {
  width: 100px;
  margin-left: 15%;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  header h1 img {
    width: 80px;
    margin-left: 5%;
  }
}

.viewmore {
  position: relative;
  line-height: 1;
}

.viewmore_a {
  position: relative;
  display: inline-block;
}
.viewmore_a::after {
  content: url(../img/viewmore_arrow.svg);
  position: absolute;
  right: -30px;
  top: 0;
  line-height: 1;
}

.viewmore_right {
  text-align: right;
}

footer .footer1 {
  margin-left: 5%;
  margin-right: 30px;
  width: 4.427vw;
}
@media screen and (max-width: 820px) {
  footer .footer1 {
    margin-right: 10px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer1 {
    width: 9vw;
  }
}
footer .footer2 {
  width: 7.382vw;
}
@media screen and (max-width: 480px) {
  footer .footer2 {
    width: 15vw;
  }
}
footer .footer_wrapper {
  background-color: #FFE498;
}
footer .footer_wrapper .footer_content {
  padding-top: 5.208vw;
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content {
    width: 80%;
  }
}
footer .footer_wrapper .footer_content .company_name {
  font-family: "游明朝", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
footer .footer_wrapper .footer_content .company_name span {
  font-size: 48px;
}
footer .footer_wrapper .footer_content nav {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content nav {
    width: 60%;
  }
}
footer .footer_wrapper .footer_content nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
footer .footer_wrapper small {
  margin: 50px auto 0 auto;
  padding-bottom: 10px;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 820px) {
  footer .footer_wrapper small {
    margin-top: 10px;
    margin-right: 5%;
  }
}

.privacy_policy {
  margin-top: 140px;
  width: 100%;
  padding: 3.646vw 0 7.813vw 0;
}
.privacy_policy .privacy_policy_wrapper {
  width: 60%;
  margin: 0 auto;
}
@media screen and (max-width: 820px) {
  .privacy_policy .privacy_policy_wrapper {
    width: 80%;
  }
}
.privacy_policy .privacy_policy_wrapper .privacy_policy_title {
  font-size: 1.667vw;
  margin: 30px 0;
}
@media screen and (max-width: 820px) {
  .privacy_policy .privacy_policy_wrapper .privacy_policy_title {
    font-size: 24px;
  }
}
@media screen and (max-width: 480px) {
  .privacy_policy .privacy_policy_wrapper .privacy_policy_title {
    font-size: 16px;
  }
}
.privacy_policy .privacy_policy_wrapper ol {
  padding-left: 30px;
}
.privacy_policy .privacy_policy_wrapper ol .indent1 {
  text-indent: 1em;
}
.privacy_policy .privacy_policy_wrapper ol .indent2 {
  text-indent: 2em;
}

@media screen and (max-width: 1280px) {
  .pc_hide {
    display: none;
  }
}
@media screen and (max-width: 820px) {
  .tab_hide {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .sp_hide {
    display: none;
  }
}
@media screen and (min-width: 1281px) {
  .pca_block {
    display: none;
  }
}
@media screen and (min-width: 821px) {
  .taba_block {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  .spa_block {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

.container {
  overflow: hidden;
  line-height: 2;
  font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  color: #464646;
}

.openbtn span:nth-of-type(3)::after {
  content: "Menu";
  /*3つ目の要素のafterにMenu表示を指定*/
  position: absolute;
  top: 5px;
  left: 3.5px;
  color: #2AB210;
  font-size: 20px;
  text-transform: uppercase;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3)::after {
    font-size: 16px;
  }
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 60%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

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

.openbtn.active span:nth-of-type(3)::after {
  content: "Close";
  /*3つ目の要素のafterにClose表示を指定*/
  transform: translateY(0) rotate(-45deg);
  top: 10px;
  left: 25px;
}
@media screen and (max-width: 820px) {
  .openbtn.active span:nth-of-type(3)::after {
    left: 23px;
  }
}

/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: #ffffff;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
}

#g-nav li a {
  color: #2AB210;
  padding: 10px;
  text-decoration: none;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  #g-nav li a {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav li a {
    font-size: 12px;
  }
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9999;
  /*ボタンを最前面に*/
  top: 50px;
  right: 15%;
  cursor: pointer;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 820px) {
  .openbtn {
    right: 5%;
    top: 40px;
    width: 80px;
    height: 80px;
  }
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 5px;
  border-radius: 5px;
  background-color: #2AB210;
  width: 60%;
}

.openbtn span:nth-of-type(1) {
  top: 0;
}

.openbtn span:nth-of-type(2) {
  top: 18px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(2) {
    top: 15px;
  }
}

.openbtn span:nth-of-type(3) {
  top: 36px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3) {
    top: 30px;
  }
}

#g-nav-list ul {
  width: 700px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #g-nav-list ul {
    width: 500px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav-list ul {
    width: 400px;
  }
}
#g-nav-list ul li {
  width: 50%;
}

.zenmaru {
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #2AB210;
}

header {
  position: fixed;
  background-color: #ffffff;
  z-index: 1000;
  width: 100%;
}
header h1 img {
  width: 100px;
  margin-left: 15%;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  header h1 img {
    width: 80px;
    margin-left: 5%;
  }
}

.viewmore {
  position: relative;
  line-height: 1;
}

.viewmore_a {
  position: relative;
  display: inline-block;
}
.viewmore_a::after {
  content: url(../img/viewmore_arrow.svg);
  position: absolute;
  right: -30px;
  top: 0;
  line-height: 1;
}

.viewmore_right {
  text-align: right;
}

footer .footer1 {
  margin-left: 5%;
  margin-right: 30px;
  width: 4.427vw;
}
@media screen and (max-width: 820px) {
  footer .footer1 {
    margin-right: 10px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer1 {
    width: 9vw;
  }
}
footer .footer2 {
  width: 7.382vw;
}
@media screen and (max-width: 480px) {
  footer .footer2 {
    width: 15vw;
  }
}
footer .footer_wrapper {
  background-color: #FFE498;
}
footer .footer_wrapper .footer_content {
  padding-top: 5.208vw;
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content {
    width: 80%;
  }
}
footer .footer_wrapper .footer_content .company_name {
  font-family: "游明朝", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
footer .footer_wrapper .footer_content .company_name span {
  font-size: 48px;
}
footer .footer_wrapper .footer_content nav {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content nav {
    width: 60%;
  }
}
footer .footer_wrapper .footer_content nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
footer .footer_wrapper small {
  margin: 50px auto 0 auto;
  padding-bottom: 10px;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 820px) {
  footer .footer_wrapper small {
    margin-top: 10px;
    margin-right: 5%;
  }
}

.transaction {
  width: 100%;
  padding: 1.042vw 0 7.813vw 0;
  margin-top: 200px;
}
.transaction .transaction_wrapper {
  width: 60%;
  margin: 0 auto;
}
@media screen and (max-width: 820px) {
  .transaction .transaction_wrapper {
    width: 80%;
  }
}
.transaction .transaction_wrapper table {
  width: 100%;
  font-size: 1.667vw;
  border-collapse: collapse;
}
@media screen and (max-width: 820px) {
  .transaction .transaction_wrapper table {
    font-size: 20px;
  }
}
@media screen and (max-width: 480px) {
  .transaction .transaction_wrapper table {
    font-size: 14px;
  }
}
.transaction .transaction_wrapper table tr {
  border-bottom: solid 1px #2AB210;
}
.transaction .transaction_wrapper table td {
  padding-bottom: 2.604vw;
}
.transaction .transaction_wrapper table th {
  width: 40%;
}
@media screen and (max-width: 480px) {
  .transaction .transaction_wrapper table th {
    width: 50%;
  }
}
.transaction .transaction_wrapper table td,
.transaction .transaction_wrapper table th {
  padding-top: 2.604vw;
}

@media screen and (max-width: 1280px) {
  .pc_hide {
    display: none;
  }
}
@media screen and (max-width: 820px) {
  .tab_hide {
    display: none;
  }
}
@media screen and (max-width: 480px) {
  .sp_hide {
    display: none;
  }
}
@media screen and (min-width: 1281px) {
  .pca_block {
    display: none;
  }
}
@media screen and (min-width: 821px) {
  .taba_block {
    display: none;
  }
}
@media screen and (min-width: 481px) {
  .spa_block {
    display: none;
  }
}
html {
  scroll-behavior: smooth;
}

.container {
  overflow: hidden;
  line-height: 2;
  font-family: "Zen Kaku Gothic New", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  color: #464646;
}

.openbtn span:nth-of-type(3)::after {
  content: "Menu";
  /*3つ目の要素のafterにMenu表示を指定*/
  position: absolute;
  top: 5px;
  left: 3.5px;
  color: #2AB210;
  font-size: 20px;
  text-transform: uppercase;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3)::after {
    font-size: 16px;
  }
}

/*activeクラスが付与されると線が回転して×になり、Menu⇒Closeに変更*/
.openbtn.active span:nth-of-type(1) {
  top: 14px;
  left: 18px;
  transform: translateY(6px) rotate(-45deg);
  width: 60%;
}

.openbtn.active span:nth-of-type(2) {
  opacity: 0;
}

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

.openbtn.active span:nth-of-type(3)::after {
  content: "Close";
  /*3つ目の要素のafterにClose表示を指定*/
  transform: translateY(0) rotate(-45deg);
  top: 10px;
  left: 25px;
}
@media screen and (max-width: 820px) {
  .openbtn.active span:nth-of-type(3)::after {
    left: 23px;
  }
}

/*========= ナビゲーションのためのCSS ===============*/
#g-nav {
  /*position:fixed;にし、z-indexの数値を大きくして前面へ*/
  position: fixed;
  z-index: 999;
  /*ナビのスタート位置と形状*/
  top: -120%;
  left: 0;
  width: 100%;
  height: 100vh;
  /*ナビの高さ*/
  background: #ffffff;
  /*動き*/
  transition: all 0.6s;
}

/*アクティブクラスがついたら位置を0に*/
#g-nav.panelactive {
  top: 0;
}

/*ナビゲーションの縦スクロール*/
#g-nav.panelactive #g-nav-list {
  /*ナビの数が増えた場合縦スクロール*/
  position: fixed;
  z-index: 999;
  width: 100%;
  height: 100vh;
  /*表示する高さ*/
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}

/*ナビゲーション*/
#g-nav ul {
  /*ナビゲーション天地中央揃え*/
  position: absolute;
  z-index: 999;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

/*リストのレイアウト設定*/
#g-nav li {
  list-style: none;
  text-align: center;
}

#g-nav li a {
  color: #2AB210;
  padding: 10px;
  text-decoration: none;
  display: block;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  font-weight: bold;
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  #g-nav li a {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav li a {
    font-size: 12px;
  }
}

/*========= ボタンのためのCSS ===============*/
.openbtn {
  position: fixed;
  z-index: 9999;
  /*ボタンを最前面に*/
  top: 50px;
  right: 15%;
  cursor: pointer;
  width: 100px;
  height: 100px;
}
@media screen and (max-width: 820px) {
  .openbtn {
    right: 5%;
    top: 40px;
    width: 80px;
    height: 80px;
  }
}

.openbtn span {
  display: inline-block;
  transition: all 0.4s;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  height: 5px;
  border-radius: 5px;
  background-color: #2AB210;
  width: 60%;
}

.openbtn span:nth-of-type(1) {
  top: 0;
}

.openbtn span:nth-of-type(2) {
  top: 18px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(2) {
    top: 15px;
  }
}

.openbtn span:nth-of-type(3) {
  top: 36px;
}
@media screen and (max-width: 820px) {
  .openbtn span:nth-of-type(3) {
    top: 30px;
  }
}

#g-nav-list ul {
  width: 700px;
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 820px) {
  #g-nav-list ul {
    width: 500px;
  }
}
@media screen and (max-width: 480px) {
  #g-nav-list ul {
    width: 400px;
  }
}
#g-nav-list ul li {
  width: 50%;
}

.zenmaru {
  font-family: "Zen Maru Gothic", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  color: #2AB210;
}

header {
  position: fixed;
  background-color: #ffffff;
  z-index: 1000;
  width: 100%;
}
header h1 img {
  width: 100px;
  margin-left: 15%;
  margin-top: 30px;
  margin-bottom: 10px;
}
@media screen and (max-width: 820px) {
  header h1 img {
    width: 80px;
    margin-left: 5%;
  }
}

.viewmore {
  position: relative;
  line-height: 1;
}

.viewmore_a {
  position: relative;
  display: inline-block;
}
.viewmore_a::after {
  content: url(../img/viewmore_arrow.svg);
  position: absolute;
  right: -30px;
  top: 0;
  line-height: 1;
}

.viewmore_right {
  text-align: right;
}

footer .footer1 {
  margin-left: 5%;
  margin-right: 30px;
  width: 4.427vw;
}
@media screen and (max-width: 820px) {
  footer .footer1 {
    margin-right: 10px;
  }
}
@media screen and (max-width: 480px) {
  footer .footer1 {
    width: 9vw;
  }
}
footer .footer2 {
  width: 7.382vw;
}
@media screen and (max-width: 480px) {
  footer .footer2 {
    width: 15vw;
  }
}
footer .footer_wrapper {
  background-color: #FFE498;
}
footer .footer_wrapper .footer_content {
  padding-top: 5.208vw;
  width: 70%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content {
    width: 80%;
  }
}
footer .footer_wrapper .footer_content .company_name {
  font-family: "游明朝", "ヒラギノ角ゴ ProN W3", "HiraKakuProN-W3", "游ゴシック", "Yu Gothic", "メイリオ", "Meiryo", Verdana, Helvetica, Arial, sans-serif;
  font-weight: bold;
  font-size: 20px;
}
footer .footer_wrapper .footer_content .company_name span {
  font-size: 48px;
}
footer .footer_wrapper .footer_content nav {
  width: 50%;
}
@media screen and (max-width: 1280px) {
  footer .footer_wrapper .footer_content nav {
    width: 60%;
  }
}
footer .footer_wrapper .footer_content nav ul {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
}
footer .footer_wrapper small {
  margin: 50px auto 0 auto;
  padding-bottom: 10px;
  display: block;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (max-width: 820px) {
  footer .footer_wrapper small {
    margin-top: 10px;
    margin-right: 5%;
  }
}

.blog_detail_main {
  width: 70%;
  margin-top: 10.417vw;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 10.417vw;
}
@media screen and (max-width: 1280px) {
  .blog_detail_main {
    width: 80%;
  }
}
@media screen and (max-width: 480px) {
  .blog_detail_main {
    margin-top: 0;
  }
}
.blog_detail_main .blog_detail_content {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
}
@media screen and (max-width: 480px) {
  .blog_detail_main .blog_detail_content {
    flex-direction: column-reverse;
    align-items: flex-end;
  }
}
.blog_detail_main .blog_detail_content img {
  width: 26.302vw;
}
@media screen and (max-width: 480px) {
  .blog_detail_main .blog_detail_content img {
    width: 50vw;
  }
}
.blog_detail_main .blog_detail_content .blog_detail_content_text {
  width: 55%;
}
@media screen and (max-width: 1280px) {
  .blog_detail_main .blog_detail_content .blog_detail_content_text {
    width: 60%;
  }
}
@media screen and (max-width: 480px) {
  .blog_detail_main .blog_detail_content .blog_detail_content_text {
    width: 100%;
  }
}
.blog_detail_main .blog_detail_content .blog_detail_content_text .blog_detail_title {
  font-size: 32px;
}
@media screen and (max-width: 820px) {
  .blog_detail_main .blog_detail_content .blog_detail_content_text .blog_detail_title {
    font-size: 24px;
  }
}
@media screen and (max-width: 480px) {
  .blog_detail_main .blog_detail_content .blog_detail_content_text .blog_detail_title {
    font-size: 18px;
  }
}
.blog_detail_main .blog_detail_content .blog_detail_content_text .blog_detail_text {
  font-size: 24px;
}
@media screen and (max-width: 820px) {
  .blog_detail_main .blog_detail_content .blog_detail_content_text .blog_detail_text {
    font-size: 16px;
  }
}
@media screen and (max-width: 480px) {
  .blog_detail_main .blog_detail_content .blog_detail_content_text .blog_detail_text {
    margin-bottom: 30px;
  }
}/*# sourceMappingURL=style.css.map */