﻿@charset "utf-8";
/* CSS Document */
#light_bx{
	position:fixed;
	width:100%;
	height:100vh;
	height:calc(var(--vh, 1vh) * 100);
	backdrop-filter: blur(2px);
	top:0;
	left:0;
	background-color:rgba(0,0,0,.8);
	text-align:center;
	overflow:auto;
	z-index:19;
	/*display:none;*/
	pointer-events:none;
	opacity: 0;
	/**/
	transition: all .5s;
	-moz-transition: all .5s;
	-webkit-transition: all .5s;
	-o-transition: all .5s;
	}
#light_bx.on{
	pointer-events:auto;
	opacity:1;
	}
#light_bx > div{
	position:relative;
	width:100%;
	min-height:100vh;
	min-height:calc(var(--vh, 1vh) * 100);
	/**/
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
	}
.pvdo{
	position:relative;
	width:889px;/*889*/
	display:none;
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100% auto;
	background-image: url(../images/pop-video-bg.png);
	}
.pvdo > .pvd{
	position:relative;
	width:100%;/*889*/
	padding-bottom:57.48031496062992%;/*511*/
	display: block;
	}
.ytvd{
	position:absolute;
	width:96.96287964004499%;/*862*/
	left:1.574803149606299%;/*14*/
	top:2.544031311154599%;/*13*/
	/*transform:translate(-50%,-50%);*/
	}
.ytvd .vdx {
  	position:relative;
  	width:100%;
  	padding-bottom:56.14849187935035%;/*484*/
	/*display: block;*/
	background-color:#000;
  	overflow:hidden;
  	cursor:pointer;
	}
.ytvd .vdx video,
.ytvd .vdx iframe,.ytvd .vdx img{
    position:absolute;
    top: 0;
    left: 0;
    width:100%;
    height:100%;
	}
.pvclose{
    position:absolute;
	width:7.649%;/*68*/
	padding-bottom:7.649%;
	display:block;
	cursor:pointer;
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100% auto;
	background-image: url(../images/pvclose-bt.png);
	transition: all 0.5s 0s ease;
	top:-3.5%;
	left:101.5%;
	}
.pvclose:hover{transform:rotate(180deg);}
/**/
.skillbx{
	position:relative;
	width:940px;/*940*/
	display:none;
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100% auto;
	background-image: url(../images/pop-bg2.png);
	}
.skillbx::before{
	position:relative;
	width:100%;/*940*/
	padding-bottom:69.787234%;/*656*/
	display:block;
	content:"";
	}
.skc{
	position:absolute;
	width:100%;
	height:100%;
	display:block;
	top:0;
	left:0;
	}
.skill-tit{
	position:relative;
	width:100%;
	display:block;
	padding:36px 0 16px;
	}
.skill-tit::before{
	position:relative;
	width:60.851%;/*572*/
	padding-bottom:4.1489318%;/*39*/
	display:block;
	content:"";
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100% auto;
	background-image: url(../images/skill-tit.png);
	margin:0 auto;
	}	
.skcobx{
	position:relative;
	width:92%;/*815 830*/
	height:calc(100% - 91px - 55px);
	display:block;
	margin:0 auto;
	/**/
	font-size:18px;/*20*/
	line-height:32px;/*32*/
	color:#1d2d3a;
	font-weight:300;
	}	
.skcobx #incon3{
		position:absolute;
		width:100%;
		height:100%;
		left:0;
		top:0;
		padding:0 10px 0 10px;
		}
.skbx{
	position:relative;
	width:100%;
	text-align:left;
	display:none;
	}		
.sk_1{
	position:relative;
	/*padding:0 0 15px;*/
	}
.sk_1 strong{
	font-weight:500;
	font-size:20px;/*20*/
	}
.sk_1 > li{
	position:relative;
	padding-left:22px;
	padding-bottom:10px;
	}
.sk_1 > li::before{
	position:absolute;
	width:10px;
	height:10px;
	content:"";
	display:block;
	background-color:#587885; 
	transform:rotate(45deg);
	left:0;
	top:10px;
  	}
.sk_2{position:relative;padding-bottom:10px;}
.sk_2 > li{
	position:relative;
	border-bottom: 1px dotted #b9a889;
	padding:10px 0;
	display:flex;
	align-items:center;
	}
.sk_2 > li:last-child{border-bottom:0 dotted #b9a889;}
.sk_img{
	position:relative;
    width:84px;
    height:84px;
    display:flex;
    align-items:center;
    justify-content:center;
	flex-shrink: 0;
	margin-right:12px;
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100% auto;
	background-image: url(../images/skill-box.png);
	}
.sk_img img{
	position:relative;
	width:71.428%;/*60*/
	display:block;
	}
.sk_ms{
	position:relative;
	text-align:left;
	font-size:16px;
	line-height:28px;
	/**/
	word-break: break-all; 
	overflow-wrap: break-word; 
	}
.sk_ms strong{
	font-weight:500;
	font-size:18px;/*20*/
	}
.sk_name{
	position:relative;
	font-size:22px;
    color: #203749;
	font-weight:500;
    padding-bottom: 2px;
	}
/**/
.art-title{
	position:relative;
	display: block;
	padding-left:24px; 
	font-size:24px;
	font-weight:500;
	margin-bottom:8px;
	}
.art-title::before{
	position: absolute;
	width:19px;/*19*/
	padding-bottom:28px;/*28*/
	display:block;
	content:"";
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100% auto;
	background-image: url(../images/up4/arrow-icon.png);
	top: 1px;
	left: 0;
	}
.artc_1{
	position:relative;
	display: block;
	padding:0 0 16px 24px; 
	}
.artc_1 strong{font-weight:500;}
/**/
#up3morbx{
	position:relative;
	width:1121px;/*1121*/
	display:none;
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100% auto;
	background-image: url(../images/up3/pop_bg.png);
	}
#up3morbx::before{
	position:relative;
	width:100%;/*1121*/
	padding-bottom:61.99821587867975%;/*695*/
	display:block;
	content:"";
	}
.u3close{
    position:absolute;
	width:5.7%;/*64*/
	padding-bottom:5.7%;/*64*/
	display:block;
	cursor:pointer;
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100% auto;
	background-image: url(../images/up3/close.png);
	transition: all 0.5s 0s ease;
	top:-1.5%;
	left:101.5%;
	}
.u3popbx{
	position:absolute;
	width:89.2%;/*1000*/
	padding-bottom:12.8448%;/*144*/
	display:block;
	top:0;
	left:5.173%;/*58*/
	}
.u3popbx::before{
	position:absolute;
	width:52.2%;/*522*/
	padding-bottom:5%;/*50*/
	display:block;
	content:"";
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100% auto;
	
	top:47.2%;/*68*/
	left:50%;
	transform: translateX(-50%);
	}
.u3popcn{
	position:absolute;
	width:89.2%;/*1000*/
	padding-bottom:44.6%;/*500*/
	top:20.719%;/*144*/
	left:5.173%;/*58*/
	/**/
	font-size:18px;
	line-height:32px;
	color:#4a6696;
	/*font-weight:300;*/
	}
.u3popcn #incon5{
		position:absolute;
		width:100%;
		height:100%;
		left:0;
		top:0;
		padding:0 10px 0 10px;
		}
.u3mbx{
	position:relative;
	width:100%;
	display:none;
	margin:0 auto;
	overflow:hidden;
	padding-top:15px;
	text-align: left;
	}
.u3m_1 .u3popbx::before{background-image: url(../images/up3/u3pop_tit_1.png);}
.u3m_2 .u3popbx::before{background-image: url(../images/up3/u3pop_tit_2.png);}
.u3m_3 .u3popbx::before{background-image: url(../images/up3/u3pop_tit_3.png);}
.u3m_4 .u3popbx::before{background-image: url(../images/up3/u3pop_tit_4.png);}
.u3m_5 .u3popbx::before{background-image: url(../images/up3/u3pop_tit_5.png);}
.u3m_6 .u3popbx::before{background-image: url(../images/up3/u3pop_tit_6.png);}
.u3m_7 .u3popbx::before{background-image: url(../images/up3/u3pop_tit_7.png);}
.u3m_8 .u3popbx::before{background-image: url(../images/up3/u3pop_tit_8.png);}
.u3m_9 .u3popbx::before{background-image: url(../images/up3/u3pop_tit_9.png);}
.u3m_10 .u3popbx::before{background-image: url(../images/up3/u3pop_tit_10.png);}

.u3m_1 .p3m_1,.u3m_2 .p3m_2,.u3m_3 .p3m_3,.u3m_4 .p3m_4,.u3m_5 .p3m_5,.u3m_6 .p3m_6,.u3m_7 .p3m_7,.u3m_8 .p3m_8,.u3m_9 .p3m_9,.u3m_10 .p3m_10{display:block;}	

.sub-tit_a,.sub-tit2_a{
	position:relative;
	width:100%;/*230*/
	height: 48px;/*48*/
	display:block;
	background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:0% 50%;
	background-size:auto 100%;
	margin:12px 0 16px;/*12 16*/
	text-align: left;
	}
.sub-tit_a{background-image: url(../images/up3/sub_tit_bg.png);}
.sub-tit2_a{background-image: url(../images/up3/sub_tit_bg2.png);}
.sub-tit_a > span,.sub-tit2_a > span{
	position:relative;
	width:100%;
	display:block;
    font-size:24px;/*24*/
	line-height:48px;/*48*/
    color: #4a6696;
    text-align:left;
    font-weight: bold;
	padding-left:22px;/*5*/
	}
.u3_2_bc2_a{
	position:relative;
	width:98%;
	padding-left:22px;/*5*/
	}
.u3img{
	position:relative;
	text-align:center;
	}
.u3img img{
	position:relative;
	max-width:98%;
	margin:10px 0;
	}
.u3img img.ma{display:block;}
.u3img img.ma2{display:none;}
.u3c{
	position:relative;
	margin:10px 0;
	}
.u3a1,.u3a2{
	position:relative;
	width:98%;
	padding-left:22px;
	}
.u3a1 li{list-style-type:disc;}
.u3a2 li{list-style-type:decimal;}
.tb1,.tb2,.tb3{
	position: relative;
	margin:10px 0;
	}
.tb1 table,.tb2 table,.tb3 table{
	width: 98%;
	position: relative;
	/*background-color:#b5caee;*/
	/**/
	border-collapse:collapse;
	text-align: center;
	}
.tb1 td,.tb2 td,.tb3 td{
	/*width:25%;*/
	height:56px;
	/*background-attachment:scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-image: url(../images/up3/tbbg.jpg);*/
	/**/
	vertical-align:middle;/* 等同於 valign="middle" 的垂直置中效果 */
    padding:5px; 
    border:1px solid #b5caee;
	}
.tb3 td{
	height:56px;
	/*background-attachment:scroll;
	background-repeat:repeat;
	background-position:50% 50%;
	background-image: url(../images/up3/tbbg.jpg);*/
	/**/
	vertical-align:middle;/* 等同於 valign="middle" 的垂直置中效果 */
    padding:5px; 
    border:1px solid #b5caee;
	}
.tb1 td:nth-child(1){width:18%;}
.tb1 td:nth-child(2){width:32%;}
.tb1 td:nth-child(3){width:25%;}
.tb1 td:nth-child(4){width:25%;}
/**/
.tb3 td:nth-child(1){width:60%;}
.tb3 td:nth-child(2){width:40%;}

.rule-tit{
	position:relative;
	width:100%;
	display:block;
	padding:36px 0 16px;
	}
.rule-tit::before{
	position:relative;
	width:60.851%;/*572*/
	padding-bottom:4.1489318%;/*39*/
	display:block;
	content:"";
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100% auto;
	background-image: url(../images/up4/rule-tit.png);
	margin:0 auto;
	}	

.tb4{
	position: relative;
	width: 98%;
	margin:10px auto;
	background-color:rgba(255,255,250,0.8);
	padding:2px;
	border:1px solid #bdb391;
	}
.tb4::before{
	position: absolute;
	width: 100%;
	height: 100%;
	display:block;
	content:"";
	pointer-events:none;
	top: 0;
	left: 0;
	z-index: 1;
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:0% 0%,100% 0%,100% 100%,0% 100%;
	background-image: url(../images/up4/tab4_1.png),url(../images/up4/tab4_2.png),url(../images/up4/tab4_3.png),url(../images/up4/tab4_4.png);
	}
.tb4 table{
	position: relative;
	width:100%;
	
	/**/
	border-collapse:collapse;
	text-align: center;
	}
.tb4 th{font-weight:500;}
.tb4 td,.tb4 th{
	min-height:98px;
	/**/
	vertical-align:middle;/* 等同於 valign="middle" 的垂直置中效果 */
    padding:5px; 
    border:1px solid #e0d7b6;
	color:#412f21;
	}
.tb4 td:nth-child(1){width:18%;}
.tb4 td:nth-child(2){width:22%;}
.tb4 td:nth-child(3){width:60%;text-align:left;}
/**/			
@media only screen and (max-width:1400px){
/**/
	
}
@media only screen and (max-width:1300px){
/**/
#up3morbx{width:87%;/*1121*/}	
.u3popcn{
	font-size:1.38vw;/*18*/
	line-height:2.46vw;/*32*/
	}	
.sub-tit_a,.sub-tit2_a{
	height:3.6923vw;/*48*/
	margin:0.923vw 0 1.23vw;/*12 16*/
	}
.sub-tit_a > span,.sub-tit2_a > span{
    font-size:1.846vw;/*24*/
	line-height:3.6923vw;/*48*/
	padding-left:1.69vw;/*22*/
	}
.u3_2_bc2_a{
	padding-left:1.69vw;/*22*/
	}
.u3a1,.u3a2{padding-left:1.69vw;/*22*/ }
	
}
@media only screen and (max-width:1080px){	
/**/
.pvdo{width:80%;/*889*/}
/**/
.skillbx{width:84%;/*940*/}
.skill-tit,.rule-tit{padding:3.33vw 0 1.48vw;}
.skcobx{
	height:calc(100% - 8.4259vw - 5.0925vw);
	/**/
	font-size:1.6vw;/*18*/
	line-height:2.96vw;/*32*/
	}	
.sk_1 strong{font-size:1.85vw;/*20*/}
.sk_1 > li{
	padding-left:2.037vw;/*22*/
	padding-bottom:0.925vw;/*10*/
	}
.sk_1 > li::before{
	width:0.925vw;/*10*/
	height:0.925vw;/*10*/
	top:0.925vw;/*10*/
  	}	
.sk_2{padding-bottom:0.925vw;/*10*/}
.sk_2 > li{padding:0.925vw 0;/*10*/}
.sk_img{
    width:7.7vw;/*84*/
    height:7.7vw;
	margin-right:1.11vw;/*12*/
	}
.sk_ms{
	font-size:1.48vw;/*16*/
	line-height:2.59vw;/*28*/
	}
.sk_ms strong{font-size:1.6vw;/*18*/}
.sk_name{
	font-size:2.037vw;/*22*/
	}	
/**/
.art-title{
	padding-left:2.222vw;/*24*/
	font-size:2.222vw;/*24*/
	margin-bottom:0.74vw;/*8*/
	}
.art-title::before{
	width:1.759vw;/*19*/
	padding-bottom:2.592vw;/*28*/
	top: 0.0925vw;/*1*/
	}
.artc_1{padding:0 0 1.48vw 2.222vw;/*16 24*/ }
	
	
/**/	
.u3popcn{
	font-size:1.6vw;/*18*/
	line-height:2.96vw;/*32*/
	}
.u3mbx{padding-top:1.38vw;}/*15*/	
.sub-tit_a,.sub-tit2_a{
	height:4.4vw;/*48*/
	margin:1.1vw 0 1.48vw;/*12 16*/
	}
.sub-tit_a > span,.sub-tit2_a > span{
    font-size:2.2vw;/*24*/
	line-height:4.4vw;/*48*/
	padding-left:2.03vw;/*22*/
	}
.u3_2_bc2_a{
	padding-left:2.03vw;/*22*/
	}	
.u3a1,.u3a2{padding-left:2.03vw;/*22*/ }

}
@media only screen and (max-width:800px){
/**/


}
@media only screen and (max-width:750px){
/**/
.pvdo{width:98%;}
.pvclose{
	width:10%;/*68*/
	padding-bottom:10%;
	top:105%;
	left:45%;
	}
/**/
.skillbx{
	width:98%;/*710*/
	background-image: url(../images/pop-bg2_m.png);
	}	
.skillbx::before{
	width:100%;/*710*/
	padding-bottom:104.5%;/*742*/
	}
.skill-tit,.rule-tit{padding:4.8vw 0 2.13vw;}/*36px 0 16px*/
.skill-tit::before,.rule-tit::before{
	width:80.563%;/*572*/
	padding-bottom:5.4929318%;/*39*/
	}
.skcobx{
	width:92%;/*815 830*/
	height:calc(100% - 12.13vw - 7.33vw);
	/**/
	font-size:2.4vw;/*18*/
	line-height:4.26vw;/*32*/
	font-weight:400;
	}
.sk_1 strong{font-size:2.6vw;/*20*/}
.sk_1 > li{
	padding-left:2.93vw;/*22*/
	padding-bottom:1.3vw;/*10*/
	}
.sk_1 > li::before{
	width:1.3vw;/*10*/
	height:1.3vw;/*10*/
	top:1.3vw;/*10*/
  	}
.sk_2{padding-bottom:1.3vw;/*10*/}
.sk_2 > li{padding:1.3vw 0;/*10*/}
.sk_img{
    width:11.2vw;/*84*/
    height:11.2vw;/*84*/
	margin-right:1.6vw;/*12*/
	}
.sk_ms{
	font-size:2.13vw;/*16*/
	line-height:3.73vw;/*28*/
	}
.sk_ms strong{font-size:2.4vw;/*18*/}
.sk_name{font-size:2.93vw;/*22*/}
/**/
.art-title{
	padding-left:3.2vw;/*24*/
	font-size:3.2vw;/*24*/
	margin-bottom:1.06vw;/*8*/
	}
.art-title::before{
	width:2.53vw;/*19*/
	padding-bottom:3.73vw;/*28*/
	top:0.13vw;/*1*/
	}
.artc_1{padding:0 0 2.13vw 3.2vw;/*16 24*/ }	
	
/**/
#up3morbx{
	width:99%;/*742*/
	background-image: url(../images/up3/pop_bg_m.png);
	margin-bottom: 6%;
	}
#up3morbx::before{
	padding-bottom:134.77%;/*1000*/
	}	
.u3close{
	width:10%;/*64*/
	padding-bottom:10%;/*64*/
	top:99%;
	left:45%;
	}
	
.u3popbx{
	width:84.23%;/*625*/
	padding-bottom:18.86.752%;/*140*/
	left:7.547%;/*56*/
	}
.u3popbx::before{
	width:83.52%;/*522*/
	padding-bottom:8%;/*50*/
	top:9.3vw;/*70*/
	}
.u3popcn{
	width:84.23%;/*625*/
	padding-bottom:107.8144%;/*800*/
	top:14%;/*140*/
	left:7.547%;/*56*/
	font-size:2.4vw;/*18*/
	line-height:4.26vw;/*32*/
	font-weight:400;
	}
.u3img img.ma{display:none;}
.u3img img.ma2{display:block;}
	
.u3mbx{padding-top:2vw;}/*15*/	
.sub-tit_a,.sub-tit2_a{
	height:6.4vw;/*48*/
	margin:1.6vw 0 2.13vw;/*12 16*/
	}
.sub-tit_a > span,.sub-tit2_a > span{
    font-size:3.2vw;/*24*/
	line-height:6.4vw;/*48*/
	padding-left:2.93vw;/*22*/
	}
.u3_2_bc2_a{
	padding-left:2.93vw;/*22*/
	}	
.u3img img{margin:1.3vw 0;}/*10*/
.u3c{margin:1.3vw 0;}
.u3a1,.u3a2{padding-left:2.93vw;/*22*/ }
	
.tb1,.tb2,.tb3{margin:1.3vw 0;/*10*/}	
.tb4{margin:1.3vw 0;/*10*/}	
	
}
@media only screen and (max-width:630px){
/**/


}
@media only screen and (max-width:580px){
	
}
@media only screen and (max-width:500px){
/**/
.skcobx{
	width:95%;
	height:calc(100% - 18.2vw - 3.5vw);/*91px - 20px*/
	/**/
	font-size:3.65vw;/*18*/
	line-height:6vw;/*30*/
	}
.sk_1 strong{font-size:4vw;/*20*/}
.sk_1 > li{
	padding-left:4.4vw;/*22*/
	padding-bottom:2.2vw;/*10*/
	}
.sk_1 > li::before{
	width:2vw;/*10*/
	height:2vw;/*10*/
	top:2vw;/*10*/
  	}
.sk_2{padding-bottom:2.2vw;/*10*/}
.sk_2 > li{padding:2.2vw 0;/*10*/}
.sk_img{
    width:16.8vw;/*84*/
    height:16.8vw;/*84*/
	margin-right:2.4vw;/*12*/
	}
.sk_ms{
	font-size:3.65vw;/*18*/
	line-height:5.5vw;/*30*/
	}
.sk_ms strong{font-size:3.65vw;/*18*/}
.sk_name{
	font-size:4.4vw;/*22*/
	padding-bottom:1vw;/*5*/
	}
/**/
.art-title{
	padding-left:4.8vw;/*24*/
	font-size:4.8vw;/*24*/
	margin-bottom:1.6vw;/*8*/
	}
.art-title::before{
	width:3.8vw;/*19*/
	padding-bottom:5.6vw;/*28*/
	top:0.2vw;/*1*/
	}
.artc_1{padding:0 0 3.2vw 4.8vw;/*16 24*/ }	
	
	
.u3popcn{
	/**/
	font-size:3.65vw;/*18*/
	line-height:6vw;/*30*/
	}
.u3mbx{padding-top:3vw;}/*15*/	
.sub-tit_a,.sub-tit2_a{
	height:8vw;/*48*/
	margin:2vw 0 2.6vw;/*12 16*/
	}
.sub-tit_a > span,.sub-tit2_a > span{
    font-size:4vw;/*24*/
	line-height:8vw;/*48*/
	padding-left:3.6vw;/*22*/
	}
.u3_2_bc2_a{
	padding-left:3.6vw;/*22*/
	}
.u3img {text-align:left;}
.u3a1,.u3a2{padding-left:3.6vw;/*22*/}	
/**/	
.tb4 th{line-height:5vw;}

}
@media only screen and (max-width:450px){
/**/
}
@media only screen and (max-width:418px){
/**/
}
@media only screen and (max-width:380px){
/**/
}
@media only screen and (max-width:360px){
/**/
}
@media only screen and (max-width:320px){
/**/
}
