@charset "utf-8";
/* a:hover{ opacity:0.9;} *//*滑鼠滑入半透明*/

.pcNo{ display: block;}
.mNo{ display: none;}

.txtGreen{ color: #e2ffb3;}
.txtDeepGreen{ color:#e9ff57}
.alink{ color: #51ffe0 !important; text-decoration: underline;}
.alink:hover{ text-decoration: none;}

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

.bgColor1{ background-image: url(https://cp-img.bookwalker.com.tw/event/2025/20250724/images/bg0.png); background-size: 180%; background-position: top center;}
.bgColor2{ background-image: url(https://cp-img.bookwalker.com.tw/event/2025/20250724/images/bg1.png); background-size: 180%; background-position: top center;}
.bgColor3{ background-image: url(https://cp-img.bookwalker.com.tw/event/2025/20250724/images/bg2.png); background-size: 180%; background-position: top center;}
.bgColor4{ background-image: url(https://cp-img.bookwalker.com.tw/event/2025/20250724/images/bg3.png); background-size: 180%; background-position: top center;}
.bgColor5{ background-image: url(https://cp-img.bookwalker.com.tw/event/2025/20250724/images/bg4.png); background-size: 180%; background-position: top center;}


/*--header-----------------------------------------*/
.headerBox{ overflow: hidden; position: relative; background-color: #7a8996;}
.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;}

/*--contain-----------------------------------------*/
.contain{ overflow: hidden;}
.headerW{ position: relative; width: 100%; margin: 0 auto;}
.areaWidth{ position: relative; width: 94%; margin: 0 auto;}
.areaWidth2{ position: relative; width: 94%; margin: 0 auto;}

.mainTitle{ width: 92%; margin: 0 auto 8px auto;}
.mainTitle2{ width: 85%; margin: 0 auto 8px auto;}
.mainTitle3{ width: 85%; margin: 0 auto 0 auto;}
.mainTitle img,.mainTitle2 img,.mainTitle3 img{ display: block; width: 100%;}

.sp{ position: absolute; top: 20%;}

/*看更多*/
.watchMore{ width: 85%; margin: 20px auto 0 auto;}
.watchMore img{ display: block; width: 100%;}

.gift img{ display: block; width: 100%;}


/*--767up(Pc)------------------------*/
@media screen and (min-width:767px) {
    .pcNo{ display: none;}
    .mNo{ display: block;}

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

    .bgColor1, .bgColor2, .bgColor3, .bgColor4, .bgColor5, .bgColor6, .bgColor7{ background-attachment: fixed; background-size: cover; background-repeat: no-repeat;}

    /*--contain-----------------------------------------*/
    .areaWidth{ max-width: 1023px; padding-top: 0;}
    .areaWidth2{ max-width: 1300px;}
    .mainTitle{ width: 50%;}
    .mainTitle2{ width: 75%; max-width: 1000px;}

    .gift{ max-width: 50%; margin-top: 30px; margin: 0 auto;}

    /*看更多*/
    .watchMore{ max-width: 600px; margin-top: 30px;}

    /*更多更多*/
    .moreBtn{ width: 90%; margin: 0 auto;}


    /*--hover animate--------------------------------*/
    .note a, .watchMore a, .gift a{ display: block; transition: 0.4s;}
    .note a:hover{ transform: scale(0.9);}
    .gift a:hover{ transform: scale(0.9) rotate(5deg);}
    .watchMore a:hover{ transform: scale(0.9);}
}

/*--768-1023(Pad)------------------------*/
@media screen and (min-width:768px) and (max-width:1023px) { 
    .bgColor1, .bgColor2, .bgColor3, .bgColor4, .bgColor5, .bgColor6, .bgColor7{ background-attachment: inherit; background-size: 100%; background-repeat: repeat;}
}

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

/* .bookShelfTitle img{aspect-ratio: 610/180;}
.bookShelfTitle + a img{ aspect-ratio: 500/610;}

.specialBox1 .specialListBox img{ aspect-ratio: 540/320;}
.specialBox2 .specialListBox img{ aspect-ratio: 540/355;}
.specialBtn img, .specialBtn2 img{ aspect-ratio: 249/70 !important;}
.special3Title img{ aspect-ratio: 640/140;}

.nanacoBox img{ aspect-ratio: 530/670;}

.closeDish img, .closeDishT img{ aspect-ratio: 1020/768;}
.bookDessertList a img{ aspect-ratio: 565/540;}
.bookDessert img{ aspect-ratio: 310/540;}
.bookDessertList > li:last-child img{ aspect-ratio: 395/571;}
.bookNightList a img{ aspect-ratio: 516/780;}

.dishName img{ aspect-ratio: 1020/85;}
.dish1b img{ aspect-ratio: 1020/760;}
.closeDish img{ aspect-ratio: 1020/760;}
.closeDishT img{ aspect-ratio: 1020/760;}
.dish1op img{ aspect-ratio: 1020/760;} */


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