/******************** 202405→ ********************/
/* grid content */
.gridcontent{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 32px;
  max-width: 1240px;
  margin: 0px auto;
  padding-left: 16px;
  padding-right: 16px;
}
.gridsample{
  color: #FFF;
  text-align: center;
}
  .grid-layout01{
      grid-column: 1 / -1;
    }
  .grid-layout02{
      grid-column: 2 / 12;
    }
  .grid-layout03{
    grid-column: 3 / 11;
  }
  .grid-layout04-1{
    grid-column: 1 / 7;
  }
  .grid-layout04-2{
    grid-column: 7 / -1;
  }
  .grid-layout05-1{
    grid-column: 2 / 7;
  }
  .grid-layout05-2{
    grid-column: 7 / 12;
  }
  .grid-layout06-1{
    grid-column: 1 / 5;
  }
  .grid-layout06-2{
    grid-column: 5 / 9;
  }
  .grid-layout06-3{
    grid-column: 9 / -1;
  }
  .grid-layout07-1{
    grid-column: 1 / 4;
  }
  .grid-layout07-2{
    grid-column: 4 / 7;
  }
  .grid-layout07-3{
    grid-column: 7 / 10;
  }
  .grid-layout07-4{
    grid-column: 10 / -1;
  }
@media screen and (max-width:980px){
  .gridcontent {
    max-width: 88%;
    padding-left: 0px;
    padding-right: 0px;
  }
}
@media screen and (max-width:780px){
  .gridcontent {   
    grid-template-columns: repeat(8, 1fr);
    max-width: 88%;
    padding-left: 0px;
    padding-right: 0px;
  }
  .grid-layout02{
      grid-column: 1 / -1;
    }
  .grid-layout03{
    grid-column: 2 / 8;
  }
  .grid-layout04-1{
    grid-column: 1 / 5;
  }
  .grid-layout04-2{
    grid-column: 5 / -1;
  }
  .grid-layout05-1{
    grid-column: 1 / 5;
  }
  .grid-layout05-2{
    grid-column: 5 / -1;
  }
  .grid-layout06-1{
    grid-column: 1 / 5;
  }
  .grid-layout06-2{
    grid-column: 5 / -1;
  }
  .grid-layout06-3{
    grid-column: 3 / 7;
  }
  .grid-layout07-1{
    grid-column: 1 / 5;
  }
  .grid-layout07-2{
    grid-column: 5 / -1;
  }
  .grid-layout07-3{
    grid-column: 1 / 5;
  }
  .grid-layout07-4{
    grid-column: 5 / -1;
  }
}
@media screen and (max-width:680px) {
  .grid-layout03{
    grid-column: 1 / -1;
  }
  .grid-layout05-1{
    grid-column: 1/-1;
  }
  .grid-layout05-2{
    grid-column: 1/-1;
  }
}

/* grid content end */
img {
  width: 100%;
}
.aboutbm{
  margin-top: 64px;
}
  .aboutbm .item-img{
    grid-column: span 6;
  }
  .aboutbm .item-text{
    grid-column: span 6;
  }
  .aboutbm .item-text h2{
    font-size: 4.2rem;
    margin-bottom: 16px;
  }
  .aboutbm .item-text p{
    margin-bottom: 16px;
  }
.marker-y {
  background: linear-gradient(transparent 75%, #F6D019 75%);
  }
  .btn a {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
  }
    .btn.btn-standard a{
      width: 88%;
      height: 90px;
      margin: 8px auto;
      border-radius: 49px;
      background-color: #ccc;
      font-size: 2.6rem;
      font-weight: 700;
      color: #FFF;
    }
      .btn.btn-standard a span{
        font-size: 3.2rem;
        margin-right: 0.8rem;
      }
      .btn.btn-documentrequest a{
        background: linear-gradient(to bottom, #49B69D, #35AE92);
        border: 2px solid #E8F7FA;
        -webkit-filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
        -moz-filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
        -ms-filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
        filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.2));
        box-sizing: border-box;
      }

    
      @media screen and (max-width:1100px) {
        .aboutbm .item-text h2{
          font-size: 3.8rem;
          }
          .btn.btn-standard a{
            height: 84px;
            font-size: 2.2rem;
            width: 100%;
          }
        }
      @media screen and (max-width:980px) {
          .btn.btn-standard a{
            height: 72px;
            font-size: 1.8rem;
            width: 100%;
          }
        }
      @media screen and (max-width:780px) {
        .home-catchcopy h1{
          font-size:1.6rem;
        }
        .aboutbm{
          margin-top: 64px;
        }
        .aboutbm .item-img{
          grid-column: span 12;
        }
        .aboutbm .item-text{
          grid-column: span 12;
        }
          .aboutbm .item-text h2{
            font-size: 2.8rem;
            }
            .btn.btn-standard a{
              height: 64px;
              font-size: 1.8rem;
              width: 100%;
            }
            .btn.btn-standard a span{
              font-size: 2.4rem;
              margin-right: 0.4rem;
            }
      }
	@media screen and (min-width:769px) {
		.hidden-pc {
			display:none!important;
		}
	}
	@media screen and (max-width:768px) {
		.hidden-sp {
			display:none!important;
		}
	}
  /* interview slider */
  .swiper {
    display: flex;
  }
  .swiper-button-next{
    right: 20px!important;
  }
  .swiper-button-prev{
    left: 20px!important;
  }
  .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after,.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after{
    color: #c3c3c3;
  }
.swiper-pagination-bullet-active{
  background-color: #5186EC;
}
@media screen and (max-width:768px){
  .swiper{
    width: 92%;
    box-sizing: border-box;
    padding-left: 2%!important;
    padding-right: 2%!important;
  }
}

/******** functtion *******/
/* func mainvisual */
.func-mainvisual{
  max-width: 1240px;
  width: 88%;
  padding-top: 120px;
  padding-left: 16px;
  padding-right: 16px;
  margin: 0px auto;
}
  .func-mainvisual-wapper{
    background-repeat: no-repeat;
    background-position: left top 120px;
    background-size: 72%;
  }
    .function.webreserve .func-mainvisual-wapper{
      background-image: url(/lib/images/func/bmline-func01.png);
    }
    .func-mainvisual-inner {
      align-items: center;
    }
    .func-mainvisual .imgcontent{
      max-width: 604px;
      width: 50%;
      height: auto;
      box-sizing: border-box;
    }
    .func-mainvisual .textcontent{
      max-width: 604px;
      width: 50%;
      padding-left: 74px;
      height: auto;
      box-sizing: border-box;
    }
      .func-mainvisual .textcontent .tag {
        border:2px solid #ccc;
        color: #ccc;
        height: 32px;
        border-radius: 16px;
        display: inline-block;
        display: flexbox;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        padding-top: 6px;
        padding-left: 14px;
        padding-right: 14px;
        line-height: 1.0;
        font-size: 1.8rem;
        font-weight: bold;
      }
      .func-mainvisual .textcontent h2{
        font-size: 4.2rem;
        line-height: 1.4;
      }
      .reserve .func-mainvisual .textcontent .tag {
        border:2px solid #5186ec;
        color: #5186ec;
      }
      .kanri .func-mainvisual .textcontent .tag {
        border:2px solid #ff4b36;
        color: #ff4b36;
      }

/* func-content */
.func-content {
  margin-top: 32px;
}
  .func-content h3{
    font-size: 2.4rem;
  }
  .func-content .lead {
    grid-column: 1/-1;
    text-align: center;
  }
  .func-content .box img{
    margin-bottom: 16px;
  }
  .func-content .text p{
    text-align: center;
    line-height: 1.6;
  }


  .func-content .head-sub {
    color: #5186ec;
    border-bottom: 2px solid #5186ec;
    text-align: center;
    margin-top: 32px;
  }
    .func-content .head-sub h3{
      font-size: 2.8rem;
      text-align: center;
    }
  .func-content .head-sub2{
    border:4px solid #e7e7e7;
    font-size: 2.4rem;
    line-height: 1.0;
    padding-top: 12px;
    padding-bottom: 12px;
    font-weight: bold;
    text-align: center;
    width: 100%;
    margin-top: 16px;
  }
  .func-content .head-sub2.sns{
    margin-top: 64px;
  }








  
  .func-content .howto-content{
    align-items: center;
  }
    .func-content .howto-content .one {
      max-width: 460px;
      width: 46%;
    }
    .func-content .howto-content .one .text {
      text-align: center;
    }
    .func-content .howto-content .one .text .tag{
          border:2px solid #e7e7e7;
          background-color: #e7e7e7;
          height: 32px;
          border-radius: 16px;
          display: inline-flex;
          align-items: center;
          justify-content: center;
          box-sizing: border-box;
          padding-top: 4px;
          padding-left: 14px;
          padding-right: 14px;
          line-height: 1.0;
          font-size: 1.8rem;
          font-weight: bold;
    }
      .func-content .howto-content .one .text .tag.blue{
          border:2px solid #5186ec;
          background-color: #5186ec;
          color: #FFF;
      }
      .func-content .howto-content .one .text p{
        margin-top: 8px;
      }
      @media screen and (max-width:1100px) {
          .func-mainvisual .textcontent h2{
            font-size: 3.8rem;
          }
          .func-mainvisual .textcontent{
            padding-left: 0px;
          }
        }
      @media screen and (max-width:980px) {
        .func-mainvisual{
          width: 88%;
          padding-top: 120px;
          padding-left:0px;
          padding-right: 0px;
        }
          .func-mainvisual .textcontent h2{
            font-size: 3.4rem;
          }
        }
      @media screen and (max-width:768px) {
          .func-mainvisual{
              width: 100%;
            }
        .func-mainvisual-inner{
          display: block;
        }
        .func-mainvisual .textcontent{
          width: 100%;
          text-align: center;
          margin-bottom: 1.4rem;
        }
          .func-mainvisual .textcontent h2{
            font-size: 3.6rem;
          }
          .func-mainvisual .imgcontent{
            width: 88%;
            margin: 0px auto;
          }
          .func-mainvisual-wapper{
            background-position: center top 120px;
            background-size: 110%;
          }
       }
    @media screen and (max-width:980px) {
      .func-content h3{
        font-size: 2.0rem;
      }
    }
    @media screen and (max-width:768px) {
      .func-content h3{
        font-size: 2.0rem;
        text-align: left;
      }
        .howto-content{
          display: block;
        }
        .func-content .howto h3{
          font-size: 2.4rem;
        }
        .func-content .howto-title{
          font-size: 2.0rem;
        }
        .howto-content.sns{
          display: flex;
          align-items: center;
        }
        .func-content .howto-content .one {
          max-width: 88%;
          width: 88%;
          margin: 0px auto;
        }
        .func-content .howto-content .arrow{
          transform: rotate(90deg);
          margin: 0px auto;
          margin-top: 32px;
          margin-bottom: 32px;
          width: 12%;
        }
          .func-content .howto-content .one .text .tag{
            font-size: 1.6rem;
          }
          .func-content .howto-content .one .text p{
            font-size: 1.6rem;
            line-height: 1.4;
          }
    }
    .webreserve .func-content .howto-content .arrow {
      max-width: 76px;
      width: 8%; 
    }
    .webreserve .func-content .howto-content.sns {
      justify-content: center;
      align-items: start;
    }
    .webreserve .func-content .howto-content.sns .one {
      max-width: 220px;
      width: 24%;
      padding-left: 16px;
      padding-right: 16px;
    }
    .webreserve .func-content .howto-content.sns .arrow {
      max-width: 76px;
      width: 8%; 
      padding-top: 220px;
    }
      .webreserve .func-content .howto-content.sns .staff{
        background-color: #f6f6f6;
        max-width: 366px;
        width: 44%;
        text-align: center;
        box-sizing: border-box;
        border-radius: 12px;
        margin-left: -48px;
        z-index: -1;
        margin-top: 16px;
        padding: 32px;
        padding-left: 32px;
        display: flex;
        flex-wrap: nowrap;
        flex-direction: column;
        gap: 12px;
      }
      .webreserve .func-content .howto-content.sns .staff img{
        width: 80%;
        margin: 12px auto;
      }
      .webreserve .func-content .howto-content.sns .staff h4{
        line-height: 1.0;
      }
      .webreserve .func-content .howto-content.sns .staff p{
        line-height: 1.4;
      }
      @media screen and (max-width:1100px) {
          .webreserve .func-content .howto-content.sns .staff{
              max-width: 88%;
              width: 60%;
              margin-left: 0px;
              margin-top:16px;
            }
          }
      @media screen and (max-width:980px) {
        .webreserve .func-content .howto-content.sns .one {
          max-width: 32%;
          width: 30%;
          padding-left: 2%;
          padding-right: 2%;
        }
        .webreserve .func-content .howto-content.sns .arrow {
          max-width: 76px;
          width: 8%; 
          padding-top: 220px;
        }
      }
      @media screen and (max-width:768px) {
        .webreserve .func-content .howto-content.sns .one {
          max-width: 36%;
          width: 36%;
          padding-left:0%;
          padding-right: 0%;
        }
        .webreserve .func-content .howto-content.sns .arrow{
          transform: inherit;
          width:8%;
          padding-top: 120px;
        }
          .webreserve .func-content .howto-content.sns .staff{
            max-width: 88%;
            width: 88%;
            margin-left: 0px;
            margin-top:16px;
          }
      }

/* cta parts */
.cta-content {
  max-width: 1024px;
  width: 88%;
  padding-left: 16px;
  padding-right: 16px;
  margin: 64px auto 32px;
}
  .cta-content  h3 {
    border-bottom: 2px solid #ff4b36;
    color: #ff4b36;
    text-align: center;
    font-size: 2.8rem;
  }
  .cta-content-box{
    width: 100%;
    height: auto;
    border-radius: 14px;
    min-height: 366px;
    box-sizing: border-box;
    margin-top: 32px;
  }

  .cta-content-box.formerit-content{
    min-height: auto;
  }
  .cta-content-box-inner{
    margin: 0px auto;
    box-sizing: border-box;
    border-radius: 12px;
    min-height: 338px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content:space-around;
  }
    .cta-content-box.formerit-content .cta-content-box-inner{
    }
    .cta-content-box-inner::before,
    .cta-content-box-inner::after {
        content: "";
        position: absolute;
        background-repeat: no-repeat;
        background-size: contain;
    }
    .cta-content-box-inner::before {
        background-image: url(/lib/images/cta/ctabg-lt.svg);
        top: 0;
        left: 0;
        width: 340px;
        height: 340px;
        position: absolute;
    }
    .cta-content-box-inner::after {
        background-image: url(/lib/images/cta/ctabg-rb.svg);
        bottom: 0;
        right: 0;
        width: 100px;
        height: 124px;
        position: absolute;
    }
    .cta-content-box .maincontent{
      position: relative;
      z-index: 1;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding-left: 32px;
      padding-right: 32px;
    }
   
    .cta-content .maincontent .image{
      max-width: 450px;
      margin-right: 16px;
      width: 48%;
    }
    .cta-content .maincontent .text{
      max-width: 450px;
      width: 48%;
      margin-left: 16px;
      text-align: center;
    }
        .cta-content-box.formerit-content .maincontent .text{
          margin-left: 0px;;
          max-width: 100%;
          margin-inline: auto;
        }
      .cta-content .maincontent .text p.catch-sub{
        font-size: 1.8rem;
        font-weight: bold;
        margin-bottom: 12px;
        line-height: 1.0rem;
      }
        .cta-content .maincontent .text p.catch-main{
          font-size: 3.2rem;
          color: #5186ec;
          font-weight: bold;
          margin-bottom: 12px;
          line-height: 1.4;
        }
        .cta-content .maincontent .text .lead{
          line-height: 1.4;
        }
          .cta-content-box.formerit-content .maincontent .text .lead{
            font-weight: bold;
            font-size: 2.4rem;
            color: #29486D;
          }
          .cta-content .maincontent .text .btn.btn-standard a {
            width: 100%;
            height: 84px;
            margin: 0 auto 8px;
            border-radius: 42px;
            font-size: 2.4rem;
          }
          .cta-content-box .form-attention{
            width: 90%;
            margin: 0px auto;
          }
          @media screen and (max-width:1024px) {
            .cta-content .maincontent .text p.catch-main{
              font-size: 2.8rem;
            }
          }
          @media screen and (max-width:768px) {
            .cta-content{
              max-width: 88%;
            }
            .cta-content-box-inner{
              display: block;
              padding-top: 32px;
              padding-bottom: 32px;
            }
              .cta-content-box .maincontent{
                display: block;
                }
                .cta-content-box-inner{
                  width: 100%;
                }
                .cta-content .maincontent .image{
                    max-width: 90%;
                    width: 90%;
                    margin: 0px auto 32px;
                  }
                  .cta-content .maincontent .text{
                    max-width: 90%;
                    width: 90%;
                    margin: 0px auto;
                  }
                    .cta-content .maincontent .text p.catch-main{
                      font-size: 3.2rem;
                    }
                    .cta-content-box-inner::before {
                        width: 160px;
                        height: 160px;
                    }
                    .cta-content-box-inner::after {
                        width: 100px;
                        height: 124px;
                    }
                }
                @media screen and (max-width:680px) {
                  .cta-content  h3 {
                    font-size: 2.4rem;
                  }
                  .cta-content-box-inner{
                    padding-top: 16px;
                    padding-bottom: 16px;
                  }
                  .cta-content-box .maincontent{
                    padding-left: 12px;
                    padding-right: 12px;
                  }
                .cta-content .maincontent .image{
                    max-width: 100%;
                    width: 100%;
                    margin: 0px auto;
                  }
                  .cta-content .maincontent .text{
                    max-width: 100%;
                    width: 100%;
                    margin: 0px auto;
                  }
                  .cta-content .maincontent .text p.catch-main{
                    font-size: 2.8rem;
                  }
                    .cta-content .maincontent .text .btn.btn-standard a {
                      height: 78px;
                      border-radius: 39px;
                      font-size: 2.4rem;
                    }
                    .cta-content .maincontent .text .btn.btn-standard a span{
                      font-size: 2.8rem;
                    }
                }
  /* magazine 内CTA */
  .magazine-middle-cta{
    width: 480px;
    margin-bottom: 32px;
  }
  .magazine-middle-cta a img{
    filter: drop-shadow(1px 3px 5px rgba(0, 0, 0, 0.3));
    width: 100%;
  }
  .magazine-middle-cta a:hover img{
    filter: none;
  }
  @media screen and (max-width:780px){
    .magazine-middle-cta{
      width: 88%;
      margin-left: auto;
      margin-right: auto;
    }
  }