*{
    padding:0;
    margin:0;
    -webkit-box-sizing:border-box;
    box-sizing:border-box
}
html,body{
    height:100%
}
figure,main,footer,nav,article{
    display:block
}
body{
    font-family:arial,Microsoft JhengHei !important
}
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{
    margin:0;
    padding:0;
    border:0;
    font-size:100%;
    font:inherit;
    vertical-align:baseline
}
article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{
    display:block
}
body{
    line-height:1
}
ol,ul{
    list-style:none
}
blockquote,q{
    quotes:none
}
blockquote:before,blockquote:after,q:before,q:after{
    content:'';
    content:none
}
table{
    border-collapse:collapse;
    border-spacing:0
}
.topnav{
    width:100%;
    background-color:#393a3e;
    position:fixed;
    top:0;
    left:0;
    z-index:2
}
.topnav_box{
    max-width:1200px;
    margin:0 auto;
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -webkit-align-items:center;
    -ms-flex-align:center;
    align-items:center
}
.topnav_box--link{
    margin-left:auto;
    -webkit-align-self:center;
    -ms-flex-item-align:center;
    -ms-grid-row-align:center;
    align-self:center;
    display:block
}
.topnav_box--link a {
    text-decoration:none;
    color:#fff;
    /*border-right:1px solid #fff;*/
    padding:0 .8rem;
    
}
.topnav_box--link a img {
    padding-right: .3rem;
    vertical-align: middle;
}
.topnav_box--link a:last-child{
    border-right:none
}
.logo{
    display:block;
    padding:1rem 0
}
.logo img{
    display:block
}
.topnav__btn{
    display:none
}
.topnav_box .topnav_box__mobile--link{
    display:none
}
.topnav_box .topnav_box__mobile--link a.active{
    background-color:#000
}
#header{
    margin-top:64px
}
@media screen and (max-width: 1200px){
    .topnav_box .logo{
        padding:1rem .5rem
    }
}
@media screen and (max-width: 768px){
    #header{
        margin-top:62px
    }
    .topnav_box{
        -webkit-flex-wrap:wrap;
        -ms-flex-wrap:wrap;
        flex-wrap:wrap
    }
    .topnav__btn{
        display:block;
        margin-left:auto;
        width:60px;
        height:40px;
        background-image:url("../images/btn.png");
        cursor:pointer
    }
    .topnav_box .logo img{
        height:30px
    }
    .topnav_box .topnav_box--link{
        display:none
    }
    .topnav_box .topnav_box__mobile--link{
        width:100%;
        border-top:1px solid #545454
    }
    .topnav_box .topnav_box__mobile--link a a{
        display:block;
        width:100%;
        text-align:center;
        padding:1rem 0;
        border-bottom:1px solid #545454;
        color:#fff;
        text-decoration:none
    }
    .topnav_box .topnav_box__mobile--link a:last-child{
        border-bottom:none
    }
}
@media screen and (max-width: 414px){
    #header{
        margin-top:52px
    }
    .topnav_box .logo img{
        height:20px
    }
}
.saletitlewrapper{
    max-width:1200px;
    width:100%;
    height:500px;
    margin:0 auto;
    position:relative
}
.slogan__date{
    position:absolute;
    top:290px;
    right:100px;
    z-index:1
}
.slogan__date img{
    display:block
}
.slogan__slogan{
    width:1200px;
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    right:0;
    z-index:0;
    margin:auto
}
.slogan__slogan img{
    display:block
}
.slogan__slogan-m{
    display:none
}
.slogan__slogan-m img{
    display:block;
    width:100%
}
@media screen and (max-width: 768px){
    .saletitlewrapper{
        height:auto
    }
    .slogan__date{
        display:none
    }
    .slogan__slogan{
        display:none
    }
    .slogan__slogan-m{
        display:block
    }
    .topnav_box .topnav_box__mobile--link a{
        display:block;
        width:100%;
        color:#fff;
        padding:.75rem;
        text-align:center;
        text-decoration:none;
        border-bottom:1px solid #585858;
        background-color:#2e2f33
    }
    .topnav_box .topnav_box__mobile--link a:last-child{
        border-bottom:none
    }
}
.pagination #mobile-select{
    display:none;
    -webkit-box-align:center;
    -webkit-align-items:center;
    -ms-flex-align:center;
    align-items:center;
    -webkit-justify-content:space-around;
    -ms-flex-pack:distribute;
    justify-content:space-around
}
.pagination #mobile-select select{
    width:60%;
    height:45px;
    font-size:1rem;
    border-radius:30px;
    padding:0 1rem
}
.pagination #mobile-select a{
    text-decoration:none;
    padding:.8rem;
    display:block;
    background-color:#e8e8e8;
    color:#000;
    border-radius:6px
}
.pagination ul{
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-flex-wrap:wrap;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap
}
.pagination ul li{
    -webkit-flex-basis:6.25%;
    -ms-flex-preferred-size:6.25%;
    flex-basis:6.25%
}
.pagination ul li a{
    padding:.8rem 1rem;
    background-color:#fff;
    border-right:1px dotted #888;
    border-bottom:1px dotted #888;
    color:#000;
    text-decoration:none;
    display:block;
    text-align:center
}
.pagination ul li a.active{
    color:#fff;
    background-color:#e5007f;
}
@media screen and (max-width: 1240px){
    .pagination ul li a{
        padding:.8rem
    }
}
@media screen and (max-width: 1000px){
    .pagination ul li a{
        padding:.6rem;
        font-size:.9rem
    }
}
@media screen and (max-width: 768px){
    .pagination #mobile-select{
        display:-webkit-box;
        display:-webkit-flex;
        display:-ms-flexbox;
        display:flex
    }
    .pagination ul{
        display:none
    }
    .pagination select{
        display:block
    }
}
@media screen and (max-width: 424px){
    .pagination #mobile-select select{
        width:50%
    }
    .pagination #mobile-select a{
        font-size:.9rem
    }
}
#nav{
    width:100%;
    max-width:1200px;
    margin:1rem auto
}
.nav-list{
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex
}
.nav-list__li{
    width:20%
}
.nav-list__li a{
    width:90%;
    height:80px;
    line-height:72px;
    font-size:1.25rem;
    font-weight:bold;
    margin:0 auto;
    display:block;
    color:#ff6;
    border:4px solid #ff6;
    border-radius:50px;
    text-align:center;
    text-decoration:none
}
.nav-list__li a:hover{
    background-color:#ff6;
    color:#000
}
.nav-list__li.active a{
    background-color:#ff6;
    color:#000
}
.nav-list__li.onactive a{
    background-color:#ff7301;
    color:#fff
}
@media screen and (max-width: 768px){
    #nav{
        display:none
    }
}
.dm-box{
    width:100%;
    margin:1rem auto;
    position:relative;
    -webkit-box-shadow:0 0 10px rgba(53,53,53,0.68);
    box-shadow:0 0 10px rgba(53,53,53,0.68);
    border:6px solid #ffffff;
    overflow:hidden
}
.dm-box.isLoaded{
    height:100vh;
    background-color:#2B3134
}
.dm-box.isLoaded:before{
    content:"";
    width:100%;
    height:100%;
    background-image:url("../images/loading.png");
    background-position:center center;
    background-repeat:no-repeat;
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%, -50%);
    -ms-transform:translate(-50%, -50%);
    transform:translate(-50%, -50%);
    -webkit-animation:circleRotate .6s linear infinite;
    animation:circleRotate .6s linear infinite
}
.dm-box.isLoaded img{
    opacity:0
}
.dm-box img{
    display:block;
    width:100%;
    opacity:1;
    -webkit-transition:all .3s;
    -o-transition:all .3s;
    transition:all .3s
}
@-webkit-keyframes circleRotate{
    0%{
        -webkit-transform:translate(-50%, -50%) rotate(0deg);
        transform:translate(-50%, -50%) rotate(0deg)
    }
    100%{
        -webkit-transform:translate(-50%, -50%) rotate(360deg);
        transform:translate(-50%, -50%) rotate(360deg)
    }
}
@keyframes circleRotate{
    0%{
        -webkit-transform:translate(-50%, -50%) rotate(0deg);
        transform:translate(-50%, -50%) rotate(0deg)
    }
    100%{
        -webkit-transform:translate(-50%, -50%) rotate(360deg);
        transform:translate(-50%, -50%) rotate(360deg)
    }
}
@media screen and (max-width: 576px){
    .dm-box{
        margin:.5rem auto
    }
}
.paper-box{
    max-width:1200px;
    width:100%;
    margin:0 auto
}
.paper-img-box{
    max-width:1200px;
    width:100%;
    position:relative;
    overflow:hidden
}
.paper-img{
    display:block;
    margin:0 auto
}
.paper-nav{
    display:-webkit-box;
    display:-webkit-flex;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:center;
    -webkit-justify-content:center;
    -ms-flex-pack:center;
    justify-content:center;
    margin-bottom:1rem
}
.paper-nav__li.active a{
    background-color:#ea0048
}
.paper-nav__li:last-child a{
    margin-right:0
}
.paper-nav__li a{
    padding:1.5rem 2rem;
    background-color:#921b3a;
    border:1px solid #ff0045;
    border-radius:100px;
    font-size:1.2rem;
    display:block;
    color:#fff;
    text-decoration:none;
    margin-right:.5rem
}
.paper-nav__li a:hover{
    background-color:#ea0048
}
.paper-img-box.isLoaded{
    height:100vh;
    background-color:#2B3134
}
.paper-img-box.isLoaded:before{
    content:"";
    width:100%;
    height:100%;
    background-image:url(../images/loading.png);
    background-position:center center;
    background-repeat:no-repeat;
    position:absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%, -50%);
    -ms-transform:translate(-50%, -50%);
    transform:translate(-50%, -50%);
    -webkit-animation:circleRotate .6s linear infinite;
    animation:circleRotate .6s linear infinite
}
@media screen and (max-width: 1000px){
    .paper-img{
        width:100%
    }
}
@media screen and (max-width: 576px){
    .paper-nav__li a{
        padding:1rem;
        font-size:1rem
    }
}
html.webp #app{
    background: #e5007f;
}
#app{
    width:100%;
    width:100%;
    margin:0 auto;
    background:url("../images/topbg.jpg") repeat-x center top,#c31047;
    background-position:center top;
    background-repeat:repeat-x
}
.container{
    max-width:1200px;
    width:100%;
    margin:0 auto;
    margin-bottom:1rem;
    position:relative
}
.h1-seo{
    position:absolute;
    top:0;
    left:0;
    -webkit-transform:translate(-10000%);
    -ms-transform:translate(-10000%);
    transform:translate(-10000%)
}
.h2-seo{
    position:absolute;
    top:0;
    left:0;
    -webkit-transform:translate(-10000%);
    -ms-transform:translate(-10000%);
    transform:translate(-10000%)
}
#btn{
    display:none
}
.onsale-ready{
    line-height:436px;
    height:500px;
    padding:2rem;
    text-align:center;
    font-size:2rem;
    font-weight:bold;
    background:#5f1d2a;
    border-radius:12px;
    color:#fff
}
footer{
    width:100%;
    text-align:center;
    color:#fff;
    background-color:#000;
    padding:.8rem
}
.disabled{
    pointer-events:none !important;
    background-color:#d8d8d8 !important;
    color:#a2a2a2 !important
}
#menu{
    display:none
}
@media screen and (max-width: 768px){
    html.webp #app{
        background:#8f1d3a
    }
    .container{
        padding:.5rem
    }
}
@media screen and (max-width: 576px){
    .container{
        padding:.25rem
    }
    footer{
        font-size:.8rem
    }
    #btn{
        width:60px;
        height:40px;
        background-image:url("../images/btn.png");
        display:block;
        margin-left:auto;
        cursor:pointer
    }
    #menu a{
        display:block;
        width:100%;
        padding:1.5rem 0;
        text-decoration:none;
        background-color:#031421;
        text-align:center;
        border-radius:0;
        color:#fff;
        font-size:1.25rem;
        border-bottom:1px solid #053154
    }
}
@media screen and (max-width: 424px){
    footer{
        padding:.5rem
    }
}