@charset "UTF-8";
body{  
  font-size: 16px;
  margin:0; 
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 400;
  font-style: normal;
}
h1{ font-size:18px; font-weight: bold;}
h2{ font-size:18px;}
h3{ font-size:18px;}
@media (min-width:480px){
  body{  font-size: 16px; }
  h1{ font-size:28px; font-weight: bold;}
  h2{ font-size:24px;}
  h3{ font-size:18px;}
}
img{ max-width:100%;  }
a{
  color:#000;
  text-decoration: none;
}
a:link, a:visited, a:hover, a:active {
  color: #000;
}
ul li{list-style: none;}

footer{ 

}
footer .footer-menu a{
  color:#fff ;
}
.footer-list{
  margin-top:-15px;
}

/*打ち消し*/
*,
*:before,
*:after {
  box-sizing: border-box;
}

.max-width{
  max-width:1080px;
  margin:0 auto;
}
/***************************
カラー指定
***************************/
:root {
  --main-color: #0B376B;
  --gradation1: linear-gradient(90deg,rgba(255, 115, 201, 1) 0%, rgba(9, 89, 164, 1) 100%) ;
  --white:#fff;
  --gray:#eee;
}
/*ブレイクポイント
480px(SP)
780px(TB)
*/

/***************************
共通
***************************/
.my-1{margin-top:10px; margin-bottom:10px;}
.my-2{margin-top:20px; margin-bottom:20px;}
.my-3{margin-top:30px; margin-bottom:30px;}
.my-4{margin-top:40px; margin-bottom:40px;}
.mt-2{margin-top:20px;}
.mt-3{margin-top:30px;}
.mt-4{margin-top:40px;}
.mt-10{margin-top:100px;}
.mb-2{margin-bottom:20px;}
.mb-3{margin-bottom:30px;}
.mb-4{margin-bottom:40px;}
.mb-10{margin-bottom:100px;}
.py-1{padding-top:10px; padding-bottom:10px;}
.py-2{padding-top:20px; padding-bottom:20px;}
.py-3{padding-top:30px; padding-bottom:30px;}
.py-4{padding-top:40px; padding-bottom:40px;}
.mx-1{margin-right:10px; margin-left:10px;}
.mx-2{margin-right:20px; margin-left:20px;}
.mx-3{margin-right:30px; margin-left:30px;}
.mx-4{margin-right:40px; margin-left:40px;}
.px-1{padding-right:10px; padding-left:10px;}
.px-2{padding-right:20px; padding-left:20px;}
.px-3{padding-right:30px; padding-left:30px;}
.px-4{padding-right:40px; padding-left:40px;}
.pt-2{padding-top:20px;}
.pt-3{padding-top:30px;}
.pt-4{padding-top:40px;}
.pb-2{padding-bottom:20px;}
.pb-3{padding-bottom:30px;}
.pb-4{padding-bottom:40px;}
.pb-10{padding-bottom:100px;}
.text-center{text-align:center;}

.flex-box{
  display:flex;
  flex-wrap:wrap;
}
.flex-box .flex-item.col-2,
.flex-box .flex-item.col-3{
  width:100%;
  margin-bottom:20px;
}
@media (min-width:480px){
  .flex-box .flex-item.col-2{
    width:100%;
  }
  .flex-box .flex-item.col-3{
    margin:10px;
    width:calc((100% - 60px) / 3);
  }
}
.inner{
  width:100%;
  padding:10px;
}
@media (min-width:480px){
  .inner{
    padding:20px;
  }
}
.bg-dot{
  background-color: #ffffff;
  background-image: radial-gradient(circle, #e6e6e6 1.5px, transparent 1.5px);
  background-position: 0 0;
  background-size: 23px 23px;
  position:relative;
}
.bg-dot:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url(images/noise.svg);
  background-size: 100px;
  background-repeat: repeat;
  filter: brightness(150%);
}
.bg-dot > .max-width{
  position:relative;
}

.bg-white2{
  background:rgba(255,255,255,.5);
  position:relative;
}
.bg-white2:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url(images/noise.svg);
  background-size: 100px;
  background-repeat: repeat;
  filter: brightness(140%);
}
.bg-white2 > .max-width{
  position:relative;
}

.bg-blue{
  background-image:url('images/bg-blue.webp');
  background-position:bottom;
  background-repeat: no-repeat;
  background-size:cover;
  position:relative;
}
.bg-blue:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url(images/noise.svg);
  background-size: 100px;
  background-repeat: repeat;
  filter: brightness( 30%);
}
.bg-blue > .max-width{
  position:relative;
}

.slide-up{
  opacity: 0;
  transform: translate(0,100%);
  transition: all .5s;
}
.slide-up.active{
  transform: translate(0, 0)!important;
    opacity: 1!important;
}
.slide-up2{
  opacity: 0;
  transform: translate(-50%, 100%) !important;
  transition: all .5s;
}
.slide-up2.active{
  transform: translate(-50%, -50%)!important;
    opacity: 1!important;
}
.slide-up3{
  opacity: 0;
  transform: translate(0, 50%) !important;
  transition: all .5s;
}
.slide-up3.active{
  transform: translate(0, 0)!important;
    opacity: 1!important;
}


.yellow-line{
  background-image: -webkit-linear-gradient(left, transparent 50%, #FCFF1E 50%);
  background-image: -moz-linear-gradient(left, transparent 50%, #FCFF1E 50%);
  background-image: -ms-linear-gradient(left, transparent 50%, #FCFF1E 50%);
  background-image: -o-linear-gradient(left, transparent 50%, #FCFF1E 50%);
  background-image: linear-gradient(left, transparent 50%, #FCFF1E 50%);
  background-repeat: repeat-x;
  background-size: 200% 50%;
  background-position: 0 .5em;
  transition: all 1s ease;
  font-weight: bold;
}
.yellow-line.active{
  background-position: -100% 120%;
}

.micro-copy{
  display:flex;
  justify-content: center;
  align-items: center;
  font-size:80%;
  font-size: 80%;
  margin-bottom: -15px;
}
.micro-copy::before,
.micro-copy::after{
  content:"";
  display:block;;
  width:2px;
  height:20px;
  background:#222;
}
.micro-copy::before{
  transform:rotate(-40deg);
  margin-right:10px;
}
.micro-copy::after{
  transform:rotate(40deg);
  margin-left:10px;
}
.micro-copy span{
  background-image: -webkit-linear-gradient(left, transparent 50%, #FCFF1E 50%);
  background-image: -moz-linear-gradient(left, transparent 50%, #FCFF1E 50%);
  background-image: -ms-linear-gradient(left, transparent 50%, #FCFF1E 50%);
  background-image: -o-linear-gradient(left, transparent 50%, #FCFF1E 50%);
  background-image: linear-gradient(left, transparent 50%, #FCFF1E 50%);
  background-repeat: repeat-x;
  background-size: 200% 50%;
  background-position: 0 .5em;
  transition: all 1s ease;
  font-weight: bold;
}
.micro-copy.active span{
  background-position: -100% 120%;
}

.text-strong{
  color:var(--text-strong);
}

.main-btn a{
  display:block;
  width:90%;;
  max-width:400px;
  margin:10px auto;
  background:var(--gradation1);
  color:#fff;
  font-weight:bold;
  text-align:center;
  border-radius:50px;
  padding:20px;
}

.normal-link{
  color:#0000ff;
  text-decoration: underline;
  word-break: break-all;
}
.normal-link:hover{
  color:#ff0000;
  text-decoration: underline;
}
.normal-link:visited{
  color:#0000ff;
  text-decoration: underline;
}
.normal-link:link{
  color:#0000ff;
  text-decoration: underline;
}



.pc-none{
  display:block;
}
.sp-none{
  display:none;
}
@media (min-width:480px){
  .pc-none{
    display:none;
  }
  .sp-none{
    display:block;
  }
}

/***************************
ヘッダー
****************************/
.header-nav-content{
  font-family: "Teko", sans-serif;
  display:flex;
  justify-content: space-between;
  align-items: center;
  position:fixed;
  top:10px;
  left:50%;
  transform: translateX(-50%);
  border-radius:100px;
  width:90%;
  max-width:400px;
  background: var(--gray);
  padding:5px 30px;
  z-index:100;
}
.header-nav-content .left a{
  font-size:26px;
  font-weight: bold;
}
.header-nav-content .right{
  display:flex;
  justify-content: space-between;
  align-items: center;
}
.header-nav-content .right .header-nav-links{
  font-size:18px;
  margin-right:20px;
}
@media (min-width:480px){
  .header-nav-content{
    left:20px;
    transform: unset;
  }
}
/*ハンバーガー*/
.hamburger-btn{
  background:#CFCFCF;
  width:40px;
  height:40px;
  display:flex;
  justify-content: center;
  align-items:center;
  border-radius:100%;
}
@media (min-width: 1080px){
  .hamburger-btn{
    right: calc(50% - 550px);
  }
}
.hamburger-btn-inner{
  position: relative;
}
.hamburger-btn span{
  display:block;
  width:4px;
  height:4px;
  background:var(--white);
  border-radius: 100%;
  opacity:1;
  transition: 1s;
}
.hamburger-btn .hamburger-btn-inner::before,
.hamburger-btn .hamburger-btn-inner::after{
  content:"";
  display: block;
  width:4px;
  height:4px;
  background:var(--white);
  position:absolute;
  border-radius: 100%;
  transition:.5s;
}
.hamburger-btn .hamburger-btn-inner::before{
  top:0;
  left:-10px;
}
.hamburger-btn .hamburger-btn-inner::after{
  top:0;
  left:10px;
}
.hamburger-btn.active .hamburger-btn-inner::before{
  top:10px;
  left:0;
}
.hamburger-btn.active .hamburger-btn-inner::after{
  top:-10px;
  left:0;
}

.menu{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(50, 50, 50, 0.6);
  padding: 65px 30px;
  z-index: 99;
  transform: translateY(-100%);
  transition:.5s;
  opacity: 0;
}
.menu.active{
  transform: translateY(0);
  opacity:1;
}
.menu li{
  margin-bottom:10px;
}
.menu li a{
  color:#fff;
}
@media (min-width:780px){
  .menu{
    max-width:445px;
  }
}

/*****************
front-page
******************/
.deco-ttl{
  text-align:center;
  margin-top:40px;
  position:relative;
  margin-bottom:0;
}
.deco-ttl::before{
  display:block;
  text-align:center;
  position:absolute;
  top:-20px;
  width:100%;
  color:var(--main-color);
  font-family: "Teko", sans-serif;
  font-size:15px;
}
@media (min-width:780px){
  .deco-ttl{
    margin-bottom:40px;
  }
  .deco-ttl::before{
    top:-40px;
    font-size:36px;
  }
}
/*メインビジュアル*/
#top-mv{
  background-image:url('images/mv-sp.webp');
  height:600px;
  background-size:cover;
  background-position:center;
  background-repeat: no-repeat;
  position:relative;
}
#top-mv video{
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
}
.video-wrapper::before{
  width: 100%;
  height: 100%;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0.5;
  background-image: url(images/kv_bg.png);
  background-size: 3px auto;
  z-index: 2;
}
.mv-txt{
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50% , -50%);
  display:block;
  width:100%;
  color:#fff;
  z-index:3;
}
.mv-txt .ttl-up{
  text-align:center;
  font-size: 26px;
  margin-bottom: 10px;
}
.mv-txt .ttl-down{
  text-align:center;
  font-size: 26px;
}

.neontext {
  color: #fff;
  text-shadow:
    0 0 7px #fff,
    0 0 10px #fff,
    0 0 21px #fff,
    0 0 42px #9900ff,
    0 0 82px #9900ff,
    0 0 92px #9900ff,
    0 0 102px #9900ff,
    0 0 151px #9900ff;
}

/*パーティクル*/
.main-bg.fix{
  position: fixed;
  z-index: -5;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

/*news*/
#news .deco-ttl::before{
  content:"News";
}
#news .news-lists li{
  padding:0;
  margin-bottom:10px;
  border-bottom:1px solid var(--gray);
}
#news .news-btn{
  display:flex;
  justify-content: end;
  align-items: center;
}
#news .news-btn a{
  font-size:90%;
  margin-right:10px;
}
/*intro*/
#intro .deco-ttl::before{
  content:"About";
}
#intro .content-wrapper{
  display:flex;
  flex-wrap:wrap;
}
#intro .content-wrapper .left,
#intro .content-wrapper .right{
  width:100%;
  padding:20px;
}
#intro .content-wrapper .right img {
  border-radius:20px;
}
@media (min-width:780px){
  #intro .content-wrapper .left,
  #intro .content-wrapper .right{
    width:50%;
  }
  #intro .content-wrapper .right{
    text-align:center;
  }
  #intro .content-wrapper .right img{
    max-width:300px;
    width:100%;
  }
}
/*solution*/
#solution .deco-ttl::before{
  content:"Solution";
}
#solution .content-wrapper{
  display:flex;
  flex-wrap:wrap;
}
#solution .content-wrapper .left,
#solution .content-wrapper .right{
  width:100%;
  padding:20px;
}
#solution .content-wrapper .right img {
  border-radius:20px;
}
@media (min-width:780px){
  #solution .content-wrapper .left,
  #solution .content-wrapper .right{
    width:50%;
  }
  #solution .content-wrapper .right{
    text-align:center;
  }
  #solution .content-wrapper .right img{
    width:100%;
    max-width:300px;
  }
}
/*Result*/
#result .deco-ttl::before{
  content:"Result";
}


.carousel-container {
  width: 100%;
  max-width: 800px;
  margin:0 auto;
  height: 250px;
  position: relative;
  perspective: 1200px;
}
.carousel {
  position: relative;
  width: 100%;
  height: 100%;
}
.carousel-item {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 60%;
  height:200px;
  transition: transform 0.5s, z-index 0.5s, opacity 0.5s;
  cursor: pointer;
}
@media (min-width: 780px) {
  .carousel-container{
    max-width:unset;
  }
  .carousel-item {
    width: 40%;
    height:250px;
  }
}
.carousel-item img{
  width:100%;
  border-radius:20px;
  height: 100%;
  object-fit: cover;
}
.carousel-item iframe{
  width:100%;
  border-radius:20px;
  height: 100%;
}
.carousel-dots {
  text-align: center;
  margin-top:  30px;
}
.carousel-dot {
  display: inline-block;
  width: 12px;
  height: 12px;
  margin: 0 5px;
  background: #bbb;
  border-radius: 50%;
  cursor: pointer;
  transition: background 0.3s;
}
.carousel-dot.active {
  background: #fff;
  border: 1px solid #bbb;
}

/*Feature*/
#feature .deco-ttl::before{
  content:"Feature";
}
#feature .feature-items{
  display:flex;
  flex-wrap:wrap;
}
#feature .feature-items{
  counter-reset: number 0;
}

#feature .feature-items .feature-item::before{
   counter-increment: number 1;
  content:"FEATURE"  counter(number);
  font-family: "Teko", sans-serif;
  display:block;
  font-weight:bold;
  font-size:24px;
  color:#fff;
  text-shadow: 0 0px 5px #8f8f8f8a, 0 -2px 1px;
}
#feature .feature-items .feature-item{
  width:90%;
  margin:20px auto 40px;
  box-shadow: 3px 3px 10px rgb(160 160 160 / 50%);
  border-radius:20px;
  padding:0 20px 20px 20px;
  background:var(--white);
}
#feature .feature-items .feature-item:nth-child(1){
  position: sticky;
  top: 65px;
  z-index: 1;
}
#feature .feature-items .feature-item:nth-child(2){
  position: sticky;
  top: 85px;
  z-index: 2;
}
#feature .feature-items .feature-item:nth-child(3){
  position: sticky;
  top: 105px;
  z-index: 3;
}
#feature .feature-items .feature-item:nth-child(4){
  position: sticky;
  top: 125px;
  z-index: 4;
}
#feature .feature-items .feature-item img{
  width:100%;
  border-radius:20px;
  margin-bottom:20px;
}
#feature .feature-items .feature-item > .ttl{
  font-size:20px;
  font-weight:bold;
  text-align: center;
  margin-bottom:20px;
}

#feature .feature-table-container{
  display:flex;
}
#feature .feature-table-container .feature-table-box {
  margin:5px;
  width:calc((100% - 20px) / 2);
}
#feature .feature-items .feature-table-box.sub > .big-ttl{
  background:var(--main-color);
  text-align:center;
  color:#fff;
  padding:10px;
  font-weight:bold;
  position:relative;
  font-size:110%;
}
#feature .feature-items .feature-table-box.sub > .big-ttl::after{
  content:"";
  display:block;
  width:100px;
  height:1px;
  background:#fff;
  position:absolute;
  left:50%;
  top:100%;
  transform: translateX(-50%);
}
#feature .feature-items .feature-table-box.sub > .ttl{
  background:var(--main-color);
  text-align:center;
  color:#fff;
  padding:10px;
}
#feature .feature-items .feature-table-box.sub > .txt{
  background:#eee;
  text-align:center;
  padding:10px;
}
#feature .feature-items .feature-table-box.main > .big-ttl{
  background:var(--gradation1);
  text-align:center;
  color:#fff;
  padding:10px;
  font-weight:bold;
  position:relative;
  font-size:110%;
}
#feature .feature-items .feature-table-box.main > .big-ttl::after{
  content:"";
  display:block;
  width:100px;
  height:1px;
  background:#fff;
  position:absolute;
  left:50%;
  top:100%;
  transform: translateX(-50%);
}
#feature .feature-items .feature-table-box.main > .ttl{
  background:var(--gradation1);
  text-align:center;
  color:#fff;
  padding:10px;
}
#feature .feature-items .feature-table-box.main > .txt{
  background:var(--gray);
  text-align:center;
  padding:10px;
}
@media (min-width:780px){
  #feature .feature-items{
    align-items: start;
  }
  #feature .feature-items .feature-item{
    width:45%;
    margin:20px auto 40px;
    box-shadow: 3px 3px 10px rgb(160 160 160 / 50%);
    border-radius:20px;
    padding:0 20px 20px 20px;
    background:var(--white);
  }
  #feature .feature-items .feature-item:nth-child(1){
    position: unset;
  }
  #feature .feature-items .feature-item:nth-child(2){
    position: unset;
    margin-top:200px;
  }
  #feature .feature-items .feature-item:nth-child(3){
    position: unset;
    margin-top:-100px;
  }
  #feature .feature-items .feature-item:nth-child(4){
    position: unset;
    margin-top:40px
  }
}


/*Service*/
#service .deco-ttl::before{
  content:"Service";
}
#service .service-table-wrapper{
  overflow: auto;
  filter: drop-shadow(3px 3px 10px rgba(160, 160, 160, 0.5));
  background: #f3f3f3;
  margin-top:40px;
}
#service .service-table-wrapper table{
  width:100%;
  min-width:800px;
  border: 1px solid var(--gray);
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 20px;
  overflow: hidden;
}
#service .service-table-wrapper table tr:first-child{
  background:var(--gradation1);
}
#service .service-table-wrapper table th{
  color:#fff;
  font-weight:bold;
  text-align:center;
  padding:10px;
}
#service .service-table-wrapper table td{
  border:1px solid var(--gray);
  background:var(--white);
  padding:10px;
}
#service .service-table-wrapper table th:nth-child(1){
  width:30%;
}
#service .service-table-wrapper table th:nth-child(2){
  width:25%;
}
#service .service-table-wrapper table th:nth-child(3){
  width:45%;
}
#service .service-table-wrapper table td:not(:last-child){
  text-align:center;
}
#service .service-table-wrapper table .small-txt{
  font-size:80%;
}


/*gallery*/
#gallery .deco-ttl::before{
  content:"Gallery";
}
#gallery .gallery-bg{
  background-image: url('images/ga-bg.webp');
  height: 350px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  background-color: rgb(255 255 255 / 60%);
  background-blend-mode: overlay;
}
#gallery .gallery-bg .deco-ttl{
  position: absolute;
  top:50%;
  left:50%;
  transform:translate(-50%, -50%);
  text-align: unset;
  margin-top: 0;
}

#gallery .slick-list {
  margin: 0 -10px;
}
#gallery .slick-slide {
  margin: 0 10px;
}
#gallery .slick-list img{
  border-radius:20px;
  box-shadow: 3px 3px 10px rgb(160 160 160 / 50%);
  margin-bottom:20px;
}
#gallery .slider-content{
  margin-top:-80px;
  overflow: hidden;
}


/*shop-info*/
#shop-info .deco-ttl::before{
  content:"Shop Info";
}
#shop-info .shopinfo-table-wrapper table{
  width:100%;
  border-spacing: 10px 15px;
}
#shop-info .shopinfo-table-wrapper table tr{
  margin-bottom:20px;
}
#shop-info .shopinfo-table-wrapper table td:first-child{
  width:100px;
  text-align:center;
}
#shop-info .content-wrapper{
  display:flex;
  flex-wrap:wrap;
  margin-top:40px;
}
#shop-info .content-wrapper .left,
#shop-info .content-wrapper .right{
  width:100%;
  padding:20px;
}
#shop-info .content-wrapper .right iframe {
  border-radius:20px;
  width:100%;
  height:300px;
}
@media (min-width:780px){
  #shop-info .content-wrapper .left,
  #shop-info .content-wrapper .right{
    width:50%;
  }
  #shop-info .content-wrapper .right{
    text-align:center;
  }
  #shop-info .content-wrapper .right iframe{
    width:100%;
  }
  #shop-info .shopinfo-table-wrapper table td:first-child{
    width:200px;
  }
}

/*column*/
#column .deco-ttl::before{
  content:"Column";
}

/*message*/
#message {
  border-radius:0 0 30px 30px;
  z-index: 2;
}
#message.bg-blue::before{
  border-radius:0 0 30px 30px;
}
#message .txt-outer{
  position:relative;
  height:300px;
}
#message .txt-wrapper{
  text-align:center;
  color:#fff;
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50% , -50%);
  width:100%;
}


/*contact*/
#contact {
  background-image:url('images/contact.webp');
  background-position:center;
  background-size:cover;
  background-repeat: no-repeat;
  margin-top: -20px;
}
#contact{
  position:relative;
}
#contact:before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: url(images/noise.svg);
  background-size: 100px;
  background-repeat: repeat;
  filter: brightness( 30%);
}
#contact > .max-width{
  position:relative;
}
#contact .inner{
  padding-top:100px;
}
#contact .txt{
  color:#fff;
  text-align:center;
  margin:20px auto;
}


.footer-menu{
  color:#fff;
  background: rgb(0 0 0 / 40%);
  backdrop-filter:blur(2px);
  width:95%;
  margin: 40px auto 0;
  padding:20px;
  border-radius:20px 20px 0 0;
}
.footer-menu .shop-ttl{
  font-size:30px;
  font-family: "Teko", sans-serif;
  margin-bottom:0;
}
.footer-menu .footer-info{
  padding:0;
  margin:0 auto 0;
}
.footer-menu .footer-sns-lists{
  padding:0;
  margin:20px auto 40px;
}

.footer-menu .footer-sns-lists li{
  display:inline-block;
  margin-right:5px;
}
.footer-menu .footer-sns-lists i{
  font-size:30px;
  color:#fff;
}



/*****************
single
******************/
.bread{
  font-size:90%;
  margin:40px auto;
}
.single-mv{
  background-image: url(images/ga-bg.webp);
  height: 280px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  background-color: rgb(255 255 255 / 60%);
  background-blend-mode: overlay;
}
.single-mv h2{
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
  width:100%;
  text-align:center;
}
.single-content{
  box-shadow: 5px 5px 10px #d0d0d0;
  padding:10px 10px 40px 10px;
  border-radius:20px;
}
.single-content-wrapper{
  display:flex;
  flex-wrap: wrap;
}
.single-content-wrapper .left,
.single-content-wrapper .right{
  width:100%;
}
@media (min-width:780px){
  .single-content-wrapper .left{
    width:65%;
  }
  .single-content-wrapper .right{
    width:35%;
  }
}
.thumb-wrapper{
  text-align: center;
}
.thumb-img{
  width:100%;
  height:auto;
  max-width:500px;
}

.single-content h2{
  background:linear-gradient(to right, rgba(0, 219, 222, .3) 0%, rgba(252, 0, 255, .3) 100%);
  padding:10px;
  border-radius:20px 0 20px 0;
}
.single-content h3{
  position: relative;
}
.single-content h3:after {
  position: absolute;
  content: " ";
  display: block;
  bottom: 0;
  width:100%;
  height:10px;
  background: linear-gradient(to right, rgba(0, 219, 222, .3) 0%, rgba(252, 0, 255, .3) 100%);
  z-index: -1;
  border-radius:20px;
}

.single-content h4{
  position: relative;
}
.single-content h4:after {
  position: absolute;
  content: " ";
  display: block;
  bottom: 0;
  width:150px;
  height:8px;
  background: linear-gradient(to right, rgba(0, 219, 222, .3) 0%, rgba(252, 0, 255, .3) 100%);
  z-index: -1;
  border-radius:20px;
}
.single-content p{
  margin:40px auto;
}


/*ページネーション*/
.pagenation{
  display: flex;
  justify-content: space-between;
}
.pagenation .prev,
.pagenation .next{
  width:50%;
  padding:5px;
}
.pagenation .prev img,
.pagenation .next img{
  width:100%;
  height:auto;
}
.pagenation .prev .txt,
.pagenation .next .txt{
  text-align: center;
  font-size: 90%;
}

/*サイドバー*/
#sidebar .shop-info,
#sidebar .writer-info{
  box-shadow: 5px 5px 10px #d0d0d0;
  padding:10px 10px 40px 10px;
  border-radius:20px;
}
#sidebar .shop-info .ttl{
  font-family: "Teko", sans-serif;
  font-size:24px;
}
#sidebar .shop-info img{
  border-radius:10px;
}
#sidebar .writer-info .image{
  text-align:center;
}
#sidebar .writer-info .image img{
  border-radius:10px;
}
#sidebar .writer-info .info{
  padding:0;
  margin:20px auto 40px;
}
#sidebar .writer-info .info li{
  display:inline-block;
  margin-right:5px;
}
#sidebar .writer-info .info li{
  font-size:30px;
}

#sidebar .toc_widget_list li.active > a {
background: linear-gradient(90deg, #58c6ff 0%, #076ad9 40%, #ff3bef 80%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
#sidebar .toc{
  padding:10px;
  border-radius: 20px;
  display:none;
}
#sidebar .toc{
  position:sticky;
  top:10px;
  background:#fff;
  max-height: 80vh;
  overflow-y: auto;
  box-shadow: 5px 5px 10px #d0d0d0;
}
#sidebar .toc ul{
  padding:0;
}
#sidebar .toc li{
  padding:0;
}
@media (min-width:780px){
  #sidebar .toc{
    display:block;
  }
}


/*TOC*/
#toc_container {
  background: #ffffff !important;
  border: 1px solid #aaa;
  padding: 10px;
  margin-bottom: 40px !important;
  width: 100% !important;
  display: table;
  font-size: 95%;
  border-radius: 20px;
  margin-top:40px;
}
#toc_container ul,
#toc_container ul li,
#toc_container ul li ul,
#toc_container ul li ul li{
  padding:0 !important;
  margin:0 !important;
}
#toc_container .toc_list > li{
  margin: 0 0 20px 0 !important;
}
#toc_container .toc_list > li > a{
  display:block;
  border-bottom: 1px dashed #555;
}
#toc_container .toc_list > li > ul > li{
  margin-left:10px !important;
  margin-top:10px !important;
}



/*****************
page.php
******************/
.page-mv{
  background-image: url(images/ga-bg.webp);
  height: 280px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  background-color: rgb(255 255 255 / 60%);
  background-blend-mode: overlay;
}
.page-mv h2{
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
  width:100%;
  text-align:center;
}
.page-content-wrapper{
  display:flex;
  flex-wrap: wrap;
}
.page-content-wrapper .left,
.page-content-wrapper .right{
  width:100%;
}
@media (min-width:780px){
  .page-content-wrapper .left{
    width:65%;
  }
  .page-content-wrapper .right{
    width:35%;
  }
}


.page-content h2{
  background:linear-gradient(to right, rgba(0, 219, 222, .3) 0%, rgba(252, 0, 255, .3) 100%);
  padding:10px;
  border-radius:20px 0 20px 0;
}
.page-content h3{
  position: relative;
}
.page-content h3:after {
  position: absolute;
  content: " ";
  display: block;
  bottom: 0;
  width:100%;
  height:10px;
  background: linear-gradient(to right, rgba(0, 219, 222, .3) 0%, rgba(252, 0, 255, .3) 100%);
  z-index: -1;
  border-radius:20px;
}

.page-content h4{
  position: relative;
}
.page-content h4:after {
  position: absolute;
  content: " ";
  display: block;
  bottom: 0;
  width:150px;
  height:8px;
  background: linear-gradient(to right, rgba(0, 219, 222, .3) 0%, rgba(252, 0, 255, .3) 100%);
  z-index: -1;
  border-radius:20px;
}
.page-content p{
  margin:40px auto;
}

/*****************
archive.php
******************/
.archive-mv{
  background-image: url(images/ga-bg.webp);
  height: 280px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
  background-color: rgb(255 255 255 / 60%);
  background-blend-mode: overlay;
}
.archive-mv h2{
  position:absolute;
  top:50%;
  left:50%;
  transform: translate(-50%, -50%);
  width:100%;
  text-align:center;
}
.archive-content-wrapper{
  display:flex;
  flex-wrap: wrap;
}
.archive-content-wrapper .left,
.archive-content-wrapper .right{
  width:100%;
}
@media (min-width:780px){
  .archive-content-wrapper .left{
    width:65%;
  }
  .archive-content-wrapper .right{
    width:35%;
  }
}

.archive-content-wrapper .archive-card-wrapper{
  display:flex;
  flex-wrap:wrap;
}
.archive-content-wrapper .archive-card{
  border:1px solid var(--gray);
  margin-bottom:40px;
  padding:20px;
  width:100%;
  border-radius:20px 0 20px 0;
}
.archive-content-wrapper .archive-card .thumb img{
  width:100%;
  height:auto;
}
@media (min-width:780px){
  .archive-content-wrapper .archive-card{
    width:calc((100% - 20px) / 2);
    margin:5px;
  }
}

/*contact*/
.wpcf7{
  width:100%;
}
.wpcf7 input,
.wpcf7 textarea{
  width:100%;
}
.wpcf7 input:not(.wpcf7-submit){
  height: 50px;
  border-radius: 20px;
  border: 1px solid var(--gray);
}
.wpcf7 textarea{
  height: 200px;
  border-radius: 20px;
  border: 1px solid var(--gray);
}
.wpcf7-submit {
  width: 100%;
  max-width: 300px;
  background: var(--main-color);
  font-weight: bold;
  display: block;
  margin: 0 auto;
  border-radius:100px;
  color:#fff;
  padding:20px;
}
.check-box{
  text-align: center;
}
.check-box input[type=checkbox] {
    -moz-transform: scale( .5 , .5 );
    -webkit-transform: scale(.5, .5);
    padding: 10px;
}
@media (min-width: 480px) {
    .check-box input[type=checkbox] {
        -webkit-transform: scale(.5, .5);
    }
}