ul, li {list-style: none;}
a {text-decoration: none;}

.intro {position: fixed; top: 0; left: 0; background-color: #fff; z-index: 999; width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; background-image: url('./logo.png'); background-size: cover; background-repeat: no-repeat; background-position: center;}
.bgm_control {position: fixed; top: 0; left: 0; background-color: none; z-index: 998; width: 100%; height: 100%;}

.icon_list {position: absolute; bottom: 20px; left: 50%; width: 180px; margin-left: -90px; background-color: rgba(0, 0, 0, 0.7); padding: 10px;}
.icon_list > ul {display: flex;}
.icon_list > ul > li {margin-right: 15px;}
.icon_list > ul > li:last-of-type {margin-right: 0;}
.icon_list > ul > li > a {color: #fff; font-size: 24px; opacity: 0.7; transition: all 0.3s ease-in-out;}
.icon_list > ul > li > a:hover {opacity: 1;}
/* #24316E */

#sceneList .scenes {background-color: rgba(0, 0, 0, 0.7); height: 100vh; }
#sceneList .scene.current {background-color: #24316e;}
.no-touch #sceneList .scene:hover {background-color: #999BBF;}
#sceneList .scene .text { font-family: 'Noto Sans KR', sans-serif; letter-spacing: -1px; line-height: 50px;}
#sceneList .scene {height: 50px;}

#bgm {width: 1px; height: 1px;}
.kakao {position: fixed; bottom: 10px; right: 10px;}
.kakao > a.times {color: #000; position: absolute; top: 5px; right: 10px; font-size: 30px;}
.kakao > a > img {width: 370px;}

@media (max-width: 640px) {
    .intro {background-size: contain;}
}