@charset "UTF-8";

body{
    font-family: 'Noto Sans KR', sans-serif;
    margin:0;
}

header{position:fixed; z-index:999;left:0;right:0; padding:0px 0; 
    background-color: gray;background-color:rgba(10,10,10,0.8);}
header .logo{float:left;}
header nav {float:right;}
header nav ul{float:left; list-style: none;}
header nav ul li{float:left;  margin-right: 60px}
header nav ul li a{line-height: 56px; font-size:18px; text-decoration:none; color:#fff;}



header .logo a{width:420px; height: 58px; background:url("../images/logogo.png") no-repeat;display:block; text-indent: -9999em;}
.container nav ul li.on a { color:#ffeb46; font-weight:bold;}
.container{width:1170px; margin:0 auto;}



.slideshow {
    background:#000;
    height:200px;
    
    min-width:960px;
    overflow:hidden;
    position:relative;
}
.slideshow_slides {
    position:absolute;
    width:100%;
    height: 100%;
}
.slideshow_slides a {
    position: absolute;
    width:100%;
    height: 100%;
    text-align:center; 
}

.slideshow_slides img {
    width: 100%;
    height: auto;
    background-repeat: no-repeat;
    background-position: center top;
    background-size: cover;
}

.slideshow_nav a {
 width:71px;
 height: 71px;
 position:absolute; 
 left:50%;
 top:50%;
 transform:translateY(180%);
 background:url(../images/sprites.png) no-repeat;
 text-indent: -9999em;
}

.slideshow_nav a.disabled{display:none;}

.slideshow_nav a.prev{
    background-position: 0 -20px;
    margin-left:-510px;
}

.slideshow_nav a.next{
    background-position: -81px -20px;
    margin-left:439px;
}

.title{
    position: absolute;
    
    font-family: 'Nanum Brush Script', cursive;
    z-index: 100;
    font-size: 6.2vw;
    font-weight: bold;
    left:26%;
    top:18%;
    color:#ffc800;
    line-height: 3.8vw;
    text-shadow: 5px 10px 5px black;
}


.indicator {
    position:absolute;
    bottom:20px;
    left:0;
    right:0;
    display:flex;
    justify-content:center;
}
.indicator a {
    width:8px;
    height:8px;
    margin:0 10px;
    background:url(../images/sprites.png) no-repeat -114px -4px;
    text-indent:-999em;
}
.indicator a.active {
    background-position: -134 -4px;
    transform: scale(1.3,1.3);
   
}


@media all and (min-width:280px){
    
   
    .slideshow {
        background:#000;
        top :0;
        left:0;
      
        width:100%;
        height:100%;
        overflow:hidden;
        position: absolute;
    }
    .slideshow_slides img {
        width: 100%;
        max-width:100%;
        height: 100%;
        background-repeat: no-repeat;
        background-position: center top;
        background-size: cover;
    }
    .indicator {
        position:absolute;
        bottom:20px;
        left:0;
        right:0;
        display:flex;
        justify-content:center;
    }

    .slideshow_nav a.prev{
        margin-left:-480px;
    }
    
    .slideshow_nav a.next{
        margin-left:409px;
    }

    .contents{
        width:100%;
        height: 100%;
        position: absolute;
        top:100%;
        background: #414345;
    }
    
    .frist{
        position:absolute;
        top:-100%;
       
    }

    .service{
        position: relative;
        width: 100%;
        height: 54vw;
        overflow: hidden;
        background:black;
      
        
    
    
    }
    .service img{
        position:absolute;
        opacity: 0;
        z-index: 99;
       
      
    }
    #servicebackground{
        position: absolute;
        width: 100%;
        height: 100%;
        opacity: 0.2;
    }

    #mainCar.animate{
        width: 32%;
        height: auto;
        left:34%;
        top:42%;
        transform: scale(1.1);
    }
    #rotationLeft{
        position: absolute;
        left:32%;
        top: 45%;
        width: 10%;
        height: auto;
    }

    #rotationLeft.rotation{
        opacity: 1;
        position: absolute;
        left:33%;
        top: 46%;
        width: 8%;
        height: auto;
    }
    #rotationRight{
        opacity: 0;
        position: absolute;
        left:56%;
        top: 55%;
        width: 10%;
        height: auto;
    }
    #rotationRight.rotation{
        opacity: 1;
        position: absolute;
        left:57%;
        top: 57%;
        width: 8%;
        height: auto;
    }
    #customer{position:absolute;width:100%;height:250%;background:black;}

    #customerBox{
        position: absolute;
        left:15%;
        width:70%;
        height:100%;
        background:black;
    }
    #customersubtext{
        position: absolute;
        top:3%;
        left:76%;
        font-size: 2.5vw;
        color: white;
        font-family: 'Do Hyeon', sans-serif;
       
    }
    #backimg{
        opacity: 0.2;
        width:100%;
        height:100%;
    }
    #customerBox h2{
        position: absolute;
        font-family: 'Noto Sans KR', sans-serif;
        font-style: italic;
        text-decoration: underline;
        text-underline-position: under;
        left:7%;
        top:1%;
        color:#ffc800 ;
        font-size: 3em;
    }
    .customerUseBox{
        position: absolute;
        width:40%;
        height:19%;
        
        
        
    }
    .customerUseBox img{
        position: absolute;
        width:100%;
        height:70%;
        
        
    }
    .customerUseBox P{
        position: absolute;
        top:70%;
        width:100%;
        height:30%;
        font-size: 1.3vw;
        text-indent: 3%;
        color: rgb(153, 153, 153);
        font-family: 'Do Hyeon', sans-serif;
        
        
    }
    #logoimgbox{
        position: absolute;
        top:83%;
        left:54%;
        width:38%;
        height:5%;
        
    }
    #logoimgbox img{
        width:100%;
        height: 100%;
    }
    .introduce{
        position: absolute;
        top:350%;
       background:linear-gradient(#000000,#414345);
       width:100%;
       height: 54vw;
      
    }
    .animate{
        animation:fadeIn 1s forwards ease-in;
        transition:1.8s ease-in-out;
    }
    .rotation{
        box-sizing: border-box;
        animation:rotation 1.5s;
        animation-delay: 0.05s;
        animation-iteration-count: infinite;
        animation-timing-function: linear;
      
    }
    #servicetexttitle{
        opacity: 0;
        position: absolute;

        font-family: 'Nanum Brush Script', cursive;
        z-index: 100;
        font-size: 6.2vw;
        font-weight: bold;
        left:10%;
        top:16%;
        color:#ffc800;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }

    #servicetexttitle.animate{
        opacity: 1;
        position: absolute;

        font-family: 'Nanum Brush Script', cursive;
        z-index: 100;
        font-size: 6.2vw;
        font-weight: bold;
        left:12%;
        top:16%;
        color:#ffc800;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }
    #servicetexttitleb{
        opacity: 0;
        position: absolute;

        font-family: 'Nanum Brush Script', cursive;
        z-index: 100;
        font-size: 6.2vw;
        font-weight: bold;
        left:73%;
        top:16%;
        color:#ffc800;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }

    #servicetexttitleb.animate{
        opacity: 1;
        position: absolute;

        font-family: 'Nanum Brush Script', cursive;
        z-index: 100;
        font-size: 6.2vw;
        font-weight: bold;
        left:75%;
        top:16%;
        color:#ffc800;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }
    #servicetexta{
        opacity: 0;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        z-index: 100;
        font-size: 2.2vw;
        left:9%;
        top:32%;
        color:white;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }
    #servicetexta.animate{
        opacity: 1;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        z-index: 100;
        font-size: 2.2vw;
        left:11%;
        top:32%;
        color:white;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }
    #servicetextb{
        opacity: 0;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        z-index: 100;
        font-size: 2.2vw;
        left:9%;
        top:38%;
        color:white;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }
    #servicetextb.animate{
        opacity: 1;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        z-index: 100;
        font-size: 2.2vw;
        left:11%;
        top:38%;
        color:white;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }
    #servicetextc{
        opacity: 0;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        z-index: 100;
        font-size: 2.2vw;
        left:9%;
        top:44%;
        color:white;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }
    #servicetextc.animate{
        opacity: 1;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        z-index: 100;
        font-size: 2.2vw;
        left:11%;
        top:44%;
        color:white;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }
    #servicetextd{
        opacity: 0;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        z-index: 100;
        font-size: 2.2vw;
        left:9%;
        top:50%;
        color:white;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }
    #servicetextd.animate{
        opacity: 1;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        z-index: 100;
        font-size: 2.2vw;
        left:11%;
        top:50%;
        color:white;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }
    #servicetexte{
        opacity: 0;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        z-index: 100;
        font-size: 2.2vw;
        left:9%;
        top:56%;
        color:white;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }
    #servicetexte.animate{
        opacity: 1;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        z-index: 100;
        font-size: 2.2vw;
        left:11%;
        top:56%;
        color:white;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }

    #serviceRighttexta{
        opacity: 0;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        z-index: 100;
        font-size: 2.2vw;
        left:72%;
        top:32%;
        color:white;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }
    #serviceRighttexta.animate{
        opacity: 1;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        z-index: 100;
        font-size: 2.2vw;
        left:74%;
        top:32%;
        color:white;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }

    #serviceRighttextb{
        opacity: 0;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        z-index: 100;
        font-size: 2.2vw;
        left:72%;
        top:38%;
        color:white;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }
    #serviceRighttextb.animate{
        opacity: 1;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        z-index: 100;
        font-size: 2.2vw;
        left:74%;
        top:38%;
        color:white;
        line-height: 3.8vw;
        text-shadow: 5px 10px 5px black;
    }
   
    #fatherworking{
        opacity: 0;
        position: absolute;
        left:60%;
        top: 59%;
        width: 40%;
        height: 40%;
        
    }

    #fatherworking.animate{
        opacity: 1;
        position: absolute;
        left:61%;
        top: 59%;
        width: 40%;
        height: 40%;
       
    }

    #lightspray{
        opacity: 0;
        position: absolute;
        left:0%;
        top: 59%;
        width: 40%;
        height: 40%;
    }

    #lightspray.animate{
        opacity: 1;
        position: absolute;
        left:-0.5%;
        top: 59%;
        width: 40%;
        height: 40%;
    }

    #lights{
        opacity: 0;
        position: absolute;
        left:0%;
        top: 23%;
        width: 36%;
        height: 36%;
    }

    #lights.animate{
        opacity: 1;
        position: absolute;
        left:-0.5%;
        top: 23%;
        width: 36%;
        height: 36%;
    }

    #backmirrors{
        opacity: 0;
        position: absolute;
        left:64%;
        top: 24%;
        width: 35%;
        height: 35%;
    }

    #backmirrors.animate{
        opacity: 1;
        position: absolute;
        left:65%;
        top: 24%;
        width: 35%;
        height: 35%;
    }

    #divleft{
        opacity: 0;
        position: absolute;
        top:27%;
        left:6%;
        width:27%;
        height:44%;
        display:none;
        z-index: 999;
    }

    #divleft.animate{
        opacity: 1;
        position: absolute;
        top:27%;
        left:6%;
        width:27%;
        height:44%;
        display:block;
        z-index: 999;
        
    }

    #divright{
        opacity: 0;
        position: absolute;
        top:24%;
        left:66%;
        width:27%;
        height:44%;
        display:none;
       
      
        z-index: 999;
    }
    
    #divright.animate{
        opacity: 1;
        position: absolute;
        top:24%;
        left:66%;
        width:27%;
        height:44%;
        display:block;
       
       
      
        z-index: 999;
    }
    
    #introduceBackground{
        width: 100%;
        height: 100%;
        opacity: 0.1;
    }

    #imgbox{
        position: absolute;
        left:0;
        top:0;
        width: 17%;
        height: 100%;
        background:url("../images/darktrees.png") no-repeat;
        background-size: 600%;
        animation : imgmove 120s linear infinite;
    }

    @keyframes imgmove {
        0%{
            background-position: 0% 100%;
        }

        50%{
            background-position: 50% 0%;
        }
        100%{
            background-position: 0% 100%;
        }
    }

    #imgbox2{
        position: absolute;
        left:83%;
        top:0;
        width: 17%;
        height: 100%;
        background:url("../images/darktrees.png") no-repeat;
        background-position: right;
        background-size: 600%;
        animation : imgmove2 120s linear infinite;
    }
    @keyframes imgmove2 {
        0%{
            background-position: 100% 0%;
        }
        50%{
            background-position: 0% 50%;
        }
        100%{
            background-position: 100% 0%;
        }
    }

    #map{
      
        left:21.8%;
        top :-65%;
        width:56%;
        height: 54%;
        background: wheat;
        box-shadow: 0 20px 50px rgba(0,0,0,.5);
        border-style:solid ;
        border-color: gray;
        border-width:6px;
    }

   

    #inquiry{
        position: absolute;
        top:12%;
        left:8%;
        font-family: 'East Sea Dokdo', cursive;
        color: black;
        font-size: 6vw;
    }

    #direction{
        position: absolute;
        top:22%;
        left:3%;
        font-family: 'East Sea Dokdo', cursive;
        color: black;
        font-size: 6vw;
    }

    #handphone{
        position: absolute;
        top:12%;
        left:24.5%;
        font-family: 'Do Hyeon', sans-serif;
        color:#ffc800;
        font-size: 2.5vw;
        text-shadow: 0 20px 50px rgba(0,0,0,.5);
        
        
    }

    .butiful.ani{
       
        font-size: 2.7vw;
        background-image:linear-gradient(to right,#FDC830,#f7b733,#F7971E,#fceabb);
        text-transform: uppercase;
        -webkit-text-fill-color:transparent;
        -webkit-background-clip:text;
        text-shadow: 0 20px 50px rgba(0,0,0,.5);
        animation : horiz 3s linear infinite;
        background-size: 400%;
        transition:0.6s ease-in-out;
    }

    .butiful2.ani{
       
        font-size: 2.7vw;
        background-image:linear-gradient(to right,#FDC830,#f7b733,#F7971E,#fceabb);
        text-transform: uppercase;
        -webkit-text-fill-color:transparent;
        -webkit-background-clip:text;
        text-shadow: 0 20px 50px rgba(0,0,0,.5);
        animation : horiz 3s linear infinite;
        background-size: 400%;
        transition:0.6s ease-in-out;
    }

    @keyframes horiz {
        0%{
            background-position: 0% 100%;
        }
        50%{
            background-position: 100% 0%;
        }
        100%{
            background-position: 0% 100%;
        }
    }
    
    .bigtext{
        font-size: 3vw;
        background:linear-gradient(to right,#bdc3c7,white);
        -webkit-text-fill-color:transparent;
        -webkit-background-clip:text;
    }
    
    #english{
        position: absolute;
        top:87%;
        left:36%;
        font-family: 'Caveat', cursive;
        color: white;
        font-size: 2.4vw;
    }

    .box{
        position: absolute;
        top:25%;
        left:20%;
        color: #1670f0;
        display: table;
        background:black;
        font-size: 1vw;
        letter-spacing: 2px;
        text-transform: uppercase;
        text-decoration: none;
        box-shadow: 0 20px 50px rgba(0,0,0,.5);
        overflow: hidden;
    }

    .box::before{
        content:'';
        position: absolute;
        top:2px;
        left:2px;
        bottom: 2px;
        width:50%;
        background:rgba(255,255,255,0.05);
    }

    .box p{
        text-align: center;
        display: table-cell;
        vertical-align: middle;
    }

    
    .box span:nth-child(1)
    {
        position: absolute;
        top:0;
        left:0;
        width:100%;
        height:3px;
        background:linear-gradient(to right, #0c002b,#1779ff);
        animation: animate1 2s linear infinite;
    }
    @keyframes animate1{
        0%
        {
            transform:translateX(-100%);
        }
        100%
        {
            transform:translateX(100%);
        }
    }

    .box span:nth-child(2)
    {
        position: absolute;
        top:0;
        right:0;
        width:3px;
        height:100%;
        background:linear-gradient(to bottom,  #0c002b,#1779ff);
        animation: animate2 2s linear infinite;
        animation-delay: 1s;
    }

    @keyframes animate2{
        0%
        {
            transform:translateY(-100%);
        }
        100%
        {
            transform:translateY(100%);
        }
    }

    .box span:nth-child(3)
    {
        position: absolute;
        bottom:0;
        left:0;
        width:100%;
        height:3px;
        background:linear-gradient(to left,  #0c002b,#1779ff);
        animation: animate3 2s linear infinite;
    }
    @keyframes animate3{
        0%
        {
            transform:translateX(100%);
        }
        100%
        {
            transform:translateX(-100%);
        }
    }

    .box span:nth-child(4)
    {
        position: absolute;
        top:0;
        left:0;
        width:3px;
        height:100%;
        background:linear-gradient(to top,  #0c002b,#1779ff);
        animation: animate4 2s linear infinite;
        animation-delay: 1s;
    }

    @keyframes animate4{
        0%
        {
            transform:translateY(100%);
        }
        100%
        {
            transform:translateY(-100%);
        }
    }

    .middle{
        position: absolute;
        top:16%;
        left:64%;
        width:8%;
        height: 10%;
        transform: translateX(-50%);
        text-align: center;
       
    }

    .btn{
        display:inline-block;
        width: 36%;
        height: 45%;
        margin:22%;
        background:#f1f1f1;
        border-radius: 30%;
        box-shadow: 0 5px 15px -5px #485563;
        color:#3498db;
        font-size:0px;
        -moz-overflow: hidden;
        -ms-overflow: hidden;
        overflow: hidden;
        position: relative;
        display: table;
    }

    .btn i{
        text-align: center;
        display: table-cell;
        vertical-align: middle;
        font-size:1.5vw;
        transition:0.2s linear;
    }

    .btn:hover i{
        transform:scale(1.2);
        color:#f1f1f1;
       
    }
    .btn::before{
        content:"";
        position: absolute;
        width:120%;
        height:120%;
        background:#3498db;
        transform:rotate(45deg);
        
        left:-110%;
        top:90%;
    }

    .btn:hover::before{
        animation: aaa 0.7s 1;
        top:-10%;
        left:-10%;
    }

    .btnn{
        display:inline-block;
        width: 36%;
        height: 45%;
        margin:22%;
        background:#f1f1f1;
        border-radius: 30%;
        box-shadow: 0 5px 15px -5px #485563;
        color:#3498db;
        overflow: hidden;
        position: relative;
        display: table;
        font-size:0px;
       
    }

    .btnn i{
        text-align: center;
        display: table-cell;
        vertical-align: middle;
        font-size:1.5vw;
        transition:0.2s linear;
    }

    .btnn:hover i{
        transform:scale(1.2);
        color:#f1f1f1;
    }
    .btnn::before{
        content:"";
        position: absolute;
        width:120%;
        height:120%;
        background:#3498db;
        transform:rotate(45deg);
        left:-110%;
        top:90%;
    }

    .btnn:hover::before{
        animation: aaa 0.7s 1;
        top:-10%;
        left:-10%;
    }

    #copy1{
        opacity: 0;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        font-size: 1.6vw;
        color: #FFD200;
        top:16.5%;
        left:65.5%;
    }

    #copy2{
        opacity: 0;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        font-size: 1.6vw;
        color: #FFD200;
        top:24%;
        left:65.5%;
    }
    @keyframes aaa {
        0%{
            left:-110%;
            top:90%;
        }
        50%{
            left:10%;
            top:-30%;
        }
        100%{
            top:-10%;
            left:-10%;
        }
    }

   @keyframes rotation {
       from{transform:rotate(0deg);}
       to{transform:rotate(360deg);}
   }
   
 
   @keyframes fadeIn {
       0%{opacity: 0;}
       100%{opacity: 1;}
       
   }

   
  
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
    
    #handphone{
        position: absolute;
        top:12%;
        left:24.5%;
        font-family: 'Do Hyeon', sans-serif;
        color:#ffc800;
        font-size: 2.5vw;
        text-shadow: 0 20px 50px rgba(0,0,0,.5);
        
        
    }

    .bigtext{
        font-size: 3vw;
        background:none;
        -webkit-text-fill-color:transparent;
        
    }


    .middle{
        position: absolute;
        top:14%;
        left:71%;
        width:8%;
        height: 10%;
        transform: translateX(-50%);
        text-align: center;
       
    }

    .btn{
        display:inline-block;
        width: 36%;
        height: 45%;
        margin:22%;
        background:#f1f1f1;
        border-radius: 30%;
        box-shadow: 0 5px 15px -5px #485563;
        color:#3498db;
        
        -moz-overflow: hidden;
        -ms-overflow: hidden;
        overflow: hidden;
        position: relative;
        display: none;
    }

    .btn i{
        text-align: center;
        display: table-cell;
        vertical-align: middle;
        font-size:1.5vw;
        transition:0.2s linear;
    }

    .btn:hover i{
        transform:scale(1.2);
        color:#f1f1f1;
       
    }
    .btn::before{
        content:"";
        position: absolute;
        width:120%;
        height:120%;
        background:#3498db;
        transform:rotate(45deg);
        
        left:-110%;
        top:90%;
    }

    .btn:hover::before{
        animation: aaa 0.7s 1;
        top:-10%;
        left:-10%;
    }

    .btnn{
        display:inline-block;
        width: 36%;
        height: 45%;
        margin:22%;
        background:#f1f1f1;
        border-radius: 30%;
        box-shadow: 0 5px 15px -5px #485563;
        color:#3498db;
        overflow: hidden;
        position: relative;
        display: none;
    }

    .btnn i{
        text-align: center;
        display: table-cell;
        vertical-align: middle;
        font-size:1.5vw;
        transition:0.2s linear;
    }

    .btnn:hover i{
        transform:scale(1.2);
        color:#f1f1f1;
    }
    .btnn::before{
        content:"";
        position: absolute;
        width:120%;
        height:120%;
        background:#3498db;
        transform:rotate(45deg);
        left:-110%;
        top:90%;
    }

    .btnn:hover::before{
        animation: aaa 0.7s 1;
        top:-10%;
        left:-10%;
    }

    #rotationLeft{
        display: none;
    }

    #rotationRight{
       display: none;
    }

}

@supports (-ms-ime-align:auto) {
    .selector { property: value;}

    .middle{
        position: absolute;
        top:14%;
        left:64%;
        width:8%;
        height: 10%;
        transform: translateX(-50%);
        text-align: center;
       
    }

    #copy1{
        opacity: 0;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        font-size: 1.6vw;
        color: #FFD200;
        top:15%;
        left:65.5%;
    }

    #copy2{
        opacity: 0;
        position: absolute;
        font-family: 'Do Hyeon', sans-serif;
        font-size: 1.6vw;
        color: #FFD200;
        top:22.5%;
        left:65.5%;
    }

    .btn::before{
        display: none;
    }

    .btnn::before{
        display: none;
    }

    .btn:hover i{
        transform:scale(1.2);
        color:#243B55;
    }

    .btnn:hover i{
        transform:scale(1.2);
        color:#243B55;
    }
}