[mn="3000"] {
    padding: 30px 0
 }
 [mn="3000"] .linkbx {
   margin: 30px 0 0;
 }
 [mn="3000"] .subttl {
   font-family: var(--ft-t1);
   font-size: 80%;
   margin: 0 0 6px
 }
 [mn="3000"] .title .htag {
   font-size: 350%;
   font-family: var(--ft-t2);
   color: var(--clr01)
 }
 [mn="3000"] .slidedtbx {
   margin: auto 0 0;
 }
 [mn="3000"] .slidew {
    width: calc(100% - 500px);
    height: calc(6 / 16 * 100vw);
    min-height: 600px;
    background-color: var(--clr01);
 }
 [mn="3000"] .slideImgbx {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
    height: 100%;
    display: flex;
    overflow: hidden;
 }
 [mn="3000"] .slideImg {
  position: absolute;
    width: 100%;
    height: 100%; 
    display: block;
    transition: 4s all cubic-bezier(0, 0, 0.2, 1);
    opacity: 0;
    scale: 1.5;
    translate: 20px 20px;
    transform-origin: center;
    pointer-events: none;
 }
 [mn="3000"] .slideImg.active {
    opacity: 1;
    scale: 1;
    translate: 0 0;
    pointer-events: all
 }
 [mn="3000"] .msgbx {
   --square: 45px;
   --w: 420px;
   --h: 400px; 
    margin: 0 0 60px;
    translate: -50% 0
 }
 [mn="3000"] .msgw { 
    height: var(--h);
    width: var(--w);
    background-color: #fff;
    line-height: 1;
 } 
 [mn="3000"] .msg- {
    height: calc( var(--h) - 100px);
    width: calc( var(--w) - 100px);
    max-width: 100%;
 }
 [mn="3000"] [slidedot]:after,
 [mn="3000"] [slidedot]:after {
   content: '';
   display: block;
   width: 0;
   height: 0;
   background-color: #000;
   top: 50%;
   left: 50%;
   position: absolute;
   translate: -50% -50%;
   border-radius: 50%;
   transition: .3s all ease;
 }
 [mn="3000"] [slidedot]:hover:after,
 [mn="3000"] [slidedot].active:after {
   width: var(--actsquare);
   height: var(--actsquare);
 }
 [mn="3000"] [slidedot] {
   --square: 6px;
   --actsquare: 12px;
   width: var(--square);
    height: var(--square);
    background-color: #ccc;
    border-radius: 50%;
    display: inline-flex;
    cursor: pointer;
    margin: 0 9px 0 0;
    position: relative;
 }
 [mn="3000"] [slidebtn] { 
    border: 0;
    padding: 12px;
    background-color: #000;
    width: var(--square);
    height: var(--square);
    display: inline-flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: .6s all cubic-bezier(0.075, 0.82, 0.165, 1);
 }
 [mn="3000"] [slidebtn]:hover { 
    background-color: var(--clr01);
 }
 [mn="3000"] [slidebtn="r"] {
   margin: 0 0 0 1px;
 }
 [mn="3000"] [slidebtn] path {
   fill: #fff 
 }
 [mn="3000"] [backimg] {
   position: absolute;
   left: 0;
   top: 0;
   height: calc(100% - var(--square));
   background-color: #ccc;
   display: block;
   width: 100%;
   z-index: -1;
   translate: -100% 0;
   transition: .6s all cubic-bezier(0.6, 0.6, 0.17, 1);
 }
 [mn="3000"] ._content {
   line-height: 1.6;
   color: #aaa
 }

 @media only screen and (max-width: 991px) { 
  [mn="3000"] .slideOut {
    display: none;
  }
  [mn="3000"] .slidew {
    width: calc(100% - 250px)
  }
 }

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

  [mn="3000"] {
    background-color: red;
    padding: 0;
  }
  [mn="3000"] .slidew {
    width: 100%
  }
  [mn="3000"] .slideImgbx{
    position: relative; 
    width: 100vw;
    height: calc(6 / 9 * 100vw); 
  }
  [mn="3000"] .slidew {
    background-color: #fff;
    height: auto;
    min-height: auto
  }
  [mn="3000"] .msgbx {
    width: calc(100% - 60px);
    margin: -100px auto 0;
    translate: 0;
    max-width: 400px;
    border-bottom: 1px solid #ccc;
  }
  [mn="3000"] .msgw {
    width: 100%;
    padding: 35px 25px 35px;
    height: auto;
  }
  [mn="3000"] .msg- {
    height: auto;
  }
  [mn="3000"] .title .htag {
    font-size: 300%
  }
  [mn="3000"] .slidedtbx {
    margin: 30px 0 0;
  }
 }