* {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        body {
            overflow: hidden; /*스크롤 숨겨줌*별도의 스크롤이 가능하도록*/
        }


        .half /*공통적으로 스크롤 가능한 ㅂ분*/{
            position: absolute; /*무족ㄴ 옮김*/
            width: 50%;
            height: 100%;
            overflow-y: auto;
            overflow-x: hidden; /*가로 스크롤*/
            padding: 20px; /*투명*/
        }

        .left {
            background-color: whitesmoke;
        }

        .right {
            background-color: lightskyblue;
            left: 50%; /*영역 구분 왼쪽 띄어서*/

        }

        .content {
            height: 200%;
        } /*콘텐츠 두배로 설정하여 스크롤 가능하게함*/

        /*blink,animaiton, z index :숫자가 클수록 위로 올라감*/

        h2 {
            position: fixed; /*고정 스테이하게함*/
            color: white;
            background-color: black
            /*백그라운드 컬러를 넣어서 */
        }

        p {
            padding-top: 40px;
            color: black;
            font-weight: bold;
            font-size: 30px;

        }

        img {
            width: 100%; /*디브안에서 100%*/
            margin-top: 20px;
        }


        .half.right img {
        filter: blur(5px); }

        .half.right img:hover{
         filter: blur(0px); }

        .circle {
        position: absolute;
        width: 100px; height: 100px; border-radius: 50%;
        background-color: darkblue;
        right: 0; margin: 10px;
        }

        /*.hello {
        position: absolute;
        width: 500px; height: 500px;
        border-radius:
        50%;
        top: 50%; left: 50%;
        transform: translate(-50%, -50%); background-color: lavender;
        color: brown; z-index: 1; font-size: 50pt; font-weight: bold; text-align:center;
         }*/

        h3 {
        position: absolute;
        top: 50%; left: 50%; transform:
        translate(-50%, -50%);

        .blink {
        animation: blink-effect 0.7s linear infinite;
        ｝
        @keyframes blink-effect {
        0% {
        visibility: hidden;
        }

        50% {
        visibility: hidden ;
        }

        100% {
        visibility: visible  ;
        }}





/*사람이 할 수 있는 것과 ai가 할 수 있는것 
들어간 원재료들과 결과물들
요리와 내가 애쓴것