/* ====(((( 個別定義 ))))===== */


/*PC背景*/
@media screen and (min-width:767px){
.bg_deco00 { z-index:-9; position:fixed; top:200px; left:0; width:100%; min-width:1220px; height:100%; background-repeat:repeat-y; background-position:center top; pointer-events:none;}
.bgtop01 { z-index: -8; position:absolute; top:0; left:0; width:100%; min-width:1220px; height:1000px; background-repeat:no-repeat; background-position:center top; }
.bgtop02 { z-index: -8; position:absolute; top:1000px; left:0; width:100%; min-width:1220px; height:100px; background-repeat:no-repeat; background-position:center top; }
.bgtop_repeat { z-index:-30; position:absolute; top:0; left:0; width:100%; min-width:1220px; height:100%; background-repeat:repeat-y; background-position:center top; pointer-events:none;}
.bgtop_fixed { z-index:-10; position:fixed; top:0; left:0; width:100%; min-width:1220px; height:100%; background-repeat:no-repeat; background-position:center top; pointer-events:none;}
}

/*mb背景*/
@media screen and ( max-width:767px) {
.m_bg01 { z-index:-1; position:fixed; top:0; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position:center top; background-size:100%; }	
}


 /*版頭區塊*/
 @media screen and (min-width:768px){

.Area_hero .subbg{position:absolute;top: 355px;left: 203px;z-index: 14;}

}
 @media screen and (max-width:767px){
.Area_hero {height: auto;}
.Area_hero .mb_01{position:absolute; top:0; left:0 ;width: 100%; z-index:0;}
.Area_hero .subbg{position:absolute;top: 37vw;left: 19.5vw;width: 60%;z-index: 1;}

}

/*版頭主標微調*/
.Area_hero .PD_layout .PD_slide{min-width:inherit;}
.toptitle .PD_layout .PD a,.top_pd .PD_layout .PD a { pointer-events: none;}
.toptitle .PD_layout .PD_slide:hover {transform: translateY(0px);box-shadow: none;}
.toptitle { z-index: 5;}

.toptitle .PD_layout li:nth-of-type(1) {position: absolute;top: 40px;left: 245px;z-index: 11;}
.toptitle .PD_layout li:nth-of-type(2) {position: absolute;top: 110px;left: 110px;z-index: 0;}
.toptitle .PD_layout li:nth-of-type(3) {position: absolute;top: 435px;left: 30px;z-index: 0;}
.toptitle .PD_layout .PD img { width: 100%!important;}

/*編輯按鈕移動*/
#eWriterBtn_bt_B_000_00 { margin-left: 10px!important; margin-top: 60px!important; z-index: 99!important; }
@media screen and (max-width:767px){
.toptitle .PD_layout li:nth-of-type(1) {position: absolute;top: 4.4vw;left: 22.5vw;width: 55%;z-index: 14;}
.toptitle .PD_layout li:nth-of-type(2) {position: absolute;top: 11vw;left: 9vw;width: 82%;z-index: 14;}
.toptitle .PD_layout li:nth-of-type(3) {position: absolute;top: 45.5vw;left: 3vw;width: 81%;z-index: 14;}
.toptitle .PD_layout .PD img { width: 100%!important; }
 }



/*副標輪播*/
.Area_hero .topPD2 {position: absolute;top: 329px;left: 245px;width: 500px;height: 75px;overflow: hidden;z-index: 20;}
.Area_hero .topPD2 ul.PD_wrapper { display: flex; flex-wrap: nowrap; margin: 0; padding: 0; width: 100%; box-sizing: content-box; grid-gap: inherit;}
.Area_hero .topPD2 ul.PD_wrapper li { flex-shrink: 0; margin: 0; padding: 0; opacity: 0; transform: translate(5%,0);}
.Area_hero .topPD2 ul.PD_wrapper li.swiper-slide-active { opacity: 1; transition: .8s ease-out; transform: translate(0,0);}

@media screen and (max-width:767px){
.Area_hero .topPD2 {width: 51%;height: 9vw;position: absolute;top: 35vw;left: 23.5vw;overflow: hidden;}
}


/*線上作圖*/
.Area03 {height: auto; z-index:30; margin-bottom: 40px;}
.Area03 .box_all {  padding: 0 ; /*background: url("Area_PDbottom.png?t=1781761711198") center bottom/ 100% no-repeat scroll;*/}
@media screen and (max-width:767px){
.Area03 {width: 100%; height:auto; padding: 0;background:none;margin-bottom: 1vw; }
.Area03 .box_all {padding: 0 0 0 0;}
.Area03 .PD_layout .PD_slide:hover { box-shadow: 0 0 0 rgba(0, 0, 0, 0); }
.mbg02 { z-index:0; position:absolute; top:0; left:0; width:100%; height:100%; background-repeat:repeat-y; background-position:center top; background-size:100%; }	

}
/*作圖區*/
.Area03 .PD_layout.layout_item .PD p b { /*font-weight: 500;*/ color: #ff4f8b;}	
.Area03 .PD_layout.layout_item .PD_slide .PD p del {color: #cfcfd2;/*font-size: 0.7em;*/}
.Area03 .PD_layout.layout_item .PD p .money, .Area03 .PD_layout.layout_item .PD p .Price {background: linear-gradient(to top, #06155a, #1a60e2);background: -webkit-linear-gradient(to top, #ff4f8b, #ff4f8b, #ff4f8b);background-clip: text;-webkit-background-clip: text;color: transparent;
font-weight: 800;}
@media screen and (max-width:767px){
.Area03 .PD_layout.layout_item .PD p b { display: none;}
}

@media screen and (min-width:768px){
.Area03 .PD_layout.layout_item {margin: 2% 2% 0;}
.Area03 .PD_layout.layout_item .PD_slide:hover {transform:translateY(-6px);}
.Area03 .PD_layout.layout_item .PD_slide:hover { box-shadow:unset;}
.Area03 .PD_layout.layout_item .PD_slide {height: 400px;padding:0;margin: 0;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(odd) .PD_into {width: 50%;margin: 0 auto;position: absolute;left: 0;top: 45px;transform: translateX(103%);text-align:center;font-size: 1.1em;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(even) .PD_into {width: 50%;margin: 0 auto;position: absolute;left: 0;top: 47px;transform: translateX(-3%);text-align:center;font-size: 1.1em;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(odd) .PD_img img {width: 30%;margin: 0 36% 0 0%;box-shadow: unset;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(even) .PD_img img {width: 30%;margin: 0 0 0 36%;box-shadow: unset;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(odd) .PD_into h3 {padding: 0;max-height: 2.2em;font-weight: 600;font-size: 2em;line-height: 1.9em;font-family: "Noto Sans CJK SC";color: #fff;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(odd) .PD_into h4 {font-size: 1.8em;color: #0f3899;padding: 0;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(odd) .PD p {padding: 1% 0;height: auto;line-height: 1em;font-size: 2em;/*transform: rotate3d(25, 55, 1, 354deg)*/}
.Area03 .PD_layout.layout_item .PD_slide .PD .PD_logo img{width: 55%;height: auto;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(odd) .PD .PD_logo {position: absolute;top: -140px;left: -10px;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(even) .PD .PD_logo {position: absolute;top: 143px;left: 346px;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(even) .PD_into h3 { padding: 0; max-height: 2.3em; font-weight: 600;font-size: 2em; line-height: 1.7em; font-family: "Noto Sans CJK SC"; color:#fff;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(even) .PD_into h4 {font-size: 1.8em;color: #0f3899;padding: 0;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(even) .PD p { padding: 2% 0;height: 5em; line-height: 1em; font-size: 2em;/*transform: rotate3d(16, 36, -2, 344deg);*/}
.Area03 .PD_layout.layout_item .PD p .Price { font-size: 1.7em;text-align: left;}

.Area03 .PD_layout.layout_item li:nth-of-type(odd){ background: url("layout_itembg1.png?t=1781761711198") center top / 100% no-repeat scroll;}	
.Area03 .PD_layout.layout_item li:nth-of-type(even){background: url("layout_itembg2.png?t=1781761711198") center top / 100% no-repeat scroll;}	
}
@media screen and (max-width:767px){
.Area03 .PD_layout.layout_item { width: 100%;position: relative; z-index: 50; }
.Area03 .PD_layout.layout_item ul {padding: 0;margin: 0% auto;}
.Area03 .PD_layout.layout_item ul li {width: 100%;}
.Area03 .PD_layout.layout_item .PD_slide .PD_img {margin-bottom: 0;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(odd) .PD_into {position: absolute;margin: 0 auto;top: 4vw;left: 0;width: 50%;transform: translateX(103%);text-align: center;display: block;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(even) .PD_into {position: absolute;margin: 0 auto;top: 4vw;left: 0;width: 50%;transform: translateX(-3%);text-align:center;display: block;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(odd) .PD_img img {width: 28%;margin: 0 39% 0 0;box-shadow: unset;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(even) .PD_img img {width: 28%;margin: 0 0 0 39%;box-shadow: unset;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(odd) .PD_into h3 {color:#fff;font-weight: 900;font-size: 18px;max-height: 2.5em;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(odd) .PD_into h4 { color: #0f3899;margin-bottom:0.1em}
.Area03 .PD_layout.layout_item .PD_slide .PD .PD_logo img{width: 25%;height: auto;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(odd) .PD .PD_logo {position: absolute;top: -13.5vw;left: 0%;transform: translateX(-22%);}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(even) .PD .PD_logo {position: absolute;top: 24vw;left: 0%;transform: translateX(41%);}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(odd) .PD p { padding: 0;line-height: 1.2em; }
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(even) .PD p { padding: 0;line-height: 1.2em; }
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(even) .PD_into h3 { color:#fff; font-weight: 800;font-size: 18px; max-height: 2.5em;}
.Area03 .PD_layout.layout_item .PD_slide:nth-of-type(even) .PD_into h4 { color: #0f3899;margin-bottom:0.2em}
.Area03 .PD_layout.layout_item .PD p .Price {text-align: left;}
.Area03 .PD_layout.layout_item li:nth-of-type(odd){height: 43vw;background: url("layout_itembg1.png?t=1781761711198") center top / 100% no-repeat scroll;}	
.Area03 .PD_layout.layout_item li:nth-of-type(even){height: 43vw;background: url("layout_itembg2.png?t=1781761711198") center top / 100% no-repeat scroll;}

}



.Area_hero {
    position: relative;
    aspect-ratio: 960 / 990;
    overflow: hidden;
}

.Area_hero--title {
    position: absolute;
    top: 35vw;
    right: 0vw;
    width: 100%;
    z-index: 5;
}

.Area_hero--title .PD_layout .PD img {
    width: 50%;
    height: auto;
}


.Areapadding .PD_layout .PD img {
    width: 80%;
    height: auto;
}


.Area_danji .danji_box ul li .activityText .gifts span {
    color: #c4dbfa;
}

.Area_brand-1-plus-2 .b_box{grid-template-columns: repeat(1, 1fr);width: 90%;margin: auto; gap: 20px;}
.PD_layout.PD_layout-D3_02 ul .PD .PD_logo {background-color: rgba(0,0,0,0);width: 50%;}
.PD_layout.PD_layout-D3_02 ul .PD .PD_into{margin: auto;margin-top: 0;}
.Area_swiper_box .PD_layout li, .Area_swiper_box .PD_layout li .PD_img img { border-radius: 5px;}

.Area_brand-1-plus-2 .b_box .PD_layout.PD_layout-D3_02 {background: #ffffff00 url(area_bg.png?t=1781761711198) bottom center no-repeat;background-size: 90%;}

@media screen and (max-width:767px){
.Area_brand-1-plus-2 .b_box{grid-template-columns: repeat(1, 1fr);width: 98%;margin: auto;gap: 15px;}
.PD_layout.PD_layout-D3_02 ul .PD .PD_logo {background-color: rgba(0,0,0,0);width: 50%;}
.PD_layout.PD_layout-D3_02 ul .PD .PD_into{margin: auto;margin-top: 0;height: 6vw;}

.Area_swiper_box .PD_layout li, .Area_swiper_box .PD_layout li .PD_img img { border-radius: 5px;}
.Area_brand-1-plus-2 .b_box .PD_layout.PD_layout-D3_02 {background: #ffffff00 url(area_bg.png?t=1781761711198) top center no-repeat;background-size: 98%;}

}
@media screen and (min-width:767px){
.Area_pd-grid-4x2 .Area_content{width: 96%;margin: auto;}
}
.Area_bn-grid-3x1 .PD_layout[data-pd-li=BN] ul {padding: 25px 90px 15px; grid-gap: 10px;}
@media screen and (max-width:767px){
.Area_bn-grid-3x1 .PD_layout[data-pd-li=BN] ul {padding: 0 0 0; }
}



