@charset "utf-8";
/*思源黑體*/
/* @font-face {
    font-family: 'Noto Sans TC VF';
    src: url('../fonts/NotoSansTC-VariableFont_wght.woff2') format('woff2-variations');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
} */

/* a:hover{ opacity:0.9;} *//*滑鼠滑入半透明*/
/*--loading載入中--------------------------------*/
/*遮罩樣式*/
.overlay{ position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); /*半透明背景*/ display: flex; justify-content: center; align-items: center; z-index: 9999;/*確保遮罩層在最上層*/}

/*spinner樣式+旋轉動畫*/
.spinner{ border: 8px solid rgba(0, 0, 0, 0.1); border-left: 8px solid #fff; border-radius: 50%; width: 50px; height: 50px; margin: 0 auto; animation: spin 1s linear infinite;}
@keyframes spin { 0% { transform: rotate(0deg);} 100% { transform: rotate(360deg);}}

/*loading文字*/
.loadingTxt{ margin-top: 10px; font-size: 2rem; color: #fff; font-weight: bold;}

/*--PC、M的隱藏/顯示設定--*/
.pcNo{ display: block;}
.mNo{ display: none;}
.mINBLpcNO{ display: inline-block;}
.pcINBLmNO{ display: none;}

/*--特殊色：文字、連結、heighLight--*/
.heighLightPurple{ background-color: #6f64d1; padding: 0 5px;}
.heighLightGreen{ display: inline-block; margin: 4px 0; background-color: #a7e0a6; padding: 0 5px;}
.heighLightRed{ display: inline-block; margin: 4px 0; background-color: #e7cdc9; padding: 0 5px;}
.txtPurple{ color: #9428d8;}
.txtPink{ color: #e700ef;}
.txtGreen{ color: #04ac00;}
.txtRed{ color: #df3f24;}
.txtBrown{ color: #885d00;}
.txtBlue{ color: #2487e0;}
.txtYellow{ color: #f7fc30;}
.alink{ color: #0076df; text-decoration: none;}
.alink:hover{ text-decoration: underline;}

/*區塊上下間距-----------------------------------------*/
.bgPadT{ padding-top: 30px;}
.bgPadB{ padding-bottom: 30px}

.bgPadT2{ padding-top: 1px;}
.bgPadB2{ padding-bottom: 1px;}

.bgPadB3{ padding-bottom: 20px;}

.bgPadTm{ padding-top: 12px;}
.bgPadBm{ padding-bottom: 12px;}

.bgPadTm2{ padding-top: 15px;}
.bgPadBm2{ padding-bottom: 15px;}

/*背景圖-----------------------------------------*/
.bg1{ background-color: #d0d0d0; background-image: url(https://cp-img.bookwalker.com.tw/event/2025/20251215_giftparty/images/bg1.png); background-position: top center; background-size: 100%;}
.bg2{ background-image: url(https://cp-img.bookwalker.com.tw/event/2025/20251215_giftparty/images/bg2.jpg); background-position: top center; background-repeat: repeat;}
.bg2Deco{ background-image: url(https://cp-img.bookwalker.com.tw/event/2025/20251215_giftparty/images/bg2_deco.png); background-position: top center; background-size: 150%; background-repeat: no-repeat;}
.bg3{ background-image: url(https://cp-img.bookwalker.com.tw/event/2025/20251215_giftparty/images/bg3.jpg); background-position: top center; background-size: 400%;}

/*--header-----------------------------------------*/
/* .headerW{ max-width: 800px; margin: 0 auto; border: #f2dcee 8px solid; overflow: hidden;} */
.headerBox{ overflow: hidden; position: relative;}
.headerBox img{ display: block; width: 100%;}
.headerH{ width: 100%;}

.headerPicFull{ position: absolute; top: 0; left: 0; width: 100%;}
.headerPicHalf{ position: absolute; top: 0; width: 50%;}
.headerPicHalf.left{ left: 0;}
.headerPicHalf.right{ right: 0;}

.headerPic{ position: absolute;}

/*刊頭動畫*/
.headerMainTitle img{ animation: headerMainTitle 1.5s infinite;}
@keyframes headerMainTitle {
    0%{ transform: scale(1);}
    50%{ transform: scale(0.98);}
    100% { transform: scale(1);}
}
.headerDeco{ animation: headerDeco 1.5s infinite;}
@keyframes headerDeco {
    0%{ transform: translateX(0) translateY(0);}
    50%{ transform: translateX(-10px) translateY(-5px);}
    100% { transform: translateX(0) translateY(0);}
}

/*--contain-----------------------------------------*/
.contain{ overflow: hidden;}
/*區塊寬度*/
.areaWidth{ position: relative; width: 94%; margin: 0 auto;}
.areaWidth2{ position: relative; width: 94%; margin: 0 auto;}
.areaWidth3{ position: relative; width: 96%; margin: 0 auto;}

/*主標寬度*/
.mainTitle{ width: 92%; margin: 0 auto 8px auto;}
.mainTitle2{ width: 100%; margin: 0 auto;}
.mainTitle3{ width: 100%; margin: 0 auto 0 auto; position: relative;}
.insideTitle{ width: 90%; margin: 0 auto;}

/*常用(定位+圖片block)*/
.posiRelative{ position: relative;}
.imgBlock100 img{ display: block; width: 100%;}

/*PC+M同版*/
.areaWidthM{ position: relative; width: 94%; margin: 0 auto;}
.mainTitleM{ width: 100%;}
.wrapperHalf > li{ padding: 2%;}

/*--禮物交換區-----------------------------------------*/
/*主標*/
.giftMainTitle{ background-color: #000000;}
.giftMainTitle h3{ width: 75%; max-width: 900px; margin: 0 auto;}

/*--漫畫列表--*/
.giftChangeBox{}
.giftChangeBox > li{ padding-top: 12px; padding-bottom: 25px; border-bottom: #a0a0a0 1px dashed;}

/*icon：ig、個人首頁*/
.giftAuthorIcon1{ position: absolute; width: 75%; right: 0; top: 0;}
.giftAuthorIcon2{ position: absolute; width: 75%; left: 10%; top: 0;}

/*作者名稱*/
.giftAuthorName{ position: absolute; width: 105%; left: 2%; bottom: -9%; z-index: 1;}

/*領取btn:特製漫畫*/
.mangaBtn{ position: absolute; width: 100%; top: 0; left: 0; z-index: 10;}
.noneEvents{ pointer-events: none;}
/*領取btn:ibon序號*/
.ibonBtn{ position: absolute; width: 70%; bottom: 0; left: 0;}

/*資格、數量*/
.giftNum{ width: 90.2%; margin: 6px 0 0 4.5%; padding: 6px 5px; background-color: #000000; font-size: 1.9rem; color: #fff; font-weight: bold; text-align: center; border-radius: 3px; box-sizing: border-box;}
.giftChangeBox > li:nth-child(1) .giftNum span{ color: #b3ff59;}
.giftChangeBox > li:nth-child(2) .giftNum span{ color: #fa7eff;}
.giftChangeBox > li:nth-child(3) .giftNum span{ color: #fff960;}
.giftChangeBox > li:nth-child(4) .giftNum span{ color: #97edff;}

/*交換禮物說明*/
.giftNotice.m{ margin-top: 8px; font-size: 1.4rem; color: #da1616; text-align: center; font-weight: bold;}

/*--活動說明-----------------------------------------*/
.noticeStyle1{ width: 90%; margin: 0 auto; background-color: #ffffff; border: #000000 8px solid; border-radius: 15px;}
.noticeStyle1{ margin-top: 15px;}
.noticeStyle1 .noticeCon{ margin: 0 auto; padding: 20px 6% 20px 6%;}
.noticeStyle1 .noticeCon .notice2{ /*max-width: 1000px;*/ margin: 0 auto; color: #333333;}
.noticeStyle1 .noticeTitle{ margin-bottom: 0; padding-bottom: 10px; font-size: 1.8rem; background-color: #000000; color: #ffffff;}
.noticeStyle1 .noticeSecTitle{ color: #000000; font-size: 1.8rem;}
.noticeStyle1 .notice2 > li{ margin-right: 0;}
.noticeStyle1 .notice2 > li > ul > li{ list-style-type: decimal;}
.noticeStyle1 .notice2 a{ color: #2189e0;}

/*ibon點擊才展開*/
.slideNotice .noticeCon{ display: none;}
.noticeSlide{ display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; margin-left: 5px; font-size: 1.8rem; color: #000000; background-color: #b3ff59; border-radius: 3px; cursor: pointer;}
.noticeSlide .bwi-delete{ font-size: 1.6rem;}
/*--派對摸彩區-----------------------------------------*/
.lotteryBox{ /*width: 90%;*/ margin: 0 auto;}
/*輪播標題----------*/
.lotteryTitle{ display: flex; align-items: center; width: calc(100% - 130px); height: 50px; padding: 0 0 0 5px; background-color: #000000; border-radius: 5px;}
.lotteryTitle img{ width: 200px;}

/*swiper設定----------*/
.swiperBox{ position: relative; width: 100%;/*寬度自訂*/ margin: 10px auto 0 auto;/*置中*/ padding: 0 0 35px 0;/*箭頭放在圖外面:依照箭頭跟點點的大小調整數值*/}

/*點點樣式設定*/
.swiperBox .swiper-pagination-bullet{ background: #2e2e2e;}

/*點點被選到時的顏色*/
.swiperBox .swiper-pagination-bullet-active{ background: #007aff;}

/*箭頭顏色*/
.swiperBox .swiper-button-next:after, .swiperBox .swiper-button-prev:after{ display: none;/*移除預設箭頭*/}
.swiperBox .swiper-button-next, .swiperBox .swiper-button-prev{ color: #ffffff; font-size: 2.5rem;/*設定箭頭大小*/}

/*箭頭底色*/
.mySwiper1.swiperBox .swiper-button-next, .mySwiper1.swiperBox .swiper-button-prev{ background-color: #84d425;}
.mySwiper2.swiperBox .swiper-button-next, .mySwiper2.swiperBox .swiper-button-prev{ background-color: #e553ff;}

/*箭頭底色(無法點擊時)*/
.swiper-button-next.swiper-button-disabled,
.swiper-button-prev.swiper-button-disabled{ opacity: 0.5;}

/*箭頭底色大小*/
.swiperBox .swiper-button-next,
.swiperBox .swiper-button-prev{ width: 50px; height: 50px; border-radius: 5px;}

/*箭頭位置設定*/
.swiperBox .swiper-button-next{ top: -38px; right: 0;}
.swiperBox .swiper-button-prev{ top: -38px; right: 60px; left: inherit;}

/*數量點點顏色*/
.mySwiper1.swiperBox .swiper-pagination-bullet-active{ opacity: 1; background-color: #62b400;}
.mySwiper2.swiperBox .swiper-pagination-bullet-active{ opacity: 1; background-color: #e553ff;}
.swiper-pagination-bullet{ opacity: 0.5;}

/*圖片外框*/
.swiper{ overflow: hidden; border: #000000 3px solid; border-radius: 10px;}

/*swiper設定(手機版)----------*/
/*輪播標題----------*/
.lotteryTitleM{ display: flex; justify-content: center; align-items: center; width: calc( 100% - 10px); height: 50px; margin-top: 30px; padding: 0 0 0 10px; background-color: #000000; border-radius: 5px;}
.lotteryTitleM img{ width: 220px;}

/*箭頭底色*/
.mySwiper3.swiperBox .swiper-button-next, .mySwiper3.swiperBox .swiper-button-prev{ background-color: #000000; opacity: 0.3;}

/*箭頭位置設定*/
.mySwiper3.swiperBox .swiper-button-next{ right: -3%; top: calc(50% - 35px); font-size: 3rem; width: 40px; height: 60px;}
.mySwiper3.swiperBox .swiper-button-prev{ right: inherit; left: -3%; top: calc(50% - 35px); font-size: 3rem; width: 40px; height: 60px;}

/*數量點點顏色*/
.mySwiper3.swiperBox .swiper-pagination-bullet-active{ opacity: 1; background-color: #000000;}

/*摸彩按鈕----------*/
.lotteryBtnBox{ width: 100%; max-width: 400px; margin: 0 auto;}
.lotteryBtn{ margin-top: 15px; cursor: pointer;}
.lotteryBtnBox .giftNum{ width: 100%; margin: 5px 0 0 0; padding: 5px; font-size: 2rem;}
.lotteryBtnBox.green .giftNum span{ color: #b3ff59;}
.lotteryBtnBox.purple .giftNum span{ color: #fa7eff;}
.giftNum i{ color: #fffb00; font-size: 1.6rem;}

/*--推薦書區-----------------------------------------*/
.bookList{ width: 80%; max-width: 280px; margin: 0 auto;}
.listBox.bookList > li{ padding-top: 15px;}
.bookList > li:nth-child(odd) .bookRead, .bookList > li:nth-child(even) .bookCover{ margin-top: -5px;}
.bookRead{ position: relative;}

/*--fixedBtnBox浮動按鈕-----------------------------------------*/
.fixedBtnBox{ position: fixed; bottom: 120px; right: 0;/*按鈕定位(靠右)*/ z-index: 101; transform: translateX(100%);/*先把按鈕向右移出畫面*/ transition: transform 0.8s;}
.fixedBtnBoxShow{ transform: translateX(0);/*show的時候再讓按鈕移入畫面*/ transition: transform 0.8s;}
.fixedBtnBox li{ overflow: hidden; margin-bottom: 5px;}

.sideBtn{ float: left; height: 175px;/*調整按鈕大小*/}
.sideBtn img{ height: 100%;}
.sideBtn{ cursor: pointer; position: relative; z-index: 1;}

/*--sweetAlert共用樣式設定-----------------------------------------*/
/*預設按鈕文字大小(一定要放)*/.swal2-actions button{ font-size: 1.4rem !important;}
/*彈窗內容區*/
.custom-html-container{ margin: 1em 0 0.3em;}
/*右上(X)關閉鈕*/
.custom-btn-close{ font-size: 4.5rem;/*(X)按鈕大小*/ color: #000000;/*(X)按鈕顏色*/ margin-top: -32px;/*位置可自訂*/ margin-right: -21px;/*位置可自訂*/ box-shadow: none;}
.custom-btn-close:focus{ box-shadow: none;}

/*移除套件按鈕預設樣式*/
.custom-btn-styled,
.custom-btn-styled:active,
.custom-btn-styled:hover{ background-color: transparent !important; background-image: none !important;}
.custom-btn-styled:focus{ border: 0 !important; box-shadow: none;}
.custom-btn-styled{ box-shadow: none !important;}

/*按鈕樣式設定----*/
.custom-btn-styled { padding: 0; margin: 0.625em; font-size: 1.4rem; cursor: pointer;}
/*文字按鈕*/
.custom-btn-styled .sweetBtn{
    display: inline-block;
    margin: 0;
    padding: 16px 5px 18px 5px; /*按鈕內間距*/
    min-width: 130px; /*按鈕最小寬度*/
    font-size: 1.7rem; /*按鈕字體大小*/
    background-color: #000000; /*按鈕底色*/
    color: #fff; /*按鈕文字顏色*/
    border-radius: 5px; /*按鈕圓角*/
    font-family: 微軟正黑體,新細明體,"Century Gothic",Arial,sans-serif; /*按鈕字體*/
    font-weight: bold; line-height: 1; text-decoration: none;
}
/*可自行新增需要的顏色按鈕*/
.custom-btn-styled .sweetBtn.red{ background-color: #a50000; color: #fff;} /*紅色按鈕*/
.custom-btn-styled .sweetBtn.blue{ background-color: #0085de; color: #fff;} /*藍色按鈕*/
.custom-btn-styled .sweetBtn.peach{ background-color: #a91168; color: #fff;} /*桃紅色按鈕*/


/*圖片按鈕*/
.custom-btn-styled .sweetPicBtn{
    width: 145px;/*按鈕寬度*/
}

/*彈窗外框(不需要可直接刪除或隱藏)*/
.custom-border{
    /*外框顏色+粗細*/
    border: #000 5px solid;
    /*外框圓角*/
    border-radius: 20px;
}

/*彈窗文字內容*/
.sweetPopTxt{ font-size: 1.6rem;}
.popTxtStyle1{ font-size: 2.2rem; color: #000000; font-weight: bold;}
.popTxtImpor{ color: #a400ea;}
.popTxtImpor i{ font-size: 3rem;}

/*按鈕動態--------*/
.scaleAni img{ animation: scaleAni 1.5s infinite;}
@keyframes scaleAni {
    0%{ transform: scale(1);}
    50%{ transform: scale(0.9);}
    100% { transform: scale(1);}
}
.rotateAni img{ animation: rotateAni 3s infinite;}
@keyframes rotateAni {
    0%{ transform: rotate(0);}
    50%{ transform: rotate(3deg);}
    100% { transform: rotate(0);}
}
.translateXAni{ animation: translateXAni 1.5s infinite;}
@keyframes translateXAni {
    0%{ transform: translateX(0);}
    50%{ transform: translateX(10px);}
    100% { transform: translateX(0);}
}

/*--767up(Pc)------------------------*/
@media screen and (min-width:767px) {
    /*--loading載入中--------------------------------*/
    /*loading文字*/.loadingTxt{ font-size: 2.5rem; }

    /*--PC、M的隱藏開啟設定--*/
    .pcNo{ display: none;}
    .mNo{ display: block;}
    .mINBLpcNO{ display: none;}
    .pcINBLmNO{ display: inline-block;}

    /*區塊上下間距-----------------------------------------*/
    .bgPadT{ padding-top: 60px;}
    .bgPadT2{ padding-top: 1cap;}

    .bgPadB{ padding-bottom: 90px;}

    .bgPadB2{ padding-bottom: 1px;}
    .bgPadB3{ padding-bottom: 40px;}

    /*背景圖-----------------------------------------*/
    .bg1, .bg2, .bg3{ background-attachment: fixed; background-size: 100%;}
    .bg2Deco{ background-attachment: fixed; background-size: 100%;}

    .border1, .border2, .border3{ border-width: 15px;}
    .border2{ padding: 25px;}
    .border3{ padding: 25px;}

    /*--header-----------------------------------------*/
    /* .headerW{ border-width: 15px;} */


    /*--contain-----------------------------------------*/
    /*區塊寬度*/
    .areaWidth{ max-width: 1200px; padding-top: 0;}
    .areaWidth2{ max-width: 1300px;}
    .areaWidth3{ max-width: 1600px;}

    /*主標寬度*/
    .mainTitle{ width: 56%; max-width: 500px;}
    .mainTitle2{ width: 65%; max-width: 590px; margin: 0 auto;}
    .mainTitle3{ width: 100%;}

    .wrapper{ width: 40%; max-width: 620px; margin: 0 auto;}
    .wrapperHalf { width: 94%; margin: 0 auto;}
    .wrapperHalf > li{ padding: 2%;}

    /*--禮物交換區-----------------------------------------*/
    /*--漫畫列表--*/
    .giftChangeBox{}
    .giftChangeBox > li{ padding: 15px 15px 25px 15px; border-bottom: 0;}

    /*資格、數量*/
    .giftNum{ font-size: 1.7rem;}

    /*交換禮物說明*/
    .giftNotice.m{ display: none;}
    .giftNotice.pc{ margin-top: 0; margin-bottom: 30px; font-size: 1.4rem; text-align: center; font-weight: bold;}
    .giftNotice.pc span{ color: #da1616;}

    /*--活動說明(書架)-----------------------------------------*/
    .noticeStyle1{ width: 91%; max-width: 1500px; margin-top: 15px;}
    .noticeStyle1 .noticeCon{ padding: 30px 5% 50px 5%;}
    .noticeStyle1 .noticeTitle{ margin-top: 0;}

    /*--派對摸彩區-----------------------------------------*/
    .lotteryBox{ width: 90%; max-width: 910px; margin-top: 15px;}

    /*摸彩按鈕----------*/
    .lotteryList{ width: 90%; max-width: 770px; margin: 0 auto;}
    .lotteryBtnBox{ max-width: inherit;}
    .lotteryBtnBox .giftNum{ margin-bottom: 20px;}

    /*--推薦書區-----------------------------------------*/
    .bookList{ width: inherit; max-width: inherit;}
    .listBox.bookList > li{ padding-top: 30px;}
    .bookList > li:nth-child(odd) .bookRead, .bookList > li:nth-child(even) .bookCover{ margin-top: -5px;}
    .bookRead{ position: relative;}

    /*--fixedBtnBox浮動按鈕-----------------------------------------*/
    .fixedBtnBox{ bottom: 110px;}
    .fixedBtnBox li{ margin-bottom: 8px;}

    .sideBtn{ height: 120px;/*調整按鈕大小*/}

    /*--sweetAlert共用樣式設定-----------------------------------------*/
    /*右上(X)關閉鈕*/
    .custom-btn-close{ font-size: 5.5rem;/*(X)按鈕大小*/}

    /*按鈕樣式設定----*/
    /*圖片按鈕*/
    .custom-btn-styled .sweetPicBtn{
        width: 200px;/*按鈕寬度*/
    }


    /*--hover animate--------------------------------*/
    .listBox li .mangaBtn a:hover, .listBox li .ibonBtn a:hover{ cursor: default; transform: inherit;}
    /*有scaleAni滑入才有滑鼠反應*/
    .listBox li .mangaBtn.scaleAni a:hover, .listBox li .ibonBtn.scaleAni a:hover,
    .listBox li .mangaBtn.scaleAni, .listBox li .ibonBtn.scaleAni{ cursor: pointer;}

    .listBox li .mangaBtn.scaleAni, .listBox li .ibonBtn.scaleAni, .lotteryBtn{ display: block; transition: 0.4s;}
    .listBox li .mangaBtn.scaleAni:hover, .listBox li .ibonBtn.scaleAni:hover, .lotteryBtn:hover{ transform: rotate(-4deg) scale(0.9);}
    /* .recommMore a, .bookCover a, .bookMore a, .moreNormalBn a{ display: block; transition: 0.4s;}
    .recommMore a:hover{ transform: rotate(-6deg);} */
}

/*--768-1024(Pad)------------------------*/
@media screen and (min-width:768px) and (max-width:1024px) {
    /*背景圖-----------------------------------------*/
    .bg1, .bg2, .bg2Deco{ background-attachment: inherit;}
    .bg3{ background-size: cover; background-attachment: inherit;}

    /*--contain-----------------------------------------*/
    /*區塊寬度*/
    .areaWidth2{ max-width: 95%;}
    .areaWidth3{ max-width: 900px;}
    /*主標寬度*/
    .mainTitle3{ width: 90%;}

    .wrapperHalf > li{ padding: 2%;}

    /*--禮物交換區-----------------------------------------*/
    /*--漫畫列表--*/
    .giftChangeBox{}
    .giftChangeBox > li{ padding-top: 12px; padding-bottom: 25px;}
    .giftChangeBox > li:nth-child(1), .giftChangeBox > li:nth-child(2){ border-bottom: #a0a0a0 1px dashed;}

    /*--活動說明-----------------------------------------*/
    .noticeStyle1{ width: 100%; box-sizing: border-box;}

    /*--派對摸彩區-----------------------------------------*/
    .lotteryBox{ width: 100%;}
    /*輪播標題----------*/
    .lotteryTitle img{ width: 150px;}

}

/*--1200以下------------------------*/
@media screen and (min-width:767px) and (max-width:1200px) {
    /*--contain-----------------------------------------*/
    .wrapper { width: 65%; margin: 0 auto;}

    /*區塊寬度*/
    .areaWidth3{ max-width: 900px;}

    /*--header-----------------------------------------*/
    .headerPadWidth{ overflow: hidden;}
    .headerPadWidth .headerBox{ width: 166%; margin-left: -33%;}/*平板刊頭放大(讓左右背景超出可視範圍)*/

    /*--禮物交換區-----------------------------------------*/
    /*--漫畫列表(2個1排)--*/
    .giftChangeBox > li{ width: 50% !important; padding: 12px 15px 30px 15px;}
    .giftChangeBox > li:nth-child(1), .giftChangeBox > li:nth-child(2){ border-bottom: #a0a0a0 1px dashed;}
    .giftChangeBox > li ul li{ padding: inherit;}

    /*資格、數量*/
    .giftNum{ font-size: 1.7rem;}

    /*交換禮物說明*/
    .giftNotice.m{ display: block;}
    .giftNotice.pc{ display: none;}
}

/*--1200-1300(特殊尺寸)------------------------*/
@media screen and (min-width:1199px) and (max-width:1300px) {
    /*--禮物交換區-----------------------------------------*/
    /*--漫畫列表--*/
    .giftChangeBox > li{ padding: 15px 4px 25px 4px;}

    /*資格、數量*/
    .giftNum{ font-size: 1.6rem;}
}

/*--1500以上------------------------*/
@media screen and (min-width:1500px) {
    .wrapperHalf { max-width: 1400px; margin: 0 auto;}

}

/*--320以下小手機------------------------*/
@media screen and (max-width:320px) {
}

.lotteryTitleM img{ aspect-ratio: 565/87;}

.lotteryTitle img{ aspect-ratio: 400/87;}
.mySwiper1 img{ aspect-ratio: 1776/785;}
.mySwiper3 img{ aspect-ratio: 810/1510;}
.lotteryBtn img{ aspect-ratio: 750/172;}

.bookCover img{ aspect-ratio: 750/1022;}
.bookRead img{ aspect-ratio: 750/162;}


/*--animate.css--------------------------------*/
.animate__animated.animate__delay-02s{-webkit-animation-delay:0.2s;animation-delay:0.2s;}
.animate__animated.animate__delay-03s{-webkit-animation-delay:0.3s;animation-delay:0.3s;}
.animate__animated.animate__delay-04s{-webkit-animation-delay:0.4s;animation-delay:0.4s;}
.animate__animated.animate__delay-05s{-webkit-animation-delay:0.5s;animation-delay:0.5s;}
.animate__animated.animate__delay-06s{-webkit-animation-delay:0.6s;animation-delay:0.6s;}
.animate__animated.animate__delay-07s{-webkit-animation-delay:0.7s;animation-delay:0.7s;}
.animate__animated.animate__delay-08s{-webkit-animation-delay:0.8s;animation-delay:0.8s;}
.animate__animated.animate__delay-10s{-webkit-animation-delay:1.0s;animation-delay:1.0s;}
.animate__animated.animate__delay-12s{-webkit-animation-delay:1.2s;animation-delay:1.2s;}
.animate__animated.animate__delay-13s{-webkit-animation-delay:1.3s;animation-delay:1.3s;}
.animate__animated.animate__delay-14s{-webkit-animation-delay:1.4s;animation-delay:1.4s;}