/* CSS Reset */
@charset "utf-8";
/* CSS Reset */
html,body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, 
form, fieldset, input, textarea, p, blockquote, th, td, span, applet,
object, iframe,  a,abbr {padding: 0; margin: 0;}
table {border-collapse:collapse; border-spacing:0;}
address, caption, cite, code, dfn, em, th, var {font-weight: normal; font-style: normal;}
caption, th, td {text-align: left;}
fieldset, img, div, iframe {border: 0;}
div{ box-sizing: border-box; }
h1, h2, h3, h4, h5, h6 {font-weight: normal; font-size: 100%;}
a, a:link, a:visited, a:hover, a:active {text-decoration: none;} 
ol, ul {list-style: none;} 
input, textarea, select, button {font-size: 100%; font-family: inherit;}
body, html { background:#FFEECB; width: 100%; height: 100%;font-family: Helvetica,Arial,Hiragino Sans GB,
WenQuanYi Zen Hei,儷黑 Pro,LiHei Pro,微軟正黑體,sans-serif;}
h1, h3{ display: none;}
a, button{ text-decoration:none; transition: all .5s ease;-webkit-transition:all .5s ease;-o-transition:all .5s ease;
-moz-transition:all .5s ease;}

/*----- custom -----*/	
.wrap{ position: relative; }
.logopic img, .kv img, .fixed-bg img, .fixed-c img, .lottery img, .sale img, .gaming img
, .musi img, .musi2 img, .remo img, .classic img, .float img{ max-width: 100%;height: auto;display: block;}
p.t{ font-size:1rem !important;color: #660F13; letter-spacing: 2px;}
.container{width: 1680px; margin: 0 auto; position: relative;}
.sub-t{ color: #660F13; font-size: 1.875rem; margin: 10px auto 15px; text-align: center; font-weight: bold; 
letter-spacing: 5px;width: 525px; position: relative; }
.sub-bg { display: inline-block; background:url(../images/sub_bg.jpg)repeat-x center; height: 45px; position: absolute;
width: 25%; }
.sub-bg1{ left: 0;}
.sub-bg2{ right: 0; }
.sub-t li{ display: inline-block;}
.clear{ clear: both; overflow: hidden;}
.white { color: #fff;}
.red{ color: #C62128;}
.red span{ color: #660F13;}
.lottery-t, #gift-carousel, .buy-t, .buy-c, .sale-t, .sale-content, .gaming-t, .gaming-c, .musi-t,
.music-c, .remo-t, .remo-c, .mmm, .musi-red{ visibility: hidden;}


/*----- Logo -----*/
.logopic{ text-align: center; width: 812px; margin:0 auto;}
.logopic ul{ padding: 25px 0;}
.logopic li{ display: inline-block; padding: 0 30px; border-right: 2px solid #000; vertical-align: middle;}
.logopic li:last-child { border-right: none;}
.logopic li a{ display: block; margin:0 auto; clear:both; position:relative; top: 0;}
.logopic li a:hover{ top: 5px;}
.logopic li a.b1{ width: 95px;}
.floater{ float:left; height:50%;  width:1px; /* only for IE7 */}
.floater-b1{margin-bottom:-16px;}
.logopic li a.b2{ width: 140px;}
.logopic li a.b3{ width: 89px;}
.floater-b3{ margin-bottom:-10px;}
.logopic li a.b4{ width: 65px;}
.floater-b4{ margin-bottom:-17px;}
.logopic li a.b5{ width: 97px;}
.floater-b5{ margin-bottom:-12px;}

/*----- kv -----*/
.menu-m{ display: none; }
.kv{ background:#FFEECB; background-image:url(../images/kv_bg1.jpg); background-repeat: no-repeat;background-position: center; width: 100%; 
margin: 0 auto ; position: relative; height: 1000px;}
.title{ max-width: 800px;width: 100%; margin:0 auto;}
.kv-txt{ position: relative; height: 375px;}
.kv-txt li{ position: absolute;}
.sub{ max-width: 212px; top: 80px; left: 285px; z-index: 1; width: 100%;}
.main-t1{ max-width: 328px; width: 100%;}
.main-t2{ max-width: 109px; width: 100%; top: 175px; left: 280px;}
.main-t3{ max-width: 109px; width: 100%; top: 155px; left: 375px;}
.main-t4{ max-width: 167px; width: 100%; top: 125px; left: 475px;}
.main-t5{ max-width: 108px; width: 100%; left: 635px; top: 155px;}
.t1{ width: 505px; bottom: 0;right: 15px;}
.t2{ width: 77px; bottom: -5px;right: 185px;}
.gift{ position: absolute; background:url(../images/kv_bg3.png) no-repeat center; bottom: 0; height: 262px; width: 100%;}
.gift-content{ width: 987px; margin: 0 auto; max-width: 987px; display: block; height: 262px; position: relative;}
.gift li{ position: absolute; }
.envelope-b{ width: 772px;position: absolute; bottom: 0; left: 50%; margin-left: -386px;}
.envelope-b-2{ width: 772px;position: absolute; bottom: 0; left: 50%; margin-left: -386px; z-index: 2;}
.g1{ width: 488px; left: -80px; bottom: 88px;}
.g2{ width: 324px; left: 350px; bottom: 65px; z-index: 1;}
.g3{ width: 215px; left: 400px; top: -140px;}
.g4{ width: 472px; left: 300px; bottom: 40px; z-index: 1;}
.g5{ width: 307px; left: 600px; bottom: 60px;}
.g6{ width: 385px; left: 50%; bottom: 43px; margin-left: -197px; z-index: 2;}
.mouse{ width: 131px; position: absolute; right: 110px;}

/*----- fixedmenu -----*/
.fixed-bg{ z-index: 3; position: relative; margin-top: -200px;background: url(../images/fixedmenu_bg.png) no-repeat center; height: 308px;}
.fixed-c{ position: relative;background:#E4AE3F;z-index: 100; height: 200px; }
.fixed-box{ border-radius:40px; width:100%; background-color:#FFEECB; padding: 0 20px; position: absolute; top: -120px;}
.fixed-box ul{ text-align: center; }
.fixed-box ul:first-child, .scroll ul:first-child{ border-bottom: 1px solid #E5D2AA;}
.fixed-box li{ display: inline-block; font-size: 1.875rem; font-weight: bold;text-align: center; padding: 30px 0; margin: 0 90px; }
.fixed-box li.game{ margin: 0 100px 0 50px; }
.fixed-box li.dts{ margin: 0 100px 0 0px;}
.fixed-box li a{ color: #000; display: table; }
.fixed-box li a:hover, .scroll li a:hover{ color: #660F13; }
.fixed-box li a span.speed{ background: url(../images/menu1.png) no-repeat; width: 37px; display: block; margin-right: 10px;
height: 65px; background-size: 100%;}
.fixed-box li a span.fashion{ background: url(../images/menu2.png) no-repeat; width: 27px; display: block; margin-right: 10px;
height: 65px; background-size: 100%;}
.fixed-box li a span.business{ background: url(../images/menu3.png) no-repeat; width: 73px; display: block; margin-right: 10px;
height: 65px; background-size: 100%;}
.fixed-box li a span.music{ background: url(../images/menu4.png) no-repeat; width: 61px; display: block; margin-right: 10px;
height: 65px; background-size: 100%;}
.fixed-box li a span.game{ background: url(../images/menu5.png) no-repeat; width: 82px; display: block; margin-right: 10px;
height: 57px; background-size: 100%;}
.fixed-box li a span.dts{ background: url(../images/menu6.png) no-repeat; width: 74px; display: block; margin-right: 10px;
height: 65px; background-size: 100%;}
.fixed-box li a span.voice{ background: url(../images/menu7.png) no-repeat; width: 73px; display: block; margin-right: 10px;
height: 65px; background-size: 100%;}
.fixed-box li a span.remote{ background: url(../images/menu8.png) no-repeat; width: 40px; display: block; margin-right: 10px;
height: 65px; background-size: 100%;}
.fixed-box li a:hover span{transition: background .5s ease;-webkit-transition:background .5s ease;-o-transition:background .5s ease;
-moz-transition:background .5s ease;}
.fixed-box li a:hover span.speed, .scroll li a:hover span.speed{ background: url(../images/menu1_hover.png); background-size: 100%; }
.fixed-box li a:hover span.fashion, .scroll li a:hover span.fashion{ background: url(../images/menu2_hover.png); background-size: 100%; }
.fixed-box li a:hover span.business, .scroll li a:hover span.business{ background: url(../images/menu3_hover.png); background-size: 100%; }
.fixed-box li a:hover span.music, .scroll li a:hover span.music{ background: url(../images/menu4_hover.png); background-size: 100%; }
.fixed-box li a:hover span.game, .scroll li a:hover span.game{ background: url(../images/menu5_hover.png); background-size: 100%; }
.fixed-box li a:hover span.dts, .scroll li a:hover span.dts{ background: url(../images/menu6_hover.png); background-size: 100%; }
.fixed-box li a:hover span.voice, .scroll li a:hover span.voice{ background: url(../images/menu7_hover.png); background-size: 100%; }
.fixed-box li a:hover span.remote, .scroll li a:hover span.remote{ background: url(../images/menu8_hover.png); background-size: 100%; }
.fixed-box li a span.t, .scroll ul li a span.t{ display: table-cell; vertical-align: middle; }

/* menu scroll fixed */
.scroll{ display: none; text-align: center;}
.scroll ul li a{ color: #000; cursor: pointer; font-size: 1.25rem; font-weight: bold; display: table;}
.scroll ul li a span.speed{ background: url(../images/menu1.png) no-repeat; display: block; margin-right: 10px; background-size: 100%; width: 18px; height: 31px; }
.scroll ul li a span.fashion{ background: url(../images/menu2.png) no-repeat; width: 14px; display: block; margin-right: 10px;height: 34px; background-size: 100%;}
.scroll ul li a span.business{ background: url(../images/menu3.png) no-repeat; width: 32px; display: block; margin-right: 10px;height: 29px; background-size: 100%;}
.scroll ul li a span.music{ background: url(../images/menu4.png) no-repeat; width: 25px; display: block; margin-right: 10px;height: 26px; background-size: 100%;}
.scroll ul li a span.game{ background: url(../images/menu5.png) no-repeat; width: 47px; display: block; margin-right: 10px;height: 32px; background-size: 100%;}
.scroll ul li a span.dts{ background: url(../images/menu6.png) no-repeat; width: 33px; display: block; margin-right: 10px;height: 29px; background-size: 100%;}
.scroll ul li a span.voice{ background: url(../images/menu7.png) no-repeat; width: 39px; display: block; margin-right: 10px;height: 35px; background-size: 100%;}
.scroll ul li a span.remote{ background: url(../images/menu8.png) no-repeat; width: 22px; display: block; margin-right: 10px;height: 36px; background-size: 100%;}
.fixed { position: fixed ; top: 0 ; width: 100% ; background: #FFEECB ; display: block; left: 0;}
.fixed ul{ padding: 7px 0 !important;}
.fixed li{ display: inline-block; margin: 0 30px;}
.fixed li a:hover p.mt-2{color: #ffe400 !important;text-decoration:none; transition: all .5s ease;-webkit-transition:all .5s ease;-o-transition:all .5s ease;
-moz-transition:all .5s ease;}

/*----- lottery -----*/
.lottery{ background:#E4AE3F; position: relative; padding-bottom: 220px;}
.lottery-box{ padding:40px 0 145px; border-radius:250px; width:100%; background-color:#FFEECB; border-top: 20px solid #AF8633; }
.lottery-t{ width: 1020px; margin: 0 auto; position: relative;}
.lottery-t-img{ width: 1020px; margin: 0 auto;}
.lottery-t-number{ position: absolute; font-size: 10rem; font-weight: bold; top: 175px; left: 240px;margin-left: 30px; 
background: -webkit-linear-gradient(top,#e9cc73 0,#c99c3d 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;}
.lottery-t p{ font-size: 1.75rem; font-weight: bold; text-align: center;letter-spacing: 5px; }
.lottery-t p span{ color: #C62128;}
.btn{ width: 246px; margin:30px auto 40px; }

#gift-carousel{ width: 1300px; margin: -120px auto 0; padding-bottom: 90px; position: relative;}
.row{ margin: 0 auto; max-width: 62.5rem; width: 100%; }
#gift-carousel .owl-carousel .item{ margin-right: 10px; }
#gift-carousel .owl-carousel .item h4{ background:#000; -webkit-border-top-left-radius: 20px;-webkit-border-top-right-radius: 20px;-moz-border-radius-topleft: 20px;
-moz-border-radius-topright: 20px; border-top-left-radius: 20px; border-top-right-radius: 20px; color: #fff; text-align: center; font-weight: bold; padding: 5px 0;
font-size: 2.25rem ;background: #f1d36d; /* Old browsers */background: -moz-linear-gradient(top,  #f1d36d 14%, #e0b544 60%, #c98c0a 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #f1d36d 14%,#e0b544 60%,#c98c0a 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #f1d36d 14%,#e0b544 60%,#c98c0a 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1d36d', endColorstr='#c98c0a',GradientType=0 ); /* IE6-9 */}
#gift-carousel .owl-carousel .item .contain{position: relative; -webkit-border-bottom-right-radius: 20px;-webkit-border-bottom-left-radius: 20px;
-moz-border-radius-bottomright: 20px;-moz-border-radius-bottomleft: 20px;border-bottom-right-radius: 20px;border-bottom-left-radius: 20px;padding:30px 20px 20px;
min-height:350px;background: #c02027; /* Old browsers */
background: -moz-linear-gradient(top,  #c02027 0%, #691014 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #c02027 0%,#691014 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #c02027 0%,#691014 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c02027', endColorstr='#691014',GradientType=0 ); /* IE6-9 */}
#gift-carousel .owl-carousel .item .contain .pic{ margin-bottom: 60px;}
#gift-carousel .owl-carousel .item .contain .pic img{transform:scale(1,1);transition: all .5s ease;-webkit-transition:all .5s ease;-o-transition:all .5s ease;
-moz-transition:all .5s ease;}
#gift-carousel .owl-carousel .item .contain .pic img:hover{transform: scale(1.1); -webkit-transform: scale(1.1);}
#gift-carousel .owl-carousel .item .contain p{ font-size: 1.312rem; color: #fff; font-weight: bold; position: absolute; bottom: 20px;}
#buy-carousel{ width: 100%; margin: 0 auto; padding: 0 80px; }
.buy-c{ background: url(../images/buy_bg.png) no-repeat center;background-size: contain; margin: -60px auto 0; width: 100%;}
.buy-t{ width: 800px; margin: 0 auto; position: relative; z-index: 2;}
.buy-box{ margin:0 auto; width: 70%; display: block; position: relative; z-index: 1;text-align: center; padding:70px 60px 30px; box-sizing: border-box; margin-top: -50px;}
.buy-box p{ font-size: 1.7rem;font-weight: bold; background: #660F13; border-radius: 40px; width: 100%; position: relative; margin: 5px auto; padding: 5px 0;}
.price{color: #C62128; font-size: 3rem; font-weight: bold; position: relative;}
.date{font-size: 1.875rem;font-weight: bold; color: #660F13;margin-top: -100px; position: relative; font-weight: 100;}

/*----- sale -----*/
.sale{ background: url(../images/sale_bg.png) no-repeat center top; margin-top: -130px; position: relative; padding: 35px 0 190px; z-index: 4;}
.sale-t{ width: 631px; margin: 0 auto;}
.sale-c, .gaming-c, .music-c{ width: 100%; padding: 0 180px; }
.sale-box, .gaming-box{ width: 29.3%; margin: 25px; display: inline-block; position: relative;}
.sale-box .sale-pd, .buy-box .buy-pd{ transition: all .5s ease;-webkit-transition:all .5s ease;-o-transition:all .5s ease; -moz-transition:all .5s ease;}
.sale-box:hover .sale-pd, .buy-box:hover .buy-pd{ transform: scale(1.04); -webkit-transform: scale(1.04);}
.sale-box p{ position: absolute;font-size: 1.875rem; left: 0; margin: auto; right: 0;bottom: 35px;width: 100%;font-weight: bold;  text-align: center;}
.sale-box p span{ font-size: 1.312rem; display: block; font-weight: 300; }
.sale-box p span.t{font-size: 1rem; font-weight: bold;}
.sale-content{ padding: 10px 0;}

/*----- gaming -----*/
.gaming{ background: url(../images/game_bg.png) no-repeat center top; position: relative; padding: 35px 0 130px; margin-top: -90px; z-index: 5;}
.gaming-t{ width: 448px; margin: -150px auto 30px;}
.gaming-content{ background: url(../images/game_bg2.png) no-repeat center top;}
.gaming-c{ width: 100%; text-align: center; }
.gaming-c ul{ margin: 30px 0;  }
.gaming-r{ position: absolute; top: 200px; right: 0; width: 514px; }
.gaming-l{ position: absolute; top: 1350px; left: 0; width: 506px;}

/*----- music -----*/
.musi{ background: url(../images/music_bg.png) no-repeat center top; position: relative; padding: 35px 0 80px;
margin-top: -200px; z-index: 6;}
.musi2{ background: url(../images/music_bg2.png) no-repeat center top; margin-top: -350px; position: relative; padding-top: 270px; z-index: 7;}
.musi ul, .musi2 ul, .remo-c ul{ text-align: center; }
.musi ul li, .musi2 ul li{ display: inline-block; text-align: center; width: 30%; margin: 0 20px; padding-bottom: 200px;
position: relative; height: 420px;}
.musi ul li p, .musi2 ul li p, .remo-c ul li p{ font-size: 1.875rem;  font-weight: bold;  text-align: center; display: block; position:
relative;z-index: 2; margin-bottom: 10px;}
.musi ul li p span, .musi2 ul li p span, .remo-c ul li p span{ display: block;font-size: 1.312rem; font-weight: 300;}
.musi ul li p span.t, .musi2 ul li p span.t{ font-size: 1rem; font-weight: bold; }
.musi ul li a:hover, .musi2 ul li a:hover{transform: scale(1.1); -webkit-transform: scale(1.1);}
.musi-t{ width: 451px; margin: 0 auto 20px;}
.musi-1{ width: 205px; display: block; margin: 0 auto; position: relative;z-index: 2;}
.musi-2{ width: 202px; display: block; margin: 0 auto; position: relative;z-index: 2;}
.musi-3{ width: 192px; display: block; margin: 0 auto; position: relative;z-index: 2;}
.musi-4{ width: 301px; display: block; margin: 0 auto; position: relative;z-index: 2;}
.musi-5{ width: 318px; display: block; margin: 0 auto; position: relative;z-index: 2;}
.musi-6{ width: 237px; display: block; margin: 0 auto; position: relative;z-index: 2;}
.musi-env{ width: 259px; position: absolute;bottom: -20px; left: 50%; margin-left: -130px; }
.musi-red{ position: absolute; left: 0; margin: auto; width: 100%; bottom: -400px;}

/*----- remote -----*/
.remo{ background: url(../images/remote_bg.png) no-repeat center top; position: relative;margin-top: -230px;z-index: 2;padding-top: 250px; z-index: 8;}
.remo-c{ border-radius: 40px; width: 100%; background-color: #FFEECB; padding: 20px 20px 0;margin-top: -90px;}
.remo-c ul li{ display: inline-block; text-align: center; width: 30%; margin: 0 20px; padding: 20px 0;}
.remo-c ul li a:hover{transform: scale(1.1); -webkit-transform: scale(1.1);}
.remo-c ul li p.t{ letter-spacing: inherit !important; }
.remo-c ul li.remo3{vertical-align: top;}
.remo-t{ width: 391px; margin: 0 auto 10px; position: relative; z-index: 1;}
.remo-1{ width: 231px; display: block; margin: 0 auto 20px;}
.remo-2{ width: 277px; display: block; margin: 0 auto 20px;}
.remo-3{ width: 399px; display: block; margin: 20px auto; min-height: 317px;}

/*----- method -----*/
.method{ background-color: #E4AE3F; padding: 70px 0; color: #660F13;}
.method-t{ font-size: 1.875rem;color: #660F13; font-weight: bold; letter-spacing: 7px;text-align: center;}
.method ol{ width:1230px; margin: 30px auto 0; list-style: decimal;}
.method li{ margin: 25px 0;}
.method li span{ color: #C62128;}

/*----- 浮動按鈕 -----*/
.float{ position: fixed;right: 0;bottom: 5%; z-index: 100;}
.f-btn1{ width:100px; display: block; margin: 0 auto; }
.f-bt{ background: #FFFFFF; border-radius: 10px; margin: 10px; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3); padding: 5px 10px; }
.f-btn2{ width:60px; display: block; margin:5px 0; }

/*----- Responsive -----*/
@media screen and (max-width: 1700px){
.container{ width: 100%;}
.fixed-box{ width: 90%; position: inherit;margin: 0 auto; }
.fixed-box li{ margin:0 30px; font-size: 1.6rem; }
.fixed-box li.game{margin:0 30px 0 10px;}
.fixed-box li.dts{ margin:0 20px 0 0px; }
.sale-box{  margin: 25px 20px;}
.sale-c, .gaming-c{ padding: 0 100px; }
.gaming-c ul{margin: 10px 0;}
.gaming-r, .gaming-l{ width: 30%; }
.remo{padding: 200px 40px 0; background: url(../images/remote_bg.png) no-repeat center -50px; margin-top: -180px;}
.music-c{ padding: 0 70px; }
.musi2{ background: url(../images/music_bg2.png) no-repeat center -50px; margin-top: -260px;}
.buy-t{ width: 35%; }
.buy-box{ width: 62%; margin-bottom: -30px;}
}

@media screen and (max-width: 1450px){
.method ol{ width: 880px; }
.remo-c ul li{ width: 29%;}
.remo-1{ width:170px; }
.remo-2{ width:180px; }
.remo-3{ width:290px; min-height: 237px; }
.musi ul li, .musi2 ul li{ width: 28.7%; }
.sale-c, .gaming-c{ padding: 0 60px; }
.sale-box p{ bottom: 20px; }
.musi ul li, .musi2 ul li{ padding-bottom: 150px; }
#gift-carousel{ width: 100%; }
}

@media screen and (max-width: 1280px){
.fixed-c{ height: auto; margin-top: -50px; }
.fixed-box{ top: -70px; }
.fixed-box li{ margin:0 20px; }
.fixed-box li.game{margin:0 20px 0 10px;}
.fixed-box li.dts{ margin:0; }
.fixed-box li a span.speed, .fixed-box li a:hover span.speed{ width: 30px; height: 50px; }
.fixed-box li a span.fashion, .fixed-box li a:hover span.fashion{ width: 20px; height: 48px;}
.fixed-box li a span.business, .fixed-box li a:hover span.business{ width: 53px; height: 47px;}
.fixed-box li a span.music, .fixed-box li a:hover span.music{ width: 43px; height: 45px;}
.fixed-box li a span.game, .fixed-box li a:hover span.game{ width: 60px;height: 41px; }
.fixed-box li a span.dts, .fixed-box li a:hover span.dts{ width: 53px;height: 46px; }
.fixed-box li a span.voice, .fixed-box li a:hover span.voice{ width: 55px; height: 49px;}
.fixed-box li a span.remote, .fixed-box li a:hover span.remote{ width: 30px;height: 49px; }
.lottery-t-img{ width: 90%;}
.lottery-t-number{ font-size: 10rem; top: 160px; }
#gift-carousel{ width: 75%; padding-bottom: 80px;}
#buy-carousel{ width: 95%; padding-bottom: 80px;}
.buy-t{ width: 40%;}
.buy-c{ width: 90%;}
.buy-box{ width: 63%; padding-bottom: 0; margin-bottom: -5px;}
.date{ margin-top: -90px; }
.sale-c, .gaming-c{ padding: 0 40px; }
.sale-box{ margin: 25px 10px; width: 30.8%;}
.sale-box p, .musi ul li p, .musi2 ul li p, .remo-c ul li p{ font-size: 1.5rem; }
.musi ul li p span, .musi2 ul li p span, .remo-c ul li p span{font-size: 1.125rem;}
.remo-c ul li{ width: 28%;}
.gaming-content{ padding: 30px 0 50px; }
.music-c{ padding: 0 40px; }
.lottery{ padding-bottom: 120px;}
.musi-red{ bottom: -170px; }
.buy-box p{ font-size: 1.6rem; }
}

@media screen and (max-width: 1023px){
/* menu mobile */
.menu-m { position:fixed;left: 0; width: 100%; z-index: 999; -ms-background-color: initial; top: 0; padding: 0; display: block; }
.menu-m ul.active { display:none;}
.menu-m ul { width:100%; position:absolute; top:49px; left:0px; background: #FFEECB; z-index: 99; padding: 0 20px; box-sizing: border-box;}
.menu-m li { border-bottom: 1px #E5D2AA solid; display:inline-block; font-size: 1rem; padding: 13px 0; text-align: center; width: 49.5%;}
.menu-m li.m5{ border-bottom: none; }
.menu-m li p { color: #000; font-size: 1.25rem; }
.menu-m li span { display: none!important; }
.menu-m a{ display:block;}
.menu-m li a{ font-size: 1.25rem; color: #fff; font-weight: bold; letter-spacing: 2px;}
.menu-m li a:hover, #navigation-menu  .current-item a{ text-decoration:none;}
.menu-m li .button:before{ content: none;}
.menu-m li.buy{ background-color: #000;}
.menu-m li.buy a{ color: #fff;}
.toggle-nav { padding:15px 0 15px 20px; text-align: left; background: #bb000e; font-size:1.2rem; transition:color linear 0.15s; color: #fff;
display: block; box-shadow: 0 3px 10px rgba(0, 0, 0, 0.5);}
.toggle-nav span{ margin-left: 10px;}
.toggle-nav span.menu{ margin-left: 25px;}
.menu-m ul, .fixed-box, .scroll{ display: none;}
.c-hamburger{position: relative; overflow: hidden;}
.c-hamburger__line{ width: 25px; height: 3px;position: absolute;left: 0;background-color: #fff;transition: transform 0.3s ease, top 0.3s ease 0.4s;}
.c-hamburger__line:nth-child(1){top: 17px;}
.c-hamburger__line:nth-child(2){top: 24px;}
.c-hamburger__line:nth-child(3){top: 31px;}
.is-open .c-hamburger__line{transition: top 0.3s ease, transform 0.3s ease 0.4s;}
.is-open .c-hamburger__line:nth-child(1) ,.is-open .c-hamburger__line:nth-child(2){top: 23px;transform: rotate(135deg);
transition: top 0.3s ease, transform 0.4s ease 0.4s;}
.is-open .c-hamburger__line:nth-child(3){top: 23px;transform: rotate(225deg);}
.kv{ height: 830px; padding-top: 60px; }
.logopic{ width: 750px; }
.logopic ul{ padding: 20px 0; }
.logopic li{ padding: 0 15px; border-right: 1px solid #000; }
.logopic li a.b1{ width: 76px; }
.logopic li a.b2{ width: 112px; }
.logopic li a.b3{ width: 71px; }
.logopic li a.b4{ width: 52px; }
.logopic li a.b5{ width: 77px; }
.title{ width: 100%; margin-top: -20px;}
.gift-content{ width: 740px; }
.envelope-b, .envelope-b-2{ width: 600px; margin-left: -300px;}
.g1{ width: 350px; bottom: 83px; }
.g2{ width: 250px; left: 220px;}
.g3{ width: 160px; top: -70px; left: 280px;}
.g4{ width: 380px; left: 210px; bottom: 35px;}
.g5{ width: 230px; left: 484px;}
.g6{ width: 300px; margin-left: -150px; bottom: 35px;}
.lottery{ padding-bottom: 220px; }
.lottery-t{ width: 760px;}
.lottery-t-img{ width: 80%;}
.lottery-t-number{ font-size: 6.4rem; top: 103px; left: 188px;}
.lottery-t p, .sale-box p, .buy-box p, .musi ul li p, .musi2 ul li p,
.remo-c ul li p{ font-size: 1.375rem;}
.buy-c{ background: none;}
.buy-box{ width: 100%; margin-bottom: 0;}
.buy-box p{ width: 80%; font-size: 1.375rem;}
.date{ margin-top: -85px;font-size: 1.375rem;}
.sale-c, .gaming-c{ padding: 0 20px; }
.sale-box{ margin: 10px; width: 30.1%;}
.sale-box p{ bottom: 15px;}
.sale-box p span{ font-size: 1.125rem;}
.gaming-box{ width: 43%; margin: 10px 20px;}
.gaming-r, .gaming-l{display: none;}
.remo{background:url(../images/remote_bg_m.png) no-repeat center top; padding: 250px 20px 0; margin-top: -250px;}
.remo-c ul li{ width: 27%; }
.remo-1{ width: 130px; }
.remo-2{ width: 160px; }
.remo-3{ width: 180px; min-height: 160px; }
.method ol{ width: 90%; }
.music-c{ padding: 0 20px; }
.musi ul li, .musi2 ul li{ width: 27%; height: auto; }
.musi-env{ width: 100%; bottom: -10px; left: 0; margin: auto; }
.musi-1, .musi-2, .musi-3, .musi-4, .musi-5, .musi-6{ width: 90%; }
.musi2 ul li{ padding-bottom: 120px; }
.musi2{ padding-top: 220px; }
.musi-4{ margin-bottom: 130px; }
.musi-6{ margin-bottom: 70px; }
.lottery{ padding-bottom: 100px;}
.fixed-c{ margin-top: 0; }
.fixed-bg{ background-position: center top; height: 288px;}
.musi-red{ bottom: -70px; }
#gift-carousel, #buy-carousel{ width: 90%; }
.buy-c{ width: 100%; }
.buy-t{ width: 70%; }
#buy-carousel{ padding: 0 40px 80px; }
.owl-carousel .owl-stage-outer{ margin-bottom: 0; }
}

@media screen and (max-width: 767px){
.kv{ height: 605px;}
.logopic{ width: 500px;}
.logopic li{ padding: 0 5px; border: none;}
.logopic li a.b1{ width: 68px; }
.logopic li a.b2{ width: 100px; }
.logopic li a.b3{ width: 63px; }
.logopic li a.b4{ width: 46px; }
.logopic li a.b5{ width: 70px; }
.title{ width: 480px; margin-top: -10px; }
.sub{ width: 150px; left: 175px; top: 30px;}
.main-t1{ width: 190px;}
.main-t2{ width: 70px; left: 170px; top: 100px;}
.main-t3{ width: 70px; left: 240px; top: 85px;}
.main-t4{ width: 100px; left: 310px; top: 70px;}
.main-t5{  width: 70px; left: 410px; top: 85px;}
.t1{ width: 310px; top:175px; bottom: inherit;right: inherit; left: 161px;}
.t2{ width: 45px; top:190px; bottom: inherit;right: inherit; left: 323px;}
.gift-content{ width: 480px;}
.envelope-b, .envelope-b-2{ width: 460px; margin-left: -230px;}
.g1{ width: 285px; bottom: 48px; left: -100px;}
.g2{ width: 180px; left: 160px;}
.g3{ width: 120px; left: 200px; top: 0;}
.g4{ width: 300px; bottom: 25px; left: 120px;}
.g5{ width: 160px; bottom: 43px; left: 320px;}
.g6{ width: 220px; bottom: 27px; margin-left: -110px;}
.lottery-box{ border-radius: 70px; padding: 30px 10px 135px; }
.lottery-t{ width: 470px; }
.lottery-t-img{ width: 100%; }
.lottery-t-number{ font-size: 5rem; top: 80px; left: 80px; }
.lottery-t p{ font-size: 1.125rem; letter-spacing: 1px; }
.btn{ width: 45%; margin: 20px auto;}
#gift-carousel{ width: 75%; }
#buy-carousel{ width: 90%; }
.owl-carousel .owl-nav button.owl-next, .owl-carousel .owl-nav button.owl-prev{ display: none; }
.buy-box{ width: 100%; padding: 60px 30px; margin-bottom: -50px;}
.date{ margin-top: -60px; }
.buy-box p{ width: 100%;}
.sale{ background: url(../images/sale_bg_m.jpg) no-repeat center top; padding: 35px 0 160px;}
.sale-c, .gaming-c{ padding: 0 60px; }
.sale-box{ margin: 10px; width: 100%;}
.sale-box p{ font-size: 1.875rem; bottom: 40px;}
.gaming{ background: url(../images/game_bg_m.png) no-repeat center top; padding: 35px 0 0px;}
.gaming-content{ padding: 0 0 50px; background: none; }
.gaming-box{ width: 80%; margin-bottom: 20px !important;}
.sub-t, .sale-t{ width: 85%; }
.remo-t, .gaming-t, .musi-t{ width: 60%; }
.gaming-t{ margin: -120px auto 30px; }
.remo{ background: url(../images/remote_bg_m.png) no-repeat center -180px; padding: 80px 20px 0; margin-top: -90px;}
.remo-c{ padding: 70px 20px 0; }
.remo-c ul li{ width: 90%;}
.remo-1, .remo-2, .remo-3{ width: 40%; }
.remo-3{ min-height: auto; }
.musi{ margin-top: -200px; }
.musi ul li, .musi2 ul li{ width: 70%; margin: 20px auto; padding-bottom: 40px; }
.musi-1, .musi-2, .musi-3, .musi-4, .musi-5, .musi-6{ width: 50%; }
.musi{background: url(../images/music_bg_m.png) no-repeat center -150px; margin-top: -60px;}
.musi2{background: url(../images/music_bg2_m.png) no-repeat center -170px; margin-top: -180px; padding-top: 90px;}
.musi-t{ margin: 10px auto 0; }
.musi-env{width: 60%; bottom: 0;left: 0;right: 0;margin: auto;}
.musi-4, .musi-6{ margin-bottom: 0; }
.lottery{ margin-top: -50px; z-index: 4;}
.musi-red{ display: none; }
}

@media screen and (max-width: 500px){
.kv{height: 530px;}
.menu-m li{ width: 49.2%; }
.title, .logopic{ width: 320px;}
.logopic li{ padding: 0 2px;}
.logopic li a.b1{ width: 48px; }
.logopic li a.b2{ width: 70px; }
.logopic li a.b3{ width: 44px; }
.logopic li a.b4{ width: 32px; }
.logopic li a.b5{ width: 49px; }
.sub{ width: 120px; left: 105px; top: 0;}
.main-t1{ width: 120px;}
.main-t2{ width: 45px; left: 110px; top: 50px;}
.main-t3{ width: 45px; left: 153px; top: 45px;}
.main-t4{ width: 65px; left: 197px; top: 40px;}
.main-t5{  width: 45px; left: 260px; top: 50px;}
.t1{ left: 10px; width: 300px; top: 120px;}
.t2{ width: 40px; top:136px; left: 169px;}
.gift-content{ width: 320px;}
.envelope-b, .envelope-b-2{ width: 300px; margin-left: -150px;}
.g1{ width: 215px; bottom: 35px;}
.g2{ width: 120px; left: 100px;}
.g3{ width: 80px; left: 130px; top: 70px;}
.g4{ width: 215px; bottom: 17px; left: 70px;}
.g5{ width: 125px; bottom: 20px; left: 193px;}
.g6{ width: 150px; bottom: 16px; margin-left: -75px;}
.lottery{ padding-bottom: 180px;}
.lottery-box{ border-radius: 0; border-top: 5px solid #af8633; padding: 20px 0 145px; }
.lottery-t{ width: 310px; }
.lottery-t-number{ font-size: 3.5rem; top: 53px; left: 40px; }
.buy-t{ width: 90%;}
.buy-box{ width: 90%; margin-top: 10px;padding: 60px 20px 10px;}
.date{ margin-top: -50px; font-size: 1.125rem;}
.buy-box p{ font-size: 1.125rem; padding: 5px 0;}
.price{ font-size: 2.5rem;}
.sale-t, .sub-t{ width: 90%; }
.sub-t{ font-size: 1.375rem; }
.sale{ padding: 35px 0 140px;}
.sale-c, .gaming-c{ padding: 0 20px; }
.sale-box{ margin: 0;}
.sale-box p{bottom: 25px; font-size: 1.5rem;}
.gaming-box{ width: 100%; }
.gaming-t{margin: -90px auto 30px;}
.remo-c ul li{ margin: 0 auto; padding: 10px 0; }
.remo-1, .remo-2, .remo-3{ width: 60%; }
.musi ul li p span, .musi2 ul li p span, .remo-c ul li p span{ font-size: 1rem; }
.method{ padding: 30px 0; }
.method-t{ font-size: 1.375rem; }
.method ol{ width: 75%; margin: 20px 0 0 60px; }
.sub-bg{ height: 30px; width: 20%; }
.musi ul li, .musi2 ul li{ width: 100%; }
.musi-env{ width: 70%; }
#buy-carousel{ padding: 0; }
.f-btn1{ width:64px; }
.f-bt{ border-radius: 10px; margin: 5px; padding: 3px 5px; }
.f-btn2{ width:44px; margin:3px 0; }
#gift-carousel{ width: 85%;  padding-bottom: 50px;}
.buy-box{margin-bottom: -10px;}
}

/*----- animation -----*/
.animated {
	animation-duration: .5s;
	-webkit-animation-duration: .5s;
	animation-fill-mode: both;
	-webkit-animation-fill-mode: both;
}

@keyframes pulse {
  0% { opacity: 0; transform: scale3d(2, 2, 2); filter: blur(20px);}
  100% { opacity: 1; transform: scale3d(1, 1, 1); filter: blur(0);}
}
@-webkit-keyframes pulse {
  0% { opacity: 0; transform: scale3d(2, 2, 2); filter: blur(20px);}
  100% { opacity: 1; transform: scale3d(1, 1, 1); filter: blur(0);}
}
.pulse-1 {
  animation-name: pulse;
  -webkit-animation-name: pulse;
}
.pulse-2 {
  animation-name: pulse;
  -webkit-animation-name: pulse;
  animation-delay: .1s;
  -webkit-animation-delay: .1s;
}
.pulse-3 {
  animation-name: pulse;
  -webkit-animation-name: pulse;
  animation-delay: .2s;
  -webkit-animation-delay: .2s;
}
.pulse-4 {
  animation-name: pulse;
  -webkit-animation-name: pulse;
  animation-delay: .3s;
  -webkit-animation-delay: .3s;
}
.pulse-5 {
  animation-name: pulse;
  -webkit-animation-name: pulse;
  animation-delay: .4s;
  -webkit-animation-delay: .4s;
}
.pulse-6 {
  animation-name: pulse;
  -webkit-animation-name: pulse;
  animation-delay: .5s;
  -webkit-animation-delay: .5s;
}


@keyframes flipInX {
  0% { transform: perspective(400px) rotate3d(1, 0, 0, 90deg); animation-timing-function: ease-in; opacity: 0;}
  40% { transform: perspective(400px) rotate3d(1, 0, 0, -20deg); animation-timing-function: ease-in;}
  60% { transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1;}
  80% { transform: perspective(400px) rotate3d(1, 0, 0, -5deg);}
  100% { transform: perspective(400px);}
}
@-webkit-keyframes flipInX {
  0% { transform: perspective(400px) rotate3d(1, 0, 0, 90deg); animation-timing-function: ease-in; opacity: 0;}
  40% { transform: perspective(400px) rotate3d(1, 0, 0, -20deg); animation-timing-function: ease-in;}
  60% { transform: perspective(400px) rotate3d(1, 0, 0, 10deg); opacity: 1;}
  80% { transform: perspective(400px) rotate3d(1, 0, 0, -5deg);}
  100% { transform: perspective(400px);}
}
.flipInX {
	-webkit-backface-visibility: visible !important;
	backface-visibility: visible !important;
	animation-name: flipInX;
	-webkit-animation-name: flipInX;
	animation-delay: 1s;
	-webkit-animation-delay: 1s;
}

@keyframes fadeInDown {
  0% { opacity: 0; transform: translate3d(0, -10%, 0);}
  100% { opacity: 1; transform: none;}
}
@-webkit-keyframes fadeInDown {
  0% { opacity: 0; transform: translate3d(0, -10%, 0);}
  100% { opacity: 1; transform: none;}
}
.fadeInDown-1 {
	animation-name: fadeInDown;
 	-webkit-animation-name: fadeInDown;
}
.fadeInDown-2{
	animation-name: fadeInDown;
 	-webkit-animation-name: fadeInDown;
 	animation-delay: .1s;
	-webkit-animation-delay: .1s;
}
.fadeInDown-3{
	animation-name: fadeInDown;
 	-webkit-animation-name: fadeInDown;
 	animation-delay: .2s;
	-webkit-animation-delay: .2s;
}
.fadeInDown-4{
	animation-name: fadeInDown;
 	-webkit-animation-name: fadeInDown;
 	animation-delay: .3s;
	-webkit-animation-delay: .3s;
}
.fadeInDown-5{
	animation-name: fadeInDown;
 	-webkit-animation-name: fadeInDown;
 	animation-delay: .4s;
	-webkit-animation-delay: .4s;
}

@keyframes UpDown-1 {
  0% { transform: translate3d(0, 5%, 0);}
  50% { transform: translate3d(0, -5%, 0);}
  100% { transform: translate3d(0, 5%, 0);}
}
@-webkit-keyframes UpDown-1 {
  0% { transform: translate3d(0, 5%, 0);}
  50% { transform: translate3d(0, -5%, 0);}
  100% { transform: translate3d(0, 5%, 0);}
}
.UpDown-1{
	animation-name: UpDown-1;
 	-webkit-animation-name: UpDown-1;
 	animation-iteration-count: infinite;
	-webkit-animation-iteration-count: infinite;
	animation-duration: 1s;
	-webkit-animation-duration: 1s;
	animation-timing-function: linear;
	-webkit-animation-timing-function: linear;
  animation-delay: .5s;
  -webkit-animation-delay: .5s;
}

@keyframes UpDown-2 {
  0% { transform: translate3d(1%, 1%, 0);}
  50% { transform: translate3d(-2%, -2%, 0);}
  100% { transform: translate3d(1%, 1%, 0);}
}
@-webkit-keyframes UpDown-2 {
  0% { transform: translate3d(1%, 1%, 0);}
  50% { transform: translate3d(-2%, -2%, 0);}
  100% { transform: translate3d(1%, 1%, 0);}
}
.UpDown-2{
  animation-name: UpDown-2;
  -webkit-animation-name: UpDown-2;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  animation-duration: 3s;
  -webkit-animation-duration: 3s;
  animation-timing-function: ease-out;
  -webkit-animation-timing-function: ease-out;
  animation-delay: .5s;
  -webkit-animation-delay: .5s;
}

@keyframes UpDown-3 {
  0% { transform: translate3d(0, 5%, 0);}
  50% { transform: translate3d(0, -5%, 0);}
  100% { transform: translate3d(0, 5%, 0);}
}
@-webkit-keyframes UpDown-3 {
  0% { transform: translate3d(0, 5%, 0);}
  50% { transform: translate3d(0, -5%, 0);}
  100% { transform: translate3d(0, 5%, 0);}
}
.UpDown-3{
  animation-name: UpDown-3;
  -webkit-animation-name: UpDown-3;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  animation-duration: 3s;
  -webkit-animation-duration: 3s;
  animation-timing-function: ease-out;
  -webkit-animation-timing-function: ease-out;
  animation-delay: .7s;
  -webkit-animation-delay: .7s;
}

@keyframes UpDown-4 {
  0% { transform: translate3d(0, 2%, 0);}
  50% { transform: translate3d(-1%, -2%, 0);}
  100% { transform: translate3d(0, 2%, 0);}
}
@-webkit-keyframes UpDown-4 {
  0% { transform: translate3d(0, 2%, 0);}
  50% { transform: translate3d(-1%, -2%, 0);}
  100% { transform: translate3d(0, 2%, 0);}
}
.UpDown-4{
  animation-name: UpDown-4;
  -webkit-animation-name: UpDown-4;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  animation-duration: 3s;
  -webkit-animation-duration: 3s;
  animation-timing-function: ease-out;
  -webkit-animation-timing-function: ease-out;
  animation-delay: .7s;
  -webkit-animation-delay: .7s;
}

.UpDown-5{
  animation-name: UpDown-4;
  -webkit-animation-name: UpDown-4;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  animation-duration: 2.5s;
  -webkit-animation-duration: 2.5s;
  animation-timing-function: ease-out;
  -webkit-animation-timing-function: ease-out;
  animation-delay: .3s;
  -webkit-animation-delay: .3s;
}

@keyframes UpDown-6 {
  0% { transform: translate3d(-3%, 3%, 0);}
  50% { transform: translate3d(0, -3%, 0);}
  100% { transform: translate3d(-3%, 3%, 0);}
}
@-webkit-keyframes UpDown-6 {
  0% { transform: translate3d(-3%, 3%, 0);}
  50% { transform: translate3d(0, -3%, 0);}
  100% { transform: translate3d(-3%, 3%, 0);}
}
.UpDown-6{
  animation-name: UpDown-6;
  -webkit-animation-name: UpDown-6;
  animation-iteration-count: infinite;
  -webkit-animation-iteration-count: infinite;
  animation-duration: 3s;
  -webkit-animation-duration: 3s;
  animation-timing-function: ease-out;
  -webkit-animation-timing-function: ease-out;
  animation-delay: .7s;
  -webkit-animation-delay: .7s;
}

.slideInUp{
  animation-duration: .2s;
  -webkit-animation-duration: .2s;
  animation-timing-function: linear;
  -webkit-animation-timing-function: linear;
  animation-delay: 1s;
  -webkit-animation-delay: 1s;
}

@keyframes slideInUp-1 {
  0% { transform: translate3d(20%, 20%, 0); visibility: visible; opacity: 0;}
  100% { transform: translate3d(0, 0, 0); opacity: 1;}
}
@-webkit-keyframes slideInUp-1 {
  0% { transform: translate3d(20%, 20%, 0); visibility: visible; opacity: 0;}
  100% { transform: translate3d(0, 0, 0); opacity: 1;}
}
.slideInUp-1 {
  animation-name: slideInUp-1;
  -webkit-animation-name:slideInUp-1;
}

@keyframes slideInUp-2 {
  0% { transform: translate3d(0, 100%, 0); visibility: visible; opacity: 0;}
  100% { transform: translate3d(0, 0, 0); opacity: 1;}
}
@-webkit-keyframes slideInUp-2 {
  0% { transform: translate3d(0, 100%, 0); visibility: visible; opacity: 0;}
  100% { transform: translate3d(0, 0, 0); opacity: 1;}
}
.slideInUp-2 {
  animation-name: slideInUp-2;
  -webkit-animation-name:slideInUp-2;
}

@keyframes slideInUp-3 {
  0% { transform: translate3d(50%, 100%, 0); visibility: visible; opacity: 0;}
  100% { transform: translate3d(0, 0, 0); opacity: 1;}
}
@-webkit-keyframes slideInUp-3 {
  0% { transform: translate3d(50%, 100%, 0); visibility: visible; opacity: 0;}
  100% { transform: translate3d(0, 0, 0); opacity: 1;}
}
.slideInUp-3 {
  animation-name: slideInUp-3;
  -webkit-animation-name:slideInUp-3;
}

@keyframes slideInUp-4 {
  0% { transform: translate3d(50%, 100%, 0); visibility: visible; opacity: 0;}
  100% { transform: translate3d(0, 0, 0); opacity: 1;}
}
@-webkit-keyframes slideInUp-4 {
  0% { transform: translate3d(50%, 100%, 0); visibility: visible; opacity: 0;}
  100% { transform: translate3d(0, 0, 0); opacity: 1;}
}
.slideInUp-4 {
  animation-name: slideInUp-4;
  -webkit-animation-name:slideInUp-4;
}

@keyframes slideInUp-5 {
  0% { transform: translate3d(-50%, 100%, 0); visibility: visible; opacity: 0;}
  100% { transform: translate3d(0, 0, 0); opacity: 1;}
}
@-webkit-keyframes slideInUp-5 {
  0% { transform: translate3d(-50%, 100%, 0); visibility: visible; opacity: 0;}
  100% { transform: translate3d(0, 0, 0); opacity: 1;}
}
.slideInUp-5 {
  animation-name: slideInUp-5;
  -webkit-animation-name:slideInUp-5;
}

@keyframes slideInUp-6 {
  0% { transform: translate3d(0, 5%, 0); visibility: visible; opacity: 0;}
  100% { transform: translate3d(0, 0, 0); opacity: 1;}
}
@-webkit-keyframes slideInUp-6 {
  0% { transform: translate3d(0, 5%, 0); visibility: visible; opacity: 0;}
  100% { transform: translate3d(0, 0, 0); opacity: 1;}
}
.slideInUp-6 {
  animation-name: slideInUp-6;
  -webkit-animation-name:slideInUp-6;
  animation-duration: .2s;
  -webkit-animation-duration: .2s;
  animation-timing-function: linear;
  -webkit-animation-timing-function: linear;
  visibility: visible !important;
  animation-delay: .5s;
  -webkit-animation-delay: .5s;
}

@keyframes fadeIndown {
  0% { opacity: 0;transform: translateY(-3%);}
  100% { opacity: 1;transform: translateY(0);}
}
@-webkit-keyframes fadeIndown {
  0% { opacity: 0;transform: translateY(-3%);}
  100% { opacity: 1;transform: translateY(0);}
}
.fadeIndown {
	animation-name: fadeIndown;
	-webkit-animation-name: fadeIndown;
	visibility: visible !important;
}


/* 落葉 */
.dot {
  width: 60px;
  height: 100px;
  position: absolute;
  z-index: 10;
  top: 0;
  left: 0;
  background: url("../images/envelope.png");
  background-size: 100% 100%;
}

@media screen and (max-width: 500px) {
  .dot {
    width: 30px;
    height: 50px;
  }
}

.kv {
  overflow: hidden;
}


/* 滑鼠左右滑動 */
.gift-content {
  z-index: 2;
}

.kv_mouse {
  position: absolute;
  z-index: 1;
  left: 10vw;
  bottom: 8vh;

  width: 12vw;
  height: auto;
  max-width: 100%;

  transform: translate(-50%, -50%);
}

@media screen and (max-width: 1200px) {
  .kv_mouse {
    display: none !important;
  }
}