.skip-btn{width : 80px;height : 80px; display: flex;align-items: center;justify-content: center; white-space: nowrap; position : fixed; z-index: 1200;font-family: futura-pt; letter-spacing: 0.15em; background: #353F49;color : #C9C9C9; border-radius: 50%; font-size: 14px;transform: translateX(-50%) translateY(-50%);transition : transform .5s; cursor: pointer;}
.skip-btn::after{position :absolute; content : ''; width : 100%;height : 100%; background: #353f49; z-index: -1;animation : cursor 1.2s infinite; border-radius: 50%;}

#intro{width : 100%;height : 100%; position : fixed; z-index: 100000; background: #fff;}

.intro-bg{position :absolute; left : 0;top : 0;width : 100%;height : 100%; z-index: -1; clip-path: inset(62% 0% 27% 0%); animation : intro-bg 3s both}
@keyframes intro-bg {
    0%{clip-path : inset(62% 50% 27%)}
    50%{clip-path: inset(62% 5% 27%);}
    100%{clip-path: inset(0);}
}
.intro-bg > img{width : 100%;height : 100%; object-fit: cover; object-position: center; transform: scale(1.5);}

.intro-inner{display: flex;flex-direction: column; justify-content: center;align-items: center; width : 100%; max-width: 1540px; margin : 0 auto; height : 100%; position :relative;}

.intro-tit-box{display: flex;flex-direction: column;align-items: start; justify-content: center; writing-mode: vertical-lr; font-family: Nanum Myeongjo; font-weight: 700; letter-spacing: 0.3em; color : #242424; font-size: 20px; position : absolute; right : 50%; transform: translateY(-30%) translateX(50%);}

.intro-tit-box b{font-weight: 800; color : #294F51; font-size: 25px;}

.intro-tit-box .char{opacity: 0;}

.intro-line{display: inline-block; width : 1px;height : 88px; background: rgba(0,0,0,0.2); margin : 16px 0; clip-path: inset(0% 0% 100% 0%);}

.intro-logo{position :absolute; bottom : 14%; transform: translateY(100px); opacity: 0;z-index: 1;}

.intro-dim{position : absolute; display: grid;left : 0; top : 0; grid-template-columns: repeat(8, 1fr);width : 100%;height : 100%; perspective: 1000px;}
.intro-dim > span{background: #111; transform: rotateY(90deg);opacity: 0;}

.visual-dim{position : absolute; display: grid;left : 0; top : 0; grid-template-columns: repeat(8, 1fr);width : 100%;height : 100%; perspective: 1000px;z-index: 10; pointer-events: none;}
.visual-dim > span{background: #111; transform: rotateY(0deg);opacity: 1;}

@media(max-width : 1200px){
    .intro-inner{}

    .intro-tit-box{font-size: 16px;}

    .intro-tit-box b{font-size: 20px;}

    .intro-line{height : 50px; margin : 12px 0;}

    .intro-logo{width : 180px;}

    .intro-open{width :80px;height : 80px;position : absolute; transform: translateX(-100px); font-size: 16px; top : auto; opacity: 0; bottom : 30px; right : 30px; line-height: 1.2em;}
}