/* all sec_06 22個職業展示 */:root{--job-pagination:80%;--job-thumb-size:60px}.sec_06 .block_content{background-color:#f2f2f5;background-repeat:repeat;background-size:auto;background-blend-mode:luminosity;color:var(--block-title-color-wt-bg);position:relative}.job_wrapper{width:100%}.job_wrapper .swiper-slide{width:100%;height:auto;display:flex;transition:none}.job_wrapper .swiper-slide:not(.swiper-slide-active){opacity:0 !important}.job_info{width:100%;display:flex;flex-direction:column;align-items:center}.job_wrapper .pic{width:100%;height:100%}.job_wrapper .pic img{width:100%;height:100%;object-fit:cover;opacity:0;transform:translate(-30%);transition:opacity .3s linear,transform .4s cubic-bezier(.3, 1.2, .7, 1)}.job_wrapper .swiper-slide-active .pic img{opacity:1;transform:translate(0)}.job_wrapper .pic::before{content:"";width:40%;height:100%;background:url(../images/sec_06/type3.webp) no-repeat left bottom;display:block;position:absolute;top:0;left:0;z-index:-1;-webkit-mask-image:url(../images/sec_06/job_bg_mask.webp);mask-image:url(../images/sec_06/job_bg_mask.webp);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-position:0 0;mask-position:0 0;opacity:1;transition:opacity .35s background-position .4s !important}.job_01 .pic::before,.job_02 .pic::before,.job_03 .pic::before,.job_04 .pic::before,.job_05 .pic::before{background-image:url(../images/sec_06/type3.webp)}.job_15 .pic::before,.job_16 .pic::before,.job_17 .pic::before,.job_18 .pic::before{background-image:url(../images/sec_06/type1.webp)}.job_wrapper .swiper-slide-active .pic::before{background-position:right bottom;opacity:1}.job_wrapper .name,.job_wrapper .content,.job_wrapper .mov{width:100%;opacity:0;transform:translateY(50px)}.job_wrapper .name,.job_wrapper .content{filter:drop-shadow(0 0 2px rgba(255,255,255,1)) drop-shadow(0 0 2px rgba(255,255,255,1)) drop-shadow(0 0 8px rgba(255,255,255,.3));-webkit-filter:drop-shadow(0 0 2px rgba(255,255,255,1)) drop-shadow(0 0 2px rgba(255,255,255,1)) drop-shadow(0 0 8px rgba(255,255,255,.3))}.job_wrapper .name{font-size:calc(var(--block-title) * .73);font-weight:900;font-family:'Noto Serif HK','Noto Serif TC',sans-serif;/* 全大寫 *//* text-transform: uppercase;  */display:flex;align-items:center;transition:opacity .5s .1s,transform .6s cubic-bezier(.39,.71,.11,1.36) .1s !important}.job_wrapper .swiper-slide-active .name,.job_wrapper .swiper-slide-active .content,.job_wrapper .swiper-slide-active .mov{opacity:1;transform:translateY(0)}.job_wrapper .name svg{width:calc(var(--block-title) * .75);aspect-ratio:1/1;transform:translateY(3%);background-color:var(--block-title-color-wt-bg);mask-size:100% 100%}.job_01 .name svg{mask-image:url(../images/svg/job/sec_06_01.svg)}.job_02 .name svg{mask-image:url(../images/svg/job/sec_06_02.svg)}.job_03 .name svg{mask-image:url(../images/svg/job/sec_06_03.svg)}.job_04 .name svg{mask-image:url(../images/svg/job/sec_06_04.svg)}.job_05 .name svg{mask-image:url(../images/svg/job/sec_06_05.svg)}.job_06 .name svg{mask-image:url(../images/svg/job/sec_06_06.svg)}.job_07 .name svg{mask-image:url(../images/svg/job/sec_06_07.svg)}.job_08 .name svg{mask-image:url(../images/svg/job/sec_06_08.svg)}.job_09 .name svg{mask-image:url(../images/svg/job/sec_06_09.svg)}.job_10 .name svg{mask-image:url(../images/svg/job/sec_06_10.svg)}.job_11 .name svg{mask-image:url(../images/svg/job/sec_06_11.svg)}.job_12 .name svg{mask-image:url(../images/svg/job/sec_06_12.svg)}.job_13 .name svg{mask-image:url(../images/svg/job/sec_06_13.svg)}.job_14 .name svg{mask-image:url(../images/svg/job/sec_06_14.svg)}.job_15 .name svg{mask-image:url(../images/svg/job/sec_06_15.svg)}.job_16 .name svg{mask-image:url(../images/svg/job/sec_06_16.svg)}.job_17 .name svg{mask-image:url(../images/svg/job/sec_06_17.svg)}.job_18 .name svg{mask-image:url(../images/svg/job/sec_06_18.svg)}.job_19 .name svg{mask-image:url(../images/svg/job/sec_06_19.svg)}.job_21 .name svg{mask-image:url(../images/svg/job/sec_06_21.svg)}.job_22 .name svg{mask-image:url(../images/svg/job/sec_06_22.svg)}.job_wrapper .name span{width:fit-content;word-break:keep-all;white-space:nowrap}.job_wrapper .name span.zh{margin:0 calc(var(--block-title) * .7 * .25)}.job_wrapper .name span.en{align-self:flex-end}.job_wrapper .content{margin:calc(var(--block-title-content) * 1) 0;padding:0 0 0 calc(var(--block-title-content) * .5);font-size:calc(var(--block-title-content) * .9);line-height:calc(var(--block-title-content) * 1.6);transition:opacity .5s .15s,transform .6s cubic-bezier(.39,.71,.11,1.36) .15s !important}.job_wrapper .mov{/* aspect-ratio: 488 / 274; */font-size:0;line-height:0;position:relative;overflow:hidden;box-shadow:0 0 9px -2px rgba(0, 0, 0, .06),0 2px 6px -2px rgba(0, 0, 0, .12),0 2px 4px -2px rgba(0, 0, 0, .16);transition:opacity .5s .2s,transform .6s cubic-bezier(.39,.71,.11,1.36) .2s !important}.job_wrapper .mov iframe{width:100%;aspect-ratio:490/276}.job_wrapper .swiper-pagination{width:var(--job-pagination);margin-bottom:1vw;padding:calc(1vw + var(--block-title-content)) 8px 1vw;left:10%;bottom:0;display:flex;align-items:center;overflow-x:auto;overflow-y:hidden;white-space:nowrap}@media screen and (min-width:1921px){.job_wrapper .swiper-pagination{justify-content:center}}.job_wrapper .swiper-pagination-bullet{min-width:var(--job-thumb-size);height:auto;aspect-ratio:1/1;position:relative;margin:0 8px;background-repeat:no-repeat;background-position:center center;background-size:100% 100%;background-color:var(--decor-bk-bg);border-radius:50%;opacity:1;flex:1 0 auto;box-shadow:rgba(0, 0, 0, 0) 0 0 5px,rgba(0, 0, 0, 0) 0px 2px 4px;border:0 solid rgba(252, 255, 255, 1)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 1"]{background-image:url(../images/sec_06/thumb/job_01.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 2"]{background-image:url(../images/sec_06/thumb/job_02.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 3"]{background-image:url(../images/sec_06/thumb/job_03.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 4"]{background-image:url(../images/sec_06/thumb/job_04.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 5"]{background-image:url(../images/sec_06/thumb/job_05.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 6"]{background-image:url(../images/sec_06/thumb/job_06.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 7"]{background-image:url(../images/sec_06/thumb/job_07.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 8"]{background-image:url(../images/sec_06/thumb/job_08.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 9"]{background-image:url(../images/sec_06/thumb/job_09.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 10"]{background-image:url(../images/sec_06/thumb/job_10.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 11"]{background-image:url(../images/sec_06/thumb/job_11.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 12"]{background-image:url(../images/sec_06/thumb/job_12.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 13"]{background-image:url(../images/sec_06/thumb/job_13.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 14"]{background-image:url(../images/sec_06/thumb/job_14.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 15"]{background-image:url(../images/sec_06/thumb/job_15.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 16"]{background-image:url(../images/sec_06/thumb/job_16.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 17"]{background-image:url(../images/sec_06/thumb/job_17.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 18"]{background-image:url(../images/sec_06/thumb/job_18.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 19"]{background-image:url(../images/sec_06/thumb/job_19.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 20"]{background-image:url(../images/sec_06/thumb/job_21.webp)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 21"]{background-image:url(../images/sec_06/thumb/job_22.webp)}.job_wrapper .swiper-pagination-bullet::before,.job_wrapper .swiper-pagination-bullet::after{width:100%;content:"";display:block;position:absolute;top:0;left:0}.job_wrapper .swiper-pagination-bullet::before{height:100%;z-index:1;background-image:linear-gradient(to right bottom, rgba(255, 255, 255, 0.2) 30%, rgba(0, 0, 0, 0.4) 70%);border-radius:50%}.job_wrapper .swiper-pagination-bullet::after{--job_type-color1:rgba(65, 84, 162, .8);--job_type-color2:rgba(69, 108, 47, .8);--job_type-color3:rgba(133, 56, 55, .8);font-size:calc(var(--block-title-content) * .55);text-align:center;color:var(--block-title-color-bk-bg);opacity:0;z-index:-1;text-shadow:0 0 2px var(--job_type-color3),0 0 4px var(--job_type-color3),0 0 6px var(--job_type-color3),0 0 8px var(--job_type-color3)}.job_wrapper .swiper-pagination-bullet.swiper-pagination-bullet-active{z-index:3}.job_wrapper .swiper-pagination-bullet.swiper-pagination-bullet-active{transform:scale(1.2);box-shadow:rgba(0, 0, 0, 0.5) 0 0 5px,rgba(0, 0, 0, 0.23) 0px 2px 4px;border-width:2px}.job_wrapper .swiper-pagination-bullet.swiper-pagination-bullet-active::before{opacity:0}.job_wrapper .swiper-pagination-bullet.swiper-pagination-bullet-active::after{opacity:1;transform:translateY(-105%)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 1"]::after{content:"英雄"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 2"]::after{content:"聖騎士"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 3"]::after{content:"黑騎士"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 4"]::after{content:"聖魂劍士"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 5"]::after{content:"狂郎勇士"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 1"]::after,.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 2"]::after,.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 3"]::after,.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 4"]::after,.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 5"]::after{text-shadow:0 0 2px var(--job_type-color3),0 0 4px var(--job_type-color3),0 0 6px var(--job_type-color3),0 0 8px var(--job_type-color3)}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 6"]::after{content:"神射手"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 7"]::after{content:"箭神"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 8"]::after{content:"破風使者"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 9"]::after{content:"暗影神偷"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 10"]::after{content:"夜使者"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 11"]::after{content:"暗夜行者"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 12"]::after{content:"拳霸"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 13"]::after{content:"槍神"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 14"]::after{content:"閃雷悍將"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 15"]::after{content:"火毒魔導"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 16"]::after{content:"冰雷魔導"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 17"]::after{content:"主教"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 18"]::after{content:"烈焰巫師"}.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 15"]::after,.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 16"]::after,.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 17"]::after,.job_wrapper .swiper-pagination-bullet[aria-label="Go to slide 18"]::after{text-shadow:0 0 2px var(--job_type-color1),0 0 4px var(--job_type-color1),0 0 6px var(--job_type-color1),0 0 8px var(--job_type-color1)}/* navigation滾動按鈕 */.sec_06 .button-scrollbar{width:calc(var(--job-pagination) + var(--job-thumb-size) * 2 *.8);height:var(--job-thumb-size);padding:0;margin:0;position:absolute;left:50%;bottom:calc(2vw + 12px);z-index:99;transform:translateX(-50%);z-index:9;display:flex;justify-content:space-between;align-items:center;transition:.3s;opacity:0;pointer-events:none}.sec_06 .button-scrollbar.active{opacity:1;pointer-events:initial}.sec_06 .swiper-button-prev,.sec_06 .swiper-button-next{width:calc(var(--job-thumb-size) * .75);height:auto;aspect-ratio:1/1;margin:initial;padding:initial;position:relative;inset:initial;transform:initial}.sec_06 .swiper-button-prev{left:0}.sec_06 .swiper-button-next{right:0}.sec_06 .swiper-button-prev::before{--color-code:0,0,0}.sec_06 .swiper-button-next::before{--color-code:255,255,255}.sec_06 .swiper-button-prev::before,.sec_06 .swiper-button-next::before{content:"";width:75%;height:100%;display:block;background-image:linear-gradient(to bottom, rgba(100, 100, 100, 1) 0%, rgba(35, 35, 32, 1) 100%);position:absolute;border-radius:12%;border:1px solid var(--decor-wt-bg);opacity:.7}.sec_06 .swiper-button-prev::after{background-color:var(--block-title-color-bk-bg)}.sec_06 .swiper-button-next::after{background-color:var(--block-title-color-bk-bg)}@media (hover){.job_wrapper .swiper-pagination-bullet:hover{transform:scale(1.2);box-shadow:rgba(0, 0, 0, 0.5) 0 0 5px,rgba(0, 0, 0, 0.23) 0px 2px 4px;border-width:2px;z-index:4}.job_wrapper .swiper-pagination-bullet:hover::before{opacity:0}.job_wrapper .swiper-pagination-bullet:hover::after{opacity:1;transform:translateY(-105%)}.sec_06 .swiper-button-prev:hover::before,.sec_06 .swiper-button-next:hover::before{opacity:1}.sec_06 .swiper-button-prev:hover::after{transform:scaleX(-1)}.sec_06 .swiper-button-next:hover::after{transform:initial}}@media screen and (min-width:768px){/* only wide sec_06 22個職業展示 */.sec_06 .block_content{background-position:left top,right -20%;justify-content:flex-start;align-items:center}.job_info{width:50%;min-height:100vh;height:100%;padding-right:2%}.job_wrapper .mov{max-width:490px}.sec_06 .title_name{width:calc(var(--block-title) * 1.08 * 9);position:absolute;left:50%;top:calc(var(--block-title) * .5);z-index:2;flex-direction:row;flex-wrap:wrap}.sec_06 .title_icons{transform:translateY(calc(-1 * var(--block-title) *.24))}.sec_06 .top_decor{width:fit-content;flex-grow:1;flex-shrink:1}.sec_06 .top_decor .decor.rt{flex-grow:1;flex-shrink:1}.sec_06 .top_decor .decor.lt{display:none}.sec_06 .sec_title{width:100%}.job_wrapper{height:100%}.job_wrapper .swiper-slide{flex-direction:column;align-items:flex-end}.job_wrapper .pic{position:absolute;left:0;bottom:0;z-index:-1}}@media screen and (min-width:1580px){.job_01 .pic img{object-position:80% bottom}.job_03 .pic img{object-position:50% bottom}.job_05 .pic img{object-position:70% bottom}.job_07 .pic img{object-position:70% bottom}.job_08 .pic img{object-position:70% bottom}.job_11 .pic img{object-position:100% bottom}.job_12 .pic img{object-position:60% bottom}.job_13 .pic img{object-position:60% bottom}.job_15 .pic img{object-position:80% bottom}.job_16 .pic img{object-position:80% bottom}.job_17 .pic img{object-position:60% bottom}.job_18 .pic img{object-position:60% bottom}}@media screen and (min-width:768px) and (max-width:1480px){/* sec_06 22個職業展示 */.job_wrapper .name,.job_wrapper .content{filter:drop-shadow(0 0 2px rgba(255,255,255,1)) drop-shadow(0 0 2px rgba(255,255,255,1)) drop-shadow(0 0 4px rgba(255,255,255,1)) drop-shadow(0 0 4px rgba(255,255,255,.5)) drop-shadow(0 0 8px rgba(255,255,255,.3)) drop-shadow(0 0 8px rgba(255,255,255,.3));-webkit-filter:drop-shadow(0 0 2px rgba(255,255,255,1)) drop-shadow(0 0 2px rgba(255,255,255,1)) drop-shadow(0 0 4px rgba(255,255,255,1)) drop-shadow(0 0 4px rgba(255,255,255,.5)) drop-shadow(0 0 8px rgba(255,255,255,.3)) drop-shadow(0 0 8px rgba(255,255,255,.3))}}@media screen and (min-width:768px) and (max-width:1280px){/* sec_06 22個職業展示 */.job_01 .pic img,.job_02 .pic img,.job_03 .pic img,.job_04 .pic img,.job_06 .pic img,.job_07 .pic img,.job_08 .pic img,.job_09 .pic img,.job_10 .pic img,.job_11 .pic img,.job_12 .pic img,.job_13 .pic img,.job_14 .pic img,.job_16 .pic img,.job_17 .pic img,.job_18 .pic img,.job_19 .pic img,.job_21 .pic img,.job_22 .pic img{object-position:50% bottom}.job_05 .pic img{object-position:70% bottom}.job_08 .pic img{object-position:70% bottom}.job_11 .pic img{object-position:70% bottom}.job_15 .pic img{object-position:70% bottom}.job_16 .pic img{object-position:65% bottom}}@media screen and (min-width:768px) and (max-width:1050px){/* sec_06 22個職業展示 */.job_01 .pic img{object-position:55% bottom}.job_02 .pic img{object-position:45% bottom}.job_03 .pic img{object-position:55% bottom}.job_04 .pic img{object-position:55% bottom}.job_05 .pic img{object-position:60% bottom}.job_06 .pic img{object-position:45% bottom}.job_07 .pic img{object-position:45% bottom}.job_08 .pic img{object-position:65% bottom}.job_09 .pic img{object-position:45% bottom}.job_10 .pic img{object-position:40% bottom}.job_11 .pic img{object-position:70% bottom}.job_12 .pic img{object-position:45% bottom}.job_13 .pic img{object-position:48% bottom}.job_14 .pic img{object-position:43% bottom}.job_16 .pic img{object-position:55% bottom}.job_17 .pic img{object-position:50% bottom}.job_18 .pic img{object-position:45% bottom}.job_19 .pic img{object-position:45% bottom}.job_21 .pic img{object-position:40% bottom}.job_22 .pic img{object-position:40% bottom}}@media screen and (max-width:1510px){/*sec_06 22個職業展示 */.sec_06 .title_name{left:initial;right:3%}.job_info{width:calc(var(--block-title) * 1.08 * 9 + 3%)}}/* mobile */@media (max-width:767px){/* mobile sec_06 22個職業展示 */.sec_06 .block_content{padding:calc(var(--block-title) * 1) 0}.sec_06 .title_name{right:initial}.job_wrapper{margin-top:calc(var(--block-title) * 0.5)}.job_wrapper .swiper-slide{justify-content:center;align-items:center}/* .job_wrapper .swiper-slide:not(.swiper-slide-active){height: 0;} */.job_info{width:100%;justify-content:center}.job_wrapper .pic::before{width:100%;height:auto;aspect-ratio:1/.93;transform:scale(-1)}.job_wrapper .swiper-slide-active .pic::before{background-size:cover}.job_wrapper .name{--padding-top-var:205;margin-top:calc(100vw * var(--padding-top-var) / 736)}.job_wrapper .name,.job_wrapper .content,.job_wrapper .mov{width:85%}.job_wrapper .content{padding:0}.job_wrapper .swiper-pagination{--top-size:350;--padding-top-var:4vw;width:100%;padding-top:calc(var(--padding-top-var) + var(--block-title-content) *.9);padding-bottom:2vw;left:0;right:initial;top:calc(100vw * var(--top-size) / 376);bottom:initial}.job_wrapper .swiper-pagination-bullet{width:16vw;margin:0 1vw !important}.job_wrapper .swiper-pagination-bullet::before{border-width:2px}.job_wrapper .swiper-pagination-bullet::after{font-size:calc(var(--block-title-content) * .9)}.job_wrapper .swiper-pagination-bullet.swiper-pagination-bullet-active::before{border-color:rgba(255, 255, 255, 1)}.button-scrollbar,.sec_06 .swiper-button-prev,.sec_06 .swiper-button-next{opacity:0;pointer-events:0;display:none !important}@media (hover){.job_wrapper .swiper-pagination-bullet:hover::before{border-color:rgba(255, 255, 255, 1)}.job_wrapper .swiper-pagination-bullet:hover{transform:scale(1.2)}}}@media (max-width:430px){/* sec_06  */.job_wrapper .name{--padding-top-var:210;font-size:calc(var(--block-title) * .85)}.job_wrapper .content{padding:0;font-size:calc(var(--block-title-content) * 1)}.job_wrapper .swiper-pagination{--top-size:360;padding-bottom:3vw}}@media (max-width:310px){.job_wrapper .swiper-pagination{--padding-top-var:5vw}.job_wrapper .name{--padding-top-var:260}}@media (max-width:250px){.job_wrapper .name{--padding-top-var:300}}@media (max-width:200px){.job_wrapper .name{padding-top:20px}}