@charset "UTF-8";
@-webkit-keyframes loop {
   0% {
     transform: translateX(100%);
   }
 
   to {
     transform: translateX(-100%);
   }
 }
 
 @keyframes loop {
   0% {
     transform: translateX(100%);
   }
 
   to {
     transform: translateX(-100%);
   }
 }
 
 @-webkit-keyframes loop2 {
   0% {
     transform: translateX(0);
   }
 
   to {
     transform: translateX(-200%);
   }
 }
 
 @keyframes loop2 {
   0% {
     transform: translateX(0);
   }
 
   to {
     transform: translateX(-200%);
   }
 }

/* ========================================
   @media screen and (min-width: 768px),print
======================================== */
@media screen and (min-width: 768px),print {  
main {
   max-width: 1920px;
   margin-inline: auto;
   width: 100%;
}
.util-btn {
   width: min(95%, 340px);
}
.util-btn a {
   font-size: clamp(0.75rem, 0.583rem + 0.35vw, 1rem);
   line-height: 2.0625;
   letter-spacing: 0;
   text-align: left;
   color: #fff;
   position: relative;
   background: #3A4F44;
   border-radius: 200px;
   display: block;
   padding: 13px 39px;
}
.util-btn a::after {
   position: absolute;
   content: "";
   background: url(../images/common/util-btn-arrow.svg)no-repeat;
   background-size: contain;
   width: 30px;
   height: 30px;
   top: 50%;
   right: 15px;
   transform: translateY(-50%);
   transition: all 0.2s;
}
.util-btn a:hover {
   text-decoration: none;
}
.util-btn a:hover::after {
   right: 10px;
}

footer .footer-Box {
   padding: 363px 0 100px;
}
  
/* mv -------------------------------------*/
#mv {
   margin-top: -78px;
}
#mv .main-photo {
   position: relative;
   width: 100%;
   max-width: 1920px;
   margin-inline: auto;
}
#mv .main-photo img {
   width: 100%;
   height: auto;
}
#mv h1 {
   position: absolute;
   top: 100px;
   left: 360px;
}

/* worries -------------------------------------*/
#worries {
   background: url(../images/index/worries-bg.png)no-repeat center top / cover;
   margin-top: -231px;
   position: relative;
   padding-bottom: 261px;
}
#worries .subt {
   margin-right: 133px;
   text-align: right;
   position: relative;
   top: -59px;
   margin-bottom: -110px;
}
#worries .inner{
   width: min(95%, 1220px);
   margin-inline: auto;
   text-align: center;
   background: url(../images/index/worries-innerBg.png)no-repeat center top / contain;
   position: relative;
   padding-bottom: 47px;
   z-index: 10;
}
#worries .inner::before {
   position: absolute;
   content: "";
   background: url(../images/index/worries-human.png) no-repeat;
   background-size: contain;
   width: 138px;
   height: 203px;
   bottom: -26px;
   left: 310px;
   z-index: 2
}
#worries h2 {
   display: inline-block;
   position: relative;
   top: -49px;
}
#worries h2::before {
   position: absolute;
   content: "";
   background: url(../images/index/worries-ttl-deco.png)no-repeat;
   background-size: contain;
   width: 98px;
   height: 69px;
   top: -47px;
   left: -53px;
}
#worries .list {
   display: flex;
   gap: 20px;
   margin-bottom: 28px;
   justify-content: center;
   margin-top: -19px;
}
#worries .list li {
   background: #fff;
   filter: drop-shadow(0px 3px 6px rgba(62, 62, 62, 0.1));
   font-weight: 500;
   font-size: 20px;
   letter-spacing: 0.05em;
   line-height: 2;
   position: relative;
   border-radius: 5px;
   padding: 13px 18px 13px 60px;
}
#worries .list li::before {
   position: absolute;
   content: "";
   background: url(../images/index/check-icon.svg)no-repeat;
   background-size: contain;
   width: 30px;
   height: 30px;
   top: 50%;
   left: 20px;
   transform: translateY(-50%);
}
#worries .list li span {
   color: #3B8461;
}
#worries .lead {
   font-weight: 500;
   font-size: 24px;
   letter-spacing: 0.05em;
   line-height: 1.6666;
   text-align: center;
   color: #fff;
   position: relative;
}
 #worries .btn {
   position: absolute;
   content: "";
   background: url(../images/index/check-img.png)no-repeat;
   background-size: contain;
   width: 140px;
   height: 140px;
   filter: drop-shadow(0px 6px 12px rgba(29, 29, 31, 0.24));
   bottom: -29px;
   right: 151px;
} 
#worries .btn a {
   display: block;
}
#worries .btn a:hover img {
   opacity: 1;
}


/* concept -------------------------------------*/
#concept {
   background: url(../images/index/concept-bg.png)no-repeat center top / cover;
   margin-top: -456px;
   position: relative;
   z-index: 2;
}
#concept .en {
   max-width: 1920px;
   width: 100%;
   margin-inline: auto;
   z-index: 6;
   position: relative;
}
#concept .loop {
   overflow: hidden;
   padding: 348px 0 0;
}
#concept .loop .loop__box {
   display: flex;
   width: 100vw;
}
#concept .loop .loop__box img {
   min-width: 175.5vw;
}
#concept .loop .loop__box img:first-child {
   -webkit-animation: loop 50s -25s linear infinite;
   animation: loop 50s -25s linear infinite;
}
#concept .loop .loop__box img:last-child {
   -webkit-animation: loop2 50s linear infinite;
   animation: loop2 50s linear infinite;
}
#concept .inner {
   width: min(95%, 1760px);
   margin-right: auto;
   padding-bottom: 407px;
}
#concept .inBox01 {
   display: grid;
   grid-template-columns: 50% 1fr;
   gap: 140px;
}
#concept .inBox01 .photo-box {
   position: relative;
}
#concept .inBox01 .photo01 {
   padding: 63px 0 0;
}
#concept .inBox01 .photo02 {
   padding: 22px 0 0;
}
#concept .inBox01 .photo03 {
   position: absolute;
   top: -18px;
   right: 140px;
   z-index: 7;
}
#concept .inBox01 .photo04 {
   position: absolute;
   top: 202px;
   right: 0;
}
#concept .inBox02 {
   display: grid;
   grid-template-columns: 50% 1fr;
   gap: 80px;
   width: min(95%, 1280px);
   margin-inline: auto;
}
#concept .inBox02 .ttl-box {padding: 105px 0 0;}
#concept .inBox02 h2 {
   padding: 0 0 0 7px;
   margin-bottom: 61px;
}
#concept .inBox02 .txt-box{position: relative;top: -67px;}
#concept .inBox02 .txt{
   font-weight: 500;
   font-size: 16px;
   letter-spacing: 0.05em;
   line-height: 2.25;
   margin-bottom: 28px;
}
#concept .inBox02 .txt:nth-child(3) {
   margin-bottom: 55px;
}

/* about -------------------------------------*/
#about {
   position: relative;
   margin-top: -354px;
   margin-bottom: -10px;
}
#about::before {
   position: absolute;
   content: "";
   width: 91.6666%;
   height: 721px;
   border-radius: 0px 100px 100px 0px;
   background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, #fff 100%);
   pointer-events: none;
   top: 0;
   left: 0;
   z-index: 3;
}
#about .wrap {
   z-index: 4;
   background: url(../images/index/about-bg.png)no-repeat top 102px center / contain;
   position: relative;
   padding: 0 0 177px;
}
#about .bg {
   background: #F6F6F6;
}
#about .inner{
   width: min(95%, 1400px);
   margin-inline: auto;
   padding-bottom: 69px;
}
#about .ttl-box{
   width: min(95%, 393px);
   margin-left: auto;
   text-align: center;
   position: relative;
   padding: 181px 0 0;
}
#about .ttl-box::before {
   position: absolute;
   content: "";
   background: url(../images/index/about-deco.png)no-repeat;
   background-size: contain;
   width: 234px;
   height: 208px;
   top: -44px;
   left: -28px;
}
#about .ttl-box .enttl {
   font-size: 20px;
   text-align: center;
   color: #3b8461;
   letter-spacing: 0;
   margin-bottom: -21px;
}
#about .ttl-box h2 {
   font-weight: 500;
   font-size: 42px;
   letter-spacing: 0.05em;
   line-height: 2.52380;
   text-align: center;
   display: inline-block;
   position: relative;
   background: url(../images/index/about-ttl-line.svg)no-repeat;
   background-size: auto;
   background-position: bottom;
}
#about .list {
   display: grid;
   gap: 60px;
   margin: -46px 0 0;
}
#about .list li {
   width: min(95%, 1086px);
}
#about .list li:nth-child(2) {
    margin-left: auto;
}
#about .list li:nth-child(3) {
    margin-left: 60px;
}
#about .list li .inBox {
   gap: 40px;
   display: flex;
   align-items: flex-start;
}
#about .list li .inBox .img {
   box-shadow: 0px 20px 40px rgba(0, 0, 0, 0.16);
   background: #fff;
}
#about .list li .inBox .txt-box {padding: 21px 0 0;}
#about .list li .inBox .enttl {
   font-size: 24px;
   line-height: 1.6666;
   letter-spacing: 0;
   color: #e6ff00;
   margin-bottom: 20px;
}
#about .list li .inBox h3 {
   font-weight: 500;
   font-size: 55px;
   letter-spacing: 0.05em;
   line-height: 1.12727;
   margin-bottom: 43px;
}
#about .list li .inBox h3 span {
   background: #FFFFFF;
   padding: 7px 24px;
}
#about .list li .inBox .txt {
   font-weight: 500;
   font-size: 14px;
   letter-spacing: 0.05em;
   line-height: 2;
   color: #fff;
   margin-bottom: 23px;
}
#about .list li .inBox .util-btn a {
   background: #176540;
}

/* menu -------------------------------------*/
#menu {
   background: #F6F6F6;
}
#menu .inner{
   width: min(95%, 1600px);
   margin-inline: auto;
   padding-bottom: 157px;
}
#menu .upper{
   display: flex;
   justify-content: space-between;
   margin-bottom: 45px;
   align-items: flex-end;
}
#menu .upper .ttl-frame {
   display: flex;
   gap: 40px;
   align-items: baseline;
   padding-left: 4px;
}
#menu .upper .ttl-box .enttl {
   font-size: 90px;
   line-height: 1.1111;
   letter-spacing: 0;
   color: #3b8461;
   padding: 0 0 8px 3px;
}
#menu .upper .ttl-box h2 {
   font-weight: 500;
   font-size: 22px;
   letter-spacing: 0.05em;
   line-height: 2.863636;
}
#menu .upper .ttl-frame .txt {
   font-size: 14px;
   letter-spacing: 0.05em;
   line-height: 2;
   position: relative;
   top: 15px;
}
#menu .upper .util-btn {
   margin: 0 0 16px;
}
#menu .list {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   gap: 36px 40px;
}
#menu .list li {
   background: #FFFFFF;
   width: 370px;
   position: relative;
}
#menu .list li::after {
   position: absolute;
   content: "";
   background: url(../images/common/util-btn-arrow02.svg)no-repeat;
   background-size: contain;
   width: 20px;
   height: 20px;
   bottom: 24px;
   right: 30px;
}
#menu .list li .content {
  position: relative;
  padding: 0 0 40px;
}
#menu .list li .content .icon{
  text-align: center;
  position: relative;
  top: -40px;
  margin-bottom: -51px;
}
#menu .list li .content h3 {
   font-weight: 500;
   font-size: 22px;
   letter-spacing: 0.05em;
   line-height: 2.454545;
   margin-bottom: 4px;
   text-align: center;
}
#menu .list li .content .txt {
   font-size: 14px;
   letter-spacing: 0.05em;
   line-height: 2;
   padding: 0 30px;
}

/* works -------------------------------------*/
#works .inner {
   width: min(95%, 1200px);
   margin-inline: auto;
   padding: 117px 0 120px;
}
#works .enttl {
   font-size: 12px;
   letter-spacing: 0;
   text-align: center;
   color: #3b8461;
   margin-bottom: 12px;
}
#works h2 {
   font-weight: 500;
   font-size: 28px;
   letter-spacing: 0.05em;
   text-align: center;
   margin-bottom: 58px;
}
#works .system-list {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 0 60px;
   margin-bottom: 80px;
}
#works .system-list li {
   display: block grid;
   grid-template-rows: subgrid;
   grid-row: span 4;
}
#works .system-list li:nth-child(-n+3) {
   margin-bottom: 60px;
}
#works .system-list li a {
   display: block grid;
   grid-template-rows: subgrid;
   grid-row: span 4;
}
#works .system-pic {
   margin-bottom: 20px;
   width: 100%;
   height: 260px;
   text-align: center;
}
#works .system-pic img{
   width: auto;
   height: 100%;
   max-width: 100%;
}
#works .system-category {
   font-size: 12px;
   letter-spacing: 0.05em;
   line-height: 2.3333;
   color: #fff;
   margin-bottom: 11px;
}
#works .system-category span {
   text-align: center;
   border-radius: 2px;
   background: #839b95;
   padding: 0 14px;
   display: inline-block;
}
#works .system-ttl-01 {
   font-weight: 500;
   font-size: 16px;
   letter-spacing: 0.05em;
   line-height: 1.875;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
   -webkit-line-clamp: 2;
   margin-bottom: 17px;
}
#works .system-area {
   font-size: 14px;
   letter-spacing: 0.05em;
   line-height: 2;
   color: #a4a4a4;
   border-bottom: 1px solid #A4A4A4;
   padding-bottom: 8px;
}
#works .util-btn {
   width: min(95%, 480px);
   margin-inline: auto;
}

/* plan -------------------------------------*/
#plan {
   background: url(../images/index/plan-bg.png)repeat-y center / contain;
   padding-bottom: 230px;
   position: relative;
}
#plan::before,
#plan::after {
   content: "";
   position: absolute;
   bottom: 0;
   pointer-events: none;
   z-index: 2;
   width: 17.5%;
   height: 17%;
}
#plan::before {
   background: url(../images/index/plan-bg.png)repeat center top / contain;
   left: 0;
}
#plan::after {
   background: url(../images/index/plan-bg.png)repeat center top / contain;
   right: 0;
}
#plan h2 {
text-align: center;
position: relative;
top: -50px;
left: -7px;
margin-bottom: -104px;
}
#plan .list {
   position: relative;
   margin-bottom: 50px;
}
#plan .list li {
   width: 860px;
   border-radius: 40px;
   background: #fff;
   border: 1px solid #1d1d1f;
   position: relative;
   margin: 0 20px;
}
#plan .list li::after {
   position: absolute;
   content: "";
   background: url(../images/common/util-btn-arrow02.svg)no-repeat;
   background-size: contain;
   width: 40px;
   height: 40px;
   bottom: 19px;
   right: 19px;
}
#plan .list li::before {
   position: absolute;
   content: "";
}
#plan .list .list01::before {
   background: url(../images/index/plan-deco01.png)no-repeat;
   background-size: contain;
   width: 215px;
   height: 170px;
   bottom: -21px;
   right: 80px;
}
#plan .list .list02::before {
   background: url(../images/index/plan-deco02.png)no-repeat;
   background-size: contain;
   width: 200px;
   height: 170px;
   bottom: -21px;
   right: 80px;
}
#plan .list .list03::before {
   background: url(../images/index/plan-deco03.png)no-repeat;
   background-size: contain;
   width: 215px;
   height: 170px;
   bottom: -21px;
   right: 80px;
}
#plan .list li .inner {
   padding: 50px 60px 54px;
   display: grid;
   grid-template-columns: 46.614% 48.782%;
   gap: 35px;
}
#plan .list li .num{
   font-size: 19px;
   line-height: 1.5;
   letter-spacing: 0;
   border-bottom: 1px solid #1D1D1F;
   margin-bottom: 28px;
   display: inline-flex;
   align-items: baseline;
   gap: 4px;
}
#plan .list li .num span{
   font-size: 33px;
   line-height: 1.0909;
}
#plan .list li h3 {
   font-weight: 500;
   font-size: 24px;
   letter-spacing: 0.05em;
   line-height: 1.6666;
   margin-bottom: 40px;
}
#plan .list li .suggestion {
   width: 440px;
   background: #fff;
   box-shadow: 0px 0px 20px rgba(29, 29, 31, 0.08);
   position: relative;
   padding: 0 29px 26px;
}
#plan .list li .suggestion h4 {
   font-weight: 500;
   font-size: 14px;
   letter-spacing: 0.05em;
   line-height: 2;
   text-align: center;
   color: #fff;
   background: url(../images/index/suggestion-ttlBg.png)no-repeat;
   background-size: cover;
   padding: 0 21px 8px;
   display: inline-block;
   top: -13px;
   position: relative;
   left: -50px;
   margin-bottom: -21px;
}
#plan .list li .suggestion .txt {
   font-weight: 500;
   font-size: 14px;
   letter-spacing: 0.05em;
   line-height: 2;
}
#plan .list li .photo {
   padding: 8px 0 0;
}
#plan .list li a:hover img {
   opacity: 1;
}
#plan .util-btn {
   width: min(95%, 480px);
   margin-inline: auto;
}
#plan .util-btn a {
   background:#4F433A;
}
#plan .util-btn a::after {
   background: url(../images/common/util-btn-arrow03.svg)no-repeat;
}

/* section-wrap -------------------------------------*/
.section-wrap {
   position: relative;
   background: url(../images/index/sec-bg.png) repeat-y center top;
   margin-top: -110px;
}
/* .section-wrap::before {
   content: "";
   position: absolute;
   top: -110px;
   left: 0;
   right: 0;
   height: 141px; 
   background: url(../images/index/sec-bg-t.png) no-repeat center top / contain;
   pointer-events: none;
} */

/* bnr-box-------------------------------------*/
.bnr-box {
   width: min(95%, 1100px);
   margin-inline: auto;
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: 60px;
   margin-bottom: 116px;
   position: relative;
   /* top: -29px; */
   padding: 82px 0 0;
}
.bnr-box img {
   width: 100%;
   height: auto;
}

/* faq-------------------------------------*/
#faq .inner {
   width: min(95%, 1100px);
   margin-inline: auto;
   padding-bottom: 140px;
}
#faq .enttl {
   font-size: 12px;
   text-align: center;
   color: #3b8461;
   margin-bottom: 11px;
}
#faq h2 {
   font-weight: 500;
   font-size: 28px;
   letter-spacing: 0.05em;
   text-align: center;
   margin-bottom: 56px;
}
#faq #faqcontents {
   display: grid;
   grid-template-columns: repeat(1, minmax(0, 1fr));
   margin-bottom: 80px;
}
#faq #faqcontents .option{
   border-bottom: 1px solid #1D1D1F;
   cursor: pointer;
   padding: 40px 81px 40px;
}
#faq #faqcontents .option:first-child {
   border-top: 1px solid #1D1D1F;
}
#faq #faqcontents .title{
   font-weight: 500;
   font-size: 18px;
   letter-spacing: 0.05em;
   line-height: 1.7777;
   color: #3b8461;
   display: grid;
   gap: 40px;
   align-items: center;
   grid-template-columns: 60px 1fr;
}
#faq #faqcontents .title span {
   font-size: 20px;
   letter-spacing: 0;
   text-align: center;
   color: #fff;
   background: #3A4F44;
   display: grid;
   place-content: center;
   width: 60px;
   height: 60px;
   border-radius: 50%;
}
#faq #faqcontents .content {
   font-weight: 500;
   font-size: 16px;
   letter-spacing: 0.05em;
   line-height: 1.625;
   display: grid;
   grid-template-columns: 60px 1fr;
   gap: 40px;
   align-items: center;
}
#faq #faqcontents .content span{
   font-weight: 500;
   font-size: 16px;
   letter-spacing: 0.05em;
   text-align: center;
   display: grid;
   place-content: center;
   background: #fff;
   border: 1px solid #3a4f44;
   color: #3B8461;
   width: 60px;
   height: 60px;
   border-radius: 50%;
}

#faq .toggle {display: none; }
#faq .title, #faq .content {-webkit-backface-visibility: hidden; backface-visibility: hidden; transform: translateZ(0); transition: all 0.3s; }
#faq .title::after, #faq .title::before {content: "";position: absolute;right: -2em;top: 0.9em;width: 0.115em;height: 1.7em;background-color: #1D1D1F;transition: all 0.3s;cursor: pointer;}
#faq .title::after {transform: rotate(90deg); }
#faq .content {max-height: 0; overflow: hidden; }
#faq .toggle:checked + .title + .content {max-height: 500px;transition: all 1.5s;padding: 29px 0 0;}
#faq .toggle:checked + .title::before {transform: rotate(90deg) !important; }

#faq #faqcontents .option {
   transition: background-color 0.3s ease;
}
#faq #faqcontents .option:has(.toggle:checked) {
   background-color: #fff;
}
#faq .util-btn {
   width: min(95%, 480px);
   margin-inline: auto;
}

/* staff -------------------------------------*/
#staff {
   background: url(../images/index/staff-bg.png)no-repeat center / cover;
   padding: 106px 0 263px;
}
#staff .inBox {
   width: min(95%, 1100px);
   margin-inline: auto;
   display: grid;
   grid-template-columns: 31.54% 65.4545%;
   gap: 33px;
   padding-bottom: 60px;
   align-items: flex-end;
}
#staff .ttl-box {
   color: #fff;
   padding: 0 0 0 5px;
}
#staff .ttl-box .enttl {
   font-size: 70px;
   letter-spacing: 0;
   margin: 0 0 6px -5px;
   line-height: 1;
}
#staff .ttl-box h2 {
   font-weight: 500;
   font-size: 22px;
   letter-spacing: 0.05em;
   margin-bottom: 23px;
}
#staff .ttl-box .txt {
   font-weight: 500;
   font-size: 14px;
   letter-spacing: 0.05em;
   line-height: 2;
   margin-bottom: 32px;
}
#staff .ttl-box .btn {
   width: min(95%, 200px);
}
#staff .ttl-box .btn a{
   font-size: 16px;
   line-height: 2.0625;
   border-bottom: 1px solid #FFFFFF;
   color: #fff;
   display: block;
   position: relative;
   letter-spacing: 0;
   padding-bottom: 6px;
}
#staff .ttl-box .btn a::after{
   position: absolute;
   content: "→";
   right: 0;
   top: 50%;
   transform: translateY(-50%);
   font-size: 16px;
   line-height: 2.0625;
}
#staff .ttl-box .btn a:hover::after {
   right: -1px;
}
#staff .photo {
   position: relative;
}
#staff .photo::before  {
   position: absolute;
   content: "";
   background: url(../images/index/staff-deco.png)no-repeat;
   background-size: contain;
   width: 105px;
   height: 90px;
   top: -63px;
   right: 91px;
}
#staff .photo img {
   width: 100%;
   height: auto;
}
#staff .link-list {
   width: min(95%, 1100px);
   margin-inline: auto;
   display: flex;
   gap: 20px;
}
#staff .link-list img {
   width: 100%;
   height: auto;
}

/* newsandevent -------------------------------------*/
#newsandevent {
   width: min(95%, 1400px);
   margin-inline: auto;
   border-radius: 60px;
   background: #faf8f4;
   margin-top: -163px;
   margin-bottom: -210px;
   position: relative;
   z-index: 2;
}
#newsandevent .inner{
   width: min(95%, 1100px);
   margin-inline: auto;
   padding: 100px 0 120px;
}
#newsandevent .enttl{
   font-size: 12px;
   letter-spacing: 0;
   text-align: center;
   color: #3b8461;
   margin-bottom: 10px;
}
#newsandevent h2{
   font-weight: 500;
   font-size: 28px;
   letter-spacing: 0.05em;
   text-align: center;
   margin-bottom: 57px;
}
#newsandevent .system-list {
   display: grid;
   grid-template-columns: repeat(3, minmax(0, 1fr));
   gap: 70px;
   margin-bottom: 60px;
}
#newsandevent .system-list li {
   position: relative;
}
#newsandevent .system-list li::after {
   position: absolute;
   content: "";
   background: url(../images/common/util-btn-arrow02.svg)no-repeat;
   background-size: contain;
   width: 24px;
   height: 24px;
   bottom: 10px;
   right: 10px;
}
#newsandevent .system-list li .system-pic{
   width: 100%;
   height: 240px;
   text-align: center;
   margin-bottom: 0;
}
#newsandevent .system-list li .system-pic img{
   width: auto;
   height: 100%;
   max-width: 100%;
}
#newsandevent .system-list li .text-box{
   background: #fff;
   box-shadow: 0px 10px 20px rgba(62, 62, 62, 0.1);
   padding: 19px 24px;
   height: 264px;
}
#newsandevent .system-list li .system-category{
   font-size: 12px;
   letter-spacing: 0.05em;
   line-height: 1;
   text-align: center;
   padding: 9px 14px;
   color: #fff;
   border-radius: 2px;
   background: #b89d80;
   display: inline-block;
   margin-bottom: 12px;
}
#newsandevent .system-list li .system-ttl{
   font-weight: 500;
   font-size: 16px;
   letter-spacing: 0.05em;
   line-height: 1.75;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
   -webkit-line-clamp: 2;
   margin-bottom: 14px;
}
#newsandevent .system-list li .date-flex {
   display: flex;
   align-items: flex-end;
   gap: 2px;
   margin-bottom: 5px;
}
#newsandevent .system-list li .event-date .year {
   font-weight: bold;
   font-size: 12px;
   letter-spacing: 0.05em;
   line-height: 2;
   color: #3b8461;
}
#newsandevent .system-list li .event-date .day {
   font-weight: bold;
   font-size: 24px;
   letter-spacing: 0.05em;
   line-height: 1;
   color: #3b8461;
}
#newsandevent .system-list li .event-date .dash {
   font-weight: 500;
   font-size: 12px;
   letter-spacing: 0.05em;
   line-height: 2.3333;
   color: #3b8461;
}
#newsandevent .system-list li .event-date .week {
   font-weight: 500;
   font-size: 12px;
   letter-spacing: 0.05em;
   color: #3b8461;
   position: relative;
   left: -3px;
}
#newsandevent .system-list li .event-date .time,
#newsandevent .system-list li .event-date .place {
   font-weight: 500;
   font-size: 12px;
   letter-spacing: 0.05em;
   line-height: 2;
   color: #a4a4a4;
}

#newsandevent .util-btn {
   width: min(95%, 480px);
   margin-inline: auto;
}

}

/* ========================================
@media screen and (min-width:768px) and (max-width:1919px) 
======================================== */
@media screen and (min-width:768px) and (max-width:1919px) {
/* mv -------------------------------------*/
#mv {
   margin-top: -4.065vw;
}
#mv h1 {
   top: 5.211vw;
   left: 18.76vw;
}
#mv h1 img {
   width: 6.774vw;
}

/* worries -------------------------------------*/
#worries {
   margin-top: -12.038vw;
   padding-bottom: 13.601vw;
}
#worries .subt {
   margin-right: 6.931vw;
   top: -3.075vw;
   margin-bottom: -5.732vw;
}
#worries .subt img {
   width: 34.184vw;
}

}

/* ========================================
@media screen and (min-width:768px) and (max-width:1440px)
======================================== */
@media screen and (min-width:768px) and (max-width:1440px) {
   #worries .inner{
   width: 84.722vw;
   padding-bottom: 3.264vw;
}
#worries .inner::before {
   width: 9.375vw;
   height: 11.736vw;
   left: 20.486vw;
}
#worries h2 {
   top: -3.403vw;
}
#worries h2 img {
   width: 45.625vw;
}
#worries h2::before {
   width: 6.806vw;
   height: 4.792vw;
   top: -3.264vw;
   left: -3.681vw;
}
#worries .list {
   gap: 1.389vw;
   margin-bottom: 1.944vw;
   margin-top: -1.319vw;
}
#worries .list li {
   font-size: 1.389vw;
   border-radius: 0.347vw;
   padding: 0.903vw 1.25vw 0.903vw 4.167vw;
}
#worries .list li::before {
   width: 2.083vw;
   height: 2.083vw;
   left: 1.389vw;
}
#worries .lead {
   font-size: 1.667vw;
}
#worries .btn {
   width: 9.722vw;
   height: 9.722vw;
   bottom: -2.014vw;
   right: 10.486vw;
}
#worries .btn img {
   width: 100%;
   height: auto;
}
}

/* ========================================
@media screen and (min-width:768px) and (max-width:1860px) 
======================================== */
@media screen and (min-width:768px) and (max-width:1860px) {
/* concept -------------------------------------*/
#concept {
   margin-top: -24.516vw;
}
#concept .loop {
   padding: 18.71vw 0 0;
}
#concept .inner {
   width: 94.624vw;
   padding-bottom: 21.882vw;
}
#concept .photo img {
   width: 100%;
   height: auto;
}
#concept .inBox01 {
   grid-template-columns: 50% 1fr;
   gap: 7.527vw;
}
#concept .inBox01 .photo01 {
   padding: 3.387vw 0 0;
}
#concept .inBox01 .photo02 {
   padding: 1.183vw 0 0;
   width: 15.054vw;
}
#concept .inBox01 .photo03 {
   top: -0.968vw;
   right: 7.527vw;
   width: 15.054vw;
}
#concept .inBox01 .photo04 {
   top: 10.86vw;
   width: 22.581vw;
}
#concept .inBox02 {
   grid-template-columns: 50% 1fr;
   gap: 4.301vw;
   width: 74.817vw;
}
#concept .inBox02 .ttl-box {padding: 5.645vw 0 0;}
#concept .inBox02 h2 {
   padding: 0 0 0 0.376vw;
   margin-bottom: 3.28vw;
}
#concept .inBox02 h2 img {
   width: 21.183vw;
}
#concept .inBox02 h3 img {
   width: 31.613vw;
}
#concept .inBox02 .txt-box{position: relative;top: -3.602vw;}
#concept .inBox02 .txt{
   font-size: clamp(0.688rem, 0.468rem + 0.46vw, 1rem);
   margin-bottom: 1.505vw;
}
#concept .inBox02 .txt:nth-child(3) {
   margin-bottom: 2.957vw;
}
}

/* ========================================
@media screen and (min-width:768px) and (max-width:1860px) 
======================================== */
@media screen and (min-width:768px) and (max-width:1860px) {
/* about -------------------------------------*/
#about {
   margin-top: -19.032vw;
   margin-bottom: -0.538vw;
}
#about::before {
   height: 38.763vw;
   border-radius: 0px 5.376vw 5.376vw 0px;
}
#about .wrap {
   background: url(../images/index/about-bg.png)no-repeat top 5.484vw center / contain;
   padding: 0 0 9.516vw;
}
#about .inner{
   width: 75.269vw;
   padding-bottom: 3.71vw;
}
#about .ttl-box{
   width: 21.129vw;
   padding: 9.731vw 0 0;
}
#about .ttl-box::before {
   width: 12.581vw;
   height: 11.183vw;
   top: -2.366vw;
   left: -1.505vw;
}
#about .ttl-box .enttl {
   font-size: 1.075vw;
   margin-bottom: -1.129vw;
}
#about .ttl-box h2 {
   font-size: 2.258vw;
}
#about .list {
   gap: 3.226vw;
   margin: -2.473vw 0 0;
}
#about .list li {
   width: 58.387vw;
}
#about .list li:nth-child(3) {
   margin-left: 3.226vw;
}
#about .list li .inBox {
   grid-template-columns: 58.9318% 36.8324%;
   gap: 2.151vw;
}
#about .list li .inBox .img {
   box-shadow: 0px 1.075vw 2.151vw rgba(0, 0, 0, 0.16);
}
#about .list li .inBox .txt-box {padding: 1.129vw 0 0;}
#about .list li .inBox .enttl {
   font-size: 1.29vw;
   margin-bottom: 1.075vw;
}
#about .list li .inBox h3 {
   font-size: 2.957vw;
   margin-bottom: 2.312vw;
}
#about .list li .inBox h3 span {
   padding: 0.376vw 1.29vw;
}
#about .list li .inBox .txt {
   font-size: clamp(0.625rem, 0.449rem + 0.37vw, 0.875rem);
   margin-bottom: 1.237vw;
}
#about .list li .inBox img {
   width: 100%;
   height: auto;
}
}

/* ========================================
@media screen and (min-width:768px) and (max-width:1100px) 
======================================== */
@media screen and (min-width:768px) and (max-width:1100px) {
   #about .wrap {
      background: url(../images/index/about-bg.png)no-repeat top 5.484vw center / 115vw;
   }
}

/* ========================================
@media screen and (min-width:768px) and (max-width:1700px)
======================================== */
@media screen and (min-width:768px) and (max-width:1700px) {
/* menu -------------------------------------*/
#menu .inner{
   width: 97.118vw;
   padding-bottom: 9.235vw;
}
#menu .upper{
   margin-bottom: 2.647vw;
}
#menu .upper .ttl-frame {
   gap: 2.353vw;
   padding-left: 0.235vw;
}
#menu .upper .ttl-box .enttl {
   font-size: 5.294vw;
   padding: 0 0 0.471vw 0.176vw;
}
#menu .upper .ttl-box .enttl img {
   width: 14.412vw;
}
#menu .upper .ttl-box h2 {
   font-size: clamp(0.75rem, 0.235rem + 1.07vw, 1.375rem);
}
#menu .upper .ttl-frame .txt {
   font-size: clamp(0.625rem, 0.419rem + 0.43vw, 0.875rem);
   top: 0.294vw;
}
#menu .upper .util-btn {
   margin: 0 0 0.941vw;
   width: 20vw;
}
#menu .list {
   gap: 2.118vw 2.353vw;
}
#menu .list li {
   width: 21.765vw;
}
#menu .list li::after {
   width: 1.176vw;
   height: 1.176vw;
   bottom: 1.412vw;
   right: 1.765vw;
}
#menu .list li .photo img {
   width: 100%;
   height: auto;
}
#menu .list li .content {
  padding: 0 0 2.353vw;
}
#menu .list li .content .icon{
  top: -2.353vw;
  margin-bottom: -3vw;
}
#menu .list li .content .icon img {
   width: 4.706vw;
}
#menu .list li .content h3 {
   font-size: clamp(0.688rem, 0.121rem + 1.18vw, 1.375rem);
   margin-bottom: 0.235vw;
}
#menu .list li .content .txt {
   font-size: clamp(0.625rem, 0.419rem + 0.43vw, 0.875rem);
   padding: 0 1.765vw;
}
}

/* ========================================
@media screen and (min-width:768px) and (max-width:1000px) 
======================================== */
@media screen and (min-width:768px) and (max-width:1000px) {
   #plan h2 img {
      width: 84.4vw;
   }
   #plan .list li {
      width: 86.6vw;
   }
   #plan .list li .photo img {
      width: 100%;
      height: auto;
   }
   #plan .list .list01::before {
      width: 21.5vw;
      height: 17vw;
      bottom: -2.1vw;
      right: 8vw;
   }
   #plan .list .list02::before {
      width: 20vw;
      height: 17vw;
      bottom: -2.1vw;
      right: 8vw;
   }
   #plan .list .list03::before {
      width: 21.5vw;
      height: 17vw;
      bottom: -2.1vw;
      right: 8vw;
   }
   #plan .list li .suggestion {
      width: 44vw;
      padding: 0 2.9vw 2.6vw;
   }
}

/* ========================================
@media screen and (min-width:768px) and (max-width:1919px) 
======================================== */
@media screen and (min-width:768px) and (max-width:1919px) {
   .bnr-box {
      width: 57.322vw;
      gap: 3.127vw;
      margin-bottom: 6.045vw;
      padding: 4.273vw 0 0;
   } 
}

/* ========================================
@media screen and (min-width:768px) and (max-width:1280px) 
======================================== */
@media screen and (min-width:768px) and (max-width:1280px) {
/* newsandevent -------------------------------------*/
#newsandevent {
   margin-top: -12.734vw;
   margin-bottom: -16.406vw;
}
#newsandevent .inner{
   width: 85.938vw;
   padding: 7.813vw 0 9.375vw;
}
#newsandevent .enttl{
   margin-bottom: 0.781vw;
}
#newsandevent h2{
   margin-bottom: 4.453vw;
}
#newsandevent .system-list {
   gap: 5.469vw;
   margin-bottom: 4.688vw;
}
#newsandevent .system-list li::after {
   width: 1.875vw;
   height: 1.875vw;
   bottom: 0.781vw;
   right: 0.781vw;
}
#newsandevent .system-list li .text-box{
   padding: 1.484vw 1.875vw;
}
#newsandevent .system-list li .system-category{
   padding: 0.703vw 1.094vw;
   margin-bottom: 0.938vw;
}
#newsandevent .system-list li .system-ttl{
   margin-bottom: 1.094vw;
}
#newsandevent .system-list li .date-flex {
   gap: 0.156vw;
   margin-bottom: 0.391vw;
}
#newsandevent .system-list li .event-date .day {
   font-size: clamp(1.125rem, 0.563rem + 1.17vw, 1.5rem);
}
#newsandevent .system-list li .event-date .week {
   font-size: clamp(0.625rem, 0.438rem + 0.39vw, 0.75rem);
   left: -0.234vw;
}
#newsandevent .util-btn {
   width: 37.5vw;
} 
}

/* ========================================
@media screen and (min-width:768px) and (max-width:1000px) 
======================================== */
@media screen and (min-width:768px) and (max-width:1000px) {
   #newsandevent .system-list {
      gap: 2.5vw;
   }
}


/* ========================================
   @media screen and (max-width: 767px)
======================================== */
@media screen and (max-width: 767px) {
.util-btn {
   width: 72.46vw;
}
.util-btn a {
   font-size:3.865vw;
   line-height: 2.0625;
   letter-spacing: 0;
   text-align: left;
   color: #fff;
   position: relative;
   background: #3A4F44;
   border-radius: 48.31vw;
   display: block;
   padding: 2.5vw 7.2vw 1.61vw;
}
.util-btn a::after {
   position: absolute;
   content: "";
   background: url(../images/common/util-btn-arrow.svg)no-repeat;
   background-size: contain;
   width: 7.25vw;
   height: 7.25vw;
   top: 50%;
   right: 2.42vw;
   transform: translateY(-50%);
   transition: all 0.2s;
}
.util-btn a:hover {
   text-decoration: none;
}
.util-btn a:hover::after {
   right: 1.21vw;
}

/* mv -------------------------------------*/
#mv {padding: 2.5vw 0 0;}
#mv .main-photo {
   position: relative;
   width: 100%;
   max-width: 100vw;
   margin-inline: auto;
}
#mv .main-photo img {
   width: 100%;
   height: auto;
}
#mv h1 {
   position: absolute;
   top: 19.5vw;
   left: 5.2vw;
}

/* worries -------------------------------------*/
#worries {
   background: url(../images/index/worries-bg_sp.png)no-repeat center top / cover;
   margin-top: -21.5vw;
   position: relative;
   padding-bottom: 18vw;
   padding-top: 2.7vw;
}
#worries .subt {
   margin-right: 9vw;
   text-align: right;
   position: relative;
   margin-bottom: 7vw;
}
#worries .subt img {
   width: 74.88vw;
}
#worries .inner{
   width: 89.37vw;
   margin-inline: auto;
   text-align: center;
   background: url(../images/index/worries-innerBg_sp.png)no-repeat center top / contain;
   position: relative;
   padding-bottom: 8vw;
   z-index: 10;
}
#worries h2 {
   display: inline-block;
   position: relative;
   top: -8vw;
   margin-bottom: -8vw;
}
#worries h2::before {
   position: absolute;
   content: "";
   background: url(../images/index/worries-ttl-deco.png)no-repeat;
   background-size: contain;
   width: 16.35vw;
   height: 9.1vw;
   top: -8vw;
   left: 0vw;
}
#worries .list {
   display: grid;
   gap: 0.8vw;
   margin-bottom: 4.2vw;
   width: 79.71vw;
   margin-inline: auto;
   margin-top: -1vw;
   position: relative;
}
#worries .list::before {
position: absolute;
content: "";
background: url(../images/index/worries-human.png) no-repeat;
background-size: contain;
width: 14.08vw;
height: 16.98vw;
top: -16vw;
left: 0.5vw;
z-index: 2;
}
#worries .list li {
   background: #fff;
   filter: drop-shadow(0px 3px 9px rgba(62, 62, 62, 0.1));
   font-weight: 500;
   font-size:3.865vw;
   letter-spacing: 0.05em;
   line-height: 2.5;
   position: relative;
   border-radius: 1.21vw;
   padding: 1vw 2vw 1vw 10.87vw;
   text-align: left;
}
#worries .list li::before {
   position: absolute;
   content: "";
   background: url(../images/index/check-icon.svg)no-repeat;
   background-size: contain;
   width: 4.83vw;
   height: 4.83vw;
   top: 50%;
   left: 4vw;
   transform: translateY(-50%);
}
#worries .list li span {
   color: #3B8461;
}
#worries .lead {
   font-weight: 500;
   font-size:3.865vw;
   letter-spacing: 0;
   line-height: 1.75;
   color: #fff;
   position: relative;
   text-align: left;
   margin: 0 7.2vw;
}
 #worries .btn {
   position: absolute;
   content: "";
   background: url(../images/index/check-img.png)no-repeat;
   background-size: contain;
   width: 24.15vw;
   height: 24.15vw;
   filter: drop-shadow(0px 6px 12px rgba(29, 29, 31, 0.24));
   bottom: -2.5vw;
   right: 3.5vw;
} 
#worries .btn a {
   display: block;
}
#worries .btn a:hover img {
   opacity: 1;
}

/* concept -------------------------------------*/
#concept {
   background: url(../images/index/concept-bg_sp.png)no-repeat center top / cover;
   margin-top: -21vw;
   position: relative;
   z-index: 2;
}
#concept .en {
   max-width: 100vw;
   width: 100%;
   margin-inline: auto;
   z-index: 6;
   position: relative;
}
#concept .loop {
   overflow: hidden;
   padding: 33vw 0 0;
}
#concept .loop .loop__box {
   display: flex;
   width: 100vw;
}
#concept .loop .loop__box img {
   min-width: 321.5vw;
}
#concept .loop .loop__box img:first-child {
   -webkit-animation: loop 50s -25s linear infinite;
   animation: loop 50s -25s linear infinite;
}
#concept .loop .loop__box img:last-child {
   -webkit-animation: loop2 50s linear infinite;
   animation: loop2 50s linear infinite;
}
#concept .inner {
   padding-bottom: 94.1vw;
}
#concept .inBox01 {
   display: grid;
   gap: 13vw;
   margin-bottom: 10vw;
}
#concept .inBox01 .photo-box {
   position: relative;
}
#concept .inBox01 .photo01 {
   width: 91.06vw;
   order: 2;
}
#concept .inBox01 .photo01 img {
   width: 100%;
   height: auto;
}
#concept .inBox01 .photo02 {
   padding: 1vw 0 0 28.5vw;
}
#concept .inBox01 .photo02 img {
   width: 27.05vw;
}
#concept .inBox01 .photo03 {
   position: absolute;
   top: -3vw;
   right: 13.5vw;
   z-index: 7;
}
#concept .inBox01 .photo03 img {
   width: 27.05vw;
}
#concept .inBox01 .photo04 {
   position: absolute;
   top: 18.5vw;
   right: 0;
}
#concept .inBox01 .photo04 img {
   width: 40.58vw;
}
#concept .inBox02 {
   display: grid;
   gap: 11vw;
   width: 89.37vw;
   margin-inline: auto;
}
#concept .inBox02 h2 {
   margin-bottom: 7.2vw;
   padding: 0 0 0 1vw;
}
#concept .inBox02 .txt-box{position: relative;top: -4vw;}
#concept .inBox02 .txt{
   font-weight: 500;
   font-size:3.382vw;
   letter-spacing: 0.05em;
   line-height: 2.285714;
   margin-bottom: 4.4vw;
}
#concept .inBox02 .txt:nth-child(3) {
   margin-bottom: 10vw;
}

/* about -------------------------------------*/
#about {
   position: relative;
   margin-bottom: -10vw;
   margin-top: -89vw;
   background: url(../images/index/about-bg_sp.png)no-repeat center top  / contain;
}
#about .wrap {
   z-index: 4;
   background: url(../images/index/about-bg_sp.png)no-repeat center bottom  / contain;
   position: relative;
   padding: 0 0 1vw;
}
#about .inner{
   width: 89.37vw;
   margin-inline: auto;
   padding-bottom: 0;
}
#about .ttl-box{
   text-align: center;
   position: relative;
   padding: 26vw 0 12vw;
}
#about .ttl-box::before {
   position: absolute;
   content: "";
   background: url(../images/index/about-deco.png)no-repeat;
   background-size: contain;
   width: 33.33vw;
   height: 29.71vw;
   top: -2vw;
   left: 1.5vw;
}
#about .ttl-box .enttl {
   font-size:2.898vw;
   text-align: center;
   color: #3b8461;
   letter-spacing: 0;
   margin-bottom: 0vw;
}
#about .ttl-box h2 {
   font-weight: 500;
   font-size:5.314vw;
   letter-spacing: 0.05em;
   text-align: center;
   display: inline-block;
   position: relative;
   background: url(../images/index/about-ttl-line_sp.svg)no-repeat;
   background-size: auto;
   background-position: bottom;
   padding: 0 3.6vw 3vw;
}
#about .list {
   display: grid;
   gap: 12.2vw;
   position: relative;
   top: 4vw;
}
#about .list li .inBox {
   gap: 4vw;
   display: grid;
   position: relative;
}
#about .list li .inBox .img {
   box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.16);
   background: #fff;
}
#about .list li .inBox .enttl {
   font-size:2.898vw;
   line-height: 1.6666;
   letter-spacing: 0;
   color: #e6ff00;
   position: absolute;
   top: 33vw;
   right: 2vw;
}
#about .list li .inBox h3 {
   font-weight: 500;
   font-size:6.763vw;
   letter-spacing: 0.05em;
   line-height: 1.142857;
   position: absolute;
   right: 0;
   top: 38.2vw;
}
#about .list li .inBox h3 span {
   background: #FFFFFF;
   padding: 0.5vw 1.6vw 0.5vw 3.6vw;
}
#about .list li .inBox .txt {
   font-weight: 500;
   font-size:3.382vw;
   letter-spacing: 0.05em;
   line-height: 2;
   color: #fff;
   margin-bottom: 6vw;
}
#about .list li .inBox .util-btn {
   width: 57.97vw;
   margin-inline: auto;
}
#about .list li .inBox .util-btn a {
   background: #176540;
}

/* menu -------------------------------------*/
#menu {
   background: #F6F6F6;
}
#menu .inner{
   width: 89.37vw;
   margin-inline: auto;
   padding: 35.5vw 0 14.5vw;
   display: grid;
}
#menu .upper{
   display: contents;
}
#menu .upper .ttl-frame {
   display: grid;
   gap: 3.2vw;
   order: 1;
   margin-bottom: 8.8vw;
}
#menu .upper .ttl-box .enttl {
   text-align: center;
   margin-bottom: 5.1vw;
}
#menu .upper .ttl-box .enttl img {
   width: 32.9vw;
}  
#menu .upper .ttl-box h2 {
   font-weight: 500;
   font-size:5.314vw;
   letter-spacing: 0.05em;
   text-align: center;
}
#menu .upper .ttl-frame .txt {
   font-size:3.382vw;
   letter-spacing: 0.05em;
   line-height: 2;
   position: relative;
}
#menu .upper .util-btn {order: 3;margin-inline: auto;}
#menu .list {
   display: grid;
   gap: 7.3vw;
   order: 2;
   margin-bottom: 7vw;
}
#menu .list li {
   background: #FFFFFF;
   position: relative;
}
#menu .list li::after {
   position: absolute;
   content: "";
   background: url(../images/common/util-btn-arrow02.svg)no-repeat;
   background-size: contain;
   width: 4.83vw;
   height: 4.83vw;
   bottom: 2.42vw;
   right: 2.42vw;
}
#menu .list li .content {
  position: relative;
  padding: 0 4.8vw 6.4vw;
}
#menu .list li .content .icon{
  text-align: center;
  position: relative;
  top: -11vw;
  margin-bottom: -12vw;
}
#menu .list li .content .icon img {
   width: 16.91vw;
}
#menu .list li .content h3 {
   font-weight: 500;
   font-size:4.831vw;
   letter-spacing: 0.05em;
   margin-bottom: 1.5vw;
   text-align: center;
}
#menu .list li .content .txt {
   font-size:3.382vw;
   letter-spacing: 0.05em;
   line-height: 2;
}

/* works -------------------------------------*/
#works .inner {
   width: 91.79vw;
   margin-inline: auto;
   padding: 19vw 0 20vw;
}
#works .enttl {
   font-size:2.898vw;
   letter-spacing: 0;
   text-align: center;
   color: #3b8461;
   margin-bottom: 1.2vw;
}
#works h2 {
   font-weight: 500;
   font-size:5.314vw;
   letter-spacing: 0.05em;
   text-align: center;
   margin-bottom: 7vw;
}
#works .system-list {
   display: grid;
   grid-template-columns: repeat(2, minmax(0, 1fr));
   gap: 0 4.83vw;
   margin-bottom: 11vw;
}
#works .system-list li {
   display: block grid;
   grid-template-rows: subgrid;
   grid-row: span 4;
   margin-bottom: 9.5vw;
}
#works .system-list li a {
   display: block grid;
   grid-template-rows: subgrid;
   grid-row: span 4;
}
#works .system-pic {
   margin-bottom: 3.38vw;
   width: 100%;
   height: 31.40vw;
   text-align: center;
}
#works .system-pic img{
   width: auto;
   height: 100%;
   max-width: 100%;
}
#works .system-category {
   font-size:2.898vw;
   letter-spacing: 0.05em;
   line-height: 2.3333;
   color: #fff;
   margin-bottom: 2vw;
}
#works .system-category span {
   text-align: center;
   border-radius: 0.48vw;
   background: #839b95;
   padding: 0.1vw 3.32vw;
   display: inline-block;
}
#works .system-category .cat02 {
   padding: 0.1vw 1.95vw;
}
#works .system-ttl-01 {
   font-weight: 500;
   font-size:3.382vw;
   letter-spacing: 0.05em;
   line-height: 1.71428;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
   -webkit-line-clamp: 2;
   margin-bottom: 3.5vw;
}
#works .system-area {
   font-size:2.898vw;
   letter-spacing: 0.05em;
   line-height: 1.8333;
   color: #a4a4a4;
   border-bottom: 0.2vw solid #A4A4A4;
   padding-bottom: 1.8vw;
}
#works .util-btn {
   margin-inline: auto;
}

/* plan -------------------------------------*/
#plan {
   background: url(../images/index/plan-bg.png)repeat-y center / auto;
   padding-bottom: 23vw;
   position: relative;
}
#plan::before,
#plan::after {
   content: "";
   position: absolute;
   bottom: 0;
   pointer-events: none;
   z-index: 2;
   width: 3vw;
   height: 19vw;
}
#plan::before {
   background: url(../images/index/plan-bg.png)repeat center top / auto;
   left: 0;
}
#plan::after {
   background: url(../images/index/plan-bg.png)repeat center top / auto;
   right: 0;
}
#plan h2 {
   text-align: center;
   position: relative;
   top: -4vw;
   margin-bottom: -4vw;
   padding: 0 7vw 0 0vw;
}
#plan h2 img {
   width: 89.37vw;
}
#plan .list {
   position: relative;
   margin-bottom: 9.5vw;
}
#plan .list li {
   width: 86.96vw;
   border-radius: 4.83vw;
   background: #fff;
   border: 0.2vw solid #1d1d1f;
   position: relative;
   margin: 0 1.81vw;
}
#plan .list li::after {
   position: absolute;
   content: "";
   background: url(../images/common/util-btn-arrow02.svg)no-repeat;
   background-size: contain;
   width: 4.83vw;
   height: 4.83vw;
   bottom: 2.2vw;
   right: 2.2vw;
}
#plan .list li::before {
   position: absolute;
   content: "";
}
#plan .list .list01::before {
   background: url(../images/index/plan-deco01.png)no-repeat;
   background-size: contain;
   width: 31.88vw;
   height: 25.12vw;
   top: -5vw;
   right: 4.5vw;
}
#plan .list .list02::before {
   background: url(../images/index/plan-deco02.png)no-repeat;
   background-size: contain;
   width: 31.88vw;
   height: 25.12vw;
   top: -5vw;
   right: 5vw;
}
#plan .list .list03::before {
   background: url(../images/index/plan-deco03.png)no-repeat;
   background-size: contain;
   width: 31.88vw;
   height: 25.12vw;
   top: -5vw;
   right: 5vw;
}
#plan .list li .inner {
   padding: 5.85vw 4.59vw 9.8vw;
   display: grid;
}
#plan .list li .txt-box {
   display: contents;
}
#plan .list li .num{
   font-size:3.382vw;
   line-height: 1.7;
   letter-spacing: 0;
   border-bottom: 0.2vw solid #1D1D1F;
   margin-bottom: 3.4vw;
   display: inline-flex;
   align-items: baseline;
   gap: 0.8vw;
   order: 1;
}
#plan .list li .num span{
   font-size:5.797vw;
   line-height: 1.083333;
}
#plan .list li h3 {
   font-weight: 500;
   font-size:5.314vw;
   letter-spacing: 0.05em;
   line-height: 1.63636;
   margin-bottom: 4vw;
   order: 2;
}
#plan .list li .suggestion {
   background: #fff;
   box-shadow: 0px 0px 8px rgba(29, 29, 31, 0.08);
   position: relative;
   padding: 0 3.8vw 3.7vw;
   order: 4;
}
#plan .list li .suggestion h4 {
   font-weight: 500;
   font-size:3.382vw;
   letter-spacing: 0.05em;
   line-height: 2;
   text-align: center;
   color: #fff;
   background: url(../images/index/suggestion-ttlBg_sp.png)no-repeat;
   background-size: cover;
   padding: 0 1.5vw 2vw 3vw;
   display: inline-block;
   top: -1.5vw;
   position: relative;
   left: -6vw;
   margin-bottom: -2vw;
}
#plan .list li .suggestion .txt {
   font-weight: 500;
   font-size:2.898vw;
   letter-spacing: 0.05em;
   line-height: 1.833333;
}
#plan .list li .photo {
   order: 3;
   margin-bottom: 4vw;
}
#plan .list li a:hover img {
   opacity: 1;
}
#plan .util-btn {
   margin-inline: auto;
}
#plan .util-btn a {
   background:#4F433A;
}
#plan .util-btn a::after {
   background: url(../images/common/util-btn-arrow03.svg)no-repeat;
}
#plan .next-arrow, #plan .prev-arrow {
   position: absolute;
   top: 49%;
   transform: translateY(-50%);
   z-index: 15;
}
#plan .slick-list {
   overflow: visible!important;
}
#plan .next-arrow {
   right: 4vw;
}
#plan .prev-arrow {
   left: 4vw;
}

/* section-wrap -------------------------------------*/
.section-wrap {
   position: relative;
   background: url(../images/index/sec-bg_sp.png) repeat-y center top / contain;
   margin-top: -8.5vw;
}

/* bnr-box-------------------------------------*/
.bnr-box {
   width: 82.13vw;
   margin-inline: auto;
   display: grid;
   grid-template-columns: repeat(1, minmax(0, 1fr));
   gap: 4.5vw;
   margin-bottom: 14vw;
   position: relative;
   padding: 10vw 0 0;
}
.bnr-box img {
   width: 100%;
   height: auto;
}

/* faq-------------------------------------*/
#faq .inner {
   width: 89.37vw;
   margin-inline: auto;
   padding-bottom: 19vw;
}
#faq .enttl {
   font-size:2.898vw;
   text-align: center;
   color: #3b8461;
   margin-bottom: 1.5vw;
}
#faq h2 {
   font-weight: 500;
   font-size: 5.314vw;
   letter-spacing: 0.05em;
   text-align: center;
   margin-bottom: 6.6vw;
}
#faq #faqcontents {
   display: grid;
   grid-template-columns: repeat(1, minmax(0, 1fr));
   margin-bottom: 9.5vw;
}
#faq #faqcontents .option{
   border-bottom: 0.2vw solid #1D1D1F;
   cursor: pointer;
   padding: 4.2vw 0vw 4.2vw 3.6vw;
}
#faq #faqcontents .option:first-child {
   border-top: 0.2vw solid #1D1D1F;
}
#faq #faqcontents .title{
   font-weight: 500;
   font-size:3.382vw;
   letter-spacing: 0.05em;
   line-height: 1.7142857;
   color: #3b8461;
   display: grid;
   gap: 2.5vw;
   align-items: center;
   grid-template-columns: 9.66vw 1fr;
   padding: 0 11vw 0 0;
}
#faq #faqcontents .title span {
   font-size:3.382vw;
   letter-spacing: 0;
   text-align: center;
   color: #fff;
   background: #3A4F44;
   display: grid;
   place-content: center;
   width: 9.66vw;
   height: 9.66vw;
   border-radius: 50%;
   position: relative;
   top: -0.5vw;
}
#faq #faqcontents .content {
   font-weight: 500;
   font-size:2.898vw;
   letter-spacing: 0.05em;
   line-height: 1.8333;
   display: grid;
   grid-template-columns: 9.66vw 1fr;
   gap: 2.5vw;
}
#faq #faqcontents .content span{
   font-weight: 500;
   font-size:3.382vw;
   letter-spacing: 0;
   text-align: center;
   display: grid;
   place-content: center;
   background: #fff;
   border: 0.2vw solid #3a4f44;
   color: #3B8461;
   width: 9.66vw;
   height: 9.66vw;
   border-radius: 50%;
   position: relative;
   top: 0.5vw;
}

#faq .toggle {display: none; }
#faq .title, #faq .content {-webkit-backface-visibility: hidden; backface-visibility: hidden; transform: translateZ(0); transition: all 0.3s; }
#faq .title::after, #faq .title::before {content: "";position: absolute;right: 5.5vw;top: 0.95vw;width: 0.1em;height: 1.15em;background-color: #1D1D1F;transition: all 0.3s;cursor: pointer;}
#faq .title::after {transform: rotate(90deg); }
#faq .content {max-height: 0; overflow: hidden; }
#faq .toggle:checked + .title + .content {max-height: 500px;transition: all 1.5s;padding: 2.5vw 14vw 0 0;}
#faq .toggle:checked + .title::before {transform: rotate(90deg) !important; }

#faq #faqcontents .option {
   transition: background-color 0.3s ease;
}
#faq #faqcontents .option:has(.toggle:checked) {
   background-color: #fff;
}
#faq .util-btn {
   margin-inline: auto;
}

/* staff -------------------------------------*/
#staff {
   background: url(../images/index/staff-bg_sp.png)no-repeat center / cover;
   padding: 16vw 0 26.3vw;
}
#staff .inBox {
   width: 89.37vw;
   margin-inline: auto;
   display: grid;
   padding-bottom: 12vw;
   align-items: flex-end;
}
#staff .ttl-box {
   display: contents;
}
#staff .ttl-box .enttl {
   font-size:12.077vw;
   letter-spacing: 0;
   line-height: 1;
   order: 1;
   color: #FFFFFF;
   margin-bottom: 1.5vw;
}
#staff .ttl-box h2 {
   font-weight: 500;
   font-size:4.348vw;
   letter-spacing: 0.05em;
   margin-bottom: 2vw;
   order: 2;
   color: #FFFFFF;
}
#staff .ttl-box .txt {
   font-weight: 500;
   font-size:3.382vw;
   letter-spacing: 0.05em;
   line-height: 2;
   margin-bottom: 2vw;
   order: 4;
   color: #FFFFFF;
   text-align: center;
}
#staff .ttl-box .btn {
   width: 48.31vw;
   order: 5;
   margin-inline: auto;
}
#staff .ttl-box .btn a{
   font-size:3.865vw;
   line-height: 2.0625;
   border-bottom: 0.2vw solid #FFFFFF;
   color: #fff;
   display: block;
   position: relative;
   letter-spacing: 0;
   padding-bottom: 2vw;
}
#staff .ttl-box .btn a::after{
   position: absolute;
   content: "→";
   right: 0;
   top: 50%;
   transform: translateY(-50%);
   font-size: 2.865vw;
   line-height: 2.0625;
}
#staff .ttl-box .btn a:hover::after {
   right: -1vw;
}
#staff .photo {
   position: relative;
   order: 3;
   margin-bottom: 2.6vw;
}
#staff .photo::before  {
   position: absolute;
   content: "";
   background: url(../images/index/staff-deco.png)no-repeat;
   background-size: contain;
   width: 18.60vw;
   height: 15.94vw;
   top: -15vw;
   right: 6.5vw;
}
#staff .photo img {
   width: 100%;
   height: auto;
}
#staff .link-list {
   width: 77.29vw;
   margin-inline: auto;
   display: grid;
   gap: 2.5vw;
}
#staff .link-list li {
   text-align: center;
}
#staff .link-list img {
   width: 100%;
   height: auto;
}
#staff .link-list li:nth-last-child(1) {
   padding: 2vw 0 0;
}
#staff .link-list li:nth-last-child(1) img {
   width: 37.20vw;
}

/* newsandevent -------------------------------------*/
#newsandevent {
   border-radius: 9.66vw;
   background: #faf8f4;
   margin-top: -12vw;
   margin-bottom: 10vw;
   position: relative;
   z-index: 2;
}
#newsandevent .inner{
   padding: 14.4vw 0;
}
#newsandevent .enttl{
   font-size:2.898vw;
   letter-spacing: 0;
   text-align: center;
   color: #3b8461;
   margin-bottom: 1vw;
}
#newsandevent h2{
   font-weight: 500;
   font-size:5.314vw;
   letter-spacing: 0.05em;
   text-align: center;
   margin-bottom: 7vw;
}
#newsandevent .system-list {
   margin-bottom: 5vw;
   grid-template-columns: repeat(1, minmax(0, 1fr));
   margin-bottom: 9.66vw;
}
#newsandevent .system-list li {
   position: relative;
   width: 77.29vw;
   margin: 0 2.42vw;
}
#newsandevent .system-list li::after {
   position: absolute;
   content: "";
   background: url(../images/common/util-btn-arrow02.svg)no-repeat;
   background-size: contain;
   width: 5.80vw;
   height: 5.80vw;
   bottom: 2.42vw;
   right: 2.42vw;
}
#newsandevent .system-list li .system-pic{
   width: 100%;
   height: 57.97vw;
   text-align: center;
   margin-bottom: 0;
}
#newsandevent .system-list li .system-pic img{
   width: auto;
   height: 100%;
   max-width: 100%;
   margin-inline: auto;
}
#newsandevent .system-list li .text-box{
   background: #fff;
   box-shadow: 0px 10px 20px rgba(62, 62, 62, 0.1);
   padding: 4.5vw 6vw;
   height: 63.77vw;
}
#newsandevent .system-list li .system-category{
   font-size:2.898vw;
   letter-spacing: 0.05em;
   line-height: 1;
   text-align: center;
   padding: 2.06vw 3.38vw;
   color: #fff;
   border-radius: 0.48vw;
   background: #b89d80;
   display: inline-block;
   margin-bottom: 3vw;
}
#newsandevent .system-list li .system-ttl{
   font-weight: 500;
   font-size:3.865vw;
   letter-spacing: 0.05em;
   line-height: 1.75;
   display: -webkit-box;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
   -webkit-line-clamp: 2;
   margin-bottom: 3.5vw;
}
#newsandevent .system-list li .date-flex {
   display: flex;
   align-items: flex-end;
   gap: 1.48vw;
   margin-bottom: 1.5vw;
}
#newsandevent .system-list li .event-date .year {
   font-weight: bold;
   font-size:2.898vw;
   letter-spacing: 0.05em;
   line-height: 2;
   color: #3b8461;
}
#newsandevent .system-list li .event-date .day {
   font-weight: bold;
   font-size:5.797vw;
   letter-spacing: 0.05em;
   line-height: 1;
   color: #3b8461;
}
#newsandevent .system-list li .event-date .dash {
   font-weight: 500;
   font-size:2.898vw;
   letter-spacing: 0.05em;
   line-height: 2.3333;
   color: #3b8461;
}
#newsandevent .system-list li .event-date .week {
   font-weight: 500;
   font-size:2.898vw;
   letter-spacing: 0.05em;
   color: #3b8461;
   position: relative;
   left: 1vw;
}
#newsandevent .system-list li .event-date .time,
#newsandevent .system-list li .event-date .place {
   font-weight: 500;
   font-size:2.898vw;
   letter-spacing: 0.05em;
   line-height: 2;
   color: #a4a4a4;
}
#newsandevent .slick-list {
   overflow: visible!important;
}
#newsandevent .util-btn {
   margin-inline: auto;
}


}