@charset "utf-8";

@font-face {
	font-family: 'yy';
	src: url('../fonts/yy.ttf') format('truetype');
	font-style: normal;
	font-weight: normal;
}

body {
	padding: 0;
	margin: 0;
	font-size: 16px;
	font-family: 'Microsoft JhengHei', Arial, Helvetica, sans-serif;
	font-weight: normal;
	color: #222;
	background: #fff;
}

.logo-box {
	position: fixed;
	top: 0;
	left: 0px;
	z-index: 999;
}

@media (min-width:768px) {
	.logo-box {
		left: 10px;
	}
}

.logo-iner {
	position: relative;
}

.logo-iner::before {
	display: none;
}

@media (min-width:768px) {
	.logo-iner::before {
		content: '';
		display: block;
		width: 10px;
		height: 100vh;
		background-color: #4c4c4c;
		position: absolute;
		left: -10px;
		top: 0;
		opacity: .7;
	}
}

.logo-in {
	display: flex;
	flex-direction: column;
}

.logo-in img {
	opacity: .7;
}

.logo-in span {
	display: block;
	width: 26px;
	height: 100vh;
	background-color: #4c4c4c;
	opacity: .7;
}

.swiper-bj {
	position: relative;
	overflow: hidden;
	height: 100vh;
}

.slide-img {
	width: 100%;
	height: 100%;
	background: url(../images/bg-1.png) no-repeat top left;
	background-size: cover;
	object-fit: cover;

}

.slide-img1 {
	position: relative;
	overflow: hidden;
}

.slide-img1 img {
	width: 100%;
	height: 100vh;
	background-size: cover;
	object-fit: cover;
}

.body-info {
	position: absolute;
	/* bottom: 0; */
	top: 0;
	left: 0;
	padding: 0 0 0 26px;
	width: 100%;
	height: 100%;
	display: block;
	overflow: hidden;
	z-index: 9;
}
/*.body-info.fix-home-hidden{
	overflow: auto;
	position: relative;
}*/
@media (min-width:768px) {
	.body-info {
		padding: 0 36px;
	}
}

.container {
	max-width: 100% !important;
	padding: 0;
}

.info-box {
	position: relative;
	/*overflow: hidden;*/
	height: 100vh;
}



.home-dln {
	position: absolute;
	bottom: 0;
	display: flex;
	justify-content: center;
	align-items: center;
}

@media (min-width:768px) {
	.home-dln {
		position: absolute;
		bottom: 0;
	}
}

.home-dln img {
	/*background-size: cover;
	object-fit: cover;*/
	/*width: 100%;*/
}

.home-text {
	position: absolute;
	bottom: 30%;
	left: 8%;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}

@media (min-width:992px) {
	.home-text {
		left: 12%;
	}
}

@media (min-width:1440px) {
	.home-text {
		left: 10%;
	}
}


@media (min-width:1921px) {
	.home-text {
		left: 12%;
	}
}

.text-1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13.5px;
	text-transform: uppercase;
	color: #f15a22;
	text-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
}

.text-2 {
	font-size: 13.5px;
	color: #fff;
	font-family: "Microsoft JhengHei";
	font-weight: 300;
	margin-top: -5px;
	text-shadow: 0 2px 2px rgba(0, 0, 0, 0.3);
}

@media (min-width:768px) {
	.text-1 {
		font-size: 24px;
	}

	.text-2 {
		font-size: 22px;
		color: #555555;
		margin-top: -10px;
	}
}

@media (min-width:1024px) {
	.text-1 {
		font-size: 32px;
	}

	.text-2 {
		font-size: 24.5px;
		margin-top: -10px;
	}
}

@media (min-width:1200px) {
	.text-1 {
		font-size: 40px;
	}

	.text-2 {
		font-size: 30.5px;
		margin-top: -15px;
	}
}

@media (min-width:1400px) {
	.text-1 {
		font-size: 50px;
	}

	.text-2 {
		font-size: 38.5px;
		margin-top: -20px;
	}
}

.footer-icon {
	position: fixed;
	bottom: 2%;
	right: 2%;
	z-index: 999;
}

@media (min-width:992px) {
	.footer-icon {
		right: 18%;
		bottom: 4%;
	}
}

@media (min-width:1921px) {
	.footer-icon {
		right: 30%;
		bottom: 4%;
	}
}

.icon-box {
	display: flex;
	align-items: center;
}

.icon-box a {
	margin: 0 4px;
}

@media (min-width:992px) {
	.icon-box a {
		margin: 0 7px;
	}
}

.swiper-bj1 {
	position: relative;
	overflow: hidden;
}

.swiper-bj1 .swiper-slide {
	height: 100vh;
}

.img-bj {
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 999;
	width: 100%;
	height: 100vh;
	padding-top: 113px;
	padding-left: 26px;
}

@media (min-width:768px) {
	.img-bj {
		padding-left: 36px;
	}
}

@media (min-width:992px) {
	.img-bj {
		padding-top: 150px;
	}
}

@media (min-width:1921px) {
	.img-bj {
		padding-top: 210px;
	}
}

.img-iner-row {
	height: 100%;
	padding: 0 0 0 10px;
}

@media (min-width:1024px) {
	.img-iner-row {
		top: 200px;
	}
}

@media (min-width:1920px) {
	.img-iner-row {
		top: 255px;
	}
}

.col-style {
	height: 100%;
	position: relative;
	padding: 0;
}

.xbj-img {
	position: absolute;
	bottom: 0;
	left: 2px;
	width: 100%;
	height: 100%;
}

.xbj-img img {
	width: 100%;
	height: 100%;
	background-size: cover;
	object-fit: cover;
}

.dln-img {
	display: none;
}

@media (min-width:768px) {
	.dln-img {
		display: block;
		position: absolute;
		bottom: 0;
		right: 0;
	}
}

.dln-img img {
	width: 100%;
	background-size: cover;
	object-fit: cover;
}

@media (min-width:1921px) {
	.dln-img img {
		width: 1000px;
	}
}

.dln-mobile {
	position: fixed;
	bottom: 0;
	z-index: 1;
	width: 100%;
	padding-left: 26px;
}

.dln-img1 {
	padding-left: 12px;
	position: relative;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
}

.dln-img1 img {
	width: 100%;
	height: 100%;
}

@media (min-width:768px) {
	.dln-mobile {
		display: none;
	}
}

/* .dln-img1{
	position: fixed;
	bottom: 0;
	left: 0;
	width: 80%;
	z-index: 999;
	padding-left: 26px;
}

@media (min-width:425px){
	.dln-img1{
		width: 78%;
	}
}

@media (min-width:768px) {
	.dln-img1{
		display: none;
	}
} */


.xbj-1 {
	position: relative;
	overflow: hidden;
}

.xbj-1::after {
	content: '';
	display: block;
	width: 150px;
	height: 2px;
	background-color: #fff;
	position: absolute;
	top: 0;
	right: 0;
}

.xbj-1::before {
	content: '';
	display: block;
	width: 2px;
	height: 150px;
	background-color: #fff;
	position: absolute;
	top: 0;
	right: 0;
}

.about-iner {
	position: relative;
	display: flex;
	justify-content: flex-end;
	margin-right: 0px;
}

@media (min-width:768px) {
	.about-iner {
		margin-right: -20px;
	}
}

@media (min-width:992px) {
	.about-iner {
		margin-right: -120px;
	}
}

.web {
	display: none;
}

.mobile {
	display: block;
}

@media (min-width:992px) {
	.web {
		display: block;
	}

	.mobile {
		display: none;
	}
}

.mobile-nav {
	margin-right: 30px;
}

.nav-box {
	display: flex;
}

@media (min-width:768px) {
	.nav-box {
		margin: 0;
	}
}

.nav-li {
	margin-top: 80px;
}

@media (min-width:768px) {
	.nav-li {
		margin-top: 60px;
	}
}

@media (min-width:992px) {
	.nav-li {
		margin-top: 100px;
	}
}

@media (min-width:1921px) {
	.nav-li {
		margin-top: 160px;
	}
}

.nav-li-1 {
	position: relative;
}

.nav-li-1::after {
	content: '';
	width: 80px;
	height: 2px;
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	background-color: #fff;
}

.nav-li-1::before {
	content: '';
	width: 2px;
	height: 270px;
	background-color: #fff;
	display: block;
	position: absolute;
	top: -270px;
	left: -4px;
}

@media (max-width:991px) {

	.nav-li-1::before,
	.nav-li-1::after {
		display: none;
	}
}

.nav-li-2 {
	margin-right: 0px;
}

@media (min-width:992px) {
	.nav-li-2 {
		margin-right: 50px;
	}
}

.nav-li-3 {
	margin-right: 0;
}

@media (min-width:768px) {
	.nav-li-3 {
		margin-right: 50px;
	}
}

.nav-li a {
	position: relative;
	display: flex;
	align-items: center;
	font-size: 22px;
	color: #fff;
	font-family: 'Microsoft JhengHei';
	font-weight: 400;
	text-decoration: none;
}

@media (min-width:768px) {
	.nav-li a {
		font-size: 38px;
	}
}

.nav-li .fa {
	font-size: 16px;
	color: #1f2639;
	display: block;
	margin-left: 5px;
	margin-top: -5px;
}

@media (min-width:768px) {
	.nav-li .fa {
		display: none;
	}
}

.nav-li a.active,
.nav-li a:hover {
	color: #1f2639;
}

.dropdown-box {
	display: none;
	position: absolute;
	width: 98%;
	top: 103%;
	left: 12px;
	margin-left: 0px;
	padding-right: 0px;
	z-index: 9;
}

@media (min-width:376px) {
	.dropdown-box {
		width: 100%;
	}
}

@media (min-width:992px) {
	.dropdown-box {
		display: block !important;
		min-width: 150px;
		left: auto;
		right: 120px !important;
		z-index: 1;
	}
}

@media (min-width:1200px) {
	.dropdown-box {
		width: 200px;
	}
}

.web-nav-in {
	display: none;
}

.mobile-nav-in {
	display: block;
	z-index: 9;
}

@media (min-width:992px) {
	.web-nav-in {
		display: block;
	}

	.mobile-nav-in {
		display: none;
	}
}

.mobile-nav-in .nav-pills .nav-link:hover {
	color: #fff;
	opacity: 1;
}

.nav-list .nav-link {
	width: 100%;
	background: none !important;
	/* font-family: 'yy'; */
	font-size: 18px;
	color: #fff;
	opacity: .6;
	text-align: right;
	padding: 0;
}

@media (min-width:992px) {
	.nav-list .nav-link {
		color: #666666;
		font-size: 20px;
		opacity: 1;
	}
}

@media (min-width:1200px) {
	.nav-list .nav-link {
		font-size: 24px;
	}
}

@media (min-width:1400px) {
	.nav-list .nav-link {
		font-size: 28px;
	}
}

.mobile-nav-li-on {
	padding-top: 5px;
	margin-bottom: 5px;
}

.mobile-nav-li-on .nav-link {
	padding-right: 10px;
	padding-top: 2px;
	padding-bottom: 2px;
}

.nav-list .nav-link:hover,
.nav-list .nav-link.active {
	color: #1f2639;
	font-weight: bold;
}

.mobile-nav-li-on .nav-link.active {
	color: #fff;
	opacity: 1;
}

.nav-li-style {
	padding: 0 !important;
	margin: 0 !important;
}

.nav-li-be {
	background-color: rgba(0, 0, 0, 0.8);
	width: 98%;
	/*width:max-content;*/
}

.about-info,
.section-info {
	z-index: 0;
}
.in-about-text,
.in-box-con,
.fix-company-language{
	padding: 0px 15px 0px 15px;
}
.in-about-text,
.in-box-con {
	height: calc(100vh - 330px);
	overflow-y: auto;
	margin-top: 20px;
}

@media (min-width:414px) {
	.in-about-text,
	.in-box-con {
		height: calc(100vh - 360px);
	}
}

@media (min-width:992px) {
	.in-about-text,
	.in-box-con,
	.fix-company-language{
		padding: 10px 200px 0px 50px;
	}
	.in-about-text,
	.in-box-con {
		height: calc(100vh - 380px);
	}
}

@media (min-width:1200px) {
	.in-about-text,
	.in-box-con,
	.fix-company-language{
		padding: 20px 250px 0px 80px;

	}
	.in-about-text,
	.in-box-con {
		/*padding: 20px 250px 0px 80px;*/
		height: calc(100vh - 350px);
	}
}

@media (min-width:1400px) {
	.fix-company-language,
	.in-about-text,
	.in-box-con {
		padding: 20px 300px 0px 80px;
	}
}

.in-about-text h3 {
	font-size: 16px;
	color: #000;
	font-weight: bold;
	margin-bottom: 5px;
}

.in-about-text p {
	font-size: 14px;
	color: #000;
	line-height: 24px;
	margin-bottom: 5px;
}

.ff-style {
	font-family: Arial, Helvetica, sans-serif;
	/*font-weight: bold;*/
}

@media (min-width:992px) {
	.ff-style{
		font-weight: normal;
	}
}

.ff-tex{
	font-weight: bold;
}

.ff-my {
	font-family: 'STSong';
	letter-spacing: 1px;
}

@media (min-width:992px) {
	.ff-my {
		letter-spacing: 4px;
	}

	.in-about-text h3 {
		font-size: 18px;
		margin-bottom: 10px;
	}

	.in-about-text p {
		font-size: 14px;
		line-height: 26px;
	}
}

@media (min-width:1200px) {
	.in-about-text h3 {
		font-size: 20px;
	}

	.in-about-text p {
		font-size: 18px;
		line-height: 30px;
	}
}

@media (min-width:1600px) {
	.in-about-text h3 {
		font-size: 24px;
		line-height: 32px;
	}

}

@media (min-width:1921px) {
	.in-about-text h3 {
		font-size: 26px;
	}

	.in-about-text p {
		font-size: 22px;
		line-height: 36px;
	}
}

.project-nav-box::-webkit-scrollbar,
.project-info::-webkit-scrollbar,
.fix-project-menu::-webkit-scrollbar,
.popup-top::-webkit-scrollbar,
.project-nav-list::-webkit-scrollbar,
.in-about-text::-webkit-scrollbar,
.in-box-con::-webkit-scrollbar,
.project-in-img::-webkit-scrollbar,
.popup-xm-inner::-webkit-scrollbar,
.awards-top::-webkit-scrollbar{
	width: 2px;
	display: block;
}

.project-nav-box::-webkit-scrollbar-track,
.project-info::-webkit-scrollbar-track,
.fix-project-menu::-webkit-scrollbar-track,
.popup-top::-webkit-scrollbar-track,
.project-nav-list::-webkit-scrollbar-track,
.in-about-text::-webkit-scrollbar-track,
.in-box-con::-webkit-scrollbar-track,
.project-in-img::-webkit-scrollbar-track,
.popup-xm-inner::-webkit-scrollbar-track,
.awards-top::-webkit-scrollbar-track {
	background-color: #fff;
	-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.1);
}

.project-nav-box::-webkit-scrollbar-thumb,
.project-info::-webkit-scrollbar-thumb,
.fix-project-menu::-webkit-scrollbar-thumb,
.popup-top::-webkit-scrollbar-thumb,
.project-nav-list::-webkit-scrollbar-thumb,
.in-about-text::-webkit-scrollbar-thumb,
.in-box-con::-webkit-scrollbar-thumb,
.project-in-img::-webkit-scrollbar-thumb,
.popup-xm-inner::-webkit-scrollbar-thumb,
.awards-top::-webkit-scrollbar-thumb {
	border-radius: 5px;
	width: 8px;
	height: auto;
	background-color: #c1c1c1;
}

.project-nav-box::-webkit-scrollbar-button,
.project-info::-webkit-scrollbar-button,
.fix-project-menu::-webkit-scrollbar-button,
.popup-top::-webkit-scrollbar-button,
.project-nav-list::-webkit-scrollbar-button,
.in-about-text::-webkit-scrollbar-button,
.in-box-con::-webkit-scrollbar-button,
.project-in-img::-webkit-scrollbar-button,
.popup-xm-inner::-webkit-scrollbar-button,
.awards-top::-webkit-scrollbar-button {
	display: none;
}

.md-box {
	margin-left: 22px;
	position: relative;
}

.img-box {
	overflow: hidden;
}

.img-box img {
	width: 100%;
}



.col-type {
	padding: 0 5px;
}

.team-box {
	margin-bottom: 20px;
}

.team-img {
	position: relative;
	overflow: hidden;
	/* height: 176px; */
}

.team-img img {
	width: 100%;
}

.team-name {
	margin: 0;
}

.team-name span {
	display: block;
	color: #000;
}

.team-name span:last-child {
	color: #f15a22;
	margin-top: -2px;
}

.dropdown-menu-box {
	display: none;
	margin: 0;
}

.dropdown-menu-box li a {
	font-size: 13px;
	color: #666;
	display: flex;
	justify-content: flex-end;
}

@media (min-width:992px) {
	.dropdown-menu-box li a {
		font-size: 16px;
	}
}

.dropdown-menu-box li a.active {
	color: #000;
}

.mobile-dropdown li a:hover,
.mobile-dropdown li a.active {
	color: #fff !important;
}

.awards-info {
	height: 70%;
}

.awards-info .in-box-con {
	height: calc(100vh - 330px);
}

@media (min-width:414px) {
	.awards-info .in-box-con {
		height: calc(100vh - 320px);
	}
}

@media (min-width:992px) {
	.awards-info .in-box-con {
		height: calc(100vh - 420px);
	}
}

@media (min-width:1200px) {
	.awards-info .in-box-con {
		height: calc(100vh - 440px);
	}
}

.awards-top {
	overflow-y: auto;
}

.awards-top-box {
	color: #000;
}

.awards-title,
.post-text {
	font-size: 20px;
	margin-bottom: 15px;
}

@media (min-width:992px) {

	.awards-title,
	.post-text {
		font-size: 30px;
		margin-bottom: 20px;
	}
}



.awards-bottom {
	height: 30%;
	padding-top: 40px;
	padding-left: 30px;
	padding-right: 30px;
}

@media (min-width:992px) {
	.awards-bottom {
		padding-left: 50px;
		padding-top: 30px;
		padding-right: 150px;
	}
}

.awards-bottom-box {
	padding-left: 0px;
}

@media (min-width:992px) {
	.awards-bottom-box {
		padding-left: 15px;
	}
}

.post-name {
	position: relative;
}

.post-text {
	color: #000;
}


.post-title {
	margin: 0;
}

.post-title li {
	margin-bottom: 2px;
}

.post-title li a {
	color: #000;
	text-decoration: none;
}

@media (min-width:992px) {
	.post-title li {
		margin-bottom: 5px;
	}
}

.post-title li a:hover {
	color: #1f2639;
}

.post-show {
	/*position: absolute;
	top: 0;*/
	display: none;
	max-width: 170px;
}

@media (min-width:3210px) {
	.post-show {
		max-width: 200px;
	}
}

@media (min-width:414px) {
	.post-show {
		max-width: 230px;
	}
}

@media (min-width:768px) {
	.post-show {
		max-width: 100%;
	}
}

.post-explain {
	font-family: Arial, Helvetica, sans-serif;
	color: #666 !important;
	font-size: 14px;
	line-height: 18px;
}

@media (min-width:992px) {
	.post-explain {
		font-size: 16px;
	}
}

@media (min-width:1200px) {
	.post-explain {
		font-size: 18px;
		line-height: 24px;
	}
}

.post-input-box {
	margin-top: 30px;
}

.input-list {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin-bottom: 10px;
}

@media (min-width:768px) {
	.input-list {
		flex-direction: row;
		align-items: center;
	}
}

.input-list1 {
	margin-top: 10px;
}

.case-input input,.case-input label{
	border: 1px solid #999;
}

.text-input {
	width: 100%;
	font-size: 14px;
}

@media (min-width:768px) {
	.text-input {
		width: 20%;
	}
}

@media (min-width:992px) {
	.text-input{
		font-size: 18px;
	}

	/*.case-input input {
		width: 250px;
	}*/
}

.case-input input:valid {
	color: #000;
	font-size: 14px;
}

.file,
.submit {
	font-size: 14px;
}

/*
.case-input .file {
	width: 180px;
}
*/

/*.case-input{
	width: 100%;
}*/

.input-list1 .submit {
	padding: 6px 20px;
}

@media (min-width:992px) {
	.input-list1 .submit {
		padding: 10px 50px;
	}
}

.back-box {
	display: block;
	font-size: 14px;
	color: #666;
	margin-bottom: 10px;
}

.post-bottom {
	margin-top: 30px;
}

.captcha-box{
	height: 60px;
}

@media (min-width:992px) {
	.captcha-box{
		height: auto;
	}
}
.captcha-1{
	transform: scale(0.7);
	-o-transform: scale(0.7);
	-ms-transform: scale(0.7);
	-moz-transform: scale(0.7);
	-webkit-transform: scale(0.7);
	transform-origin: 0 0;
	-o-transform-origin: 0 0;
	-ms-transform-origin: 0 0;
	-moz-transform-origin: 0 0;
	-webkit-transform-origin: 0 0;
}

@media (min-width:992px) {
	.captcha-1{
		transform: scale(1);
		-o-transform: scale(1);
		-ms-transform: scale(1);
		-moz-transform: scale(1);
		-webkit-transform: scale(1);
		transform-origin: 0 0;
		-o-transform-origin: 0 0;
		-ms-transform-origin: 0 0;
		-moz-transform-origin: 0 0;
		-webkit-transform-origin: 0 0;
	}
}


/* project */
.project-box {
	position: relative;
	overflow: hidden;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 10px;
}

.project-img {
	position: relative;
	overflow: hidden;
}

.project-img img {
	transition: all ease .4s;
}

.project-text {
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.5);
	font-size: 16px;
	color: #fff;
	opacity: 0;
	transition: all ease .4s;
}

.project-box:hover .project-img img {
	transform: scale(1.1);
	transition: all ease .4s;
}

.project-box:hover .project-text {
	opacity: 1;
	transition: all ease .4s;
}

.section-img-box {
	display: flex;
	align-items: center;
	margin-bottom: 30px;
	margin-top: 20px;
}

@media (min-width:768px) {
	.section-img-box {
		margin-bottom: 30px;
		margin-top: 30px;
	}
}

.section-img {
	padding: 0;
	/* height: 180px; */
}

.img-popup {
	position: relative;
	display: block;
	/* height: 172px; */
	z-index: 0;
	overflow: hidden;
}

/* .img-popup img{
	width: 100%;
	height: 100%;
} */

.popup-box {
	display: none;
	z-index: 999999;
}

.popup-img-box {
	position: fixed;
	top: 0;
	left: 0;
	background-color: rgba(0, 0, 0, 0.5);
	width: 100%;
	height: 100%;
	padding: 0 10%;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 999999;
}

.popup-img {
	position: relative;
}

.fa-icon {
	position: absolute;
	right: 0;
	top: 0;
	color: #fff;
	font-size: 18px;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 30px;
	height: 30px;
	background-color: #111;
}

.project-bj-box {
	position: absolute;
	width: 100%;
	height: 100vh;
	top: 0;
	left: 0;
	padding-bottom: 100px;
}
@media (min-height: 741px) {
	.project-bj-box {
		padding-bottom: 150px;
	}
}
@media (min-width:1024px) {
	.project-bj-box {
		padding-bottom: 150px;
	}
}

/* @media (min-width:1400px) {
	.project-bj-box {
		padding-bottom: 200px;
	}
} */

/* @media (min-width:1600px) {
	.project-bj-box {
		padding-bottom: 150px;
	}
} */

.project-bj-row {
	height: 100%;
}

.project-xbj::before {
	content: '';
	position: absolute;
	top: auto;
	bottom: 0 !important;
	left: 0 !important;
	z-index: 999;
}

.project-xbj::after {
	content: '';
	position: absolute;
	top: auto;
	bottom: 0 !important;
	left: 0 !important;
	z-index: 999;
}

.nav-con-inner {
	display: flex;
	align-items: center;
	/*margin-top: 46px;*/
	margin-left: 0px;
}

@media (min-width:992px) {
	.nav-con-inner {
		/*margin-left: -110px;*/
		/* margin-top: 100px; */
	}
}

/*@media (min-width:1025px) {
	.nav-con-inner {
		margin-top: 45px;
	}
}

@media (min-width:1026px) {
	.nav-con-inner {
		margin-top: 100px !important;
	}
}

@media (min-width:1200px) {
	.nav-con-inner {
		margin-top: 100px !important;
	}
}

@media (min-width:1400px) {
	.nav-con-inner {
		margin-top: 150px !important;
	}
}

@media (min-width:1600px) {
	.nav-con-inner {
		margin-top: 230px !important;
	}
}*/

.web-nav-box {
	display: none;
}

.mobile-nav-box {
	display: block;
	margin-left: 20px;
}

@media (min-width:992px) {
	.web-nav-box {
		display: block;
	}

	.mobile-nav-box {
		display: none;
	}
}

.nav-con-list {
	position: relative;
}

.proicon {
	display: flex;
	align-items: center;
}

.proicon .fa {
	display: block;
	margin-top: -5px;
}

@media (min-width:992px) {
	.proicon .fa {
		display: none;
	}
}

.nav-con-list a {
	font-size: 20px;
	color: #fff;
	font-family: 'Microsoft JhengHei';
	font-weight: 400;
	text-decoration: none;
	z-index: 999;
}

@media (min-width:992px) {
	.nav-con-list a {
		font-size: 35px;
	}
}

.nav-con-list a:hover,
.nav-con-list a.active {
	color: #1f2639;
}

.nav-con-bf {
	position: relative;
}

.nav-con-bf::before,
.nav-con-bf::after {
	display: none;
}

@media (min-width:992px) {
	.nav-con-bf::before {
		display: block;
		content: '';
		position: absolute;
		bottom: 0;
		left: 0;
		width: 96px;
		height: 2px;
		background-color: #fff;
		z-index: 999;
	}

	.nav-con-bf::after {
		display: block;
		content: '';
		position: absolute;
		bottom: -298px;
		right: -26px;
		width: 2px;
		height: 300px;
		background-color: #fff;
		z-index: 999;
	}
}

.project-info {
	padding-right: 20px;
	max-height: calc(100vh - 210px);
	overflow-y: auto;
}
@media (min-width: 425px) and (max-width: 768px) and (orientation: portrait) {
	.project-info {
		max-height: 70vh;
	}
}
#v-pills-tabContent{
	min-height: 50%;
}
@media (orientation: landscape) {
	.project-info {
		min-height: 50%;
		max-height: 45vh;
	}
}

/*@media (orientation: portrait) and (max-height: 740px) {
	.project-info {
		max-height: calc(100vh - 100px);
	}
}*/
@media (min-width:1024px) and (orientation: landscape) {
	.project-info {
		max-height: 100%;
	}
}
@media (min-width:769px) and (orientation: portrait) {
	.project-info {
		max-height: 100%;
		padding-right: 0px;
	}
}

.in-project-con {
	padding: 0 !important;
	margin-top: 0 !important;
	/*height: calc(100vh - 200px);*/
}
@media (orientation: landscape) {
	.in-project-con {
		height: calc(100vh - 100px);
	}
}
@media (orientation: portrait) {
	.in-project-con {
		height: calc(100vh - 200px);
	}
}
@media (min-width:1025px) {
	.in-project-con {
		height: calc(100vh - 250px);
	}
}

@media (min-width:1400px) {
	.in-project-con {
		height: calc(100vh - 300px);
	}
}

@media (min-width:1600px) {
	.in-project-con {
		height: calc(100vh - 380px);
	}
}

.project-nav-box {
	/*bottom: 40px;*/
	bottom: 10px;
	/*left: 10px;*/
	width: 100%;
	/*display: flex;
	flex-direction: row;*/
}
.project-nav-list{
	overflow-y: auto;
}
@media (min-width:768px) {
	.project-nav-box{
		/*width: 90%;*/
		/*width: 28%;*/
	}
}

@media (min-width:1024px) {
	.fix-detail-project-nav{
		position: absolute;
	}
	.project-nav-box {
		max-height:calc(50% - 20px);
		/*overflow-y: auto;*/
		/*height: 260px;*/
		/*width: 22%;*/
	}
}
/*@media (min-width:1024px) and (max-height: 768px) {
	.project-nav-box {
		position: relative;
	}
}*/
@media (min-width:1366px) {
	.project-nav-box {
		/*height: 250px;*/
	}
}

@media (min-width:1400px) {
	.project-nav-box {
		/*height: 280px;*/
	}
}

@media (min-width:1600px) {
	.project-nav-box {
		/*height: 330px;*/
	}
}

.project-nav-mobile .nav-link {
	text-align: left !important;
	padding-left: 10px;
	padding-top: 1px;
	padding-bottom: 1px;
}

.project-nav-list .nav-link {
	/*font-size: 18px;*/
	font-size: 17px;
	text-align: left !important;
}

@media (min-width:1024px) {
	.project-nav-list .nav-link {
		/*font-size: 19px;*/
		font-size: 18px;
	}
}

@media (min-width:1400px) {
	.project-nav-list .nav-link {
		/*font-size: 22px;*/
		font-size: 21px;
	}
}

.project-nav-link{
	color: #000 !important;
	font-weight: bold;
}

@media (min-width:1400px) {
	.project-nav-link{
		font-size: 24px;
	}
}

.nav-list .project-nav-link:hover,
.nav-list .project-nav-link.active{
	font-size: 160%;
}

.dropdown-box1 {
	display: none;
	position: absolute;
	bottom: 28px;
	left: -16px;
	width: 100%;
	z-index: 9;
}

@media (min-width:992px) {
	.dropdown-box1 {
		bottom: 50px;
		display: block;
	}
}

@media (min-width:1024px) {
	.dropdown-box1 {
		bottom: 28px;
	}
}

.nav-list1 {
	position: relative;
	overflow: hidden;
}

.nav-list1:before {
	content: '';
	position: absolute;
	bottom: 0;
	padding: 10px;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7);
}

/*.project-xm-li {
	width: 100%;
	height: 100%;
}*/


/* @media (min-width:479px) {
	.project-xm-li{
		width: 100%;
		height: auto;
	}
} */

.project-xm-li a{
	display: block;
	/*height: 100%;*/
}
/*
.project-xm-li img{
	width: 100%;
	height: 100%;
}*/

/*@media (min-width:992px) {
	.project-xm-li img{
		height: auto;
	}
}*/

.project-in-img {
	display: block;
	height: auto;
	overflow-y: auto;
	position: relative;
	z-index: 0;
	height: 100%;
}

.project-in-img.on {
	display: none;
}

.gallery .project-xm-box {
	height: auto;
	position: relative;
	padding-bottom: 20px;
}

.project-xm-box .next-box,
.project-xm-box .prev-box{
	background-color: #000;
	top: 48%;
}

.project-xm-box .next-box::after,
.project-xm-box .prev-box::after{
	color: #fff;
	font-size: 18px;
}

.project-xm-box .next-box{
	right: 10px;
}

.project-xm-box .prev-box{
	left: 10px;
}

.web-swiper{
	display: none;
}

.mobile-swiper{
	display: block;
}

@media (min-width:992px) {
	.web-swiper{
		display: block;
	}

	.mobile-swiper{
		display: none;
	}
}

/*
@media (max-width:321px) {
	.project-xm-box .swiper-slide{
		width: 100% !important;
	}
} */

.gallery .project-xm-box .project-pag {
	bottom: 0;
	text-align: right;
}

.project-pag .swiper-pagination-bullet {
	opacity: 1;
	background-color: #fff;
}

.project-pag .swiper-pagination-bullet-active {
	opacity: 1;
	background-color: #000;
}

.xm-title-box {
	/*position: absolute;*/
	left: 0px;
	/*width: 100%;*/
	bottom: 60px;
	z-index: 9;
	margin-left: -22px;
}

@media (min-width:992px) {
	.xm-title-box {
		bottom: 60px;
		/*left: 27%;*/
		margin-left: 1%;
	}
}

/*@media (min-width:1024px) {
	.xm-title-box {
		height: 260px;
	}
}

@media (min-width:1366px) {
	.xm-title-box {
		height: 250px;
	}
}

@media (min-width:1400px) {
	.xm-title-box {
		height: 280px;
	}
}

@media (min-width:1600px) {
	.xm-title-box {
		height: 330px;
	}
}*/

.xm-title {
	font-size: 14px;
}

.popup-project {
	/*display: none;*/
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.6);
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
}

.close-icon {
	position: absolute;
	right: 0;
	top: 0;
	width: 30px;
	height: 30px;
	background-color: #000;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 999999;
}

.close-icon .fa {
	color: #fff;
}

.popup-top {
	/*height: calc(49vh);*/
	 overflow-y: auto;
	padding-right: 10px;
	margin-right: 40px;
}
@media (orientation: landscape) {
	.popup-top {
		/*max-height: calc(45vh);*/
		max-height: 50%;
	}
}
@media (min-width: 768px) and (orientation: portrait) {
	.popup-top {
		height: auto;
	}
}
.gallery .popup-info {
	position: relative;
	overflow: hidden;
	padding-bottom: 20px;

}

.popup-info .swiper-slide a{
	display: block;
	width: 100%;
	height: auto;
}

.popup-info .swiper-slide img{
	width: 100%;
}

.popup-info .swiper-pagination{
	bottom: 0 !important;
	text-align: right;
	z-index: 999;
}

/* .popup-info {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	padding-right: 0px;

} */

/* @media (min-width:992px) {
	.popup-info {
		padding-right: 100px;
		height: 344px;
	}
}

@media (min-width:1230px) {
	.popup-info {
		height: auto;
	}
}

.popup-info li {
	margin-right: 2px;
	margin-bottom: 2px;
} */

/* @media (min-width:1025px) {
	.project-in-img{
		height: 310px;
	}
} */

.popup-con {
	position: relative;
	margin-top: 36px;
	margin-left: -9px;
}

.popup-bottom {
	height: 155px;
	width: 200px;
	padding: 10px;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #333;
	bottom: 30px;
	right: 0px;
	overflow: hidden;
	z-index: 9;
}

@media (min-width:540px) {
	.popup-bottom {
		width: 300px;
		bottom: 0px;
	}
}
@media (min-width:768px) {
	.popup-bottom {
		bottom: 0px;
		right: -10%;
	}
}

@media (min-width:992px) {
	.popup-bottom {
		width: auto;
		/*position: absolute;*/
		/*width: 400px;*/
		height: 180px;
		/*right: 30px;*/
		right: -10%;
	}
}

@media (min-width:1441px) {
	.popup-bottom {
		/*width: 520px;*/
		height: 220px;
	}
}

.popup-xm-inner {
	width: 100%;
	height: 100%;
	overflow-y: auto;
	overflow-x: hidden;
}

.popup-xm-con {
	font-size: 13px;
	color: #ccc;
}

@media (min-width:992px) {
	.popup-xm-con {
		font-size: 15px;
	}
}

.in-popup-con {
	height: calc(100vh - 200px);
}

@media (min-width:320px) {
	.in-popup-con {
		height: calc(100vh - 360px);
	}
}

@media (min-width:768px) {
	.in-popup-con {
		height: calc(100vh - 200px);
	}
}

@media (min-width:1025px) {
	.in-popup-con {
		height: calc(100vh - 250px);
	}
}

@media (min-width:1400px) {
	.in-popup-con {
		height: calc(100vh - 300px);
	}
}

@media (min-width:1600px) {
	.in-popup-con {
		height: calc(100vh - 380px);
	}
}

.nav-flex-pills.active .nav-link.active {
	color: #000;
}

.nav-flex-pills.active .nav-link {
	color: #fff;
}
.fix-detail-title .xm-text{
	opacity: 1;
}
.xm-text {
	/*position: absolute;*/
	display: inline-block;
	bottom: -30px;
	font-family: 'yy';
	font-size: 14px;
	opacity: 0;
	padding: 5px;
	color: #fff;
	/*background-color: #000;*/
	z-index: 999;
}

@media (min-width:768px) {
	.xm-text {
		bottom: 0;
	}
}

@media (min-width:992px) {
	.xm-text {
		/*position: absolute;*/
		bottom: auto;
		font-size: 22px;
		color: #000;
		padding: 0;
		background: none;
	}
}

@media (min-width:1200px) {
	.xm-text {
		font-size: 26px;
	}
}

.xm-text.on {
	opacity: 1;
}

.xm-text.active {
	color: #fff;
}

.xm-title.active {
	z-index: 999999;
}

.xm-title-box.active .xm-title .xm-text1{
	opacity: 0;
}

@media (min-width:992px) {
	.xm-title-box.active .xm-title .xm-text1{
		opacity: 1;
	}
}

.web-xm-title-box.active .xm-title .xm-text1{
	opacity: 1;
}

.nav-navli {
	opacity: 1 !important;
}

@media (min-width:992px) {
	.nav-navli {
		opacity: 1;
	}

	.nav-navli.active {
		opacity: 0;
	}
}

.popup-nav-con {
	display: none;
}

@media (min-width:992px) {
	.popup-nav-con {
		display: block;
		margin-top: -49px;
	}
}

.popup-nav-con-list {
	position: relative;
}

.popup-nav-con-list:before {
	content: '';
	width: 150px;
	height: 2px;
	background-color: #fff;
	position: absolute;
	/*top: 0;
	left: -24px;*/
	/*top: -17px;*/
	left: -70px;
}

.popup-nav-con-list::after {
	content: '';
	width: 2px;
	height: 150px;
	background-color: #fff;
	position: absolute;
	/*bottom: 50px;
	left: -24px;*/
	bottom: 68px;
	left: -72px;
}
@media (min-width: 1440px) {
	.popup-nav-con-list:before {
		bottom: 67px;
		left: -51px;
	}
	.popup-nav-con-list::after {
		bottom: 67px;
		left: -51px;
	}
}
@media (min-width: 1680px) {
	.popup-nav-con-list:before {
		bottom: 59px;
		left: -25px;
	}
	.popup-nav-con-list::after {
		bottom: 59px;
		left: -28px;
	}
}
.web-xm-title {
	/*position: absolute;*/
	bottom: 0;
	width: 100%;
}

@media (min-width:992px) {
	.web-xm-title .xm-text {
		top: 15px;
		bottom: auto;
		left: 25%;
		color: #fff;
	}
}

.web-xm-title-box {
	position: absolute;
	left: 0%;
	width: 100%;
	bottom: -170px;
	z-index: 1;
}

@media (min-width:768px) {
	.web-xm-title-box {
		left: 2%;
		bottom: -38px;
	}
}

@media (min-width:992px) {
	.web-xm-title-box {
		bottom: 10px;
		left: 0;
	}
}

@media (min-width:1024px) {
	.web-xm-title-box {
		height: 260px;
	}
}

@media (min-width:1366px) {
	.web-xm-title-box {
		height: 250px;
	}
}

@media (min-width:1400px) {
	.web-xm-title-box {
		height: 280px;
	}
}

@media (min-width:1600px) {
	.web-xm-title-box {
		height: 330px;
	}
}

.xm-title-box.active {
	opacity: 1;
}

@media (min-width:992px) {
	.xm-title-box.active {
		opacity: 0;
	}
}

/* ------------ */

.img.mfp-img{
	padding: 40px 0 25px;
}

.language-box {
	position: absolute;
	right: 2%;
	bottom: 10px;
	z-index: 9;
}

@media (min-width:992px) {
	.language-box {
		bottom: 10%;
		right: 5%;
	}

	.xm-language {
		bottom: 3%;
	}
}

.language-info a {
	color: #222;
	font-size: 13px;
	/*text-transform: uppercase;*/
	text-decoration: none;
	/*padding: 6px 10px;*/
}

@media (min-width:992px) {
	.language-info a {
		font-size: 15px;
	}
}

.language-info a:hover {
	color: #fff;
	text-decoration: underline;
}

.fadeIn {
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn;
	-webkit-animation-direction: .5s;
	animation-direction: .5s;
	-webkit-animation-delay: .3s;
	animation-delay: .3s;
}
.home-text p{
	margin-bottom: 0px;
}

in-about-text,
.in-box-con {
	height: calc(100vh - 330px);
}

@media (min-width:414px) {
	.in-about-text,
	.in-box-con {
		height: calc(100vh - 360px);
	}
}

@media (min-width:992px) {
	.in-about-text,
	.in-box-con {
		height: calc(100vh - 380px);
	}
}

@media (min-width:1200px) {
	.in-about-text,
	.in-box-con {
		height: calc(100vh - 350px);
	}
}
.nav-con {
	width: 100%;
	position: absolute;
	/*bottom: 15%;*/
	bottom: -5%;
	/*left: 30%;*/
}
@media (orientation: landscape) {
	.nav-con {
		bottom: -15%;
	}
}
@media (min-width: 991px) and (orientation: portrait){
	.nav-con {
		width: auto;
		bottom: -7%;
		left: 0;
		transform: translate(-57%,0);
	}
}
@media (min-width: 991px) and (orientation: landscape){
	.nav-con {
		width: auto;
		bottom: -10%;
		left: 0;
		transform: translate(-57%,0);
	}
}
@media (min-width: 1200px) and (orientation: landscape){
	.nav-con {
		bottom: -11%;
	}
}
@media (min-width: 1440px) and (orientation: landscape){
	.nav-con {
		bottom: -7%;
	}
}
.fix-project-menu{
	overflow: hidden;
	/*overflow-y: auto;*/
}
body .mfp-figure:after{
	background: transparent !important;
	box-shadow: none !important;
}
.upload-text {
	font-size: 14px;
	color: #f00;
}


.project-xm-li{
	width: calc(50% - 4px);
	margin-top: 4px;
	text-align: center;
}
.project-xm-li:not(:nth-child(even)){
	margin-right: 4px;
}
@media (min-width: 768px) {
	.project-xm-li {
		width: calc(16.5% - 4px);
	}
	.project-xm-li:not(:nth-child(6n)){
		margin-right: 4px;
	}
}
@media (min-width: 991px) {

	.project-xm-li:not(:nth-child(8n)){
		margin-right: 4px;
	}
	.project-xm-li{
		width: calc(12.5% - 4px);

	}
}
/*#page .active .page-point{
	background: #000;
}
#page .next,
#page .last,
#page .first,
#page .prev{
	display: none;
}
#page .page-link{
	padding: 0;
	background: transparent;
	border: 0;
}
#page .page-item:not(:last-child){
	margin-right: 8px;
}
#page .page-point{
	width: 8px;
	height: 8px;
	background: #fff;
	border-radius: 20px;
	display: inline-block;
}*/





.language-info a.active {
    color: #fff;
    text-decoration: underline;
}
.fix-cat-list-position{
	margin-top: -5px;
	/*position: absolute;*/
	left: 0px;
	bottom: 10px;
}
@media (min-height: 790px) {
	.fix-cat-list-position{
		position: absolute;
	}
}
.fix-detail-title{
	/*background: #000;*/
}
@media (min-width: 992px) {
	.fix-detail-title{
		background: transparent;
	}
}

.recruitment-title {
	font-weight: bold;
	color: #000;
	font-size: 16px;
}

@media (min-width:768px) {
	.recruitment-title {
		font-size: 18px;
	}
}

@media (min-width:1440px) {
	.recruitment-title {
		font-size: 22px;
	}
}
/*
.project-xm-li img{
	max-height: 160px;
}
@media (min-width: 768px) {
	.project-xm-li img{
		max-height: 100%;
	}
}*/
.common-home{
	position: relative;
}
.fix-company-language{
	position: absolute;
	top: -73px;
	/*margin-top: -100px;*/
	padding-top: 0px;
}
.fix-project-language{
	position: absolute;
	top: 59px;
}
.fix-project-language .ch-btn {
	font-size: 13px;
}
.fix-company-language .ch-btn {
	font-size: 15px;
}
@media (min-width: 425px) {
	.fix-project-language .ch-btn ,.fix-company-language .ch-btn {
		font-size: 16px;
	}
}
@media (min-width: 768px) {
	.fix-project-language .ch-btn,.fix-company-language .ch-btn {
		font-size: 18px;
	}
}
@media (min-width: 992px) {
	.fix-project-language{
		top: 60px;
	}
}


.ch-btn{
	font-weight: 700;
}