@font-face {
    font-family: 'Pretendard';
    src: url('https://cdn.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-SemiBold.woff') format('woff');
    font-weight: 700;
    font-style: SemiBold;
}


body {
  box-sizing: border-box;
  width:100vw;
  height: 100vh;
  background:#009CEA;
  color: white;
  font-family: 'Pretendard' ;
  font-size: 19px;
  letter-spacing: 0;
  word-spacing: 0;
  line-height: 1.6;
  word-break: keep-all;
  margin: 0px;
  padding: 0px;
  display: flex;
}


.wave::-webkit-scrollbar{
    display: none; 
}


.wave{
  display: flex;
  width: 100vw;
  height: 100vh;
  min-height: 600px;
  overflow-x: scroll;
  scroll-snap-type: x mandatory;


}

.container{
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 100vw;
  scroll-snap-align: start;
}



h1{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 600px;
  padding: 40px 360px;
  text-align: left;
  font-size: 22x;

}



@keyframes blink-effect {
  50% {
    opacity: 0;
  }
}

span1{
  text-shadow:1px 1px 10px #fff, 1px 1px 10px #ccc;
  animation: blink-effect 1s step-end infinite;
}

.container2{
  background: linear-gradient(90deg, deepskyblue, white, beige,  #D9C6BA,  #D9C6BA);
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 1200px;
  padding: 70px 300px;
  scroll-snap-align: start;
}

.container3{
  display: flex;
  background: linear-gradient(90deg, #009CEA, deepskyblue, deepskyblue );
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 100vw;
  scroll-snap-align: start;
}

.container4{
  display: flex;
  background: deepskyblue;
  justify-content: center;
  align-items: center;
  text-align: center;
  width: 100vw;
  scroll-snap-align: start;
}

span{
  color: white;
  background: linear-gradient(180deg,deepskyblue, deepskyblue, ghostwhite );
  border-radius: 40px; 
  border-bottom: 8.5px solid transparent;
}

span:hover {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg id='squiggle-link' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:ev='http://www.w3.org/2001/xml-events' viewBox='0 0 20 4'%3E%3Cstyle type='text/css'%3E.squiggle{animation:shift .3s linear infinite;}@keyframes shift {from {transform:translateX(0);}to {transform:translateX(-20px);}}%3C/style%3E%3Cpath fill='none' stroke='ghostwhite' stroke-width='3' class='squiggle' d='M0,3.5 c 5,0,5,-3,10,-3 s 5,3,10,3 c 5,0,5,-3,10,-3 s 5,3,10,3'/%3E%3C/svg%3E");
  background-position: bottom;
  background-repeat: repeat-x;
  background-size: 20%;
  border-bottom: 0;
  padding-bottom: .3rem;
  text-decoration: none;
}



a, a:link, a:visited{
  text-decoration: none;
  justify-content: center;
  align-items: center;
  width: 420px;
  height: 60px;
  font-size: 18px;
}

.button{
  position: fixed;
  right: 26px;
  bottom: 20px;
  
}

span1{
  font-size: 120px
}