/* 各頁面CSS */

body {
  font-size: inherit !important;
  background-color:  #105459;
}

body.ts_02  {
  font-size: inherit !important;
  background-color:  #271967;
}


.ts_A {}
.ts_B { display: none;}

.ts_02 .ts_A { display: none;}
.ts_02 .ts_B { display: block;}

.ts_C {}
.ts_D { display: none;}

.ts_02 .ts_C { display: none;}
.ts_02 .ts_D { display: block;}


/*切換PC置頂選單*/
.cantantBase1 { display: block;background-color: #59421a;}
.cantantBase2 { display: none;}



/* 版頭 */
@media screen and (min-width: 768px){
  .hero { height: 1517px; }
  .hero-title { top:90px; left:370px;margin:0 auto ;}
  .ts_02 .hero-title { top:105px; left:190px; transform-origin: 50% 50%;/*傾斜*/transform: skew(-6deg, -10deg);/*傾斜*/}
 
  .hero-title .lg-text { width: 530px;}
  .ts_02 .hero-title {}
}
@media screen and (max-width: 767px){
  .hero-title {padding: 10vw 0 0;width: 100%;left:0%;}
  .ts_02 .hero-title {padding: 8vw 0 0;width: 54%;left:9%;  
    transform-origin: 50% 50%;/*傾斜*/
    transform: skew(-6deg, -7deg);/*傾斜*/}
}


/* 倒數 */
/** 倒數 **/
.TimerNick { z-index:0; display:inline-block;  height:96px;width:102% ;margin: 0 auto;padding-top:115px;right: 30px;font-weight:500 !important ;}
.ts_02 .TimerNick { z-index:0; display:inline-block; position: absolute; padding-right:14px; height:96px;text-align:right;width:100% ;top:93px;right: 504px;
  font-weight: 900; transform-origin: 50% 50%;transform: skew(-6deg, -9deg);font-weight:500 !important ;}
.TimerNick .FontStyle { display:inline-block; margin:0px 0 0 0 ; padding:0; border:0px;font: bold 35px/38px Century Gothic; color:#FFF; letter-spacing:-1px; text-align:center; background:transparent; width:50px ;font-weight:500 }
.TimerNick div:nth-of-type(2),
.TimerNick div:nth-of-type(3) { width:60px;}
.TimerNick span { display:inline-block; margin:0px 0 0 0 ; padding:0; border:0px; font: bold 35px/38px Century Gothic; color:#FFF;letter-spacing:-1px; text-align:right; background:transparent;font-weight:500 }
.ts_02 .TimerNick span { padding-left:2px; font: bold 35px/38px "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.05em;color: #FFF;  font-weight: 900; transform-origin: 50% 50%; transform: skew(-6deg, -3deg);}
.TimerNick .time_day { font-size: 35px; letter-spacing: .05rem;}
.ts_02 .TimerNick .time_day { font-size: 35px; letter-spacing: .05rem;transform-origin: 50% 50%; transform: skew(-6deg, -3deg);}
    @media screen and (max-width:767px){
        .TimerNick { z-index:2; position: absolute; top:8vw; left:0%; display:inline-block; margin:0; padding-right:0%; width:78%; height:0; padding-bottom:13%; overflow:hidden; text-align:right; color:#FFF;background-size:100%;padding-top:0vw}
        .ts_02  .TimerNick { z-index:2; position: absolute; top:9vw; left:-23vw; display:inline-block; margin:0; padding-right:0%; width:85%; height:0; padding-bottom:13%; overflow:hidden; text-align:right;  /*background:url(m_time_bg.png?t=1786340503383) no-repeat center top; */background-size:100%; transform-origin: 50% 50%; transform: skew(-6deg, -7deg);}
        .TimerNick .FontStyle { display:inline-block; margin:0px 0 0 0 ; padding:0; border:0px; font:  4.5vw/11vw Century Gothic; color:#FFF; /*text-shadow:1px 1px 0px #fff;*/ letter-spacing:-1px; text-align:right; background:transparent;width:5vw ;}
        .TimerNick div:nth-of-type(2),
        .TimerNick div:nth-of-type(3) { width:4vw;}
        .TimerNick span { padding-left:1vw; font: bold 4vw/11vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.05em;color: #FFF;}
        .ts_02  .TimerNick span { padding-left:1vw; font: bold 4vw/7vw "微軟正黑體","Microsoft JhengHei", Arial, Helvetica; letter-spacing: -0.05em;color: #FFF;transform-origin: 50% 50%; transform: skew(-6deg, -7deg);}
        .TimerNick .time_day { font-size: 4vw; letter-spacing: .05rem;}
        .ts_02 .TimerNick .time_day { font-size: 4vw; letter-spacing: .05rem;margin-top:0.5vw ;}
    }




/* 版頭品輪播 */
.top_pd .Area_swiper_box .PD_layout li, .Area_swiper_box .PD_layout li .PD_img img { border-radius: 0!important;}
@media screen and (min-width:768px){
  .top_pd { position: absolute; top: 75px; left: 758px; width: 316px; height: 385px; overflow: hidden; z-index: 9;}
  .top_pd .ly ul, .top_pd .ly ul li { padding: 0;}
  .top_pd .ly ul li .PD_into {text-align: center;}
  .top_pd .ly ul li .PD_into .PD_logo { display: none;}
  .top_pd .ly ul li .PD_into { width: 100%; position: relative; top: 6px;}
  .top_pd .ly ul li .PD_img { width:100%; height: auto;padding: 0px 0.2px 0px;}
  /* 文字 */	
  .top_pd .ly.PD_layout .PD_into h3 {color: #ce2227; width: 100%; font-size: 1.8em;text-align: center;}
}

@media screen and (max-width:767px){
  .top_pd .ly ul li { padding: 0;}
  .top_pd .ly ul li .PD_into .PD_logo { display: none;}
  .top_pd .ly  ul li .PD_into  { padding: .05em 0 0;}
  .top_pd .ly ul li .PD_img { width: 100%; height: auto; padding: 0.3em .2em 0em}
  /*文字*/	
  .top_pd .ly  ul li .PD_into h3 { color: #ce2227; font-size: .9em;}
}

/* hasBG調整 */
@media screen and (min-width:768px){
  .Area_boxstyle.Area_boxstyle--hasBackdrop .Area_boxstyle_box {
    }
  .Area_boxstyle.Area_boxstyle--hasBackdrop:before { background: url(Area_boxstyle_hasbg_top-B.png?t=1786340503383) top center / 100% no-repeat, url(Area_boxstyle_hasbg_bottom-B.png?t=1786340503383) bottom center / 100% no-repeat, url(Area_boxstyle_hasbg_bottom-B.png?t=1786340503383) center top 80px / 100% calc(100% - 80px) no-repeat !important;border-radius: 0 !important;}
}
@media screen and (max-width:767px){
  .Area_boxstyle.Area_boxstyle--hasBackdrop .Area_boxstyle_box {}
  .Area_boxstyle.Area_boxstyle--hasBackdrop:before { background: url(m_Area_boxstyle_hasbg_top-B.png?t=1786340503383) top center / 100% no-repeat, url(m_Area_boxstyle_hasbg_bottom-B.png?t=1786340503383) bottom center / 100% no-repeat, url(m_Area_boxstyle_hasbg_bottom-B.png?t=1786340503383) center top 5vw / 100% calc(100% - 5vw) no-repeat !important;border-radius: 0 !important;}

}

/* 移除公版設定 */
.Area .remove_box_style ul { background-color: transparent; grid-gap: 0;}
.Area .remove_box_style ul li { border: none !important; background-color: transparent;}
@media screen and (max-width:767px){
  .Area .remove_box_style ul { width: 100%; padding: 0;}
}

/* 品牌公版背景設定 */
.PD_layout-D1_01 .PD_slide { background-color: #fcd206;}
.PD_layout-D1_01 .PD h4 { color: #060606; font-weight: 900;}
.PD_layout-D1_01 .PD h4:hover { color: #d71163 !important;}
.PD_layout-D1_01 { padding-bottom: 30px;}
.PD_layout-D1_01 ul { width: 100%;}
.Area_grabmoney_NUM2 .PD_layout-btn li .PD h3 { color: #ffffff; background: #000000;}
@media screen and (max-width:767px){
  .Area_grabmoney_NUM2 .PD_layout-btn { margin-top: -5vw;}
}

/* 熱銷排行 */
.Area_PD3 .PD_layout-btn li .PD h3 { color: #000; background: #fff;}
@media screen and (min-width:768px){ 
  .Area_PD3 .PD_layout-btn { margin-top: 25px;}
}
@media screen and (max-width:767px){
  .Area_PD3 .PD_layout-btn { margin-top: 3vw;}
}

.Area_AD {padding:10px ;}
.Area_AD .Area_swiper_box .PD_layout li .PD_img img{border-radius:20px !important ; }

@media screen and (max-width:767px){
  .Area_AD {padding:3vw 3vw 3vw 1vw;}
}


/* --------------共用素材---自行新增區------------------ */




.top_pd{background: url(top_pd_01.png?t=1786340503383)top center no-repeat;background-size: 100%;height: 360px;position: absolute; top: 95px; right: 5px; z-index: 0;width:18%;}


@media screen and (max-width:767px){
  .Area_logo a::before{display: block;background: url(logo_orange.png?t=1786340503383)top center no-repeat;background-size: 100%;width: 60%;}
  .top_pd{background: url(top_pd_01.png?t=1786340503383)top center no-repeat;background-size: 100%;height: 41vw;position: absolute; top: 2vw; right: 7vw; z-index: 0;width: 28%;}


}


.Area_logo a::before{display: block;background: url(logo.png?t=1786340503383)top center no-repeat;background-size: 100%;}
.fixarea .fix_top a::before{background: url(fixed_Area_top-main.png?t=1786340503383)top center no-repeat;background-size: 100%;}

.ts_03 .Area_logo a::before{display: block;background: url(logo-2.png?t=1786340503383)top center no-repeat;background-size: 100%;}
.ts_03 .fixarea .fix_top a::before{background: url(fixed_Area_top-main-2.png?t=1786340503383)top center no-repeat;background-size: 100%;}




/*登記贈品文案顏色*/
.Area_danji .danji_box ul li .activityText .gifts span { color: #905d00;}          



/* MB選單 */
.Fixedfooter_box {
  background-image: url(Fixedfooter_bg.png?t=1786340503383);
  background-size: cover;
  background-position: center top;
}



/*-----------------------------看更多按鈕從這邊開始------------------------------*/

/*各區看更多按鈕，哪一區不要就:not(.Area17) > .PD_layout-btn*/

.PD_layout-btn li {
  list-style-type: none;
}

.PD_layout-btn .PD h3 {
  color: var(--font-white);
  background-color: #937130 !important;
  transition: all .5s ease-in-out;
}
.PD_layout-btn ul
 { background-color: transparent !important; }
@media screen and (min-width: 768px) {
  .PD_layout-btn .PD h3:hover {
    cursor: pointer;
    color: var(--font-black);
    background-color: #ffe389 !important;
  }
}

/*-----------------------------併版從這邊開始------------------------------*/


/* 品牌公版 */
.PD_layout-D1_01 li{background-color:#ffffff !important;border: 1px solid #000 !important;border-radius: 1em !important;}
.PD_layout.PD_layout-D1_06 .PD h4 b, .PD_layout.PD_layout-D1_06 .PD_into h4 span { display: inline;}



/* 折價券 */
.PD_layout.PD_layout-coupon3 .PD .divine_coupon, .PD_layout.PD_layout-coupon3 .PD .threshold{color: #ffffff;}
@media screen and (max-width:767px){
.PD_layout.PD_layout-coupon3 .PD small.Dis_unit, .PD_layout.PD_layout-coupon3[data-pd-col-pc*="1"] .PD small.Dis_unit{padding-left: 0.5vw;}
.PD_layout.PD_layout-coupon3 .PD .divine_coupon1{top: 43%;}
}


/* 01_活動攻略 */
@media screen and (min-width:768px){ 
.Area_active{margin-bottom: 50px;}
.Area_active .btnx4{margin-bottom: 20px;}  
.Area_active .Area_coupon_sw{margin-bottom: 40px;}
.Area_active .Area_coupon_sw ul{height: 190px;}
}
@media screen and (max-width:767px){
.Area_active{margin-bottom: 0vw;}
.Area_active .btnx4{margin-bottom: 3vw;}  
.Area_active .Area_coupon_sw{margin-bottom: 3vw;}
.Area_active .Area_swiper_box .PD_layout-coupon3{height: 21vw;}
}

/* 02_必買話題熱書 */
@media screen and (min-width:768px){ 
.Area_buy{padding-bottom: 20px;}
}
@media screen and (max-width:767px){
.Area_buy{margin-bottom: 2vw;}
}

/* 04_BN輪播 */
@media screen and (min-width:768px){ 
.Area_banner{margin-bottom: 20px;}
.Area_banner ul{height: 170px;}
}
@media screen and (max-width:767px){
.Area_banner ul{height: 32vw;}
}


/* 05_HOT！書店暢銷 */
@media screen and (min-width:768px){ 
.Area_hot{ margin-bottom: 40px;}
}
@media screen and (max-width:767px){
.Area_hot{margin-bottom: -1vw;}
}

/* 06_登記活動 */
/*登記贈品文案顏色*/
/* .Area_danji .danji_box ul li .activityText .gifts span { color: #1932e6;}                  */
@media screen and (min-width:768px){ 
.Area_danjiall{margin-bottom: -20px;}

}

@media screen and (max-width:767px){
.Area_danjiall{margin-bottom: -1vw;}
}


/* 下方公版 */
@media screen and (max-width:767px){
.Area_down{margin-bottom: 3vw;}
}

/* 電子書9元神券 */
.Area_item .item00 ul  {background-color: transparent; padding: 0;}
.Area_item .item00 ul li {background: url(item01.png?t=1786340503383) top center / 100% no-repeat; border: none;}
/* 顏色 */
.Area_item .PD_layout[data-pd-h3="5"] .PD h3 span{background-color: #fff;}
.Area_item .PD_layout[data-pd-h4="1"] .PD h4{color: #fff;}
.Area_item .PD_layout[data-pd-h4="1"] .PD h4 b{display: none;}
.Area_item .PD_layout .PD p del{color: #ffffff8a;}
.Area_item .PD_layout .PD p{color: #ffda9a;}

@media screen and (min-width:768px){ 
.Area_item {margin-bottom: -40px;}
.Area_item .item00 ul li {height: 564px;}
.Area_item .PD_layout[data-pd-direction=row] .PD_img{position: relative;left: 50px;width: 34%;top: 109px;}
.Area_item .PD_layout[data-pd-into=center] .PD_into{position: relative;left: 150px;top: 110px;}

.Area_item .PD_layout .PD h3{font-size: 20px;}
.Area_item .PD_layout .PD h4{font-size: 28px;}
.Area_item .PD_layout .PD p del{font-size: 18px;}
.Area_item .PD_layout .PD p .Price{font-size: 36px;}

.Area_item .Area_coupon{margin-bottom: 10px;}
.Area_item .item00{margin-bottom: 65px;}

}

@media screen and (max-width:767px){
.Area_item {margin-bottom: -4vw;}
.Area_item .item00 ul li {height: 57vw;}
.Area_item .PD_layout[data-pd-direction=row] .PD_img{position: relative;left: 2.5vw;width: 40%;top: 9vw;}
.Area_item .PD_layout[data-pd-into=center] .PD_into{position: relative;left: 4vw;top: 9vw;}

.Area_item .PD_layout .PD h3{font-size: 16px;}
.Area_item .PD_layout .PD h4{font-size: 20px; margin-bottom:0;}
.Area_item .PD_layout .PD p del{font-size: 16px;}
.Area_item .PD_layout .PD p .Price{font-size: 33px;}

.Area_item .Area_coupon{margin-bottom: 2vw;}
.Area_item .item00{margin-bottom: 4vw;}
}


/* 08_超強品牌 */
@media screen and (min-width:768px){ 
.Area_super{margin-bottom: 30px;}
.Area_super .PD_layout.PD_layout-D1_16 ul .PD .PD_img{max-width: 95%;}
}
@media screen and (max-width:767px){
.Area_super .PD_layout.PD_layout-D1_16 ul{grid-gap: 0;}
.Area_super .PD_layout.PD_layout-D1_16 ul .PD .PD_img{max-width: 90%;} 
}




.top_PD.Area_bestPD_bottom .PD_layout-acPD2 .PD_into{border-radius:.5em ;}
.top_PD.Area_bestPD_bottom .PD_layout-acPD2 .PD_into h4 span{margin-top: 0;}
@media screen and (min-width: 768px) {
	.top_PD{width: 25%;}
	.top_PD .PD_layout li{border: none;}
	.Area_bestPD_bottom{top: 90px!important;}

}
@media screen and (max-width: 767px) {
	.top_PD{width: 33% !important;}
	.top_PD .PD_layout li{border: none;}
	.Area_bestPD_bottom{top: 2vw!important;left: 64vw!important;}
}


/*間距*/
@media screen and (min-width: 768px) {
.Area_bottom {margin-bottom: 60px;}
}

@media screen and (max-width: 767px) {
  .Area_bottom {margin-bottom: 8vw;}
}