@charset "utf-8";
/*思源黑體*/
@font-face {
    font-family: 'Noto Sans TC VF';
    src: url('https://taiwan-image.bookwalker.com.tw/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;}

/*----*/
.pcNo{ display: block;}
.mNo{ display: none;}
.mINBLpcNO{ display: inline-block;}
.pcINBLmNO{ display: none;}

.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;}
.heighLightBlue{ display: inline-block; margin: 4px 0; background-color: #0052d8; padding: 0 5px;}
.txtGreen{ color: #04ac00;}
.txtRed{ color: #df3f24;}
.txtBrown{ color: #885d00;}
.txtBlue{ color: #2487e0;}
.txtYellow{ color: #f7fc30;}
.txtPurple{ color: #ff98f6;}
.alink{ color: #0076df; text-decoration: none;}
.alink:hover{ text-decoration: underline;}

/*bg-----------------------------------------*/
.bgPadT{ padding-top: 30px;}
.bgPadB{ padding-bottom: 30px}
.bgPadT2{ padding-top: 0;}
.bgPadB2{ padding-bottom: 0;}
.bgPadB3{ padding-bottom: 20px;}
.bgPadTm{ padding-top: 12px;}
.bgPadBm{ padding-bottom: 12px;}
.bgPadTm2{ padding-top: 15px;}
.bgPadBm2{ padding-bottom: 15px;}

.bg0{ background-image: url(https://cp-img.bookwalker.com.tw/event/2026/20260501_blaward17/images/bg0.jpg); background-position: top center; background-size: cover;}
.bg1{ background-image: url(https://cp-img.bookwalker.com.tw/event/2026/20260501_blaward17/images/bg1.jpg); background-position: top center; background-size: cover;}
.bg2{ background-image: url(https://cp-img.bookwalker.com.tw/event/2026/20260501_blaward17/images/bg2.jpg); background-position: top center; background-size: cover;}
.bg3{ background-image: url(https://cp-img.bookwalker.com.tw/event/2026/20260501_blaward17/images/bg3.jpg); background-position: top center; background-size: cover;}
.bg4{ background-image: url(https://cp-img.bookwalker.com.tw/event/2026/20260501_blaward17/images/bg4.jpg); background-position: top center; background-size: cover;}
.bg5{ background-image: url(https://cp-img.bookwalker.com.tw/event/2026/20260501_blaward17/images/bg5.jpg); background-position: top center; background-size: 170%;}

/*--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;}


/*刊頭動畫*/
.headerStar1{ animation: headerStar1 4s infinite; opacity: 0;}
@keyframes headerStar1 { 
    0%{ opacity: 0;}
    33%{opacity: 1;}
    66% { opacity: 0;}
    100% { opacity: 1;}
}
.headerStar2{ animation: headerStar2 2s infinite; opacity: 0;}
@keyframes headerStar2 { 
    0%{ opacity: 0;}
    50%{opacity: 1;}
    100% { opacity: 0;}
}
.headerStar3{ animation: headerStar3 5s infinite;}
@keyframes headerStar3 { 
    0%{ opacity: 1;}
    50%{opacity: 0;}
    100% { opacity: 1;}
}

.headerP1 img{ animation: headerP1 3s infinite; transform-origin: bottom right;}
@keyframes headerP1 { 
    0%{ transform: rotate(0);}
    50%{ transform: rotate(1deg);}
    100% { transform: rotate(0);}
}
.headerP2 img{ animation: headerP2 3s infinite; transform-origin: top left;}
@keyframes headerP2 { 
    0%{ transform: rotate(0);}
    50%{ transform: rotate(1deg);}
    100% { transform: rotate(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;}

/*常用*/
.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%;}

/*--BL award是什麼-----------------------------------------*/
.whatBox{ padding: 2%; background-color: rgba(255,255,255,0.2); border-radius: 15px; box-shadow: rgba(255,255,255,0.3) 0 0 30px;}
.whatBox > li{ font-family: 'Noto Sans TC VF', sans-serif; font-weight: 300; padding: 6%; list-style: none; border: #08285c 3px solid; box-shadow: inset #08285c 0px 0px 20px; font-size: 1.6rem; color: #fff; font-weight: bold; border-radius: 15px;}

/*--優惠券專區+更多大賞作品-----------------------------------------*/
.getBox{ max-width: 650px; margin: 0 auto; /*padding-top: 35px;*/}
.getHover img{ animation: getHover 2s infinite;}
@keyframes getHover { 
    0%{ transform: scale(1);}
    50%{ transform:  scale(0.9);}
    100% { transform:  scale(1);}
}

/*--MAU活動-----------------------------------------*/
.mauConWidth{ overflow: hidden; margin: 0 auto; /*border: #34582d 8px solid; background-color: rgba(129,161,80,0.95); border-radius: 20px;*/ box-sizing: border-box;}
.mauConWidthPadd{ padding: 3% 0 0 0;}
.borderDeco{ margin-bottom: 15px;}
.couponBox{ padding: 0 3%;}

/*按鈕動畫*/
.specialBtn{ display: block; animation: specialBtn 2s infinite;}
.specialBtn2 #btmMsg2{ display: block; animation: specialBtn2 2s infinite;}
@keyframes specialBtn { 
    0%{ transform: scale(1) translateX(0);}
    50% { transform: scale(0.9) translateX(-10px);}
    100% { transform: scale(1) translateX(0);}
}
@keyframes specialBtn2 { 
    0%{ transform: scale(1) translateX(0);}
    50% { transform: scale(0.9) translateX(15px);}
    100% { transform: scale(1) translateX(0);}
}

/*按鈕動畫(全體會員好禮)*/
.specialAllBtn{ display: block; animation: specialAllBtn 2s infinite;}
@keyframes specialAllBtn { 
    0%{ transform: scale(1) translateX(0);}
    50% { transform: scale(0.9) translateX(10px);}
    100% { transform: scale(1) translateX(0);}
}

/*按鈕滑入*/
.specialBtn img,.specialBtn2 #btmMsg2 img{ transition: 0.4s;}
.specialBtn img:hover,.specialBtn2 #btmMsg2 img:hover{ transform: translateY(10px);}

/*按鈕已登記*/
.specialBtn2 #btmMsg2.checked{ animation: none;}
.specialBtn2 #btmMsg2.checked img:hover{ transform: translateY(0);}
.listBox li a.specialBtn2:hover{ transform: translateY(0);}

/*資格+剩餘數量*/
.giftNum{ display: inline-block; position: absolute; top: 82%; left: 9%; margin: 5% 0 0 5%; padding: 2px 10px; border: #b19552 3px solid; font-size: 1.5rem; color: #002a5b; font-weight: bold; background-color: #fff; border-radius: 100px;}
.giftNum span{ color: #c620b2;}
.giftNum b{ color: #c620b2;}

/*登記外框*/
.special3Border{ margin: -14% 2% 0 2%; padding-top: 16%; background-color: rgba(109,255,254,0.2); border-radius: 30px;}

/*--註冊贈書-----------------------------------------*/
.freeBookTxt{ margin-top: 20px; font-size: 2rem; color: #ffffff; text-align: center; font-weight: bold; line-height: 1.4;}
.freeBookTxt span{ color: #d0ec4a;}
.freeBook{ margin-top: 20px; border: #ffffff 5px solid; border-radius: 5px;}

/*立即註冊鈕*/
.freeBookBtn{ display: block; max-width: 240px; width: 60%; margin: 30px auto 0 auto; transition: 0.4s;}
.freeBookBtn:hover{ transform: translateY(-10px);}
.freeBookBtn img{ animation: freeBookBtn 2s infinite;}
@keyframes freeBookBtn { 
    0%{ transform: scale(1);}
    50% { transform: scale(0.9);}
    100% { transform: scale(1);}
}

/*書封打碼+壓書名*/
.r18blur{ filter: blur(5px);}
.r18bookName{ position: absolute; top:0; bottom: 0; left: 0; right: 0; margin: auto; font-size: 1.8rem; font-weight: bold;
    display: flex; align-items: center; justify-content: center; width: 80%;
    text-shadow: 0px 0px 5px #fff, 0px 0px 5px #fff, 0px 0px 5px #fff, 0px 0px 5px #fff;
}

/*--推薦書區-----------------------------------------*/
/*標題*/
.mainTitle2 .bookTitle{ width: 90%;}
/*提醒標示*/
.btnGet{ position: absolute; top: 16%; right: -4%; width: 35%; animation: btnGet 2s infinite;}
@keyframes btnGet { 
    0%{ transform: scale(1);}
    50%{ transform:  scale(0.9);}
    100% { transform:  scale(1);}
}
/*標題另外加說明文字*/
.mainTitleNotice{ padding: 10px 15px 0 15px; font-size: 1.3rem; color: #ffffff; text-align: center;}

/*------書籍列表------*/
.bookList{ width: 82%; margin: 0 auto; padding-top: 10px;}

/*書籍漸層外框+漸層底色*/
.bookBorderBg{ position: relative; padding: 10%; border: 2px solid; border-image: linear-gradient(to bottom, #777777, #e8e8bb) 1; 
 background: linear-gradient(to bottom, rgba(0, 0, 0, 0.55) 0%, rgba(0, 0, 0, 0.2) 40%, rgba(0, 0, 0, 0.1) 100%); 
}

/*邊框星星裝飾*/
.bookDeco{ position: absolute; top: 2%; right: 0; left: 0; width: 90%; margin: 0 auto;}
/*放大鏡裝飾*/
.bookRead{ position: absolute;  bottom: -15%; right: -20%; width: 26%; z-index: 1;}

/*書名*/
.bookName{ margin-bottom: 15px; font-family: 'Noto Sans TC VF', sans-serif; font-weight: 900; font-size: 2.2rem; text-align: center;
    background: linear-gradient(135deg,  #75eaff 0%,#d4d4d4 66%,#d4d4d4 100%);/*書名文字漸層色*/
    background-clip: text; -webkit-background-clip: text;/*製作文字剪裁遮色片，把背景的漸層色裁入文字區域內*/ 
    color: transparent;

    /*文字設定2行的高度、水平垂直置中*/
    display: flex;
    align-items: center;
    justify-content: center;
    height: 5.8rem;
}
/*文字超過2行顯顯示[...]*/
.bookName h4{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-all;
    line-height: 1.2;
}

/*hashTag標籤*/
.bookTag{ padding-top: 10px; text-align: center; border-top: #6d6d6d 1px solid; /*min-height: 10.4rem;*/}
.bookTag p{ display: table; margin: 8px auto; padding: 2px 10px; background-color: #d4d4d4; 
    font-family: 'Noto Sans TC VF', sans-serif; font-weight: 500; font-size: 1.45rem; color: #022d45; font-weight: bold; border-radius: 10px;
}

/*看更多*/
.bookMore{ margin-top: 15px;}

/*--抓站上書封(註冊贈書+推薦書共用)-----------------------------------------*/
/*書封比例*/
.webBookCover{ position: relative; width: 100%; margin-top: 15px; aspect-ratio: 600/883;/*書封比例*/}
/*書封邊框+陰影*/
.webBookCover a{ /*overflow: hidden;*/ box-sizing: border-box; width: 100%; height: 100%; position: absolute; top: 0; left: 0; right: 0; margin: 0 auto; border-radius: 3px;}
.swiper .webBookCover a{ border: #ffffff 2px solid;}/*註冊贈書樣式*/
.bookList .webBookCover a{ border: #ffffcc 2px solid; box-shadow: rgba(0,0,0,0.3) 0 0 3px;}/*推薦書樣式*/

/*img填滿外框設定*/
.webBookCover img{ width: 100%; height: 100%; 
    object-fit: cover; /*圖片等比例，並填滿外框的寬與高（因此若圖片比例差太多時，可能會有圖片被裁到的狀況）*/
    transform: scale(1.0001);/*用transform觸發瀏覽器重新渲染圖片*/ 
    backface-visibility: hidden;/*避免渲染時的邊緣/閃爍副作用*/
}

/*img縮入外框內(圖片比例差太多，裁到重要部分時補白底)*/
.webBookCover.contain img{
    object-fit: contain; /*圖片等比例縮入外框內（會用白底來補）*/
}
.webBookCover.contain a{
    background-color: #ffffff;/*補的白底可以改顏色*/
}

/*--優惠券活動說明(2026沒有)-----------------------------------------*/
.noticeStyle{ background-color: rgba(144,136,222,0.58); margin-top: 0; padding: 30px 5% 20px 5%;}
.noticeStyle .notice2{ max-width: 1000px; margin: 0 auto; color: #fff;}
.noticeStyle .noticeSecTitle{ color: #ffffff;}
.noticeStyle .notice2 > li > ul > li{ list-style-type: disc;}
.noticeStyle .notice2 > li > ul > li a{ color: #fcffa1;}

/*--MAU活動說明-----------------------------------------*/
.noticeStyle1{ width: 96%; margin: 0 auto; background-color: rgba(0, 0, 0, 0.25); /*border: #3b5d2e 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: #ffffff;}
.noticeStyle1 .noticeTitle{ margin-bottom: 0; padding-top: 30px; padding-bottom: 0; font-size: 1.8rem; /*background-color: #3b5d2e;*/ color: #ffffff;}
.noticeStyle1 .noticeSecTitle{ color: #ffffff; font-size: 1.8rem;}
.noticeStyle1 .notice2 > li{ margin-right: 0;}
.noticeStyle1 .notice2 > li > ul > li{ list-style-type: decimal;}
.noticeStyle1 .notice2 a{ color: #82fff5;}

/*--社群活動-----------------------------------------*/
/*上方裝飾人物*/
.eventTopDeco{ width: 70%; margin: 0 auto;}

/*hashTag*/
.hashTagTxt{ background-color: #0052d8;}
.hashTagTxt > li:first-child{ padding-bottom: 30px;}

/*文字*/
.hashTagTxt p{ width: 80%; margin: 0 auto; padding: 0 2%; background-color: #fff554; color: #0052d8; font-size: 2.1rem; font-family: 'Noto Sans TC VF', sans-serif; font-weight: 900; text-align: center;}

/*複製按鈕*/
.hashTagCopy{ width: 70px; margin: 10px auto 0 auto; padding: 5px 20px; background-color: #000000; color: #ffffff; font-size: 1.8rem; font-weight: bold; text-align: center; border-radius: 100px;
    cursor: pointer; user-select: none; transition: transform 0.1s, background-color 0.15s;
}
.hashTagCopy:hover{ background-color: #00307e;/*滑入變色*/}
.hashTagCopy:active{ transform: scale(0.94);/*點擊當下縮小*/}
.hashTagCopy.copied{ background-color: #c664ff;/*已複製變色*/}
/*滑鼠放開動態反應*/
.hashTagCopy.pop{ animation: popBtn 0.25s ease;}
@keyframes popBtn{
    0%   { transform: scale(1); }
    40%  { transform: scale(0.88); }
    75%  { transform: scale(1.08); }
    100% { transform: scale(1); }
}

/*前往活動按鈕*/
.eventBtn img{ animation: eventBtn 2s infinite;}
@keyframes eventBtn { 
    0%{ transform: scale(1);}
    50% { transform: scale(0.9);}
    100% { transform: scale(1);}
}

/*--一般向大賞(2026沒有)-----------------------------------------*/
.moreNormalBn{ border: #a55c33 6px solid; background-color: #904926; border-radius: 5px;}
.moreNormalBn img{ border-radius: 5px;}

/*--fixedBtnBox側邊浮動按鈕-----------------------------------------*/
.fixedBtnBox{ position: fixed; bottom: 115px; 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: 122px;/*調整按鈕大小*/}
.sideBtn img{ height: 100%;}
.sideBtn{ cursor: pointer; position: relative; z-index: 1;}

/*--sweetAlert-----------------------------------------*/
/*預設按鈕文字大小*/.swal2-actions button {font-size: 1.4rem !important;}


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

    /*----*/
    .pcNo{ display: none;}
    .mNo{ display: block;}
    .mINBLpcNO{ display: none;}
    .pcINBLmNO{ display: inline-block;}

    /*bg-----------------------------------------*/
    .bgPadT{ padding-top: 60px;}
    .bgPadT2{ padding-top: 15px;}
    .bgPadB{ padding-bottom: 90px;}
    .bgPadB2{ padding-bottom: 0;}
    .bgPadB3{ padding-bottom: 40px;}

    .bg0, .bg1, .bg2, .bg3, .bg4, .bg5{ background-attachment: fixed;}
    .bg5{ background-size: cover;}

    .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: 900px;}

    .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%;}

    /*--BL award是什麼-----------------------------------------*/
    .whatBox{ padding: 3%; border-radius: 20px;}
    .whatBox > li{ padding: 6%; border-width: 4px; box-shadow: inset #08285c 0px 0px 40px; font-size: 2rem;}

    /*--MAU活動-----------------------------------------*/
    .mauConWidth{ width: 100%; border-radius: 25px;}
    .mauConWidthPadd{ padding: 0 5% 0 5%;}
    .mauConWidthPadd.listBox > li:nth-child(1){ padding-top: 5%;}

    /*--優惠券專區+更多大賞作品-----------------------------------------*/
    .getBox{ /*padding-top: 60px;*/}

    /*--推薦書區-----------------------------------------*/
    /*標題*/
    .mainTitle2 .bookTitle{ width: 100%;}
    /*提醒標示*/
    .btnGet{ top: 25%; right: -14%; width: 32%;}
    /*標題另外加說明文字*/
    .mainTitleNotice{ padding: 0 15px 0 15px;}

    /*------書籍列表------*/
    .bookList{ width: 100%; padding-top: 20px;}
    /*hashTag標籤*/
    .bookTag p{ padding: 3px 10px 1px 10px;}
    /*看更多*/
    .bookMore{ max-width: 550px; margin: 30px auto 0 auto;}

    /*--優惠券活動說明-----------------------------------------*/
    .noticeStyle{ padding: 50px 5% 45px 5%;}

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

    /*--社群活動-----------------------------------------*/
    /*上方裝飾人物*/
    .eventTopDeco{ max-width: 350px;}

    /*文案區*/
    .eventBox{ max-width: 600px; margin: 0 auto;}

    /*hashTag文字*/
    .hashTagTxt p{ font-size: 3rem;}

    /*--一般向大賞(2026沒有)-----------------------------------------*/
    .moreNormalBn{ width: 85%; margin: 0 auto; border-width: 10px; border-radius: 10px;}

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

    .sideBtn{ height: 167px;/*調整按鈕大小*/}
    .sideBtn:hover{ transform: scale(0.98) translateX(5px);}

    /*--hover animate--------------------------------*/
    .getHover, .btnGet a, .bookCover a, .bookMore a, .moreNormalBn a, .eventBtn{ display: block; transition: 0.4s;}
    .getBox:hover .getHover, .eventBtn:hover{ transform: rotate(-6deg);}
    .btnGet a:hover{ transform: translateY(-10px);}
    .bookCover a:hover, .bookMore a:hover, .moreNormalBn a:hover{ transform: scale(0.9);}
}


/*--768-1024(Pad)------------------------*/
@media screen and (min-width:768px) and (max-width:1023px) { 
    .bg1, .bg1, .bg2, .bg3, .bg4, .bg5{ background-attachment: inherit;}
    .bg5{ background-size: cover;}
    .wrapperHalf > li{ padding: 2%;}
    .mainTitle3{ width: 90%;}
    .areaWidth2{ max-width: 700px;}
}

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

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

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

.btnGet img{ aspect-ratio: 1/1;}
.bookList img{ aspect-ratio: 442/820;}
.bookMore img{ aspect-ratio: 761/130;}
.bookDeco img{ aspect-ratio: 442/35;}
.bookRead img{ aspect-ratio: 1/1;}

/*--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;}