issue #11 웰컴 다시보기 완료.

procentric/application/hoteltv.app.full.mypage.css

@@ -47,6 +47,18 @@
     padding: 0;
 }
 
+.main .mypage .bg .owl-carousel .owl-stage-outer .owl-stage .owl-item>div {
+    width: 1920px;
+    height: 1080px;
+    background-image: var(--bg_noplay);
+}
+
+.main .mypage .bg .owl-carousel .owl-stage-outer .owl-stage .owl-item.movieplay>div {
+    width: 100%;
+    height: 100%;
+    background-image: url(tv:);
+}
+
 .main .mypage .bg div .item {
     width: 100%;
     height: 100%;
@@ -402,4 +414,105 @@ div#lst_mypagebg div #mp_message_table>#mp_msg_tblrec tr>#date {
     top: -50px;
     width: 100%;
     align-content: center;
+}
+
+
+
+
+/**********************************************************************
+ * Replay Welcome movie
+ **********************************************************************/
+.main .mypage .bg .owl-carousel .owl-item .ctz_mv_ctrl {
+    position: absolute;
+    top: 820px;
+    left: 1700px;
+    height: 54px;
+    line-height: 54px;
+    color: rgb(235, 235, 235);
+    font-size: 38px;
+    filter: drop-shadow(0 0 5px rgb(0, 0, 0));
+    white-space: nowrap;
+}
+
+.main .mypage .bg .owl-carousel .owl-item.movieplay .item .ctz_mv_ctrl {
+    animation-delay: 4s;
+    animation-name: moveMypageMvCtrl;
+    animation-iteration-count: 1;
+    animation-timing-function: ease-in;
+    animation-fill-mode: forwards;
+    animation-duration: 1s;
+}
+
+@keyframes moveMypageMvCtrl {
+    from {
+        left: 1700px;
+    }
+    to {
+        left: 2220px
+    }
+}
+
+.main .mypage .bg .owl-carousel .owl-item .ctz_mv_ctrl::before {
+    position: absolute;
+    content: '';
+    width: 128px;
+    height: 54px;
+    margin-left: -140px;
+    background-image: url("./images/icons/icon_btn_media_play.png");
+    background-repeat: no-repeat;
+    background-position: right center;
+    background-size: contain;
+}
+
+.main .mypage .bg .owl-carousel .owl-item.movieplay .ctz_mv_ctrl::before {
+    animation-name: iconCtzMvCtrlBtn;
+    animation-iteration-count: 1;
+    animation-timing-function: ease-in;
+    animation-fill-mode: forwards;
+    animation-duration: 1s;
+}
+
+@keyframes iconCtzMvCtrlBtn {
+    0% {
+        transform: rotateX(0deg);
+    }
+    50% {
+        transform: rotateX(90deg);
+        background-image: url("./images/icons/icon_btn_media_stop.png");
+    }
+    100% {
+        transform: rotateX(0deg);
+        background-image: url("./images/icons/icon_btn_media_stop.png");
+    }
+}
+
+.main .mypage .bg .owl-carousel .owl-item .ctz_mv_ctrl::after {
+    content: var(--playmsg);
+}
+
+.main .mypage .bg .owl-carousel .owl-item.movieplay .ctz_mv_ctrl::after {
+    animation-delay: 1s;
+    animation-name: msgMypageMvCtrlBtn;
+    animation-iteration-count: 1;
+    animation-timing-function: ease-in;
+    animation-fill-mode: forwards;
+    animation-duration: 2s;
+}
+
+@keyframes msgMypageMvCtrlBtn {
+    0% {
+        opacity: 1;
+    }
+    25% {
+        opacity: 0;
+        content: var(--stopmsg);
+    }
+    50% {
+        opacity: 1;
+        content: var(--stopmsg);
+    }
+    100% {
+        opacity: 1;
+        content: var(--stopmsg);
+    }
 }