:root {
  --base-font: "Noto Sans JP", sans-serif;
  --inter-font:"Inter", sans-serif;
  --base-color: #181818;
  --base_bg: #F4F4F4;
  --white: #FFF;
  --white-8: rgba(255, 255, 255, 0.80);
  --white-82: rgba(255, 255, 255, 0.82);
  --black: #000;
  --black-7: rgba(24, 24, 24, 0.70);
  --green: #00783C;
  --green01: #005028;
  --green02: #033A1F;
  --light-green: #8CAE9D;
  --light-green01: #B9C9BF;
  --light-green01-8: rgba(185, 201, 191, 0.80);
  --light-green01-9: rgba(185, 201, 191, 0.90);
  --light-green02: #85A294;
  --light-green03: #7EAA8F;
  --light-green04: #EAEDEC;
  --yellow: #FFC55F;
  --yellow-9: rgba(255, 197, 95, 0.90);
  --grey: #E8EEEB;
  --grey01: #E7E7E7;
  --brown:#EFEAE5;
}

/*------------------------------------------------------------
	index
------------------------------------------------------------*/
#main {
  padding-bottom: 7.7rem;
  overflow: hidden;
}
@media all and (max-width: 896px) {
  #main {
    padding-bottom: 19.1rem;
  }
}
#main .mainVisual {
  position: relative;
}
#main .mainVisual .mainVisualLoading {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--base_bg);
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: center;
}
#main .mainVisual .mainVisualLoading .loadingSpinner {
  width: 5rem;
  height: 5rem;
  border: 4px solid var(--light-green01);
  border-top-color: var(--green);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}
#main .mainVisual .lineDecoration {
  position: absolute;
  top: 6.3rem;
  left: 0;
  width: 100%;
  height: 63rem;
  z-index: 2;
  pointer-events: none;
  perspective: 2000px;
  perspective-origin: center center;
}
#main .mainVisual .lineDecoration .line01_1,
#main .mainVisual .lineDecoration .line01_2 {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
}
#main .mainVisual .lineDecoration .line01_1 svg,
#main .mainVisual .lineDecoration .line01_2 svg {
  width: 100%;
  height: 100%;
  display: block;
}
#main .mainVisual .lineDecoration .line01_1 path,
#main .mainVisual .lineDecoration .line01_2 path {
  stroke-dasharray: 10000;
  stroke-dashoffset: 10000;
}
@media all and (max-width: 896px) {
  #main .mainVisual .lineDecoration .line01_1 path,
  #main .mainVisual .lineDecoration .line01_2 path {
    stroke-width: 4;
  }
}
#main .mainVisual .lineDecoration .line01_1 {
  z-index: 1;
}
#main .mainVisual .lineDecoration .line01_1 svg {
  margin-top: 6rem;
}
@media all and (max-width: 896px) {
  #main .mainVisual .lineDecoration .line01_1 svg {
    margin-top: 2rem;
  }
}
#main .mainVisual .lineDecoration .line01_2 {
  z-index: 2;
}
#main .mainVisual .slideBox {
  margin-left: auto;
  width: 95.9rem;
  position: relative;
  z-index: 1;
}
#main .mainVisual .slideBox .foo {
  position: relative;
  z-index: 3;
  aspect-ratio: 16/9;
}
#main .mainVisual .slideBox .foo li {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
}
#main .mainVisual .slideBox .foo li:first-child {
  position: relative;
  opacity: 1;
}
#main .mainVisual .slideBox .foo li img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
#main .mainVisual .slideBox .foo.slick-initialized li {
  position: relative;
  opacity: 1;
}
#main .mainVisual .slideBox .circleImg {
  width: 155.5rem;
  pointer-events: none;
  position: absolute;
  bottom: -14rem;
  left: -13.6rem;
  z-index: 1;
}
#main .mainVisual .slideBox .circleImg img {
  width: 100%;
  animation: rotate infinite linear;
  animation-duration: 45s;
}
@media all and (min-width: 897px) and (max-width: 1400px) {
  #main .mainVisual .lineDecoration {
    height: 49rem;
    bottom: 19rem;
  }
  #main .mainVisual .slideBox {
    width: 68.5vw;
  }
  #main .mainVisual .slideBox .circleImg {
    width: 111.071vw;
    bottom: -10vw;
    left: -9.714vw;
  }
}
@media all and (max-width: 896px) {
  #main .mainVisual {
    padding-bottom: 5.7rem;
  }
  #main .mainVisual .lineDecoration {
    top: auto;
    bottom: 0;
    height: 19.5rem;
  }
  #main .mainVisual .lineDecoration .line01_1,
  #main .mainVisual .lineDecoration .line01_2 {
    display: block;
  }
  #main .mainVisual .slideBox {
    width: 79.231vw;
  }
  #main .mainVisual .slideBox .circleImg {
    width: 147.949vw;
    bottom: -20.256vw;
    left: -23.077vw;
  }
}
#main .topBox {
  margin: -8.3rem 0 16rem;
  position: relative;
  z-index: 3;
}
#main .topBox .content {
  max-width: 132rem;
}
#main .topBox h2 {
  margin-bottom: 5.8rem;
  color: var(--green);
  font-size: 8rem;
  font-weight: 500;
  line-height: 1.2;
}
#main .topBox .text {
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 2.2;
  letter-spacing: 0.09rem;
  color: var(--green01);
}
@media all and (max-width: 896px) {
  #main .topBox {
    margin: 0.6rem 0 8rem;
  }
  #main .topBox h2 {
    margin-bottom: 3.2rem;
    font-size: 4rem;
  }
  #main .topBox .text {
    font-size: 1.6rem;
    line-height: 2;
    letter-spacing: 0.08rem;
  }
}
#main .business {
  padding: 12.5rem 0 20.2rem;
  position: relative;
  z-index: 2;
  background: linear-gradient(180deg, var(--green) 35.1%, var(--green02) 100%);
}
#main .business .content {
  max-width: 124rem;
}
#main .business .imgBox {
  margin-bottom: 8rem;
  padding-right: 2rem;
  max-width: calc(50% + 62rem);
  align-items: center;
}
#main .business .imgBox .photoBox {
  width: 68rem;
  border-radius: 0 12rem 0 0;
  overflow: hidden;
}
#main .business .imgBox .textBox {
  margin-top: 4rem;
  width: calc(100% - 76rem);
}
#main .business .imgBox .textBox .text {
  margin-bottom: 4rem;
  color: var(--grey);
  font-weight: 500;
  line-height: 2;
  letter-spacing: 0.08rem;
}
#main .business .imgBox .comBtn02 {
  margin-left: auto;
}
#main .business .photoUl {
  margin: -2rem 0 8rem;
}
#main .business .photoUl li {
  margin: 2rem 4.1% 0 0;
  width: 30.6%;
}
#main .business .photoUl li:nth-child(3n) {
  margin-right: 0;
}
#main .business .photoUl li .photo {
  margin-bottom: 2.4rem;
  border-radius: 12rem;
  overflow: hidden;
}
#main .business .photoUl li img {
  width: 100%;
}
#main .business .photoUl li .text {
  text-align: center;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 0.09rem;
  color: var(--white);
}
#main .business .imgBox01 {
  padding: 0 0 0 2rem;
  margin-left: auto;
  flex-direction: row-reverse;
}
#main .business .imgBox01 .photoBox {
  border-radius: 20rem 0 0 20rem !important;
}
#main .business .photoUl01 {
  margin-bottom: 0;
}
#main .business .photoUl01 li {
  width: 22.5%;
  margin-right: 3.3333333333% !important;
}
#main .business .photoUl01 li:nth-child(4n) {
  margin-right: 0 !important;
}
#main .business .photoUl01 li .photo {
  border-radius: 0 8rem;
}
@media all and (max-width: 896px) {
  #main .business {
    padding: 7.8rem 0 10.1rem;
    background: linear-gradient(180deg, var(--green) 35.1%, var(--green02) 100%);
  }
  #main .business .imgBox {
    margin-bottom: 6rem;
    max-width: 100%;
    display: block;
  }
  #main .business .imgBox .photoBox {
    margin-bottom: 4rem;
    width: auto;
    border-radius: 0 6rem 0 0;
  }
  #main .business .imgBox .photoBox img {
    width: 100%;
  }
  #main .business .imgBox .textBox {
    margin: 0 0 0 2rem;
    width: auto;
  }
  #main .business .imgBox .textBox .text {
    margin-bottom: 0;
  }
  #main .business .photoUl {
    margin: 0 -0.9rem 6rem;
    display: block;
  }
  #main .business .photoUl li {
    margin: 0 0 4rem !important;
    width: auto;
  }
  #main .business .photoUl li:last-child {
    margin-bottom: 0 !important;
  }
  #main .business .photoUl li .photo {
    margin-bottom: 2rem;
    border-radius: 30.769vw;
  }
  #main .business .photoUl li .photo img {
    width: 100%;
  }
  #main .business .imgBox01 {
    padding: 0 0 0 2rem;
    margin: 12rem 0 8.2rem auto;
  }
  #main .business .imgBox01 .headLine04 {
    padding-left: 3.7rem;
    margin-left: 0.4rem;
    background-image: url(../img/common/icon02_sp.png);
    background-size: 2.3rem auto;
    background-position: left top;
  }
  #main .business .imgBox01 .textBox {
    margin: 0 2rem 0 0;
  }
  #main .business .photoUl01 {
    margin: 0 auto 6.1rem !important;
    width: 77%;
  }
  #main .business .photoUl01 li {
    width: auto;
    margin-right: 0;
  }
  #main .business .photoUl01 li .photo {
    border-radius: 0 6rem;
  }
}
#main .subBox {
  margin-top: -24.2rem;
  position: relative;
  z-index: 1;
}
#main .subBox img {
  width: 100%;
}
@media all and (max-width: 896px) {
  #main .subBox {
    margin-top: -8rem;
  }
}
#main .news {
  position: relative;
  padding: 12.9rem 0 16.3rem;
}
#main .news .content {
  display: flex;
  flex-wrap: wrap;
  max-width: 124rem;
  position: relative;
  z-index: 2;
}
#main .news .lineDecoration {
  position: absolute;
  left: 0;
  bottom: -5.5rem;
  width: 100%;
  height: 50rem;
  z-index: 1;
  pointer-events: none;
}
#main .news .lineDecoration .line02_1,
#main .news .lineDecoration .line02_2 {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}
#main .news .lineDecoration .line02_1 svg,
#main .news .lineDecoration .line02_2 svg {
  width: 100%;
  height: 100%;
  display: block;
}
#main .news .lineDecoration .line02_1 path,
#main .news .lineDecoration .line02_2 path {
  stroke-dasharray: 10000;
  stroke-dashoffset: 10000;
}
@media all and (max-width: 896px) {
  #main .news .lineDecoration .line02_1 path,
  #main .news .lineDecoration .line02_2 path {
    stroke-width: 4;
  }
}
#main .news .lineDecoration .line02_1 {
  z-index: 1;
}
#main .news .lineDecoration .line02_2 {
  z-index: 2;
}
#main .news .lBox {
  width: 35rem;
  margin-top: 3.7rem;
}
#main .news .lBox .comBtn02 {
  width: 24.3rem;
}
#main .news .comNewsUl {
  flex: 1;
}
#main .news .comNewsUl .sub {
  align-items: flex-start;
}
#main .news .comNewsUl time {
  padding-top: 0.5rem;
  width: 9.9rem;
}
#main .news .comNewsUl a {
  display: block;
  padding: 3.2rem 5rem 3.2rem 0;
}
#main .news .comNewsUl a .text {
  line-height: 1.6;
  font-weight: 400;
  letter-spacing: 0.08rem;
}
#main .news .comNewsUl li.else a {
  background: url(../img/common/icon03.png) no-repeat right 0.7rem top 8.7rem/2.5rem;
}
@media all and (max-width: 896px) {
  #main .news {
    margin-bottom: 6.5rem;
    padding: 8.5rem 0 12.5rem;
  }
  #main .news .lineDecoration {
    bottom: 0;
    height: 14rem;
  }
  #main .news .lineDecoration .line02_1,
  #main .news .lineDecoration .line02_2 {
    display: block;
  }
  #main .news .content {
    display: block;
  }
  #main .news .lBox {
    width: auto;
    margin-top: 0;
  }
  #main .news .lBox .comBtn02 {
    width: 24.3rem;
  }
  #main .news .comNewsUl {
    margin-bottom: 6rem;
  }
  #main .news .comNewsUl .sub {
    display: block;
  }
  #main .news .comNewsUl time {
    padding-top: 0.5rem;
    width: auto;
    display: block;
  }
  #main .news .comNewsUl a {
    padding: 2.8rem 5rem 2rem 0;
  }
  #main .news .comNewsUl li.else a {
    background-position: right 0.7rem bottom 3.8rem;
  }
  #main .news .comBtn02 {
    width: 24.3rem;
    margin: 0 0 0 auto;
  }
}
#main .company {
  position: relative;
  z-index: 2;
  border-top-left-radius: 16rem;
  overflow: hidden;
}
#main .company .comBorder02 {
  padding: 8.5rem 0 11.7rem;
  background: linear-gradient(180deg, var(--green) 50.48%, var(--green02) 100%);
}
#main .company::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  content: "";
  z-index: -1;
  background-color: var(--light-green01);
}
#main .company .headLine05 {
  margin-bottom: 4rem;
  text-align: center;
}
#main .company .headLine05 .en {
  margin-bottom: 1.4rem;
  color: var(--white);
  font-size: 6.4rem;
}
#main .company .headLine05 .jp {
  padding: 0;
  color: var(--white);
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: 0.32rem;
}
#main .company .imgBox {
  align-items: flex-start;
}
#main .company .imgBox .photoBox {
  width: 52rem;
  border-radius: 0 8rem;
  overflow: hidden;
}
#main .company .imgBox .photoBox img {
  width: 100%;
}
#main .company .imgBox .textBox {
  margin-top: -0.5rem;
  width: calc(100% - 62rem);
}
#main .company .imgBox .textBox a {
  padding: 1.5rem 0;
  display: block;
  border-bottom: 1px solid var(--white);
  background: url(../img/common/line05.png) no-repeat right top 6rem/2rem;
}
#main .company .imgBox .textBox a:hover {
  opacity: 0.7;
}
#main .company .imgBox .textBox a .num {
  margin-bottom: 0.5rem;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 1;
  color: var(--yellow);
}
#main .company .imgBox .textBox a .num span {
  padding-right: 0.2rem;
  font-size: 1.2rem;
  font-weight: 400;
}
#main .company .imgBox .textBox a .en {
  margin-bottom: 0.5rem;
  color: var(--white);
  font-size: 2rem;
  font-weight: 600;
  line-height: 1.2;
}
#main .company .imgBox .textBox a .jp {
  font-size: 1.4rem;
  color: var(--white);
  line-height: 1;
  letter-spacing: 0.14rem;
}
@media all and (max-width: 896px) {
  #main .company {
    border-top-left-radius: 8rem;
  }
  #main .company .comBorder02 {
    padding-bottom: 10rem;
  }
  #main .company .headLine05 {
    margin-bottom: 4rem;
  }
  #main .company .headLine05 .en {
    margin-bottom: 1.4rem;
    font-size: 5.6rem;
    letter-spacing: 0.02em;
  }
  #main .company .imgBox {
    display: block;
  }
  #main .company .imgBox .photoBox {
    margin-bottom: 4rem;
    width: auto;
    border-radius: 0 6rem;
  }
  #main .company .imgBox .textBox {
    margin-top: 0;
    width: auto;
  }
}
#main .recruit {
  overflow: hidden;
  position: relative;
  z-index: 1;
  padding: 10.3rem 0 12rem;
  background-color: var(--light-green01);
}
#main .recruit .content {
  max-width: 124rem;
}
#main .recruit .headLine05 {
  margin-bottom: 4.3rem;
}
#main .recruit .headLine05 .jp {
  color: var(--grey);
}
#main .recruit .photoUl {
  margin-bottom: 8rem;
}
#main .recruit .photoUl li {
  width: 36rem;
  border-radius: 8rem 0;
  overflow: hidden;
}
#main .recruit .photoUl li:nth-child(2n) {
  border-radius: 50%;
}
#main .recruit .photoUl li img {
  width: 100%;
}
#main .recruit .textBox {
  width: 80rem;
}
#main .recruit .textBox .title {
  margin-bottom: 2.3rem;
  color: var(--green01);
  font-size: 2.7rem;
  font-weight: 500;
  line-height: 1.4;
}
#main .recruit .textBox .text {
  line-height: 2;
  letter-spacing: 0.08rem;
}
#main .recruit .comBtn02 {
  margin: -5.3rem 0 0 auto;
  width: 19.4rem;
}
@media all and (max-width: 896px) {
  #main .recruit {
    padding: 10.5rem 0 10rem;
  }
  #main .recruit .headLine05 {
    margin-bottom: 4.3rem;
  }
  #main .recruit .photoUl {
    margin-bottom: 3.8rem;
  }
  #main .recruit .photoUl li {
    width: 24rem;
    border-radius: 6rem 0;
  }
  #main .recruit .textBox {
    margin-bottom: 4.1rem;
    width: auto;
  }
  #main .recruit .textBox .title {
    margin-bottom: 2.3rem;
    font-size: 2rem;
  }
  #main .recruit .comBtn02 {
    margin: 0 auto;
  }
}
#main .contact {
  position: relative;
  padding: 9.5rem 0 28.7rem;
}
#main .contact .content {
  max-width: 124rem;
}
#main .contact .lineDecoration {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 64rem;
  z-index: 1;
  pointer-events: none;
}
#main .contact .lineDecoration .line01_contact_1,
#main .contact .lineDecoration .line01_contact_2 {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
}
#main .contact .lineDecoration .line01_contact_1 svg,
#main .contact .lineDecoration .line01_contact_2 svg {
  width: 100%;
  height: 100%;
  display: block;
}
#main .contact .lineDecoration .line01_contact_1 path,
#main .contact .lineDecoration .line01_contact_2 path {
  stroke-dasharray: 10000;
  stroke-dashoffset: 10000;
}
@media all and (max-width: 896px) {
  #main .contact .lineDecoration .line01_contact_1 path,
  #main .contact .lineDecoration .line01_contact_2 path {
    stroke-width: 4;
  }
}
#main .contact .lineDecoration .line01_contact_1 {
  z-index: 1;
}
#main .contact .lineDecoration .line01_contact_1 svg {
  margin-top: 6rem;
}
@media all and (max-width: 896px) {
  #main .contact .lineDecoration .line01_contact_1 svg {
    margin-top: 2rem;
  }
}
#main .contact .lineDecoration .line01_contact_2 {
  z-index: 2;
}
#main .contact .headLine03 {
  margin-bottom: 2.8rem;
  background-image: url(../img/common/line06.png);
}
#main .contact .headLine03 .en {
  color: var(--green);
}
#main .contact .headLine03 .jp {
  color: var(--light-green);
}
#main .contact .text {
  line-height: 1.8;
  letter-spacing: 0.08rem;
}
#main .contact .btn {
  margin: -8.8rem 0 0 auto;
  width: 12rem;
  background-color: var(--base_bg);
  border-radius: 50%;
  overflow: hidden;
  position: relative;
  z-index: 2;
}
#main .contact .btn a {
  display: block;
}
#main .contact .btn a:hover {
  opacity: 0.7;
}
@media all and (max-width: 896px) {
  #main .contact {
    padding: 7.8rem 0 1.2rem;
  }
  #main .contact .lineDecoration {
    height: 19.5rem;
  }
  #main .contact .lineDecoration .line01_contact_1,
  #main .contact .lineDecoration .line01_contact_2 {
    display: block;
  }
  #main .contact .headLine03 {
    margin-bottom: 3.7rem;
    background-image: url(../img/common/line06_sp.png);
  }
  #main .contact .text {
    margin-bottom: 4.1rem;
  }
  #main .contact .btn {
    margin-top: 0;
    width: 8rem;
  }
}

@keyframes rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}