@charset "utf-8";
body {-webkit-text-size-adjust: none;}
@font-face {font-family: 'font_woff2';font-style: normal;font-weight: 400;src: url('https://use.fontawesome.com/releases/v5.6.4/webfonts/fa-solid-900.woff2') format('woff2');font-display: swap;}
.sp_size {display:none;}
.container-fluid {padding:0;width: 100%;
  overflow:hidden;}
  .sec03,.sec07,.sec09,
  {padding:0 0 80px;}
  .sec00{padding:15px 0 0 0;}
  .contact{padding:60px 0 50px 0;}
  
  h1{margin: 0;}
  h2{font-size: 20px;padding: 10px 0 0px 0;color: #232741;
  }
  .title {
    padding: 10px 0 20px 30px;
    line-height: 30px;
    background: url(warrp.png) no-repeat;
    background-size:19px;
    background-position: 5px 15px;}
    
    .sec03 .container{width: 70%;}
    .company .container{width: 70%;}
    .contact .container{width: 70%;}
    
    a:hover {text-decoration: none;}
    img {width:100%;}
    .text-center {margin-bottom:30px;}
    ul {margin:0;padding:0;list-style: none;}
    
    .sec03 p{font-size: 0.8em;margin-top: 10px;display: block;}
    .sec03 span{font-weight: bold;text-decoration: underline;}
    
    h3 {font-size:28px;font-weight:bold;margin-bottom:20px;}
    h4 {position: relative;margin-bottom:30px;display: inline-block;}
    
    h4:after {content: "";position: absolute;left: 0;bottom: -12px;width: 100%;height: 7px;background: -webkit-repeating-linear-gradient(-45deg, #6ad1c8, #6ad1c8 2px, #fff 2px, #fff 4px);background: repeating-linear-gradient(-45deg, #6ad1c8, #6ad1c8 2px, #fff 2px, #fff 4px);}
    h5 {padding: .25em 0 .5em .75em;border-left: 6px solid #001868;border-bottom: 1px solid #001868;font-size:24px;}
    
    /*よくある質問　ボックス全体ーーーーーーーーーーーーー*/
    .accbox {margin: 2em 0;padding: 0;width: 100%;/*最大幅*/}
    .accbox span{font-weight: bold;text-decoration: underline;}
    .accshow span{font-weight: bold;text-decoration: underline;}
    /*ラベル*/
    .accbox label {
      display: block;
      margin: 1.5px 0;
      padding : 11px 25px;
      color :#fff;
      font-weight: bold;
      background :#0071bc;
      cursor :pointer;
      transition: all 0.5s;
    }
    
    /*ラベルホバー時*/
    .accbox label:hover {
      background :#85baef;
    }
    
    /*チェックは隠す*/
    .accbox input {
      display: none;
    }
    
    /*中身を非表示にしておく*/
    .accbox .accshow {
      height: 0;
      padding: 0;
      overflow: hidden;
      opacity: 0;
      transition: 0.8s;
    }
    
    /*クリックで中身表示*/
    .cssacc:checked + .accshow {
      height: auto;
      padding: 15px 10px 40px 10px;
      background: #eaeaea;
      opacity: 1;
    }
    
    .header .logo{
      padding: 15px 10px 10px 20px;width: 200px;float: left;}
      
      
      .header {padding: 5px 5px 5px 5px;position: fixed;width:100%;z-index:9999;opacity:1;background-color: #fff;}
      .header .container,
      .header .offset-md-4{padding:0 1px 0 0;}
      .header a:hover img  {opacity: 0.8;}
      .header .navi{float: right;width: 50%;margin: 0 0 0 0;text-align: right;}
      
      .cp_navi {
        border-radius: 4px;
        color: #3e3a39;
        display: block;
        margin: 0 0 0 0;
        overflow: hidden;
        width: 90%;
      }
      .cp_navi ul {
        margin: 0;
        padding: 0 20px;
      }
      .cp_navi ul li {
        display: inline-block;
        list-style-type: none;
        -webkit-transition: all 0.2s;
        transition: all 0.2s;
      }
      .cp_navi > ul > li > a > .caret {
        border-top: 4px solid #aaaaaa;
        border-right: 4px solid transparent;
        border-left: 4px solid transparent;
        content: '';
        display: inline-block;
        height: 0;
        width: 0;
        vertical-align: middle;
        -webkit-transition: color 0.1s linear;
        transition: color 0.1s linear;
      }
      .cp_navi > ul > li > a {
        color: #aaaaaa;
        display: block;
        line-height: 56px;
        padding: 0 10px;
        text-decoration: none;
      }
      .cp_navi > ul > li:hover {
        background-color: rgb(218, 60, 65);
      }
      .cp_navi > ul > li:hover > a {
        color: rgb( 255, 255, 255 );
      }
      .cp_navi > ul > li:hover > a > .caret {
        border-top-color: rgb( 255, 255, 255 );
      }
      .cp_navi > ul > li > div {
        background-color: rgb(218, 60, 65);
        border-top: 0;
        border-radius: 0 0 4px 4px;
        box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.055);
        display: none;
        margin: 0;
        opacity: 0;
        position: absolute;
        width: 165px;
        visibility: hidden;
        -webkit-transiton: opacity 0.2s;
        transition: opacity 0.2s;
      }
      .cp_navi > ul > li:hover > div {
        display: block;
        opacity: 1;
        visibility: visible;
      }
      .cp_navi > ul > li > div ul > li {
        display: block;
      }
      .cp_navi > ul > li > div ul > li > a {
        color: #ffffff;
        display: block;
        padding: 12px 24px;
        text-decoration: none;
      }
      .cp_navi > ul > li > div ul > li:hover > a {
        background-color: rgba( 255, 255, 255, 0.1);
      }
      
      
      .sec03 {background:#f5f5f5;}
      
      .sec03_innner {border-radius:10px;background:#fff;border:3px solid #232741;padding:10px 10px; text-align: center;
        margin-right:20px;margin-bottom:26px;box-shadow: 9px 9px #999;position: relative;}
        .sec03_innner img{width: 50%;padding:0;display: block;margin: 0 auto;padding: 20px;}
        .sec03_innner:last-child {margin-right:0;}
        .sec03_innner p{text-align: left;padding: 0 10px}
        
        .cp_card {
          z-index: 2;
          position: relative;
          overflow: visible;
        }
        .cp_ribbon02 {
          width: 106px;
          height: 108px;
          overflow: hidden;
          position: absolute;
          top: -7px;
          left: -6px;
        }
        .cp_ribbon02 .cp_ribbon {
          font-size: 1em;
          line-height: 1.2em;
          position: relative;
          top: 26px;
          left: -33px;
          width: 150px;
          padding: 7px 10px;
          -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
          text-align: center;
          letter-spacing: 0.5px;
          color: #ffffff;
          background-color: #FF9800;
          box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
        }
        .cp_ribbon02 .cp_ribbon::before,.cp_ribbon02 .cp_ribbon::after {
          position: absolute;
          bottom: -4px;
          content: '';
          border-width: 4px 4px 0 4px;
          border-style: solid;
          border-color: #EF6C00 transparent transparent transparent;
        }
        .cp_ribbon02 .cp_ribbon:before {
          left: 0;
        }
        .cp_ribbon02 .cp_ribbon:after {
          right: 0;
        }
        .contact table{
          border-collapse: collapse;
          border-spacing: 0;
          table-layout: fixed;
          width: 100%;
          border:solid 1px #ddd;
          width:100%;margin:0 auto;
        }
        .contact th {
          width:45%;
          text-align: left;
          padding:5px 10px;
          vertical-align: middle;
          border-right:solid 1px #ddd;
          border-left:solid 1px #ddd;
          border-bottom:solid 1px #ddd;
          background-color:#f9f9f9;
        }
        .sec04 {background:#f5f5f5;padding: 80px 0 60px 0;text-align: center;}
        
        
        .button p{line-height: 5px;}
        
        
        .button {
          border-radius:4px;
          display: inline-block;
          width: 250px;
          height: 80px;
          text-align: center;
          text-decoration: none;
          line-height: 54px;
          outline: none;
        }
        .button::before,
        .button::after {
          position: absolute;
          z-index: -1;
          display: block;
          content: '';
          
        }
        .button,
        .button::before,
        .button::after {
          -webkit-box-sizing: border-box;
          -moz-box-sizing: border-box;
          box-sizing: border-box;
          -webkit-transition: all .3s;
          transition: all .3s;
        }
        
        
        
        
        .button {
          position: relative;
          z-index: 2;
          background-color: #232741;
          border: 3px solid #232741;
          color: #232741;
          line-height: 50px;
        }
        .button:hover {
          background-color: #fff;
          border-color: #232741;
          color: #232741;
          font-weight: bold;
        }
        .button::before,
        .button::after {
          left: 0;
          width: 100%;
          height: 50%;
          background-color: #fff;
        }
        .button::before {
          top: 0;
        }
        .button::after {
          bottom: 0;
        }
        .button:hover::before,
        .button:hover::after {
          height: 0;
          background-color: #232741;
        }
        
        .company{width: 100%;
          margin: auto;
          padding: 100px 0 50px 0;
        }
        .dl01{width: 100%;}
        
        .dl01 dt{
          float: left;
          padding: 5px;
        }
        
        .dl01 dd{
          margin-left: 0px;
          border-bottom: 1px dotted #ccc;
          padding: 5px 0 10px 130px;
        }
        
        
        .contact td {width:68%;padding:3px;border-bottom:solid 1px #ddd;}
        .contact th span {margin-right:7px;padding:3px 7px;background:#dc143c;color:#fff;font-size:12px;font-weight:normal;border-radius:5px;}
        .contact th span2 {margin-right:7px;padding:3px 7px;background:#232741;color:#fff;font-size:12px;font-weight:normal;
          border-radius:5px;}
          .contact input[type="text"] {width:100%;border-radius:6px;border:1px solid #ccc;padding:3px 2px;}
          .contact textarea {width:100%;border-radius:6px;border:1px solid #ccc;}
          
          .btn-submit {background:#0071bc;padding:8px 60px;color:#fff;font-size:1em;font-weight:bold;letter-spacing: 0.1em;
            border-radius:6px;border:2px solid #0071bc;display:block;margin-top:30px;}
            .btn-submit:hover {background:#fff;border:2px solid #0071bc;color:#0071bc;text-decoration: none;}
            .btn-before {background:#ccc;padding:8px 60px;font-size:1em;letter-spacing: 0.1em;
              border-radius:6px;border:2px solid #ccc;display:block;margin-top:30px;}
              .btn-before:hover {background:#fff;border:2px solid #ccc;text-decoration: none;}
              
              
              .footer {background:#232741;color:#fff;padding:20px 0 10px 0;}
              .footer p {margin: 10px 0 10px 0;font-size: 15px;}
              .footer-in{width: 70%;borderb-: 2px solid #fff;margin: 0 auto;padding: 10px;;background-color: #232741;}
              .footer-in img{width: 130px;margin-bottom: 10px;}
              .footer .copy {text-align: center;border: 2px solid #000;background:#fff;color:#000;padding:0px 0;}
              .footer　.container{width: 100%;}
              .copy_og{text-align: center;background:#232741;color:#fff;padding:0px 0;}
              .copy_og p{margin: 1px 0 1px 0;font-size: 10px;}
              .footer a{color: #fff;text-decoration: underline;}
              .footer-box{background:#232741;text-align: center;}
              .footer td{padding-left: 10px;line-height: 1em;}
              .thanks{margin: 200px 0 100px 0;}
              
              .in-pp{margin: auto;width: 70%;margin-bottom: 100px;}
              .in-pp h1{text-align: center;margin: 50px;}
              .in-pp h2{
                background: transparent;
                padding: .2em .5em;
                margin: 40px 10px 10px 5px;
                color: #000;
                font-size: 20px;
                font-weight: bold;
                border-left: .2083em solid #2196F3;
                text-align: left;
              }
              
              
              .relative {
                position: relative;
                width: 100%;
              }
              
              .t0 {
                position: absolute;
                top: 2%;
                left: 0;
                right: 36%;
                bottom: 0;
                margin: auto;
                width: 3%;
                z-index: 10;
              }
              
              .t1 {
                position: absolute;
                top: 47.5%;
                left: 3%;
                right: 0%;
                bottom: 0;
                margin: 0 auto;
                width: 35%;
                z-index: 20;
                max-width: 700px;
              }
              
              .t2 {
                position: absolute;
                top: 25%;
                left: 0;
                right: 0;
                bottom: 0;
                margin: auto;
                width: 45%;
                z-index: 40;
              }
              
              .t3 {
                position: absolute;
                top: -70%;
                left: 0;
                right: 82%;
                bottom: 0;
                margin: auto;
                width: 15%;
                z-index: 20;
              }
              .contact-title {font-size:20px;font-weight:bold;}
              .thanks{text-align: center;}
              
              
              
              
              
              @media screen and (max-width: 768px) {
                .sp_size {display:inline;}
                .pc_size {display:none;}
                
                .contact{padding: 50px 0 50px 0;}
                .company{width: 100%;
                  margin: auto;
                  padding: 50px 0 50px 0;
                }
                .header{position: fixed;padding: 5px 0 5px 5px;}
                .header .logo{padding: 10px 10px 10px 10px;width: 150px;float: left;}
                
                h2 {font-size:15px;padding:5px 0;margin-bottom:16px;}
                h3 {font-size:18px;}
                h4 {font-size:20px;}
                h5 {font-size:20px;}
                h6 {font-size:20px;}
                .contact-title {font-size:20px;font-weight:bold;}
                
                
                
                .sec03 h2{font-size: 20px;}
                .company h2{font-size: 20px;}
                .contact h2{font-size: 20px;
                }
                
                
                .title {
                  padding: 30px 0 10px 25px;
                  line-height: 10px;
                  background: url(warrp.png) no-repeat;
                  background-size:18px;
                  background-position: 0px 26px;}
                  
                  
                  
                  .sec03 .container{width: 90%;}
                  .company .container{width: 90%;}
                  .contact .container{width: 90%;}
                  
                  
                  /*よくある質問　ボックス全体ーーーーーーーーーーーーー*/
                  .accbox {
                    margin: 0 0 30px 0;
                    padding: 0;
                    width: 100%;/*最大幅*/
                  }
                  
                  /*ラベル*/
                  .accbox label {
                    display: block;
                    margin: 1px;
                    padding : 11px 25px;
                    color :#fff;
                    font-weight: bold;
                    background :#0071bc;
                    cursor :pointer;
                    transition: all 0.5s;
                  }
                  
                  /*ラベルホバー時*/
                  .accbox label:hover {
                    background :#85baef;
                  }
                  
                  /*チェックは隠す*/
                  .accbox input {
                    display: none;
                  }
                  
                  /*中身を非表示にしておく*/
                  .accbox .accshow {
                    height: 0;
                    padding: 0;
                    overflow: hidden;
                    opacity: 0;
                    transition: 0.8s;
                  }
                  
                  /*クリックで中身表示*/
                  .cssacc:checked + .accshow {
                    height: auto;
                    padding: 15px 10px 40px 10px;
                    background: #eaeaea;
                    opacity: 1;
                  }
                  
                  
                  
                  
                  
                  .sec00 {padding-top:0;}
                  
                  .sec03_innner {text-align: center;;margin-right:0;margin-bottom:20px;padding: 0}
                  .sec03_innner img{width: 40%;margin-bottom: 0px;padding: 20px;}
                  .sec03_innner p{text-align: left;padding: 0 10px}
                  .text-center p {margin: 1px 0 1px 0;font-size: 0.9em;text-align: left;}
                  .text-center2 p {margin: 1px 0 10px 0;font-size: 12px;text-align: center;color: red;}
                  .contact table {width:100%;}
                  .contact th {width:100%;display:block;padding:8px 12px;}
                  .contact td {width:100%;display:block;}
                  .contact th span {margin-left:8px;padding:3px 12px;font-size:12px;border-radius:5px;}
                  .contact th span2 {margin-left:8px;padding:3px 12px;font-size:12px;border-radius:5px;}
                  
                  .btn-submit {padding:4px 30px;}
                  
                  
                  .dl01{width: 100%;}
                  
                  .dl01 dt{
                    float: left;
                    padding: 5px;
                  }
                  
                  .dl01 dd{
                    margin-left: 0px;
                    border-bottom: 1px dotted #ccc;
                    padding: 5px 0 10px 75px;
                  }
                  
                  
                  
                  .footer {background:#232741;color:#fff;padding:10px 0;}
                  .footer p {margin: 10px 0 10px 0;font-size: 15px;}
                  .footer-in{width: 90%;borderb-: 2px solid #fff;margin: 0 auto;padding: 10px;;background-color: #232741;}
                  .footer-in img{width: 130px;margin: 0 0 15px 7px;}
                  .footer .copy {text-align: center;background:#fff;padding:0px 0;}
                  .footer　.container{width: 100%;}
                  .copy_og{text-align: center;background:#232741;color:#fff;padding:0px 0;}
                  .copy_og p{font-size: 10px;}
                  .footer-box{background:#232741;text-align: center;}
                  .footer-box a{font-size: 11px;}
                  
                  .in-pp{margin: auto;width: 95%;}
                  .in-pp h1{text-align: center;margin: 40px;font-size: 25px;}
                  
                  
                  .t0 {
                    position: absolute;
                    top: 2%;
                    left: 0;
                    right: 61%;
                    bottom: 0;
                    margin: auto;
                    width: 5%;
                    z-index: 10;
                  }
                  
                  .t1 {
                    position: absolute;
                    top: 45%;
                    left: 0;
                    right: 0%;
                    bottom: 0;
                    margin: 0 auto;
                    width: 90%;
                    z-index: 20;
                    max-width: 800px;
                  }
                  
                  .t2 {
                    position: absolute;
                    top: 15%;
                    left: 0;
                    right: 0;
                    bottom: 0;
                    margin: auto;
                    width: 70%;
                    z-index: 40;
                  }
                  
                  .t3 {
                    position: absolute;
                    top: -70%;
                    left: 0;
                    right: 82%;
                    bottom: 0;
                    margin: auto;
                    width: 15%;
                    z-index: 20;
                  }
                  
                  
                  
                  
                  
                }/*@media screen and (max-width: 768px)終わりー*/
                
                /* メニュー */
                *, *:before, *:after {
                  padding: 0;
                  margin: 0;
                  box-sizing: border-box;
                }
                
                ol, ul {
                  list-style: none;
                }
                
                a {
                  text-decoration: none;
                  color: inherit;
                }
                .cp_cont {
                  height: 65vh;
                }
                .cp_offcm01 {
                  position: absolute;
                  top: -3px;
                  right: 20px;
                  display: inline-block;
                }
                /* menu */
                .cp_offcm01 .cp_menu {
                  position: fixed;
                  top: 0;
                  right: -100vw;
                  width: 250px;
                  height: 100%;
                  cursor: pointer;
                  -webkit-transition: 0.53s transform;
                  transition: 0.53s transform;
                  -webkit-transition-timing-function: cubic-bezier(.38,.52,.23,.99);
                  transition-timing-function: cubic-bezier(.38,.52,.23,.99);
                  background-color: #607D8B;
                  opacity: 0.8;
                }
                .cp_offcm01 .cp_menu ul {
                  margin: 0;
                  padding: 0;
                }
                .cp_offcm01 .cp_menu li {
                  list-style: none;
                }
                .cp_offcm01 .cp_menu li a {
                  display: block;
                  padding: 20px;
                  text-decoration: none;
                  color: #ffffff;
                  border-bottom: 1px solid #ffffff;
                }
                
                .cp_offcm01 #cp_toggle01 {
                  position: absolute;
                  display: none;
                  opacity: 0;
                }
                .cp_offcm01 #cp_toggle01:checked ~ .cp_menu {
                  -webkit-transform: translateX(-100vw);
                  transform: translateX(-100vw);
                }
                /* menu toggle */
                .cp_offcm01 #cp_toggle01 ~ label {
                  display: block;
                  padding: 0.5em;
                  cursor: pointer;
                  -webkit-transition: 0.5s transform;
                  transition: 0.5s transform;
                  -webkit-transition-timing-function: cubic-bezier(.61,-0.38,.37,1.27);
                  transition-timing-function: cubic-bezier(.61,-0.38,.37,1.27);
                  text-align: center;
                  color: #333333;
                }
                .cp_offcm01 #cp_toggle01:checked ~ label {
                  -webkit-transform: translateX(-250px);
                  transform: translateX(-250px);
                }
                .cp_offcm01 #cp_toggle01 ~ label::before {
                  font-family:"Font Awesome 5 Free";
                  content: '\f0c9';
                  font-weight: 900;
                  font-size: 2em
                }
                .cp_offcm01 #cp_toggle01:checked ~ label::before {
                  content: '\f00d';
                }
                /* contents */
                .cp_contents {
                  color: #333333;
                  text-align: center;
                }
                
                /* メニュー終わり */
                
                
                
                
                
                .js-animation {
                  opacity: 0;
                  visibility: hidden;
                  : 1;
                  transform: translateY(30px);
                  transition: all 0.8s;
                  transition-delay:30ms;/*表示タイミング*/
                  0% {-webkit-transform:translate(0, 0) rotate(-1deg);}
                  50% {-webkit-transform:translate(0, -1px) rotate(0deg);}
                  100% {-webkit-transform:translate(0, 0)rotate(1deg);}
                }
                
                .left {transform: translate3d(-2%, 0, 0);}
                .right {transform: translate3d(2%, 0, 0);}
                .top {transform: translate3d(0, -20%, 0);}
                .delay {transition: all 2s ease;}
                .fast {transition: all 0.8 ease;}
                
                
                .js-animation.is-show {
                  opacity: 1;
                  visibility: visible;
                  transform: translateY(0px);
                }
                
                .poyon {animation: poyon 1.1s linear 0s 1;}
                @keyframes poyon {
                  0%   { transform: scale(0.8, 1.4) translate(0%, -100%); }
                  10%  { transform: scale(0.8, 1.4) translate(0%, -15%); }
                  20%  { transform: scale(1.4, 0.6) translate(0%, 30%); }
                  30%  { transform: scale(0.9, 1.1) translate(0%, -10%); }
                  40%  { transform: scale(0.95, 1.2) translate(0%, -30%); }
                  50%  { transform: scale(0.95, 1.2) translate(0%, -10%); }
                  60%  { transform: scale(1.1, 0.9) translate(0%, 5%); }
                  70%  { transform: scale(1.0, 1.0) translate(0%, 0%); }
                  100% { transform: scale(1.0, 1.0) translate(0%, 0%); }
                }
                
                .yure {animation: yure 2.5s ease infinite;}
                @keyframes yure {
                  0% {transform: translate(0px, 0px) rotateZ(0deg)}
                  20%  {transform: translate(0px, 0px) rotateZ(0deg)}
                  30%  {transform: translate(0px, 0px) rotateZ(0deg)}
                  40%  {transform: translate(0px, 0px) rotateZ(0deg)}
                  50%  {transform: translate(0px, 0px) rotateZ(0deg)}
                  60%  {transform: translate(-1px, 1px) rotateZ(-5deg)}
                  70%  {transform: translate(0px, 0px) rotateZ(0deg)}
                  80% {transform: translate(0px, 0px) rotateZ(0deg)}
                  90% {transform: translate(-1px, 1px) rotateZ(-5deg)}
                  100% {transform: translate(0px, 0px) rotateZ(0deg)}
                }
                
                .kira {animation: kira 2s ease infinite;}
                @keyframes kira {
                  0% {transform: translate(0px, 0px) rotateZ(0deg)}
                  20%  {transform: translate(0px, 0px) rotateZ(0deg)}
                  30%  {transform: translate(0px, 0px) rotateZ(0deg)}
                  40%  {transform: translate(0px, 0px) rotateZ(0deg)}
                  50%  {transform: translate(0px, 0px) rotateZ(0deg)}
                  60%  {transform: translate(-1px, 1px) rotateZ(5deg)}
                  70%  {transform: translate(0px, 0px) rotateZ(0deg)}
                  80% {transform: translate(0px, 0px) rotateZ(0deg)}
                  90% {transform: translate(-1px, 1px) rotateZ(5deg)}
                  100% {transform: translate(0px, 0px) rotateZ(0deg)}
                }
                
                .fluffy2 {animation: fluffy2 2.8s linear 0s 1;}
                @keyframes fluffy2 {
                  0% { transform:scale(1) }
                  50% { transform:scale(1.08) }
                  100% { transform:scale(1) }
                }
                
                
                .fluffy3 {animation: fluffy3 1.7s ease infinite;}
                @keyframes fluffy3 {
                  0% { transform:translateY(0) }
                  5% { transform:translateY(0) }
                  10% { transform:translateY(0) }
                  20% { transform:translateY(-3px) }
                  25% { transform:translateY(0) }
                  30% { transform:translateY(-3px) }
                  50% { transform:translateY(0) }
                  100% { transform:translateY(0) }
                }
                
                #particles-js{
                  position: fixed;
                  width: 100%;
                  height: 100%;
                  z-index: 1;
                }