@charset "utf-8";

.header{position:fixed;left:0%;top:0;right:0%;z-index:3;transition:all 0.7s ease-out 0s;}
.header{opacity:0;transform:translateY(-100%);}
.header.showdiv{opacity:1;transform:none;}
.body_home.showdiv .header{transform:none;opacity:1;}

.header .d1{background:var(--color-2);color: #FFF;transition:all 0.2s ease-out 0s;overflow:hidden;
line-height:calc(4.0rem + 0.5vw);height:calc(4.0rem + 0.5vw);}
.header .d2{transition:all 0.3s ease-out 0s;height:85px;background:linear-gradient(rgba(0,0,0,0.7),rgba(0,0,0,0));}
	.header .block-outer{position:relative;height:100%;
	display:-ms-flexbox;display:flex;-ms-flex-pack:justify;
	justify-content:space-between;-ms-flex-align:center;align-items:center;}
	.header .nav_main{flex:1}

/*頂欄共用的樣式*/
	.header-link .d1 .nav_l a{display:inline-block;line-height:1;color:#FFF;display:block;margin-right:calc(1.8rem + 0.2vw);font-size:var(--fsize-16);float:left;}
	.header-link .d1 .nav_l a:hover{color:var(--color-3)}
	.header-link .d1 .nav_l a:after{content:"";display:block;border-bottom:2px solid var(--color-3);margin-top:5px;
	transition:all 0.1s ease-out 0s;;transform:scaleX(0);}
	.header-link .d1 .nav_l a:hover:after{transform:scaleX(50%);}
	.header-link .d1 .nav_r i{font-size:var(--fsize-18);display:block;}
	.header-link .d1 .nav_r a{text-align:center;display:block;}
	.header-link .d1 .nav_r a i{color:#FFF;}
	.header-link .d1 .nav_r a:hover i{color:var(--color-3);}
	.header-link .logo{height:100%;width:calc(18.0rem + 8.0vw);}
	.header-link .logo a{height:100%;font-size:0;display:block;}
	.header-link .logo img{max-height:80%;vertical-align:middle;display:inline-block;}
	.header-link .logo a:after{content:"";display:inline-block;height:100%;vertical-align:middle;}
	
.header2{position:fixed;left:0;right:0;top:0;z-index:3;background:var(--color-2);
opacity:0;transform:translateY(-100%);transition:all 0.5s ease-out 0s;box-shadow:0 0 10px rgba(0,0,0,0.15);}
	.body_b .header2{opacity:0;transform:translateY(-100%);}
	.body_b.showdiv .header2{transition:all 0.7s ease-in-out 0.5s;transform:none;opacity:1;}
	.header2.showdiv{opacity:1;transform:none;}
	.header2 .d1{background:var(--color-2);color: #d39797;line-height:45px;height:45px;font-size:var(--fsize-14);transition:all 0.2s ease-out 0s;overflow:hidden;}
	.header2 .d2{transition:all 0.3s ease-out 0s;height:85px;height:85px;background:#fff;}
	.header2 .block-outer{position:relative;height:100%;
display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;}
	.header2 .nav_main{flex:1}

.header3{position:-webkit-sticky; position:sticky; top:0;z-index:10;;background:var(--color-2);
opacity:1;transform:translateY(0px);transition:all 0.5s ease-out 0s;box-shadow:0 0 10px rgba(0,0,0,0.15);}
	.body_b .header3{opacity:0;transform:translateY(-100%);}
	.body_b.showdiv .header3{transition:all 0.7s ease-in-out 0.5s;transform:none;opacity:1;}
	.header3.showdiv{opacity:1;transform:none;}
	.header3 .d1{background:var(--color-2);color: #d39797;line-height:45px;height:45px;font-size:var(--fsize-14);transition:all 0.2s ease-out 0s;overflow:hidden;}
	.header3 .d2{transition:all 0.3s ease-out 0s;height:85px;height:85px;background:#fff;}
	.header3 .block-outer{position:relative;height:100%;
display:-ms-flexbox;display:flex;-ms-flex-pack:justify;justify-content:space-between;-ms-flex-align:center;align-items:center;}
	.header3 .nav_main{flex:1}


/***ax-nav導航***/
/***引起ax-header部分***/
.my-header .ax-nav .ax-item .ax-line {
    height: .2rem;
    background-color: #198cff;
    width: 2.8rem;
    -webkit-transform: translate(-50%,0) scaleX(0);
    transform: translate(-50%,0) scaleX(0);
    transition: all .2s linear;
    position: absolute;
    left: 50%;
    top: calc(4.4rem + 1rem - .2rem);}
.my-header .ax-nav .ax-item {
  margin: 0 1.6rem;
  display: inline-block;
  vertical-align: middle;
  position: relative;}
.my-header .ax-nav .ax-item a {transition: all 200ms linear;}
.my-header .ax-nav .ax-item a.ax-text > i {
  font-size: 1rem;
  line-height: 1.4rem;
  vertical-align: middle;
  margin-left: 0.4rem;}
.my-header .ax-nav .ax-item a.ax-text {
  line-height: calc(4.4rem + 1rem);
  width: 100%;
  text-align: center;}
.my-header .ax-nav .ax-item .ax-line {
  height: 0.2rem;
  background-color: #198cff;
  width: 2.8rem;
  -webkit-transform: translate(-50%, 0) scaleX(0);
  transform: translate(-50%, 0) scaleX(0);
  transition: all 200ms linear;
  position: absolute;
  left: 50%;
  top: calc(4.4rem + 1rem - 0.2rem);}
.my-header .ax-nav .ax-item.ax-selected > a {color: #198cff;}
.my-header .ax-nav .ax-item.ax-selected .ax-line {
  -webkit-transform: translate(-50%, 0) scaleX(1);
  transform: translate(-50%, 0) scaleX(1);}
.my-header .ax-nav .ax-item:hover .ax-line {
  -webkit-transform: translate(-50%, 0) scaleX(1);
  transform: translate(-50%, 0) scaleX(1);}
.ax-nav{display:flex}
.ax-nav .ax-item{flex:1;text-align:center;}
.ax-nav .ax-item{margin: 0 0 !important;}
	.ax-nav .ax-text{color:#FFF;font-size:var(--fsize-17)}
	.ax-nav .ax-text:hover{color:var(--color-3)}
	.ax-nav .ax-item .ax-line{background-color:var(--color-3) !important;height:0.3rem !important;}/***觸碰後線***/
	.ax-nav div:hover > .ax-text{color: var(--color-3);}/***觸碰後樣式保留***/
/***2級***/

@font-face {
  font-family: "Huawen";
  src: url("../fonts/xingkai.ttf");
  font-weight: normal;
  font-style: normal;
}

	.ax-grade .ax-outer, .ax-grade ul.ax-outer ul{border: 0px solid rgba(0,0,0,0.8);border-radius:0px;width:100%;text-align:left;}
	.ax-grade .ax-outer{background-color:transparent !important;width:60.0vw;padding:0px;}

	.ax-nav div:nth-child(6) .ax-outer{left:-8.0vw;}
	.ax-nav div:nth-child(7) .ax-outer{left:-8.0vw;}
	.ax-nav div:nth-child(8) .ax-outer{left:-24.0vw;}
	.ax-nav div:nth-child(9) .ax-outer{left:-24.0vw;}
	.ax-nav div:nth-child(10) .ax-outer{left:-24.0vw;}

		.ax-grade .ax-outer dl{
		background-color:var(--color-2); 
		background-image:url(../picture/topleft.png);
		background-repeat: no-repeat;
		background-position: right bottom;
		background-size: 50% auto;
		width:100%;color:#FFF;display:flex;
		overflow:hidden;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;
		padding:calc(1.0rem + 1.0vw)}
			.ax-grade .ax-outer dl p{width:calc(16.0rem + 6.0vw);height:calc(9.0rem + 3.0vw);
				display: block;
				background-repeat: no-repeat;
				background-position: center;
				background-size: cover;
				overflow:hidden;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;
				}
			.ax-grade .ax-outer dl dt{width:25%;padding-left:calc(1.0rem + 0.5vw);
			font-weight:normal;font-family: 'Huawen';font-size:var(--fsize-18);
			line-height:1.5;
			overflow:hidden;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;
			height:calc(9.0rem + 3.0vw);position:relative;
			}
			.ax-grade .ax-outer dl dt span{position:absolute;top:50%;transform:translate(0%, -50%);}
			.ax-grade .ax-outer dl dd{flex:1;font-size:var(--fsize-15);position:relative}
			.ax-grade .ax-outer dl dd span{width:100%;
			position:absolute;top:50%;transform:translate(0%, -50%);
			}



	
	.ax-grade ul.ax-outer li {line-height:100%;transition: all 1000ms linear 1000ms;font-size:var(--fsize-16);
	  border: 0px;background-color:rgba(0,0,0,0.8)}
	.ax-grade .ax-outer a{color:#FFF;display:block;padding:calc(0.4rem + 0.1vw) calc(0.9rem + 0.3vw) !important;
	border-bottom:0px rgba(255,255,255,0.05) solid;float:left;width:33.33%}
	.ax-grade .ax-outer a:hover{color:var(--color-1)}

	.ax-nav .outer div:nth-child(224) .ax-outer{width:380%;}
	.ax-nav .outer div:nth-child(224) .ax-outer li{float:left;width:33.33%;}
	.ax-nav2 .ax-text{color:#000;font-size:var(--fsize-17)}
	.ax-nav2 .ax-text:hover{color:var(--color-2) !important}
	.ax-nav2 .ax-item .ax-line{background-color:var(--color-2) !important;height:0.3rem !important;}
	.ax-nav2 div:hover > .ax-text{color: var(--color-2) !important;}

/*--滾動大圖處的底部三角--*/
.body_home .bb{position:absolute;left:50%;bottom:calc(2.0rem + 1.0vw);text-align:center;transform:translateX(-50%);
color:rgba(255,255,255,0.5);
cursor: pointer;opacity:0;font-family:icon;padding:0 10px;animation:bb 2s linear 0s infinite;font-weight:bold;}
.body_home.showdiv .bb{opacity:1;}
.body_home .bb i{font-size:calc(2.8rem + 1.0vw)}
.body_home .bb:hover{ animation-play-state:paused;color:#fffbe7;}
/*--三角動作--*/
@keyframes bb{
	0%{transform:translate(-50%,0);opacity:0;}
	20%{transform:translate(-50%,3px);opacity:1;}
	80%{transform:translate(-50%,10px);opacity:1;}
	90%{transform:translate(-50%,10px);opacity:0;}
	100%{transform:translate(-50%,10px);opacity:0;}
}

/*--底部--*/
.footer{background: var(--color-2);;color:#fff;position: relative;padding-bottom:calc(0.5rem + 0.5vw)}
	.footer a{color:#fff;}
	.footer a:hover{color:var(--color-3);}
	.footer .part1{padding:calc(1.0rem + 0.2vw) 0px;font-size:var(--fsize-15);
		display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:end;align-items:flex-end;
		background:#f0f8ff;color:#000;}
		.part1 .nav_foot{overflow: hidden;}
		.part1 .link-mu{font-size:var(--fsize-16);font-weight:bold}
		.part1 .link-inner a{display:block;float:left;margin-right:calc(1.5rem + 0.5vw);position:relative;padding-left:calc(1.0rem + 0.2vw);
		height:calc(2.2rem + 1.2vw);line-height:calc(2.2rem + 1.2vw);color:#000;
		}
		.part1 .link-inner a:hover{color:#e60000}
		.part1 .link-inner a::before {
			content: '\220E';
			color: var(--color-2);
			font-family: 'ax-iconfont';
			font-size: 70%;
			left: 0px;
			top: 0px;
			position: absolute;}

			.nav_foot .inner a{padding:60px 0 0 0;text-align:center;width:calc(8.0rem + 1.5vw);
				border-left:1px solid rgba(255,255,255,0.2);display:inline-block;white-space:nowrap;}
		.part1 .icon-box{overflow:hidden;text-align:center}
			.icon-box i{display:block;text-align:center;clear:both;margin: 0 auto;;
			width:calc(4.0rem + 0.1vw);height:calc(4.0rem + 0.1vw);line-height:calc(4.0rem + 0.1vw);
			background:#FFF;border-radius:50%;text-align:center;color:var(--color-2);font-size:calc(2.5rem + 0.1vw)}
			.icon-box span{display:block;text-align:center;clear:both}
	.footer .part2{padding-top:calc(1.0rem + 1.0vw);width:100%;font-size:var(--fsize-13);}
		 .part2 .footer-pic {margin-bottom:calc(1.0rem + 1.0vw);}
			 .part2 .footer-pic1 span{display:block}/***wap-重定***/
			 .part2 .footer-pic1 img{width:100%;max-width:calc(15.0rem + 12.0vw)}
			 .part2 .footer-pic2 span{text-align:center;display:block}
			 .part2 .footer-pic2 img{max-width:calc(8.0rem + 1.5vw)}
			 .part2 .footer-pic2 em{display:block;line-height:2.2;padding-top:2px;}
		 .part2 .footer-info{color:rgba(255,255,255,0.1);}
			.part2 .footer-info{text-align:left;}
			.part2 .footer-info span{color: #fff;font-size:var(--fsize-15);}
			.part2 .footer-info span{display:block}

		 .part2 .footer-link{overflow:hidden;text-align:center}
			.part2 .footer-link select{background:#FFF;border:0px;margin-bottom:calc(0.5rem + 0.2vw);opacity:0.8}