/*- - - - - - - - - - - - - - - */
/*
/* mainvisual
/*
/*- - - - - - - - - - - - - - - */
.mainvisual {
    width: 100vw;
    height: calc(100vh - 120px);
    max-width: 100%;
    background-color:#fff;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    margin-top: 120px;
}
.mainvisual__content{
    max-width: 80%;
    max-height: 80%;
    position: relative;
    min-width: 80%;
    min-height: 85%;
    margin-bottom: 20px;
}
.mainvisual__lead {
    font-size: 3rem; 
    position: absolute;
    right: -1px;
    top: -1px;
    background-color: #fff;
    display: block;
    padding: 30px 50px;
    border-top-right-radius: 30px;
    border-bottom-left-radius: 30px;
    font-family: serif;
    z-index: 1;
}
.mainvisual__lead:before{
    position: absolute;
    top:0;
    left: -50px;
    width: 50px;
    height: 50px;
    content: "";
    background-image: url(../img/top/mv-corner-right.svg);
    background-repeat: no-repeat;
    background-size: contain;
}
.mainvisual__lead:after{
    position: absolute;
    bottom:-50px;
    right: 0;
    width: 50px;
    height: 50px;
    content: "";
    background-image: url(../img/top/mv-corner-right.svg);
    background-repeat: no-repeat;
    background-size: contain;
}

@media (max-width: 768px) {
	.mainvisual {
    height: calc(65vh - 90px);
    margin-top: 90px;
}
.mainvisual__content{
    max-width: 90%;
    max-height: 90%;
    min-width: 90%;
    min-height: 88%;
    border-radius: 30px;
}
.mainvisual__lead {
    font-size: 2.5rem; 
    padding:10px 0 20px 25px;
    width: 60%;
}
.mainvisual__lead:before{
    left: -20px;
    top:0px;
    width: 30px;
    height: 20px;
	background-size:20px;
}
.mainvisual__lead:after{
	background-size:20px;
	right:-30px
}
}
/*************************************************************:*/
.slideshow {
            max-width: 100%;
            width: 100%; 
            height: 100%; 
            min-height: 100%;
            max-height: 100%;
            overflow: hidden;
            position: relative;
            border-radius: 30px;
        }

.slideshow__container {
            position: relative; 
            height: 100%;
        }

 .slideshow__slide {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            opacity: 0;
            transition: opacity 1.5s ease-in-out, transform 2s ease-in-out; 
            pointer-events: none; 

            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            padding: 2rem;
            box-sizing: border-box;
            text-align: center;
            transform: scale(1.115); 
	 background-repeat: no-repeat;
	 background-size: cover;
	 background-position: center;
        }
        .slideshow__slide--active {
            opacity: 1;
            pointer-events: auto; 
            transform: scale(1); 
        }

        .slideshow__slide:nth-child(1) { background-image: url(../img/top/mv1.webp);background-repeat: no-repeat;background-size: cover;background-position: center bottom; }
        .slideshow__slide:nth-child(2) { background-image: url(../img/top/mv2.webp);background-repeat: no-repeat;background-size: cover; }
        .slideshow__slide:nth-child(3) { background-image: url(../img/top/mv3s.webp);background-repeat: no-repeat;background-size: cover; }



        /* -------------------------------------------------- */
        /* BEM: .slideshow__nav-btn (矢印ボタン) */
        /* -------------------------------------------------- */
.mainvisual__page{
    display: flex;
    gap:30px;
    align-items: center;
}
 .slideshow__nav-btn {
            border: none;
            cursor: pointer;
            z-index: 10;
            font-size: 2rem;
            user-select: none;
            z-index: 1;
            background-color: #fff;
}

        /* -------------------------------------------------- */
        /* BEM: .slideshow__counter (番号表示) */
        /* -------------------------------------------------- */

        .slideshow__counter {
            user-select: none;
        }

/*********/


.gallery-pickup{
    background-color: #F8F8F8;
    text-align: center;
}
.gallery-pickup__title {
    background-image: url('../img/top/ttl-pickup.svg'); 
    margin: 0 auto var(--spacing-lg);
    background-position: center;
}
.gallery-pickup__content{
    margin: 0 auto var(--spacing-lg);
}
.about__title {
    background-image: url('../img/top/ttl-about.svg'); 
    margin: 0 0 var(--spacing-lg);
    background-position: left;
}
.news__title {
    background-image: url('../img/top/ttl-news.svg'); 
    margin: 0 auto var(--spacing-lg);
    background-position: center;
}

/*- - - - - - - - - - - - - - - */
/*
/* about
/*
/*- - - - - - - - - - - - - - - */
.about{
    background-color: #F8F8F8;
}
.about__right{
    padding: 0 7% ;
}
.about__content .about__lead{
font-size: 2.7rem;
margin: 0 0 var(--spacing-lg);
font-family: serif;
}

.about__parallax{
      border-top-right-radius: 50px;
      border-bottom-right-radius: 50px;
}

@media ( max-width : 768px ){
.about .l-responsive-split{
flex-direction: column-reverse;
gap:50px
}
.about__content .about__lead{
text-align: center;
}

.about__right{
    padding: 0;
}
.about__parallax{
      min-width: 95vw;
      border-radius: 30px;
      max-height: 200px;
}

}
/***/


/*- - - - - - - - - - - - - - - */
/*
/* flow
/*
/*- - - - - - - - - - - - - - - */
.flow{
    background-color: #F8F8F8;
    text-align: center;
    background-image: url(../img/top/flow-bg.svg);
    background-repeat: no-repeat;
    background-position: left top;
    background-size: 600px;
}
.flow__grid {
  display: grid;
  gap: 10px;
  grid-template-columns: 1fr 3fr 1fr;
}
.flow__grid2 {
  order: 2;
}
.flow__grid2 p:nth-child(1){
    font-size: 2.5rem;
    font-family: serif;
    margin:0 0 var(--spacing-lg);
    line-height: 2;
}
.flow__grid2 p:not(:first-child){
    margin:0 0 var(--spacing-md);
    line-height: 2.6;
}
.flow__grid3 {
  order: 3;
}
.flow__grid1 {
  order: 1;
  position: relative;
  display: flex;
    justify-content: center;
    align-items:flex-start;
}
@media ( max-width : 768px ){

  .flow__grid {
    grid-template-columns: 1fr;
  }
  .flow__grid2 {
    margin: 10% 0 0;
}

.flow__grid2 p:not(:first-child){
    text-align: left;
}
}
/*- - - - - - - - - - - - - - - */
/*
/* client
/*
/*- - - - - - - - - - - - - - - */
.client {
    background-image: url(../img/top/news-frame.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: bottom ;
}

.client__title {
    text-align: center;
    background-image: url('../img/top/ttl-client.svg'); 
    margin: 0 auto var(--spacing-lg);
    background-position: center;
}

.client__list {
    display: grid;
    container-type: inline-size;
    margin-bottom: 100px;
    justify-content: center;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--spacing-lg);
}

.client__img{
    border: solid rgb(27, 27, 27) 1px;
    aspect-ratio: 2 / 1;
    max-height: 200px;
    margin: 0 auto 10px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
}
.__diana{
    background-image: url(../img/top/client-diana.webp);
}
.__soon{
    background-image: url(../img/top/client-comingsoon.webp);
}
.client__item {
    padding: var(--spacing-md);
    text-align: center;
    font-size: 1.4rem;
}
@media (max-width: 768px) {
    .client__list {
    grid-template-columns: 1fr; 
    gap: 0;
    }
        .client__item {
        text-align: left;
    }
    
}
/*- - - - - - - - - - - - - - - */
/*
/* parallax
/*
/*- - - - - - - - - - - - - - - */
.parallax-container {
      position: relative;
      overflow: hidden;
      max-width: 100%;
}
.parallax-container::before {
      content: '';
      position: absolute;
      top: -40%;
      left: 0;
      right: 0;
      bottom: -30%;
      background-size: cover;
      background-position: center center;
      background-repeat: no-repeat;
      z-index: 0;
      transform: translateY(var(--parallax-y, 0));
}

@media (max-width: 768px){
    
.parallax-container::before {
      top: -70%;
      bottom: 0%;
}

}
.about .parallax-container {
      height: 500px;
}
.about .parallax-container::before {
      background-image: url(../img/about.webp);
}
/**/
.flow__grid1 .parallax-container{
    width: 70%;
    min-height: 25vw;
    border-radius: 200px;
    border-bottom-right-radius: 0;
}
/*左*/
.flow__grid1 .parallax-container::before{
      background-image: url(../img/top/img2.webp);
}
.flow__grid3 .parallax-container{
    width: 80%;
    min-height: 25vw;
    border-radius: 200px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    transform: translateY(-200px);
}
/**/
.flow__grid3 .parallax-container::before{
      background-image: url(../img/top/img1.webp);
}
.flow__grid3 .parallax-container{
    width: 80%;
    min-height: 23vw;
    border-radius: 200px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}
.flow__grid3 .parallax-container:nth-child(1){
    transform: translateY(-100px);
}
.flow__grid3{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}
/*右下*/
.flow__grid3 .grid3__img2::before{
      background-image: url(../img/top/img3.webp);
}
.flow__grid3 .grid3__img2{
    min-height: 20vw;
    width: 68%;
    border-radius: 200px;
    transform: translateY(0px) translateX(-90px);
}

@media ( max-width : 768px ){

.flow__grid1 .parallax-container{
    width: 100%;
    min-height: 200px;
    border-radius: 200px;
}

.flow__grid3 .parallax-container{
    width: 100%;
    min-height: 150px;
    transform: translateY(0);
}
/**/
.flow__grid3 .parallax-container{
    width: 100%;
    min-height: 300px;
}
.flow__grid3 .parallax-container:nth-child(1){
    transform: translateY(0);
}
/**/
.flow__grid3{
    display: flex;
    flex-direction: row;
    align-items: center;
    gap:20px;
    margin-bottom: 100px;
}
.flow__grid3 .grid3__img2{
    width: 100%;
    min-height: 300px;
    transform: translateY(100px);
}

}