﻿@import"https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&display=swap";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:middle}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1;position:relative;overflow-x:hidden}html{font-size:16px}@media only screen and (max-width: 769px){html{font-size:14px}}@media only screen and (max-width: 480px){html{font-size:12px}}ol,ul,button{margin:0;padding:0}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}*:focus,a:hover,a:active,a:focus,button:focus{text-decoration:none;outline:none}button,a{border:none;font-size:unset;padding:0;margin:0;background:rgba(0,0,0,0);background-color:none;outline:none;border:none}img{max-width:100%;height:fit-content}.tab-content>.tab-pane{height:0;display:block;opacity:0;pointer-events:none}.tab-content>.active{height:auto;opacity:1;pointer-events:auto}.nav-tabs .nav-link,.nav-tabs a.nav-link,.nav-tabs a.nav-link.active,.nav-pills .nav-link,.nav-pills a.nav-link,.nav-pills a.nav-link.active{padding:0;background:rgba(0,0,0,0);background-color:none}.tab-pane{display:none}.tab-pane.active{display:block}body{font-family:"Noto Sans TC","Microsoft JhengHei","Playfair Display",sans-serif,Arial;font-optical-sizing:auto;font-style:normal;line-height:1;font-size:1rem}body p{font-weight:400;font-size:1.25rem}.wrap{position:relative;overflow:hidden;background:url(../images/main_bg.jpg) no-repeat center top/cover;max-width:1920px;min-height:3280px;margin:80px auto 0;transform:translateX(-50%);left:50%}@media only screen and (max-width: 1200px){.wrap{padding-bottom:80px}}#main{position:relative}#main .main-info{display:flex;justify-content:center;height:100%}@media only screen and (max-width: 769px){#main .main-info{flex-direction:column}}#main .main-info .char{margin:-38px 0 0 -15px}@media only screen and (max-width: 769px){#main .main-info .char{margin:-38px auto 0;max-width:90vw}}#main .main-info .title{margin:173px 0 0 -38px}@media only screen and (max-width: 769px){#main .main-info .title{margin:-65vw auto 0}}#main .main-info .title .date{color:#84b9ff;text-align:center;font-size:1.1875rem}#main .main-info .title .date span{color:#9fb1c7}#main .main-info .title .link{display:flex;justify-content:center;align-items:center;text-align:center;margin:30px 0 0;gap:25px}#main .main-info .title .link a{position:relative;display:inline-flex;width:160px;height:46px;border-radius:25px;font-size:1.125rem;align-items:center;justify-content:center;color:#fff;background:#6685ad;transition:all .3s ease-in-out}@media only screen and (max-width: 769px){#main .main-info .title .link a{width:120px;height:35px}}#main .main-info .title .link a:hover{background:#4774af}@media only screen and (max-width: 480px){#main .main-info .title .link a:nth-of-type(2){display:none}}section{position:relative;text-align:center;margin:-419px 0 0}@media only screen and (max-width: 1200px){section{margin-top:50px}}section .container{flex-direction:row;flex-wrap:wrap;justify-content:center;max-width:1300px}@media only screen and (max-width: 480px){section .container{padding:0px}}section .container .tit{margin-bottom:2.5rem;filter:drop-shadow(0 3px 8px rgba(0, 0, 0, 0.95))}section .container .tit p{padding-top:1.25rem;line-height:1.8;color:#fff;text-shadow:2px 0px 5px #000}section .container .tit p span{color:#a5c8ff;vertical-align:top}section .container .tit p span.note{margin-left:-10px}section .container .title{margin-bottom:2.5rem}section .container .wrapper{background:#0e2542;margin:0 0 2.5rem;padding:2.5rem;display:flex;flex-wrap:wrap;position:relative}section .container .wrapper>[class*=col-]{padding-top:15px;padding-bottom:15px}section .container .wrapper .card{background:rgba(0,0,0,0);border:none;min-height:320px;height:100%}section .container .wrapper .card .title{background:#124087;margin:0}section .container .wrapper .card .title p{color:#fff;padding:0;line-height:3;text-shadow:none}section .container .wrapper .card .content{display:flex;align-items:flex-end;flex-wrap:wrap;justify-content:center;background:#000f21;padding:3.125rem 0;border-top:none;height:100%;gap:2.5rem 0}@media only screen and (max-width: 480px){section .container .wrapper .card .content{padding:15px 0}}section .container .wrapper .card .content .col{display:flex;flex-direction:column;align-items:center;width:270px;flex:0 0 270px}@media only screen and (max-width: 480px){section .container .wrapper .card .content .col{width:auto;flex:1 0 0}}section .container .wrapper .card .content .col .box{position:relative;margin-bottom:4px}section .container .wrapper .card .content .col .box .mug{position:absolute;right:0px;bottom:0px;cursor:pointer}section .container .wrapper .card .content .col .box.pop{cursor:pointer}section .container .wrapper .card .content .col .box.pop::before{content:"";position:absolute;background-position:0 0;background-repeat:no-repeat;background-size:contain;display:block;left:50%;top:100%;transform:translateX(-50%);opacity:0;pointer-events:none;z-index:10;transition:opacity .3s ease-in-out;margin:0 auto}section .container .wrapper .card .content .col .box.pop:hover::before{opacity:1}section .container .wrapper .card .content .col .box img.swipeimage{position:absolute;top:0;left:0;width:min(346px,57vw);height:auto;max-width:none;object-fit:cover;transform:translateX(-50%) translateY(-50%);z-index:9;opacity:0;visibility:hidden;pointer-events:none}section .container .wrapper .card .content .col .box img.swipeimage.swipeimage2{width:min(586px,75vw)}@media only screen and (max-width: 480px){section .container .wrapper .card .content .col .box img.swipeimage.swipeimage2{right:0;left:auto}}section .container .wrapper .card .content .col .item_name{margin-bottom:4px}section .container .wrapper .card .content .col .item_name p{line-height:1.3;color:#fff;text-wrap:nowrap;font-size:1.125rem}section .container .wrapper .card .content .col .item_price{position:relative;background:#4268af;border-radius:15px;margin-bottom:20px;width:200px;height:35px}@media only screen and (max-width: 769px){section .container .wrapper .card .content .col .item_price{width:140px;height:30px}}section .container .wrapper .card .content .col .item_price p{font-size:1.125rem;color:#cfdaed;text-wrap-mode:nowrap;line-height:1.8;display:inline-block;vertical-align:middle}@media only screen and (max-width: 768px){section .container .wrapper .card .content .col .item_price p{font-size:12px}}section .container .wrapper .card .content .col .item_price::before{content:"";position:relative;width:29px;height:29px;background:url("../images/item_price.png") no-repeat center center/contain;margin-right:-4px;display:inline-block;vertical-align:middle}section .container .wrapper .card .content .col span{color:#ffe361;vertical-align:top}section .container .wrapper .card.card2 .col:nth-child(n+6):nth-child(-n+11)::before{content:"限量\a折扣";white-space:pre-line;line-height:1.2;position:absolute;font-size:1rem;display:flex;justify-content:center;align-items:center;top:0;right:30px;width:60px;height:60px;color:#cfdaed;background:#0e2542;border:1px solid #124087;border-radius:50%;z-index:1}@media only screen and (max-width: 480px){section .container .wrapper .card.card2 .col:nth-child(n+6):nth-child(-n+11)::before{width:50px;height:50px;top:-30px;right:10px}}section .container #mug_box{position:fixed;left:50px;top:300px;max-width:80%;opacity:0;pointer-events:none;transition:.3s}section .container #mug_box.active{opacity:1;pointer-events:unset}@media only screen and (max-width: 480px){section .container #mug_box{left:10%}}section .container #mug_box #mug_close{position:absolute;right:-15px;top:-15px;width:30px;height:30px}section .container #mug_box #mug_close::after{content:"X";color:#fff;position:absolute;font-size:20px;line-height:30px;background:#333;right:0;top:0;border:2px solid #fff;border-radius:50%;width:30px;height:30px;opacity:.7}section .container #mug_box #mug_close:hover::after{opacity:1}