@charset "UTF-8";
/* ============================================================
 plan 
=============================================================== */
.plan__topic{
       margin-top: 40px;
}

.topic__txt {
       color: #1F1F1F;
       font-size: 1.6rem;
       letter-spacing: 0.1em;
       text-align: center;
       margin-top: 31px;
}

.topic__txt span {
       font-size: 1.7rem;
}

.topic__txtBox {
       text-align: center;
}

.topic__txt2 {
       display: inline-block;
       font-size: 1.6rem;
       margin: 11px auto 0;
       letter-spacing: 0.1em;
       border-top:1px solid #C19A5B;
       border-bottom:1px solid #C19A5B;
       padding: 2px 25px;
}

.topic__txt2 span {
       font-size: 1.7rem;
}

/* ---------plan set-------------------- */
.planSet__img {
       width: 75%;
       margin: 21px auto;
}

.planSet__content {
       background: #FBF9F5;
       padding: 35px var(--contentpadding);
       margin-top: 20px;
}

.planSet__name {
       color: var(--primary-black, #1F1F1F);
       font-size: 1.6rem;
       font-weight: 500;
       line-height: 1.7; 
       letter-spacing: 0.08em;
       display: flex;
       align-items: center;
       justify-content: space-between;
       padding-bottom: 2px;
}

.planSet__name--span1 {
       font-size: 1.8rem;
       font-weight: 500;
       line-height: 1.7;
       letter-spacing: 0.1em;
       text-align: end;
}

.planSet__name--span2 {
       font-size: 1.2rem;
       font-weight: 500;
       line-height: 1.7;
       letter-spacing: 0.1em;
}

.planSet__title {
       border-bottom: 1.5px solid var(--primary-brown);
}


.planSet__p {
       font-size: 1.3rem;
       font-weight: 350;
       letter-spacing: 0.05px;
       text-align: end;
       margin-top: 4px;
}

.planSet__list {
       margin-top: 30px;
}

.planSet__item {
       font-size: 1.6rem;
       line-height: 1; 
       letter-spacing: 0.05em;
       margin-top: 20px;
       display: flex;
       flex-wrap: wrap;
       align-items: flex-start;
}

.planSet__item span {
       font-size: 1.4rem;
       font-weight: 350;
       line-height: 1.7; 
       letter-spacing: 0.05em;
}

.planSet__item:first-of-type span {
       display: block;
       margin-top: 5px;
       position: relative;
       text-indent: 4em;
}

.planSet__item:first-of-type span::before {
       content: '';
       display: inline-block;
       background-image: url(../img/plan_beforeLine.svg);
       background-repeat: no-repeat;
       background-position: center;
       background-size: contain;
       width: 25px;
       height: 10px;
       margin-right: 4px;
}

.planSet__item:last-of-type span {
      margin-left: 7px;
      position: relative;
      display: inline-block;
       padding-left: 30px;
       position: relative;
       flex: 1;
       top: -1px;
}

.planSet__item:last-of-type span::before {
       content: '';
       display: inline-block;
       background-image: url(../img/plan_beforeLine.svg);
       background-repeat: no-repeat;
       background-position: center;
       background-size: contain;
       width: 25px;
       height: 10px;
       margin-right: 4px;
       position: absolute;
       left: 0;
       top: 0.4em;
}

.planSet__txt {
       font-size: 1.4rem;
       line-height: 1.7;
       letter-spacing: 0.05em;
       margin-top: 40px;
       text-align: center;
}

/* ---------plan その他-------------------- */
.planContent {
       padding: 90px var(--contentpadding) 100px;
}

.planContent__list {
       position: relative;
}

.planContent__list::after {
       display: block;
       content: '';
       position: absolute;
       background-image: url(../img/check_txt.svg);
       background-position: left center;
       background-repeat: no-repeat;
       background-size: contain;
       width: 74px;
       height: 50px;
       top: -13%;
       left: 0;
       transform-origin: left;
       animation: yurayuraPlan 2s linear infinite;
}

@keyframes yurayuraPlan {
       0% , 100%{
           transform: rotate(6deg);
       }
       50%{
           transform: rotate(-6deg);
       }
     }

.planContent__item {
       display: flex;
       justify-content: flex-start;
       align-items: flex-start;
}

.planContent__item p {
       margin-left: 10px;
}

.planContent__spImg {
       max-width:none ;
       width: 35px;
       height: 35px;
}


.planContent__pcImg {
       display: none;
}

.planContent__item {
       font-size: 1.4rem;
       font-weight: 350;
       line-height: 1.8;
       letter-spacing: 0.05em;
       margin-top: 30px;
}

.planContent__item span {
       font-size: 1.2rem;
       font-weight: 300;
       line-height: 1.7; 
       letter-spacing: 0.05em;
       display: block;
}

.planContent__item:last-of-type span {
       font-size: 1.4rem;
       font-weight: 350;
       line-height: 1.8;
       letter-spacing: 0.05em;
}

/* plan_pc表示 */
@media screen and (min-width:609px) {
       .planSet__item:first-of-type span {
              margin-top: 0;
              text-indent: 0;
       }
}
@media screen and (min-width:769px) {
       .plan__topic{
              margin-top: 40px;
       }
       
       .topic__txt {
              font-size: 2rem;
              text-align: center;
              letter-spacing: 0.2em;
       }

       .topic__txt span {
              font-size: 2.1rem;
       }
       

       .topic__txt2 {
              font-size: 1.8rem;
              letter-spacing: 0.2em;
              padding: 8px 41px;
              margin-top: 15px;
       }

       .topic__txt2 span {
              font-size: 1.9rem;
       }
       
       /* ---------pc_plan その他-------------------- */
        .planContent {
              padding: 0px 0px 0px 37px;
              max-width: 902px;
              margin: 125px auto 0;
       }

       .planContent__pcImg {
              width: 49px;
              height: 49px;
       }

       .planContent__list::after {
              width: 122px;
              height: 59px;
              top: -20%;
              transform: translateX(-5%);
       }

       .planContent__item {
              align-items: center;
       }

       .planContent__item p {
              margin-left: 15px;
       }
       
       .planContent__spImg {
              max-width:none ;
       }
       
       .planContent__pcImg {
              display: block;
       }

       .planContent__spImg {
              display: none;
       }
       
       .planContent__item {
              font-size: 1.5rem;
              line-height: 1.9; 
              margin-top: 48px;
       }


       .planContent__item:last-of-type span {
              font-size: 1.5rem;
              line-height: 1.9;
              display: inline;
       }

       .planSet__item:first-of-type span {
              margin-top: 0;
       }
       
       .planSet__item:last-of-type span {
              top: 0;
       }

}/* 769pxpc 表示 */

       /* plan_pc表示 */
@media screen and (min-width:1153px) {
       /* ---------pc_plan set-------------------- */
       .plan__topic{
              margin-top: 150px;
       }
       
       .planSet__img {
              width: 40%;
              margin:0;
       }

       .planSet__box {
              background-color: rgba(253, 253, 253, 0.70);
              padding: 61px 5.5% 50px;
              max-width: 1200px;
              margin: 61px auto 0;
              display: flex;
              justify-content: space-between;
              align-items: center;
       }

       .planSet__content {
              background:transparent;
              padding: 0;
              margin-top: 0;
       }

       .planSet__title {
              border-bottom: 1.5px solid var(--primary-brown);
       }

       .planSet__name {
              font-size: 1.8rem;
              font-weight: 400;
              line-height: 1.5; 
              text-align: center;
              padding-bottom: 1px;
       }

       .planSet__name--span1 {
              margin-left: 76px;
              font-size: 2.5rem;
              line-height: 1.5;
              letter-spacing: 0.05em;
       }

       .planSet__name--span1::before {
              width: 50px;
              top: 58%;
              left: -68px;
       }
       

       .planSet__name span {
              display: inline;
       }

       .planSet__p {
              margin-top: 6px;
       }

       .planSet__list {
              margin-top: 20px;
       }

       .planSet__item {
              line-height: 1.5; 
              margin-top: 15px;
       }

       .planSet__item:first-of-type span {
              display: inline;
              margin-top: 3px;
              text-indent: 0;
       }
       
       .planSet__item:first-of-type span::before {
              display: inline-block;
              width: 58px;
       }

       .planSet__item:last-of-type span::before {
              left: -1%;
       }

       .planSet__item:last-of-type span {
              margin-left: 6px;
              text-align: end;
              top: 0;
              margin-top: 3px;
        }

        
        .planSet__item:first-of-type span::before,
        .planSet__item:last-of-type span::before {
              background-image: url(../img/pc_planSet_beforeLine2.svg);
               width: 100px;
               height: 10px;
               margin: 0 4px;
               top: 33%;
        }

        .planSet__txt {
              font-size: 1.6rem;
              line-height: 1.9;
              margin-top: 20px;
              text-align: left;
        }

        .planSet__txt span{
              margin-left: 18px;
        }
}/* 1024px pc_表示 */

@media screen and (max-width:367px) {
       .planSet__name {
              display: block;
       }

       .planSet__name--span1 {
              display: block;
       }
}
/* ============================================================
 option
=============================================================== */
.option__box {
       padding: 50px var(--contentpadding);
       background-color:#DCC59E;
}

.option__name {
       color: #FDFDFD;
       font-family: Aboreto;
       font-size: 4rem;
       text-align: center;
}

.option__title {
       font-size: 1.6rem;
       line-height: 1.7;
       letter-spacing: 0.05em;
       text-align: center;
       border-bottom: 1.5px solid #FDFDFD;
       padding-bottom: 2px;
       margin-top: 30px;
}

.option__list {
       margin-top: 52px;
}

.option__item {
       font-size: 1.6rem;
       line-height: 1; 
       letter-spacing: 0.05em;
       margin-top: 40px;
}

.option__itemGroup1 {
       display: flex;
       flex-wrap: wrap;
       justify-content: space-between;
       align-items: center;
}

.option__item--em {
       font-style: normal;
}

.option__item span {
       font-size: 1.5rem;
       font-weight: 400;
       line-height: 1.5; 
       letter-spacing: 0.1em;
       text-align: end;
       margin-top: 5px;
       position: relative;
}

.option__item:nth-of-type(1) span{
       display: block;
}

.option__item:nth-of-type(2) span{
       display: block;
}

.option__item:nth-of-type(3) span{
       display: block;
}

.option__item:nth-of-type(4) span{
      padding-left: 9.9%;
}

.option__item:nth-of-type(5) span{
       padding-left: 3.9%;
 }

.option__item span::before {
       content: '';
       display: inline-block;
       background-image: url(../img/option_bforeLine.svg);
       background-repeat: no-repeat;
       background-position: center;
       background-size: contain;
       width: 63px;
       height: 10px;
       margin-right: 4px;
}

.option__item p {
       font-size: 1.2rem;
       font-weight: 300;
       line-height: 1.7;
       letter-spacing: 0.05em;
       margin-top: 6px;
       padding-left: 1rem;
       width: 100%;
}

.option__imgBox {
       margin-top: 150px;
}

.option__imgBox1 {
       width: 80%;
       position: relative;
       left: 0;
}

.option__imgBox1::after {
       position: absolute;
       content: '';
       display: block;
       background-image: url(../img/plan_kizuki.svg);
       background-repeat: no-repeat;
       background-size: contain;
       width: 40px;
       height: 50px;
       top: -18%;
       left: 96%;
       transform-origin: left;
       animation: yurayuraOption 2s linear infinite;
}

@keyframes yurayuraOption {
       0% , 100%{
           transform: rotate(7deg);
       }
       50%{
           transform: rotate(-7deg);
       }
}

.option__imgBox2 {
       width: 65%;
       padding-right: var(--contentpadding);
       position: relative;
       right: 0;
       margin-left: 30%;
       margin-top: 74px;
}

.option__planBox {
       margin: 127px 0 26px 0;
}

.option__img {
       width: 100%;
       position: relative;
}

.option__img::before {
       position: absolute;
       display: inline-block;
       content: '';
       background-image: url(../img/plan_rent_txt.svg);
       background-repeat: no-repeat;
       background-size: contain;
       width: 234px;
       height: 67px;
       bottom: 99%;
       left: 4%;
}

.option__txt__box {
       padding: 0 10px;
}

.option__txt {
       background-color: rgba(247, 239, 226, 0.70);
       padding: 20px 19px 15px 18px;
       margin-top: -22px;
       z-index: 100;
       position: relative;
}

.option__txt1 {
       width: fit-content;
       position: relative;
}

.option__txt1::after {
       position: absolute;
       display: inline-block;
       content: '';
       background-image: url(../img/rent_kizuki.svg);
       background-repeat: no-repeat;
       background-position: center;
       background-size: contain;
       width: 32px;
       height: 50px;
       left: 94%;
       top: -98%;
}

.option__planBox p{
       font-size: 1.4rem;
       line-height: 1.9;
       letter-spacing: 0.07em;
}

.option__txt2 {
       margin-top: 8px;
}

/* その場でアニメーション */
.fadeInTrigger{
       opacity: 0;
       }

       .fadeIn{
       animation-name:fadeInAnime;
       animation-duration:3s;
       animation-fill-mode:forwards;
       opacity:0;
       }
       
       @keyframes fadeInAnime{
         from {
           opacity: 0;
         }
       
         to {
           opacity: 1;
         }
       }

     /* loopArea */
.loop_wrap {
       width: 100vw;
       height: 300px;
       overflow: hidden;
     }

.loop__list {
       display: flex;
       align-items: center;
       width: 2000px;
}

.loop__item {
       margin-left: 6%;
}
     
.loop_wrap img {
       width: auto;
       height: 310px;
       object-fit: contain;
}

     @keyframes loop {
       0% {
         transform: translateX(100%);
       }
       to {
         transform: translateX(-100%);
       }
     }
     
     @keyframes loop2 {
       0% {
         transform: translateX(0);
       }
       to {
         transform: translateX(-200%);
       }
     }

     .loop_wrap img:first-child {
       animation: loop 70s -25s linear infinite;
     }
     
     .loop_wrap img:last-child {
       animation: loop2 70s linear infinite;
     }

     /* option_pc表示 */
@media screen and (min-width:500px) {
       .option__imgBox1::after{
              width: 49px;
              height: 50px;
              top: -13%;
              left: 98%;
       }
}
@media screen and (min-width:769px) {
       .option {
              margin-top: 161px;
       }
       .option__box {
              padding: 58px 114px 54px;
              width: 721px;
       }
       
       .option__main {
              display: flex;
              justify-content: space-between;
              max-width: 1122px;
              margin: 0 auto;
       }

       .option__name {
              font-size: 4.8rem;
       }

       .option__title {
              font-size: 1.8rem;
              line-height: 1.5;
              text-align: left;
              border-bottom: 1.5px solid #FDFDFD;
              padding-bottom: 14px;
              margin-top: 35px;
       }

       .option__list {
              margin-top: 32px;
       }
       
       .option__item {
              font-size: 1.6rem;
              line-height: 1.5; 
              margin-top: 32px;
              display: flex;
              justify-content: space-between;
              flex-wrap: wrap;
              position: relative;
              z-index: 1;
       }
       
       .option__item::before {
              position: absolute;
              content: '';
              background-image: url(../img/option_beforeLine.svg);
              background-repeat: no-repeat;
              background-position: center;
              background-size: contain;
              width: 100%;
              height: 1px;
              top: 0.85em;
              left: 0;
              z-index: -1;
       }
       
       .option__item span::before  {
              display: none;
       }

       .option__item--em {
              background-color:#DCC59E;
       }
       
       .option__item span {
              line-height: 1.9; 
              text-align: end;
              margin-top: 0;
              background-color:#DCC59E;
              font-size: 1.5rem;
       }

       .option__item:nth-of-type(1) span{
              display: inline;
              padding-left: 3px;
       }
       
       .option__item:nth-of-type(2) span{
              display: inline;
              padding-left: 3px;
       }
       
       .option__item:nth-of-type(3) span{
              display: inline;
              padding-left: 3px;
       }

       .option__item:nth-of-type(4) span {
              padding-left: 3px;
       }

       .option__item:nth-of-type(5) span {
              padding-left: 3px;
          }
       
       .option__imgBox {
              margin-top: -61px;
       }
       
       .option__imgBox1 {
              width: 100%;
              max-width: 385px;
              position: relative;
              left: -50px;
       }

       .option__imgBox1::after {
              width: 40px;
              height: 5vw;
              top: -14%;
              left: 97%;
              transform-origin: left;
              animation: yurayuraOption 2s linear infinite;
}

@keyframes yurayuraOption {
       0% , 100%{
           transform: rotate(5deg);
       }
       50%{
           transform: rotate(-5deg);
       }
}

       .option__imgBox2 {
              width: 100%;
              max-width: 335px;
              margin-left: -6%;
              right: 21px;
              margin-top: 134px;
       }

       .option__txt {
              background-color: rgba(247, 239, 226, 0.9);
              padding: 20px 19px 15px 18px;
              margin-top: -142px;
              z-index: 100;
              position: relative;
       }
}

@media screen and (min-width:980px) {
       .option__planBox {
              margin: 163px auto 0;
              max-width: 1160px;
              display: flex;
              align-items: flex-end;
       }

       .option__img {
              max-width: 693px;
              width: 100%;
              padding-left: 20px;
              max-width: 693px;
       }

       .option__txt__box {
              margin-bottom: 27px;
              padding: 0;

       }

       .option__txt {
              padding: 41px 31px 31px;
              margin-top: 0;
              position: relative;
              left: -82px;
              background-color: rgba(247, 239, 226, 0.8);
       }

       .option__planBox p{
              font-size: 1.5rem;
              line-height: 2;
              letter-spacing: 0.05em;
       }

       .option__txt2 {
              margin-top: 20px;
       }

       .option__img::before {
              top: -37%;
              height: 109px;
              width: 386px;
       }

       .option__txt1::after {
              height: 50px;
              left: 93%;
              top: -96%;
              width: 50px;
       }

       .option__txtImg {
              margin-top: 85px;
       }
}

@media screen and (min-width:1060px) {
       .option__imgBox2  {
              margin-left: 17%;
       }
}/* pc表示 */

/* ============================================================
 case
=============================================================== */
.case {
       padding: 0;
}

.case h3 {
       color: var(--primary-brown);
       font-family: Aboreto;
       font-size: 4rem;
       text-align: center;
}

.case p {
       font-size: 1.6rem;
       font-weight: 350;
       line-height: 1; 
       letter-spacing: 0.05em;
       width: var(--contentWidth);
       text-align: center;
       padding-bottom: 9px;
       border-bottom:1.5px solid var(--primary-brown);
       margin:14px auto;
}

/* 下から */
.fadeUpTrigger{
       opacity: 0;
       }

.fadeUp{
       animation-name:fadeUpAnime;
       animation-duration:1.3s;
       animation-fill-mode:forwards;
       opacity:0;
       perspective: 1000; 
       }
       
       @keyframes fadeUpAnime{
         from {
           opacity: 0;
              transform: translateY(100px);
         }
       
         to {
           opacity: 1;
              transform: translateY(0);
         }
       }

.case__img--1 {
       width: 80%;
       margin: 26px auto 0;
}

.case__box {
       padding: 0 var(--contentpadding);
}

.case__name img {
       margin-top: 40px;
}

.case__h4 {
       font-size: 1.6rem;
       line-height: 1.7; 
       letter-spacing: 0.05em;
       text-align: center;
       position: relative;
       margin-top: 5px;
}

.case__h4::after {
       position: absolute;
       display: inline-block;
       content: '';
       background-image: url(../img/case_line.svg);
       background-repeat: no-repeat;
       background-position: center;
       background-size: contain;
       width: 100%;
       top: 94%;
       height: 6vh;
       left: 0;
}

.case__content {
       margin-top: 40px;
}

.case__title {
       font-size: 1.6rem;
       font-weight: 350;
       letter-spacing: 0.05em;
       text-align: center;
       border-bottom: 0.5px solid var(--primary-black);
       padding-bottom: 6px;
}

.case__detail {
       font-size: 1.4rem;
       font-weight: 300;
       line-height: 1.9; 
       letter-spacing: 0.05em;
       margin-top: 5px;
       display: flex;
       justify-content: space-between;
}

.case__detail:first-of-type {
       margin-top: 10px;
}

.case__detail span {
       text-align: end;
}

.case__group:nth-of-type(2),
.case__group:last-of-type {
       margin-top: 60px;
}

.case__img--2 {
       width: 78.7%;
       position: relative;
       right: 0;
       margin-left: auto;
       margin-top: 80px;
}

.case__img--3 {
       width: 80%;
       position: relative;
       left: 0;
       margin-top: 80px;
       margin-bottom: 60px;
}

.case__img--4 {
       width: 80%;
       margin: 80px auto 40px;
}

/* cace_pc表示 */
@media screen and (min-width:769px) {
       .case {
              max-width: 1200px ;
              padding: 0 147px 150px;
              margin: 80px auto 0;
       }

       .case h3 {
              font-size: 4.8rem;
       }

       .case p {
              font-size: 1.8rem;
              font-weight: 400;
              line-height: 1.5; 
              width: 100%;
              padding-bottom: 14px;
              margin:14px auto;
       }
}
@media screen and (min-width:1024px) {
       .case__group {
              display: flex;
              align-items: center;
              gap: 1%;
              justify-content: space-between;
              margin: 80px auto 0;
       }

       .case__img--1 {
              max-width: 385px;
              width: 100%;
              margin: 0;
       }

       .case__box {
              padding: 0 var(--contentpadding);
       }

       .case__box {
              padding: 0 ;
       }

       .case__name img {
              margin-top: 0;
              width: 69px;
       }

       .case__h4 {
              line-height: 1.8; 
              text-align: center;
              margin-top: 10px;
       }


       .case__h4::after {
              top: 82%;
              height: 5vh;
       }

       .case__title {
              padding-bottom: 10px;
              line-height: 1.6;
       }

       .spBr {
              display: none;
       }

       .case__img--2 {
              width: 100%;
              max-width: 365px;
       }

       .case__name2 {
              position: relative;
       }

       h4 .case__name2::after {
              position: absolute;
              display: inline-block;
              content: '';
              background-image: url(../img/pc_case_line.svg);
              background-repeat: no-repeat;
              background-position: center;
              width: 100%;
              top: 94%;
              height: 6vh;
              left: 0;
       }

       .case__img--3 {
              max-width: 415px;
              width: 100%;
              left: 0;
              margin-top: 0;
              margin-bottom: 0;
       }

       .case__img--3::after {
              height: 4vw;
              top: -18%;
       }

       .case__img--4 {
              max-width: 385px;
              width: 100%;
              margin: 0;
       }
}/* pc表示 */