/* 各頁面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=1786093812462) 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=1786093812462) top center / 100% no-repeat, url(Area_boxstyle_hasbg_bottom-B.png?t=1786093812462) bottom center / 100% no-repeat, url(Area_boxstyle_hasbg_bottom-B.png?t=1786093812462) 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=1786093812462) top center / 100% no-repeat, url(m_Area_boxstyle_hasbg_bottom-B.png?t=1786093812462) bottom center / 100% no-repeat, url(m_Area_boxstyle_hasbg_bottom-B.png?t=1786093812462) 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=1786093812462)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=1786093812462)top center no-repeat;background-size: 100%;width: 60%;} .top_pd{background: url(top_pd_01.png?t=1786093812462)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=1786093812462)top center no-repeat;background-size: 100%;} .fixarea .fix_top a::before{background: url(fixed_Area_top-main.png?t=1786093812462)top center no-repeat;background-size: 100%;} .ts_03 .Area_logo a::before{display: block;background: url(logo-2.png?t=1786093812462)top center no-repeat;background-size: 100%;} .ts_03 .fixarea .fix_top a::before{background: url(fixed_Area_top-main-2.png?t=1786093812462)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=1786093812462); 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; } } /*文字公版*/ .title2 {width: 79%;} .title ul {padding: 0!important;grid-gap:0!important;} .title ul li {pointer-events: none;} .bg_top {position: absolute;margin: 0 auto;width: 100%;height: auto;top: 0;z-index: 0;} .bg_top img {width: 100%;} .box_txt {position: absolute;margin: 0 auto;width: 100%;height: auto;} .box_txt img {width: 100%;} .txt ul {position: relative;padding: 0;margin: 0;list-style: none;height: 150px;top:0;} .txt ul li { background-color: transparent; pointer-events: none;padding: 0;} .txt .PD_into {padding: 0;} .txt ul li h5 {position: relative;top: 30px;margin: 0;padding: 0;width: 100%;font: 63px/63px "Noto Sans CJK SC";font-weight: 700;text-align: center;overflow: hidden;color: #242424;letter-spacing:-4px;} .txt2 ul {position: relative;padding: 0;margin: 0;list-style: none;height: 95px;top:0;} .txt2 ul li { background-color: transparent; pointer-events: none;padding: 0;} .txt2 .PD_into {padding: 0;} .txt2 ul li h5 {position: relative;top: 23px;right: 188px;margin: 0;padding: 0;width: 100%;font: 44px/44px "Noto Sans CJK SC";font-weight: 600;text-align: center;overflow: hidden;color: #ffffff;letter-spacing:0px;} @media screen and (min-width: 768px){ .Area_boxstyle_title { position: absolute; font-size: 44px; } } @media screen and (max-width:767px){ .title2 {width: 100%;} .bg_top {position: absolute;margin: 0 auto;width: 100%;top:0;} .bg_top img {width: 100%;} .box_txt {position: absolute;margin: 0 auto 0vw;width: 100%;} .box_txt img {width: 100%;} .txt ul {padding: 0;margin: 0;list-style: none;height: 17vw;} .txt ul li { background-color: transparent; pointer-events: none;padding-top: 0;} .txt .PD_into {padding: 0;} .txt ul li h5 {position: relative;top: 3.5vw;margin: 0;padding: 0;width: 100%;font: 6vw/6vw "Noto Sans CJK SC";font-weight: 700;text-align: center;letter-spacing: -0.5vw;overflow: hidden;} .txt2 ul {padding: 0;margin: 0;list-style: none;height: 10vw;} .txt2 ul li { background-color: transparent; pointer-events: none;padding-top: 0;} .txt2 .PD_into {padding: 0;} .txt2 ul li h5 {position: relative;top: 1.5vw;right: 18.5vw;margin: 0;padding: 0;width: 100%;font: 5vw/6.2vw "Noto Sans CJK SC";font-weight: 700;text-align: center;letter-spacing: 0vw;overflow: hidden;} } /* 輪播點點 */ @media screen and (max-width: 767px) { .Area .Area_swiper_box { padding-bottom: 5vw;} } /*今日主打*/ @media screen and (max-width: 767px) { .Area_Department.withBG2 .Area_swiper { margin: 5vw 0 8vw; } } /*超殺爆品 限時搶*/ .Area01 ul {width: 100%;} .Area01 .PD_layout ul {padding:75px 0 20px 0 !important;} .PD_layout[data-pd-btn*=box-1] .PD_btn, .PD_layout[data-pd-btn*=box-2] .PD_btn {background-color: #ffde28;} .Area_24hr {position: relative;/*padding-bottom: 50px;*/} .Area_24hr .TimerNick3 {position: absolute;top: 164px;transform: translateX(-50%);z-index: 15;display:inline-block;padding-right:14px;} .Area_24hr .TimerNick3 .FontStyle3 {display:inline-flex;justify-content:center;align-items:center;width: 52px;height: 50px;font: bold 32px "Century Gothic";color: #ffe389;background: #000000;border-radius: 12px;margin: 0 8px;} .Area_24hr .TimerNick3 span {font: bold 22px "微軟正黑體","Microsoft JhengHei";color: #000000;} @media screen and (max-width:767px){ .Area01 .PD_layout ul {padding:13vw 0 3vw 0 !important;position: relative;top:24px;} .Area01 .PD_layout {padding:0vw 0 10vw 0 !important} .Area_24hr {position: relative;padding-bottom: 0px;} .Area_24hr .TimerNick3 {z-index:2;position: absolute;top: 18vw;left: 48.5%;display:inline-block;margin:0;padding-right:5%;width: 90%;height:0;padding-bottom:10%;overflow:hidden;text-align:right;} .Area_24hr .TimerNick3 .FontStyle3 {width: 9vw;height:8vw;font-size: 5.5vw;border-radius: 2vw;margin: 0 1vw;} .Area_24hr .TimerNick3 span {font: bold 18px "微軟正黑體","Microsoft JhengHei";} .Area_24hr .Area_boxstyle .Area_boxstyle_box1 {padding-block-start: 9vw;} } /*情境圖輪播­*/ .Area_newpd .Area_swiper_box .PD_layout li { border-radius: 12px; overflow: hidden;} @media screen and (min-width: 768px){ .Area_newpd .more_bn {position: absolute;top: 58px;left: 688px;z-index: 5;width: 100%;} .Area_newpd .more_bn a {overflow: hidden; border-radius: 100px;} .Area_newpd .Area_swiper_box ul { height: 510px;padding:0;grid-gap:0;} .Area_newpd .PD_layout.PD_layout-D1_15 ul { height: 420px;padding:0;grid-gap:0;} .Area_newpd .Area_swiper{width: 100%;} } @media screen and (max-width: 767px){ .Area_newpd .more_bn {position: absolute;top: 3.3vw;left: 72vw;z-index: 5;width: 60%;} .Area_newpd .Area_PD9 {overflow: hidden;height: 86vw;} .Area_newpd .Area_swiper{width: 100%;} .Area_newpd .PD_layout.PD_layout-D1_15 ul { height: 80vw;padding:0;grid-gap:0;} .Area_newpd .swiper-pagination-progressbar{ display: none; } } /*攻略區*/ .Area04 .Area_coupon .PD_layout.PD_layout-coupon3 .PD .divine_coupon, .PD_layout.PD_layout-coupon3 .PD .threshold{color: #000000 !important;} .Area04 { border-radius: 10px;border: 1px solid rgba(255,255,230,.7);} .Area04 {position: relative;overflow: hidden;padding-bottom: 20px;background: radial-gradient(ellipse at center, transparent 60%, rgba(0, 0, 0, .35) 100%), repeating-linear-gradient(90deg, #014d53 0, #014d53 40px, #1d4548 40px, #0b484b 80px);} @media screen and (min-width: 768px){ .Area04 {} .Area04 .box {position: relative;} .Area04 .more_bn {position: absolute;top: 13px;left: 669px;z-index: 5;} .Area04 .more_bn a {display: inline-block; overflow: hidden; border-radius: 9999px;} .Area04 .Area_coupon {padding-bottom: 20px;} .Area04 .layout_BN {width: 90%;} .Area04 .layout_BN ul {padding: 0;grid-gap:0;} .Area04 .layout_BN ul li {padding: 0 7px;} } .Area04 .danji2 {margin-top: 20px;} .danji2 .danji_box ul li .activityText .gifts span {color: #ffe8a7;} .Area_danji .danji_box {margin-bottom: 0;} .warningTxt h3 {color: #000;} @media screen and (max-width: 767px){ .Area04 {right: .2vw; border-radius: 0;border: .1vw solid rgba(255,255,230,.7);} .Area04 {position: relative;overflow: hidden;padding-bottom: 2vw;} .Area04 {} .Area04 .Area_danji {width: 96%;} .Area04 .danji2 {margin-top: 2vw;} .Area04 .box {position: relative;} .Area04 .more_bn {position: absolute;top: 1.3vw;left: 72vw;z-index: 5;width: 28%;} .Area04 .Area_coupon {padding-bottom: 3vw;} .Area04 .layout_BN {width: 97%;} .Area04 .layout_BN ul {padding: 0;grid-gap:0;} .Area04 .layout_BN ul li {padding: 0 1vw;} } /*BN*/ .Area_BN .Area_swiper_box .PD_layout li{border-radius: 12px; overflow: hidden;} @media screen and (min-width: 768px){ .Area_BN .PD_layout ul {height: 354px;} } @media screen and (max-width: 767px){ .Area_BN .PD_layout ul {height:39vw;} } /*2PD一排公版*10*/ .Area06 { position: relative; overflow: hidden; background-color: #013337;} @media screen and (min-width: 768px){ .Area06 { border-radius: 10px;} .Area06 .remove_box_style ul {grid-gap:10px;} .Area06 .PD_wrap {padding: 0;height: 100%;position: relative;width: 79%;margin: 0 auto;} .Area06 .PD_box ul li { position: relative;} .Area06 .PD_box ul li .PD_img { padding: 0;} .Area06 .PD_box ul li .PD_into {position: absolute;top: 420px;left: 49%;transform: translateX(-50%);width: 90%;z-index: 1;} .Area06 .PD_box ul li .PD_into h3 { color: #000000; font-size: 22px;} .Area06 .PD_box ul li .PD_into h4 { color: #000000; font-size: 20px;} .Area06 .PD_box ul li .PD_into p { height: 2.5em; color:#d62672;} .Area06 .PD_box ul li .PD_into p del { font-size: 22px; color:#616161;} .Area06 .PD_box ul li .PD_into p b { font-size: 20px;} .Area06 .PD_box ul li .PD_into p .money { font-size: 22px;} .Area06 .PD_box ul li .PD_into p .Price { font-size: 40px;} .Area06 .PD_wrap .PD_box ul li .PD_img {padding: 2% 2% 0 2%;position: absolute;top: 6px;width: 97%;left: 4px;} .Area06 .PD_wrap .PD_box ul li {position: relative;border-radius: 10px;background-color: #fff !important;height: 580px;} .Area06 .PD_wrap .PD_layout ul{width: 90%;} .Area06 .PD_wrap .PD_layout.CX .imgTagBottom {display:none!important;} .Area06 .PD_wrap .PD_layout.CX .prdImgWrap .imgTagRectangle {display:none!important;} .Area06 .PD_wrap .PD_layout.CX .prdImgWrap .imgTag {display:none!important;} } @media screen and (max-width:767px){ .Area06 {border-radius: 0;} .Area06 .remove_box_style ul {grid-gap:10px;} .Area06 .PD_wrap .PD_layout ul{width: 100%;} .Area06 .PD_wrap {width: 97%;padding: 0;height: 100%;position: relative;} .Area06 .PD_wrap {padding: 0;width:100%;} .Area06 .PD_wrap .PD_box ul li {border-radius: 10px;width: 100%;background-color: #fff !important;height: 70vw;margin-bottom: 1vw;} .Area06 .PD_wrap .PD_box ul li .PD_img { padding: 2% 2% 0 2%; position: absolute;top: 2vw; width: 94%;left: 1.2vw;} .Area06 .PD_box ul li {padding-bottom: 3vw;} .Area06 .PD_box ul li .PD_into {top:46vw;position: relative;} .Area06 .PD_box ul li .PD_into h3 { color: #000000; font-size: 15px;} .Area06 .PD_box ul li .PD_into h3:after { width: 10em;} .Area06 .PD_box ul li .PD_into h4 { font-size: 15px; margin-bottom: 0;} .Area06 .PD_box ul li .PD_into p { height: 2.5em;} .Area06 .PD_box ul li .PD_into p del { font-size: 14px;} .Area06 .PD_box ul li .PD_into p b { font-size: 14px;} .Area06 .PD_box ul li .PD_into p .money { font-size: 16px;} .Area06 .PD_box ul li .PD_into p .Price { font-size: 28px;} .Area06 .PD_wrap .PD_layout.CX .imgTagBottom {display:none!important;} .Area06 .PD_wrap .PD_layout.CX .prdImgWrap .imgTagRectangle {display:none!important;} .Area06 .PD_wrap .PD_layout.CX .prdImgWrap .imgTag {display:none!important;} } /*1帶6公格*10*/ .Area09 {} .Area09 .box_all{border-radius: 10px;border: 1px solid rgba(255,255,230,.7);} .Area09 .box_all{position: relative;overflow: hidden;background: radial-gradient(ellipse at center, transparent 60%, rgba(0, 0, 0, .35) 100%), repeating-linear-gradient(90deg, #014d53 30px, #014d53 60px, #1d4548 60px, #0b484b 120px);} .Area09 .box_all {position: relative;padding-bottom: 50px;margin-bottom: 40px;} .Area09 .box_txt4 {position: absolute;margin: 0 auto;height: auto;width: auto;top: 65px;} .Area09 .text02 {width: 100%;margin: auto;height: 155px;} .Area09 .text02 .PD_layout {width: 80%;} .Area09 .text02 .PD_layout .PD_into {display: flex;flex-direction: row;margin-top: 32px;} .Area09 .text02 .PD_layout .PD_into .PD_logo {width: 35%;left: 52px;top: 25px;position: relative;} .Area09 .text02 .PD_layout .PD_into h3 {width: 52%;color: #ffdf74;margin-top: 38px;left: -7px;position: relative;font: 34px/43px "Noto Sans CJK SC";font-weight: 550;} .Area09 .Area_swiper {width: 93%;left: 0px;top: 44px;} .Area09 .Area_swiper_box { padding-bottom: 50px; } @media screen and (min-width: 768px){ .Area09 .box_txt4{ } .Area09 .box_txt4 img{ width:100%; height:auto; } } @media screen and (max-width:767px){ .Area09 .box_all{border-radius: 2vw;border: 1px solid rgba(255,255,230,.7);} .Area09 .box_all{ position: relative; overflow: hidden; background: radial-gradient(ellipse at center, transparent 60%, rgba(0, 0, 0, .35) 100%), repeating-linear-gradient(90deg, #014d53 0, #014d53 40px, #1d4548 40px, #0b484b 80px);} .Area09 .box_all {position: relative;padding-bottom: 5vw;margin-bottom: 4vw;} .Area09 .box_txt4 {top: 3vw;} .Area09 .text02 {height: 13.2vw;} .Area09 .text02 .PD_layout {width: 94%;} .Area09 .text02 .PD_layout .PD_into{display: flex;flex-direction: row;margin-top: 0vw;margin-bottom: 0;} .Area09 .text02 .PD_layout .PD_into .PD_logo {width: 40%;top: 3vw;left: 1vw;position: relative;} .Area09 .text02 .PD_layout .PD_into h3{width: 51%;margin-left: 0;font-size: 19px;line-height: 1em;color: #ffdf74;margin-top: 5.5vw;left: -2.5vw;} .Area09 .Area_swiper {width: 100%;left: 0;top: 4vw;} .Area09 .Area_swiper_box { padding-bottom: 5vw; } } /*大家都在買(頁籤)*/ .Area10 { border-radius: 10px;} .Area10 { position: relative; overflow: hidden; background-color: #013337;} .Area10 {overflow: hidden;padding: 30px 0 60px;margin-bottom: 50px;} .Area10 .box_txt_all {position: relative;margin: 0 auto;height: 112px;} .Area10 .box_txt_all .PD_layout .PD .PD_into {padding: 0;} .Area10 .box_txt_all ul {} .Area10 .box_txt_all li:hover { transform: none!important;} .Area10 .box_txt_all a { pointer-events: none;} .Area10 .box_txt_all h3 span { overflow: visible!important;} .Area10 .box_txt_all .PD_layout .PD h3 {font-size: 2.8em;line-height: 2em;letter-spacing: .07em;font-weight: 700;font-family:"Century Gothic","Noto Sans TC";/* font-style: italic; */color: #ebd270;transform: translate(-194px, 2px);text-shadow: 1px 1px 2px #000000;} .Area10 .box_txt_all .PD_layout .PD h4 {color: #ffffff;transform: translate(486px, -59px);font-size: 32px;text-align: left;font-weight: 600;} .Area10 .NavArea_tabbar_page {width: 88%;} .Area10 .layout_PD {width: 88%;} .Area10 .layout_PD li:nth-child(1)::after{ content: ""; position: absolute; top: 1%; left: 3%; width: 31%; height: 15%; background: url(tag1.png?t=1782442605312) no-repeat top / 100%; z-index: 10;} .Area10 .layout_PD li:nth-child(2)::after{ content: ""; position: absolute; top: 1%; left: 3%; width: 31%; height: 15%; background: url(tag2.png?t=1782442605312) no-repeat top / 100%; z-index: 10;} .Area10 .layout_PD li:nth-child(3)::after{ content: ""; position: absolute; top: 1%; left: 3%; width: 31%; height: 15%; background: url(tag3.png?t=1782442605312) no-repeat top / 100%; z-index: 10;} @media screen and (max-width:767px){ .Area10 { border-radius: 0;} .Area10 {padding: 3vw 0 6vw;margin-bottom: 8vw;} .Area10 .box_txt_all {height: 14vw;} .Area10 .box_txt_all .PD_layout .PD h3 {font-size: 1.6em;line-height: 2.5em;text-shadow: .1vw .1vw .2vw #000000;} .Area10 .box_txt3 .PD_layout .PD h3 {transform: translate(-22vw, -1.3vw);} .Area10 .box_txt3 .PD_layout .PD h4 {transform: translate(51vw, -7.5vw);font-size: 3.8vw;} .Area10 .NavArea_tabbar_page {width: 96%;} .Area10 .layout_PD {width: 96%;} } /* -------------------------------------- * Page * -------------------------------------- */ .NavArea_tabbar_page { margin: 0 auto 20px ; width: 94%; } .NavArea_tabbar_page .Nav { overflow: visible; transform: translate3d(-30.5%, 0, 0);} .NavArea_tabbar_page .Nav_box { border-radius: 8px; overflow: hidden; padding: 0 2%;} .NavArea_tabbar_page[data-num="2"] .Nav-wrapper { transform: translate3d(55.5%, 0, 0)!important} .NavArea_tabbar_page[data-num="3"] .Nav-wrapper { transform: translate3d(43.0%, 0, 0)!important} .NavArea_tabbar_page[data-num="4"] .Nav-wrapper { transform: translate3d(30.5%, 0, 0)!important} .NavArea_tabbar_page[data-light="box"] .Nav ul { padding: 0 } .NavArea_tabbar_page .Nav li { overflow: visible; } @media screen and (min-width:768px){ .NavArea_tabbar_page { display: block; } } .NavArea_tabbar_page .Nav .swiper-slide-active a { color:#fff;} .NavArea_tabbar_page .Nav .swiper-slide-active i {display:block;/* border: 1px solid; */background-color: #000000 !important;} .NavArea_tabbar_page .Nav input { position: fixed; left: 30%} /*下方公版*/ .Down_bg { border-radius: 10px;border: 1px solid rgba(255,255,230,.7);} .Down_bg {position: relative;overflow: hidden;padding-bottom: 25px;background: radial-gradient(ellipse at center, transparent 60%, rgba(0, 0, 0, .35) 100%), repeating-linear-gradient(90deg, #014d53 0, #014d53 40px, #1d4548 40px, #0b484b 80px);} @media screen and (max-width:767px){ .NavArea02 {margin-bottom: 4vw;} .Down_bg { right: .2vw;border-radius: 0;} .Down_bg {position: relative;overflow: hidden;padding-bottom: 2vw;} } /*LOGO*12*/ .Area12 { position: relative; overflow: hidden; background-color: #013337;} @media screen and (min-width:768px){ .Area12 {padding-bottom: 50px;border-radius: 10px;padding-bottom: 78px;} .Area12 .layout_PD {width: 100%;} .Area12 .layout_PD ul {grid-gap: 15px;padding:0;display: flex;justify-content: center;flex-wrap: wrap;} .Area12 .layout_PD ul li {background:url(Area12_bg.png?t=1782442605312)top center no-repeat;background-size:100%;width: calc(100% / 5);min-width: inherit;} .Area12 .layout_PD .PD_img {padding: 20px;} .Area12 .PD_layout li:nth-of-type(even) {position: relative;top:40px;} } @media screen and (max-width: 767px){ .Area12 {padding-bottom: 4vw;} .Area12 .layout_PD {width: 96%;} .Area12 .layout_PD ul {grid-gap: 8px;padding: 0;} .Area12 .layout_PD ul li {background:url(Area12_bg.png?t=1782442605312)top center no-repeat;background-size:100%;} .Area12 .layout_PD .PD_img {padding: 5%;padding-bottom: 5%!important;} .Area12 .PD_layout li:nth-of-type(even) {position: relative;top:6vw;} } /*館連結*/ @media screen and (min-width:768px){ .Area_guan .box .logo { width: 110%; right: 6%; } } @media screen and (max-width: 767px){ .Area_guan .box .logo ul li{padding: 1vw;} } /*編輯按鈕移動*/ #eWriterBtn_bt_B_000_71 {margin-left: 50px!important;margin-top: 0px!important;z-index: 99!important;}