/* 共通 */


.flex{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-evenly;
}

img{
    width: 100%;
    max-width: 100%;
    object-fit: cover;
}
body{
    background-color: #000 !important;
}


/* content */
　





.movie{
    position: relative;
}
.movie iframe{
  width:78.5%;
  display: block;
  aspect-ratio: 16 / 9;
  position: relative;
  top: 0;
  left: 50%;
  -webkit-transform: translate(-50%,-105%);
  -moz-transform: translate(-50%,-105%);
  transform: translate(-50%,-105%);
}


.btn_x{
  display: none;
}

.bar{
  background-color: #fff;
}






/*.bgーstyle{
  background-image: url(../img/bg.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
  background-attachment: fixed;
  -webkit-overflow-scrolling: touch;
  min-height: 100vh;
}*/


.bgーstyle::before {
  content: "";
  display: block;
  position: fixed;
  top: 0px;
  left: 0px;
  z-index: -1;
  width: 100%;
  height: 100vh;
  background-image:url(../img/bg.jpg);
  /*background-size: cover;*/
  background-repeat: no-repeat;
}


.product{
  margin:0 auto;
  }


.product img{


}
.youtube {
    width: 70%;
    aspect-ratio: 16 / 9;
    margin: 0 auto 10%;
  }



.youtube-bg {
    aspect-ratio: 16 / 9;
    background-image: url(../img/pv.png);
    background-size:cover;
    padding: 12% 0 0 0;
  }

  .youtube iframe {
    width: 100%;
    height: 100%;
  }


.footer-info{
    background-image: url(../img/info_bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 15% 0 5%;
}


.footer-info img{
    width: 70%;
    text-align: center;
    margin:0 auto;
}


@media screen and ( max-width:768px ) { /* SP  ==================== */
    .brand_Logo{
    width:90% !important;
    margin:0 auto;
}

.footer-info img{
    width: 85%;
    text-align: center;
    margin:0 auto;
}



}
.attention{
    width:90%;
    margin:0 auto;
    color: #fff !important;
    text-align: center;
}
.copyright{
    width:90%;
    margin:0 auto;
    color: #fff !important;
    text-align:center;
    margin-top:50px;
}





.t3{margin-top:3%;}
.t-8{margin-top:-8%;}
.t-10{margin-top:-10%;}
.t-12{margin-top:-12%;}
.t-22{margin-top:-22%;}

.r1{margin-right: 1%;}
.r2{margin-right: 2%;}
.r3{margin-right: 3%;}
.r4{margin-right: 4%;}
.r5{margin-right: 5%;}
.r10{margin-right: 10%;}
.r20{margin-right: 20%;}
.r30{margin-right: 30%;}
.r40{margin-right: 40%;}
.left-i {
  margin-left: 11.8%;
}

.l1{margin-left: 1%;}
.l2{margin-left: 2%;}
.l3{margin-left: 3%;}
.l4{margin-left: 4%;}
.l5{margin-left: 5%;}
.l10{margin-left: 10%;}
.l10{margin-left: 10%;}
.l15{margin-left: 15%;}
.l20{margin-left: 20%;}
.l30{margin-left: 30%;}





/**********************************************
                   スペース  
***********************************************/

.mt-5{margin-top:3rem;}
.mt-4{margin-top:2rem;}
.mt-3{margin-top:1rem;}
.mt-2{margin-top:0.5rem;}
.mt-1{margin-top:0.25rem;}

.mb-5{margin-bottom:3rem;}
.mb-4{margin-bottom:2rem;}
.mb-3{margin-bottom:1rem;}
.mb-2{margin-bottom:0.5rem;}
.mb-1{margin-bottom:0.25rem;}

.mr-5{margin-right:3rem;}
.mr-4{margin-right:2rem;}
.mr-3{margin-right:1rem;}
.mr-2{margin-right:0.5rem;}
.mr-1{margin-right:0.25rem;}

.ml-5{margin-left:3rem;}
.ml-4{margin-left:2rem;}
.ml-3{margin-left:1rem;}
.ml-2{margin-left:0.5rem;}
.ml-1{margin-left:0.25rem;}

.my-5{margin:3rem 0;}
.my-4{margin:2rem 0;}
.my-3{margin:1rem 0;}
.my-2{margin:0.5rem 0;}
.my-1{margin:0.25rem 0;}

.mx-5{margin:0 3rem;}
.mx-4{margin:0 2rem;}
.mx-3{margin:0 1rem;}
.mx-2{margin:0 0.5rem;}
.mx-1{margin:0 0.25rem;}


.pt-5{padding-top:3rem;}
.pt-4{padding-top:2rem;}
.pt-3{padding-top:1rem;}
.pt-2{padding-top:0.5rem;}
.pt-1{padding-top:0.25rem;}

.pb-5{padding-bottom:3rem;}
.pb-4{padding-bottom:2rem;}
.pb-3{padding-bottom:1rem;}
.pb-2{padding-bottom:0.5rem;}
.pb-1{padding-bottom:0.25rem;}

.pr-5{padding-right:3rem;}
.pr-4{padding-right:2rem;}
.pr-3{padding-right:1rem;}
.pr-2{padding-right:0.5rem;}
.pr-1{padding-right:0.25rem;}

.pl-5{padding-left:3rem;}
.pl-4{padding-left:2rem;}
.pl-3{padding-left:1rem;}
.pl-2{padding-left:0.5rem;}
.pl-1{padding-left:0.25rem;}

.py-5{padding-top:3rem;padding-bottom:3rem;}
.py-4{padding-top:2rem;padding-bottom:2rem;}
.py-3{padding-top:1rem;padding-bottom:1rem;}
.py-2{padding-top:0.5rem;padding-bottom:.0.5rem;}
.py-1{padding-top:0.25rem;padding-bottom:0.25rem;}

.px-5{padding-left:3rem; padding-right:3rem;}
.px-4{padding-left:2rem; padding-right:2rem;}
.px-3{padding-left:1rem; padding-right:1rem;}
.px-2{padding-left:0.5rem; padding-right:0.5rem;}
.px-1{padding-left:0.25rem; padding-right:0.25rem;}

.p-5{padding:3rem;}
.p-4{padding:2rem;}
.p-3{padding:1rem;}
.p-2{padding:0.5rem;}
.p-1{padding:0.25rem;}

.gap-0{  gap:0rem;}
.gap-1{  gap:0.25rem;}
.gap-2{  gap:0.5rem;}
.gap-3{  gap:1rem;}
.gap-4{  gap:1.5rem;}
.gap-5{  gap:2rem;}


@media screen and (min-width: 768px),print {
  .gap-md-0{  gap:0rem;}
  .gap-md-1{  gap:0.25rem;}
  .gap-md-2{  gap:0.5rem;}
  .gap-md-3{  gap:1rem;}
  .gap-md-4{  gap:1.5rem;}
  .gap-md-5{  gap:2rem;}
}

  @media screen and (min-width: 992px),print {
.gap-lg-0{  gap:0rem;}
.gap-lg-1{  gap:0.25rem;}
.gap-lg-2{  gap:0.5rem;}
.gap-lg-3{  gap:1rem;}
.gap-lg-4{  gap:1.5rem;}
.gap-lg-5{  gap:2rem;}
    

 }



/**********************************************
                   カ ラ ー      
***********************************************/


.bg-gray{ background: #eee;}


.text-Red{color:#ff382e;}
.text-Pink{color:#ff2e58;}
.text-DeepPink{color:#ff1493;}
.text-Hotpink {color:#ff69b4;}
.text-Violet {color:#ee82ee;}
.text-blueviolet {color:#8a2be2 ;}
.text-Purp{color:#b33de6;}
.text-DeepPurple{color:#801fff;}
.text-darkviolet{color:#9400d3;}
.text-plum{color:#dda0dd;}
.text-orchid{color:#da70d6;}
.text-Indigo{color:#3e5ed0;}
.text-Blue{color:#007bff;}
.text-LightBlue{color:#009efa;}
.text-Cyan{color:#20c4d9;}
.text-Teal{color:#2abba8;}
.text-Green{color:#4ad962;}
.text-LightGreen{color:#79de2b;}
.text-Lime{color:#bee22c;}
.text-Yellow{color:#f7e226;}
.text-Amber{color:#f6b213;}
.text-Orange{color:#ff9500;}
.text-DeepOrange{color:#ff4f1a;}
.text-Brown{color:#b07663;}
.text-Grey{color:#9e9e9e;}
.text-LightGrey{color:#efefef;}
.text-BlueGrey{color:#6e96aa;}
.text-black{color:#000000;}
.text-white{color:#ffffff;}

.bg-Red{background-color:#ff382e;}
.bg-Pink{background-color:#ff2e58;}
.bg-DeepPink{background-color:#ff1493;}
.bg-Hotpink {background-color:#ff69b4;}
.bg-Violet {background-color:#ee82ee;}
.bg-blueviolet {background-color:#8a2be2 ;}
.bg-plum{background-color:#dda0dd;}
.bg-orchid{background-color:#da70d6;}
.bg-Purp{background-color:#b33de6;}
.bg-darkviolet{background-color:#9400d3;}
.bg-DeepPurple{background-color:#801fff;}
.bg-Indigo{background-color:#3e5ed0;}
.bg-Blue{background-color:#007bff;}
.bg-LightBlue{background-color:#009efa;}
.bg-Cyan{background-color:#20c4d9;}
.bg-Teal{background-color:#2abba8;}
.bg-Green{background-color:#4ad962;}
.bg-LightGreen{background-color:#79de2b;}
.bg-Lime{background-color:#bee22c;}
.bg-Yellow{background-color:#f7e226;}
.bg-Amber{background-color:#f6b213;}
.bg-Orange{background-color:#ff9500;}
.bg-DeepOrange{background-color:#ff4f1a;}
.bg-Brown{background-color:#b07663;}
.bg-Grey{background-color:#9e9e9e;}
.bg-LightGrey{background-color:#efefef;}
.bg-BlueGrey{background-color:#6e96aa;}
.bg-Black{background-color:#000000;}
.bg-White{background-color:#ffffff;}



/**********************************************
                  width      
***********************************************/

.w-10{width:10%;}
.w-20{width:20%;}
.w-30{width:30%;}
.w-40{width:40%;}
.w-50{width:50%;}
.w-60{width:60%;}
.w-70{width:70%;}
.w-71{width:71%;}
.w-72{width:72%;}
.w-73{width:73%;}
.w-74{width:74%;}
.w-75{width:75%;}
.w-76{width:76%;}
.w-77{width:77%;}
.w-78{width:78%;}
.w-79{width:79%;}
.w-80{width:80%;}
.w-90{width:90%;}
.w-100{width:100%;}
.w-105{width:105%;}

.vw-100{width:100vw;}
.vw-50{width:50vw;}

/**********************************************
                  height     
***********************************************/

.h-10{height:10%;}
.h-20{height:20%;}
.h-30{height:30%;}
.h-40{height:40%;}
.h-50{height:50%;}
.h-60{height:60%;}
.h-70{height:70%;}
.h-80{height:80%;}
.h-90{height:90%;}
.h-100{height:100%;}

.vh-100{height:100vh;}
.vh-90{height:90vh;}
.vh-80{height:80vh;}
.vh-70{height:70vh;}
.vh-60{height:60vh;}
.vh-50{height:50vh;}
.vh-40{height:40vh;}
.vh-30{height:30vh;}
.vh-20{height:20vh;}
.vh-10{height:10vh;}