section#sample.sample001 .messageView,section#sample.sample002 .messageView{position:relative;width:700px;height:20pc;margin:5pc auto 20px;cursor:pointer}section#sample.sample001 .messageView .mv-contents,section#sample.sample002 .messageView .mv-contents{padding:5pc 0 0}section#sample.sample001 .messageView .mv-contents .mv-name,section#sample.sample002 .messageView .mv-contents .mv-name{position:absolute;top:93px;left:-40px;width:300px;padding:6px 10px;background:rgba(47,109,174,.8);background:-webkit-gradient(linear,left top,right top,from(rgba(47,109,174,0)),color-stop(.1,rgba(47,109,174,.8)),color-stop(.9,rgba(47,109,174,.8)),to(rgba(47,109,174,0)));color:#fff;font-weight:700;font-size:22px;text-align:center;text-shadow:#000 1px 1px 1px;text-shadow:#000 1px 1px 3px 1px;z-index:20}section#sample.sample001 .messageView .mv-contents .mv-comment,section#sample.sample002 .messageView .mv-contents .mv-comment{position:relative;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;margin-top:50px;height:10pc;padding:20px 30px 10px;background:rgba(33,54,94,.7);border-radius:8px;color:#fff;z-index:10}section#sample.sample001 .messageView .mv-contents .mv-comment .pointer,section#sample.sample002 .messageView .mv-contents .mv-comment .pointer{position:absolute;right:20px;bottom:0;width:20px;height:34px;background:url(../img//icon_pointer.png) no-repeat;-moz-background-size:20px auto;-o-background-size:20px auto;-webkit-background-size:20px auto;background-size:20px auto;-moz-animation:pointer-anime 1s ease-in-out infinite;-webkit-animation:pointer-anime 1s ease-in-out infinite;animation:pointer-anime 1s ease-in-out infinite}section#sample.sample001 .messageView .mv-contents .mv-image.character,section#sample.sample002 .messageView .mv-contents .mv-image.character{position:absolute;right:-62px;top:-111px;z-index:1}section#sample.sample001 .messageView .mv-contents .mv-image.character img,section#sample.sample002 .messageView .mv-contents .mv-image.character img{display:block;width:300px}section#sample.sample001 .messageView.left .mv-name,section#sample.sample002 .messageView.left .mv-name{left:auto;right:-23px}section#sample.sample001 .messageView.left .mv-contents .mv-image.character,section#sample.sample002 .messageView.left .mv-contents .mv-image.character{right:auto;left:-24px}section#sample.sample001 .messageView.center .mv-contents .mv-image.character,section#sample.sample002 .messageView.center .mv-contents .mv-image.character{right:auto;left:50%;margin-left:-150px;-moz-animation:character-anime 3s ease-in infinite;-webkit-animation:character-anime 3s ease-in infinite;animation:character-anime 3s ease-in infinite}@media screen and (max-width:768px){section#sample.sample001 .messageView,section#sample.sample002 .messageView{width:auto;height:auto;margin:0 auto 20px}section#sample.sample001 .messageView .mv-contents .mv-name,section#sample.sample002 .messageView .mv-contents .mv-name{top:102px;left:-11px;width:150px;font-size:15px}section#sample.sample001 .messageView .mv-contents .mv-image.character,section#sample.sample002 .messageView .mv-contents .mv-image.character{right:-15px;top:-1pc}section#sample.sample001 .messageView .mv-contents .mv-image.character img,section#sample.sample002 .messageView .mv-contents .mv-image.character img{width:210px}section#sample.sample001 .messageView .mv-contents .mv-comment,section#sample.sample002 .messageView .mv-contents .mv-comment{height:137px}section#sample.sample001 .messageView .mv-contents .mv-comment .val,section#sample.sample002 .messageView .mv-contents .mv-comment .val{font-size:14px}section#sample.sample001 .messageView .mv-contents .mv-comment .pointer,section#sample.sample002 .messageView .mv-contents .mv-comment .pointer{right:1pc;bottom:-10px;width:15px;height:34px;-moz-background-size:15px auto;-o-background-size:15px auto;-webkit-background-size:15px auto;background-size:15px auto}section#sample.sample001 .messageView.left .mv-name,section#sample.sample002 .messageView.left .mv-name{left:auto;right:-9px}section#sample.sample001 .messageView.left .mv-contents .mv-image.character,section#sample.sample002 .messageView.left .mv-contents .mv-image.character{right:auto;left:-24px}section#sample.sample001 .messageView.center .mv-contents .mv-image.character,section#sample.sample002 .messageView.center .mv-contents .mv-image.character{margin-left:-75pt}section#sample.sample001 .stage-buttons .btn,section#sample.sample002 .stage-buttons .btn{margin-bottom:10px}}@-webkit-keyframes character-anime{0%,100%,30%{-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}20%{-moz-transform:translate3d(0,-18px,0);-ms-transform:translate3d(0,-18px,0);-webkit-transform:translate3d(0,-18px,0);transform:translate3d(0,-18px,0)}}section#sample.sample002 .messageView.flash .effect{position:absolute;top:-110px;left:0;display:block;width:100%;height:25pc;background:#fff;-moz-animation:flash-anime 3s ease-in 1;-webkit-animation:flash-anime 3s ease-in 1;animation:flash-anime 3s ease-in 1;opacity:0}@-webkit-keyframes flash-anime{0%{opacity:0}20%{opacity:.5;z-index:100}100%,35%,70%{opacity:0;z-index:100}50%{opacity:.9;z-index:100}}section#sample.sample003 .messageView{position:relative;height:20pc;margin-bottom:20px;background:#000}section#sample.sample003 .messageView .mv-comment{width:630px;margin:0 auto}section#sample.sample003 .messageView .mv-comment .val{font-size:90px;font-weight:700;color:red;line-height:20pc}@media screen and (max-width:768px){section#sample.sample003 .messageView{width:auto;height:auto;margin:0 auto 20px}section#sample.sample003 .messageView .mv-comment{width:280px}section#sample.sample003 .messageView .mv-comment .val{font-size:40px}section#sample.sample003 .stage-buttons .btn{margin-bottom:10px}}section#sample.sample004 .messageView{position:relative;height:500px;margin-bottom:20px;background:url(../img/sample004/bg_main.jpg) no-repeat;-moz-background-size:100% auto;-o-background-size:100% auto;-webkit-background-size:100% auto;background-size:100% auto}section#sample.sample004 .messageView .mv-comment{padding:40px}section#sample.sample004 .messageView .mv-comment .val{font-size:24px;color:#fff}section#sample.sample004 .messageView .mv-comment .pointer{position:absolute;right:20px;bottom:10px;width:20px;height:34px;background:url(../img/icon_pointer.png) no-repeat;-moz-background-size:20px auto;-o-background-size:20px auto;-webkit-background-size:20px auto;background-size:20px auto;-moz-animation:pointer-anime 1s ease-in-out infinite;-webkit-animation:pointer-anime 1s ease-in-out infinite;animation:pointer-anime 1s ease-in-out infinite}@media screen and (max-width:768px){section#sample.sample004 .messageView{width:auto;height:auto;min-height:200px;margin:0 auto 20px}section#sample.sample004 .messageView .mv-comment{padding:8px}section#sample.sample004 .messageView .mv-comment .val{font-size:9pt}section#sample.sample004 .messageView .mv-comment .pointer{bottom:0;width:15px;height:34px;-moz-background-size:15px auto;-o-background-size:15px auto;-webkit-background-size:15px auto;background-size:15px auto}section#sample.sample004 .stage-buttons .btn{margin-bottom:10px}}