@font-face {
    font-family: 'EliceDigitalBaeum_Bold';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_220508@1.0/EliceDigitalBaeum_Bold.woff2') format('woff2');
    font-weight: 700;
    font-style: normal;
}

@font-face {
    font-family: 'EBSHunminjeongeumSBA';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/EBSHunminjeongeum.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'RixYeoljeongdo_Regular';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2102-01@1.0/RixYeoljeongdo_Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'SBAggroB';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SBAggroB.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


*{cursor:url('cursor.png') 2 2, auto;}

html, body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    background-color:#C2F4FF;
    width: 100%;
    overflow-x: hidden;
    
}

.bg{z-index: 0;}
 

header {
    width: 100%; 
    height: 75px;
    background-color: transparent;
    color: black;
    position: fixed;
    top: 0; 
    left: 0; 
    z-index: 10;
    display: flex;
    justify-content: center; 
    align-items: center; 
    

    }
    .header1 {
        font-size: 24px;
        font-family: 'SBAggroB';
        
    }
    
    .header2 {
        font-size: 24px;
        font-family: 'SBAggroB';
        text-align: center;
        flex: 0.9; /* 가운데 정렬 */
    }
    
    .header3 {
        font-size: 24px;
        font-family: 'SBAggroB';
        text-align: center;
    }

    a{text-decoration: none;
        color: black; cursor: url(./img/cursor2.png), auto !important;}
    a:visited{text-decoration: none;
        color: black;}




        .container{
            background-color: white;
            border-radius: 20px;
            width:80%;
            height:80%;
            overflow:hidden;
            position: absolute;
            top: 53%;
            left: 50%;
            transform: translate(-50%, -50%);
        }

    .left{
        position: absolute;
        left:0;
        height: 100%;
        width: 40%;
        background-color: #FFA0B3;
    }

    .name{
        font-size:70px;
        color:white;
        margin:15%;
        font-family: 'SBAggroB';
    }


    .text1{background-color: #B7FF44;
        color: #FFB8E9;
        font-family: 'SBAggroB';
        font-size: 35px;
     width:fit-content;
        margin-left:43%;
        margin-top:35%;}

    .text2{background-color: #939393;
    color: #B7FF44;
    font-family: 'SBAggroB';
    font-size: 35px;
    width:fit-content;
    margin-left:43%;
    margin-top:1%;}


    .text2:hover{        color: #ff7fa8;
        background-color: #ffd6e9; cursor: url(./img/cursor2.png), auto !important;}
    .link {
        text-decoration: none; 

    }


    .stars{
        position: absolute;
        margin-top:2%; margin-left:68%; height:15%;}


        .slidebox {
            width: 450px;
            height: 250px;
            position: relative;
            background-color:#ff7fa8;
            font-size:80px;
            color:white;
            font-family: 'SBAggroB';
            display: flex;
            justify-content: flex-end;
            padding-right:100px;
            align-items: center;
            cursor: pointer;
            margin-top: 100px;
            transition: transform 1s ease; 
            z-index: 100;
        }
        
        /* hover 시 왼쪽으로 슬라이드 */
        .slidebox:hover {
            transform: translateX(-150%); 
            z-index: 100;
        }



    *{
        cursor: url(./img/cursor1.png), auto !important;
      }