.room-bg1{ width: 100vw; height: 76.26vw; background: url(../images/room-bg1.png)no-repeat; background-size: 100% 100%; position: relative; display: none; } i{ font-style: normal; } .room-bg2{ width: 100vw; height: 76.26vw; background: url(../images/room-bg2.png)no-repeat; background-size: 100% 100%; position: relative; display: none; .room-bg-top{ // -webkit-text-stroke:0.6vw #C2A0FE; // text-shadow: 0 1vw 1vw #C2A0FE; // text-shadow: 1vw 0vw 1vw #803df3; text-shadow: 0.3vw 0.3vw 0.3vw #803df3,0.3vw 0 0.3vw #803df3,0 0.3vw 0.3vw #803df3; } .room-targe{ -webkit-text-stroke:none; text-shadow: 0.3vw 0.3vw 0.3vw #803df3,0.3vw 0 0.3vw #803df3,0 0.3vw 0.3vw #803df3; } .room-num{ -webkit-text-stroke:0; // -webkit-text-stroke:0.5vw #C2A0FE; text-shadow: 0.3vw 0.3vw 0.3vw #803df3,0.3vw 0 0.3vw #803df3,0 0.3vw 0.3vw #803df3; } .room-bar >div{ background: #A775FA; } } .room-bg3{ width: 100vw; height: 76.26vw; background: url(../images/room-bg3.png)no-repeat; background-size: 100% 100%; position: relative; display: none; .room-bg-top{ // -webkit-text-stroke:0.6vw #B3EBEC; // text-shadow: 0 1vw 1vw #B3EBEC; // text-shadow: 1vw 0vw 1vw #B3EBEC; // text-shadow: 0.3vw 0.3vw 0.3vw #000; text-shadow: 0.3vw 0.3vw 0.3vw #00f4f8,0.3vw 0 0.3vw #00f4f8,0 0.3vw 0.3vw #00f4f8; } .room-targe{ // -webkit-text-stroke:0.5vw #20e7eb; text-shadow: 0.3vw 0.3vw 0.3vw #00f4f8,0.3vw 0 0.3vw #00f4f8,0 0.3vw 0.3vw #00f4f8; } .room-num{ // -webkit-text-stroke:0.5vw #B3EBEC; text-shadow: 0.3vw 0.3vw 0.3vw #00f4f8,0.3vw 0 0.3vw #00f4f8,0 0.3vw 0.3vw #00f4f8; } .room-bar >div{ background: #00d6c4; } } .room-bg-top{ font-size: 15.5vw; color: #fff; font-weight: 700; position: absolute; top: 7.5vw; left: 7.5vw; text-shadow: 0.3vw 0.3vw 0.3vw #f7237f,0.3vw 0 0.3vw #f7237f,0 0.3vw 0.3vw #f7237f; } .room-targe{ font-size: 11vw; color: #fff; font-weight: 700; // -webkit-text-stroke:0.5vw #FE93BF; text-shadow: 0.3vw 0.3vw 0.3vw #f7237f,0.3vw 0 0.3vw #f7237f,0 0.3vw 0.3vw #f7237f; position: absolute; top: 12vw; right: 6vw; } .room-num{ font-size: 11vw; color: #fff; font-weight: 700; // -webkit-text-stroke:0.5vw #FE93BF; text-shadow: 0.3vw 0.3vw 0.3vw #f7237f,0.3vw 0 0.3vw #f7237f,0 0.3vw 0.3vw #f7237f; // text-shadow: 0.3vw 0.3vw 0.3vw #000; position: absolute; top: 40vw; left: 10vw; } .room-bar-box{ position: absolute; width: 82vw; height: 6vw; background: rgba(255,255,255,0.4); border-radius: 10vw; left: 9vw; top: 56vw; } .room-bar{ width: 80vw; height: 4vw; position: absolute; left: 1vw; top: 1vw; border-radius: 10vw; >div{ height: 4vw; width: 0%; background: #FC3F91; border-radius: 10vw; } } .r-p1{ font-size: 12.5vw; color: #fff; font-weight: 700; text-shadow: 0.5vw 0.5vw 0.5vw red, 0.5vw 0 0.5vw red, 0 0.5vw 0.5vw red, 0 -0.5vw 0.5vw red; text-indent: 6vw; margin-top: 4vw; } .r-p2{ font-size: 12.5vw; color: #fff; font-weight: 700; text-shadow: 0.5vw 0.5vw 0.5vw red, 0.5vw 0 0.5vw red, 0 0.5vw 0.5vw red, 0 -0.5vw 0.5vw red; text-indent: 6vw; margin-top: 4vw; } .r-p3{ font-size: 12.5vw; color: #fff; font-weight: 700; text-shadow: 0.5vw 0.5vw 0.5vw red, 0.5vw 0 0.5vw red, 0 0.5vw 0.5vw red, 0 -0.5vw 0.5vw red; text-indent: 6vw; margin-top: 4vw; } //活動 .act-room-bg{ position: relative; width: 10rem; height: 4.252rem; background: url(../images/act-room-bg.png)no-repeat; background-size: 100% 100%; } .act-room-p1{ color: #fff; font-size: 0.75rem; text-indent: 0.7rem; padding-top: 0.9rem; } .act-room-p2{ color: #fff; font-size: 0.75rem; text-indent: 0.7rem; padding-top: 0.2rem; } .act-room-bg2{ position: relative; width: 5.04rem; height: 3.402rem; background: url(../images/act-room-bg2.png)no-repeat; background-size: 100% 100%; p{ display: none; } }