/*

Theme Name: Lightning Child 

Theme URI:

Template: lightning

Description: lightningの子テーマです。

Author: t-shimizu

*/



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





.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;

}





@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;

}









.artisan_text01{

  font-size: 1.5rem;

  text-align: center;

  font-weight: 800;

  margin-bottom: 2rem;

}

.artisan_area,

.artisan_area2,

.artisan_area4{

  height: 80vh;

}

.artisan_area3{

  position: relative;

  margin-bottom: 6rem;

}

.artisan_area3_bg{

  background: url(images/logo_m.png);

  width: 400px;

  height: 400px;

  background-size: cover;

  opacity: 0.3;

  z-index: -1;

  position: absolute;

  right: 280px;

  top: 330px;

}

.artisan_area3 ul{

  max-width: 1000px;

  margin: 0 auto 6rem auto;

  padding:0;

  gap: 40px;

  justify-content: center; /* 子要素をflexboxにより中央に配置する */

  align-items: center;  /* 子要素をflexboxにより中央に配置する */

}

.artisan_area3 ul li{

  list-style: none;



}

.artisan_01,

.artisan_02{

  margin-bottom: 2em;

}

.artisan_01,

.artisan_02{

  margin-bottom: 2em;

}

.artisan_area .artisan_01,

.artisan_area2 .artisan_02,

.artisan_area4 .artisan_02{

  background: rgba(29, 63, 125,1);

  background: rgba(29, 63, 125,1);

  width: 50%;

  padding:3rem 3rem 0 3rem;

  display: flex;

  flex-direction: row;

  /* justify-content: center; */

  align-items: center;

  color:white;



}

.artisan_area .artisan_01 h3,

.artisan_area2 .artisan_02 h3,

.artisan_area4 .artisan_02 h3{

  display: block;

  width: 100%;

  font-size: 3.5rem;

  letter-spacing: 0.3em;

  line-height: 1.2;

}

.artisan_area .artisan_01 h3 span,

.artisan_area2 .artisan_02 h3 span,

.artisan_area4 .artisan_02 h3 span{

  font-size: 1.8rem;

  margin-bottom: 0;

}

.artisan_area .artisan_02 div.artisan_text_area_bg,

.artisan_area2 .artisan_01 div.artisan_text_area_bg,

.artisan_area4 .artisan_01 div.artisan_text_area_bg{

  background: rgba(255,255,255,0.9);

  padding:1rem;

  font-size: 1.5rem;

  margin-bottom: 1rem;

  display: inline-block;

  overflow: hidden;

  break-words: break-all;



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


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



.artisan_01, .artisan_02 {

    margin-bottom: 0em;

  }

  .artisan_area,

  .artisan_area2,

  .artisan_area4{

    height: 60vh;

    margin-bottom: 1em;

  }

  .artisan_area .artisan_01,

  .artisan_area .artisan_02,

  .artisan_area2 .artisan_01,

  .artisan_area2 .artisan_02,

  .artisan_area4 .artisan_01,

  .artisan_area4 .artisan_02{

    width:100%;

    height: 30vh;

    paddig:1rem;

  }

  .artisan_area .artisan_02,

  .artisan_area2 .artisan_01,

  .artisan_area4 .artisan_01{

    order:1;

  }

  .artisan_area .artisan_01,

  .artisan_area2 .artisan_02,

  .artisan_area4 .artisan_02{

    order:2;

  }

  .artisan_area .artisan_01 h3,

  .artisan_area2 .artisan_02 h3,

  .artisan_area4 .artisan_02 h3{

    display: block;

    width: 100%;

    font-size: 1.5rem;

    letter-spacing: 0.3em;

    line-height: 1.2;

  }

  .artisan_area .artisan_01 h3 span,

  .artisan_area2 .artisan_02 h3 span,

  .artisan_area4 .artisan_02 h3 span{

    font-size: 1.2rem;

    margin-bottom: 0;

  }

  .artisan_text_area {

    width: 100%;

    z-index: 100;

    position: absolute;

    bottom: 0;

    top:30vh;

    -ms-transform: inherit;

    -webkit-transform: inherit;

    transform: inherit;

    -webkit-box-sizing: border-box;

    box-sizing: border-box;

  }



  .artisan_area .artisan_02 div.artisan_text_area_bg,

  .artisan_area2 .artisan_01 div.artisan_text_area_bg,

  .artisan_area4 .artisan_01 div.artisan_text_area_bg {

    padding: 0.3rem;

    font-size: 1rem;

    margin-bottom: 0.5rem;

  }

  .artisan_area .artisan_02{

    background-image: url(images/artisan_01.webp);

    background-attachment:  unset;

    background-repeat:  no-repeat;

    background-size:  cover;

  }

  .artisan_area2 .artisan_01{

    background-image: url(images/artisan_02.webp);

    background-attachment:  unset;

    background-repeat:  no-repeat;

    background-size:  cover;

  }

  .artisan_area4 .artisan_01{

    background-image: url(https://owaritest.com/kitano/wp-content/uploads/2023/01/20230106_064833411_iOS-1024x833.jpg);

    background-attachment:  unset;

    background-repeat:  no-repeat;

    background-size:  cover;

  }

  .artisan_area3 ul li{

    width:60%;

  }

  .artisan_area3_bg {

    background: url(images/logo_m.png);

    width: 300px;

    height: 300px;

    background-size: cover;

    opacity: 0.3;

    z-index: -1;

    position: absolute;

    right: 20px;

    bottom: 20px;

  }

  .artisan_text01{

    font-size: 1.2rem;

    text-align: left;

    font-weight: 600;

    margin-bottom: 1rem;

  }

  /* すりガラス */

	.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; /* 中央揃え */

	}

}

