/*

Theme Name: Lightning Child 

Theme URI:

Template: lightning

Description: lightningの子テーマです。

Author: t-shimizu

*/



/* テーマファイルトップの余白調整 */


body.home{
  border-top: solid #27ba9f 28px;
  border-top: solid #93d1cc 28px;
}


.home .siteContent {

  padding: 0;

}

.top_grid :is(*, div):nth-child(1) {

  order: 1;

}

.top_grid :is(*, div):nth-child(2) {

  order: 2;

}

.top_grid :is(*, div):nth-child(3) {

  order: 3;

}

.top_grid :is(*, div):nth-child(4) {

  order: 4;

}

.top_grid :is(*, div):nth-child(5) {

  order: 5;

}

.top_grid :is(*, div):nth-child(6) {

  order: 6;

}

.top_grid :is(*, div):nth-child(7) {

  order: 7;

}

.top_grid :is(*, div):nth-child(8) {

  order: 8;

}
.site-header {
    box-shadow: none;
}
.pickup_box .card.card-noborder{
  background: #FFF;
}
.pickup_box .card-body{
  padding:1em 1em 2em 1em;
}

.bubble {
  position: absolute;
  border-radius: 50%;
  animation: rise linear infinite;
  filter: blur(3px);
  box-shadow: inset 0 5px 10px rgba(255, 255, 255, 0.4),
              0 3px 10px rgba(0, 0, 0, 0.05);
}

@keyframes rise {
  0% {
    transform: translateY(0) translateX(0);
    opacity: 0;
  }
  10% {
    opacity: var(--bubble-opacity);
  }
  25% {
    transform: translateY(-25vh) translateX(20px);
  }
  50% {
    transform: translateY(-50vh) translateX(-15px);
  }
  75% {
    transform: translateY(-75vh) translateX(25px);
  }
  90% {
    opacity: var(--bubble-opacity);
  }
  100% {
    transform: translateY(-100vh) translateX(0);
    opacity: 0;
  }
}

/* ローディング画面 */
#loading-screen {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #93d1cc 0%, #93d1cc 100%);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    transition: transform 0.8s ease-in-out, opacity 0.8s ease-in-out;
}

#loading-screen.hide {
    transform: translateY(-100%);
    opacity: 0;
}

.spinner {
    width: 60px;
    height: 60px;
    border: 5px solid rgba(255, 255, 255, 0.3);
    border-top: 5px solid white;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

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

.loading-text {
    color: white;
    font-size: 24px;
    margin-top: 20px;
    font-weight: 300;
}

.lprogress-bar {
    width: 200px;
    height: 4px;
    background: rgba(255, 255, 255, 0.3);
    border-radius: 2px;
    margin-top: 20px;
    overflow: hidden;
}

.lprogress-fill {
    height: 100%;
    background: white;
    width: 0%;
    transition: width 0.3s ease;
}

@media (max-width: 1200px) {

  .home .siteContent {

      padding: 0;

  }

}

@media (max-width: 992px) {

  .home .siteContent {

      padding: 0;

  }

  .top_grid :is(*, div):nth-child(1) {

    order: 1;

  }

  .top_grid :is(*, div):nth-child(2) {

    order: 2;

  }

  .top_grid :is(*, div):nth-child(3) {

    order: 3;

  }

  .top_grid :is(*, div):nth-child(4) {

    order: 5;

  }

  .top_grid :is(*, div):nth-child(5) {

    order: 4;

  }

  .top_grid :is(*, div):nth-child(6) {

    order: 8;

  }

  .top_grid :is(*, div):nth-child(7) {

    order: 6;

  }

  .top_grid :is(*, div):nth-child(8) {

    order: 7;

  }



}

@media (max-width: 768px) {

  .home .siteContent {

      padding: 0;

  }

  .top_grid :is(*, div):nth-child(1) {

    order: 1;

  }

  .top_grid :is(*, div):nth-child(2) {

    order: 2;

  }

  .top_grid :is(*, div):nth-child(3) {

    order: 3;

  }

  .top_grid :is(*, div):nth-child(4) {

    order: 5;

  }

  .top_grid :is(*, div):nth-child(5) {

    order: 4;

  }

  .top_grid :is(*, div):nth-child(6) {

    order: 8;

  }

  .top_grid :is(*, div):nth-child(7) {

    order: 6;

  }

  .top_grid :is(*, div):nth-child(8) {

    order: 7;

  }

}







/* 子テーマファイルオリジナルCSS */



body{

  font-family: 'Montserrat', sans-serif, 'Hiragino Kaku Gothic ProN', 'Hiragino Sans', Meiryo;

}





.ani-fadeIn.animated {

  opacity: 1 !important;

  transition: opacity 3s cubic-bezier(0.155, 0.91, 0.695, 0.95);

}



.ani-fadeInUp {

  position: relative;

  transform: translate(0, 140px);

  transition: opacity 1s cubic-bezier(0.155, 0.91, 0.695, 0.95), transform 1s cubic-bezier(0.155, 0.91, 0.695, 0.95);

}



.ani-fadeInUp.animated {

  opacity: 1 !important;

  transform: translate(0, 0);

}



.ani-fadeInRight {

  position: relative;

  transform: translate(140px, 0);

  transition: opacity 1s cubic-bezier(0.155, 0.91, 0.695, 0.95), transform 1s cubic-bezier(0.155, 0.91, 0.695, 0.95);

}



.ani-fadeInRight.animated {

  opacity: 1 !important;

  transform: translate(0, 0);

}



.ani-fadeInLeft {

  position: relative;

  transform: translate(-140px, 0);

  transition: opacity 1s cubic-bezier(0.155, 0.91, 0.695, 0.95), transform 1s cubic-bezier(0.155, 0.91, 0.695, 0.95);

}



.ani-fadeInLeft.animated {

  opacity: 1 !important;

  transform: translate(0, 0);

}

@media (max-width: 992px) {

  .ani-fadeInUp {

    position: relative;

    transform: translate(0, 0);

    transition: opacity 1s cubic-bezier(0.155, 0.91, 0.695, 0.95), transform 1s cubic-bezier(0.155, 0.91, 0.695, 0.95);

  }

  .ani-fadeInLeft {

    position: relative;

    transform: translate(0, 0);

    transition: opacity 1s cubic-bezier(0.155, 0.91, 0.695, 0.95), transform 1s cubic-bezier(0.155, 0.91, 0.695, 0.95);

  }

  .ani-fadeInRight {

    position: relative;

    transform: translate(0, 0);

    transition: opacity 1s cubic-bezier(0.155, 0.91, 0.695, 0.95), transform 1s cubic-bezier(0.155, 0.91, 0.695, 0.95);

  }

}





@keyframes fadeInFromLeft {

  from {

    opacity: 1 !important;

    transform: translateX(-30px);

  }

  to {

    opacity: 1 !important;

    transform: translateX(0);

  }

}



.artisan_text_area_bg.animated  {

  animation: fadeInFromLeft 1.2s ease forwards !important;

  opacity: 1 !important;

}





.artisan_text_area {

    width: 50%;

    z-index: 100;

    position: absolute;

    bottom: 10%;

    -ms-transform: translateY(-25%);

    -webkit-transform: translateY(-25%);

    transform: translateY(-25%);

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

}

.artisan_area .artisan_02,

.artisan_area2 .artisan_01,

.artisan_area4 .artisan_01{

  padding:3rem;



  background-size: cover;

  width: 50%;

}

.artisan_area .artisan_02{

  background-image: linear-gradient(0.25turn,rgba(55, 19, 215, 0.3), rgba(41, 130, 96, 0.3)), url(images/artisan_01.webp);



  background-repeat: no-repeat, no-repeat;

  background-size: cover, cover;



}

.artisan_area2 .artisan_01{

  background-image: linear-gradient(0.25turn,rgba(55, 19, 215, 0.3), rgba(41, 130, 96, 0.3)), url(images/artisan_02.webp);



  background-repeat: no-repeat, no-repeat;

  background-size: cover, cover;

  background-position: left,center;

}

.artisan_area4 .artisan_01{

  background-image: linear-gradient(0.25turn,rgba(55, 19, 215, 0.3), rgba(41, 130, 96, 0.3)), url(https://owaritest.com/kitano/wp-content/uploads/2023/01/20230106_064833411_iOS-1024x833.jpg);



  background-repeat: no-repeat, no-repeat;

  background-size: cover, cover;

  background-position: left,center;

}

.ani-fadeInUp {

  position: relative;

  /* opacity: 0; */

  /* transform: translate(0, 140px); */

  transition: opacity 1s cubic-bezier(0.155, 0.910, 0.695, 0.950),transform 1s cubic-bezier(0.155, 0.910, 0.695, 0.950);

}

.ani-fadeInUp.animated{

  opacity: 1 !important;

  /* transform: translate(0, 0); */

}

.flexbox{

  display: flex;

  flex-direction: row;

  flex-wrap: wrap;

}





.siteHeader_logo{

  padding-left:70px;

  background: url(images/cropped-site_icon.png);

  background-repeat: no-repeat;

  background-position: left;

  background-size: 58px 58px;

}



@media (max-width: 992px) {

  .siteHeader_logo{

    padding-left:0;

    background: none;



  }

}





/* すりガラス */

.vkp_filter_blur{

  backdrop-filter: blur(5px);

  -webkit-backdrop-filter: blur(5px);  

  background: rgba(255,255,255,0.3); /* 半透明 */

  border-radius: 2rem; /* 角丸 */

  box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 10px; /* 影 */

  box-shadow: rgba(255, 255, 255, 0.1) 0px 0px 10px; /* 影 */

  max-width:700px; /* 最大幅 */

  margin:0 auto; /* 中央揃え */

}

/* 線 */

.vkp_hr_short{

  width: 3rem;

  height: 2px;

}

.vk_posts.top-events{
  justify-content: center;
}

.face_box_st01 .wp-block-column:nth-child(1){
  order: 1;
}
.face_box_st01 .wp-block-column:nth-child(2){
  order: 2;
}

@media screen and (max-width: 834px){


.face_box_st01 .wp-block-column:nth-child(1){
  order: 2;
}
.face_box_st01 .wp-block-column:nth-child(2){
  order: 1;
}


  /* すりガラス */

	.vkp_filter_blur{

	  backdrop-filter: blur(5px);

	  -webkit-backdrop-filter: blur(5px);  

	  background: rgba(255,255,255,0.3); /* 半透明 */

	  border-radius: 2rem; /* 角丸 */

	  box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 10px; /* 影 */

	  box-shadow: rgba(255, 255, 255, 0.1) 0px 0px 10px; /* 影 */

	  max-width:700px; /* 最大幅 */

	  margin:0 auto; /* 中央揃え */

	}

}