/* Reset CSS
 * --------------------------------------- */
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
fieldset,
input,
textarea,
p,
blockquote,
th,
td {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
}

a {
	text-decoration: none;
	color: #333;
}

table {
	border-spacing: 0;
}

fieldset,
img {
	border: 0;
}

address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
	font-weight: normal;
	font-style: normal;
}

strong {
	font-weight: bold;
}

ol,
ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

caption,
th {
	text-align: left;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: normal;
	font-size: 100%;
	margin: 0;
	padding: 0;
	color: #000;
}

q:before,
q:after {
	content: '';
}

abbr,
acronym {
	border: 0;
}


/* Custom CSS
 * --------------------------------------- */
:root {
	--color: #333;
	--color-primary: #006dc9;
	--color-primary-hover: #2388dd;
	--color-second: #d29d62;
	--color-second-hover: #ddb869;
	--color-info: #999;	
}
body {
	font-family: "Microsoft Yahei", arial, helvetica;
	color: #444;
	color: rgba(0, 0, 0, 0.5);
}

h1 {
	font-size: 4em;
}

.clear {
	clear: both;
}

.flex {
	display: flex;
}

.flex-between {
	justify-content: space-between;
}

.flex-around {
	justify-content: space-around;
}

.flex-middle {
	align-items: center;
}

.flex-end {
	justify-content: flex-end;
}

.flex-center {
	justify-content: center;
	align-items: center;
}

.flex-column {
	flex-direction: column;
}

.w100 {
	width: 100% !important;
}

.h100 {
	height: 100% !important;
}

.mt-space {
	margin-top: 20px !important;
}

#loading {
	background: #fff;
	width: 100%;
	height: 100%;
	position: fixed;
	left: 0;
	top: 0;
	z-index: 99999;
}

#loading .loader {
	width: 300px;
	height: 300px;
	position: absolute;
	margin: 0 auto;
	left: 50%;
	top: 50%;
	margin: -150px auto auto -150px;
	background: url(images/loading.gif) center center no-repeat;
}


#fullpage {
	z-index: 969;
}

.backhome {
	position: absolute;
	z-index: 999;
	right: 0;
	bottom: 30px;
	background-color: #ddb869;
	color: #333;
	border-radius: 20px 0 0 20px;
	padding: .5em .5em .5em 1em;
}
.backhome:hover {
	background-color: #eecd8b;
}
/* Side page menu */
#menu {
	position: fixed;
	top: 0;
	bottom: 0;
	right: 20px;
	z-index: 970;
	padding: 0;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	flex-direction: column;
}

#menu li {
	margin: 10px 0;
	position: relative;
	text-align: center;
}

#menu li a {
	text-decoration: none;
	background: #fff;
	/* background:linear-gradient(to bottom, #fff, #666); */
	color: #000;
	display: block;
	padding: 9px 18px;
	display: block;
	-webkit-border-radius: 50px;
	border-radius: 50px;
	box-shadow: -3px 3px rgba(0, 0, 0, 0.3);
	transition: .2s;
}

#menu .active a {
	background: #0d5da6;
	color: #fff;
	margin-right: 0;
	box-shadow: -5px 5px 3px rgba(0, 0, 0, 0.3);
}

#menu li a:hover {
	background: var(--color-primary-hover);
	color: #fff;
}

.music {
    position: absolute;
    left: 10px;
    top: 10px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 1px #fff7 solid;
    background-color: #3334;
	z-index: 999;
}
.mobile-hint {
	position: fixed;
	top: 5px;
	right: 8px;
	padding: 8px 16px;
	background: linear-gradient(to bottom, #b0883366, #b08833);
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
	color: white;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
	font-size: 10px;
	font-weight: 500;
	border-radius: 4px;
	/*box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);*/
	z-index: 9999;
	white-space: nowrap;
	transform-origin: top right;
	transition: transform 0.3s ease, opacity 0.3s ease;
}

/* 可选：添加悬停效果 */
.mobile-hint:hover {
	transform: scale(1.02);
	background-color: rgba(51, 51, 51, 0.9);
}

.music-pause {
    border-color: #fff9;
}
.music-pause::after {
    content: "";
    position: absolute;
    left:0;
    top: 50%;
    width: 100%;
    height: 2px;
    background-color: #fff9;
    transform: rotate(45deg);
}
.music-icon {
    width: 100%;
    height: 100%;
    animation: musicmove 1.5s infinite;
}


.section {}

.full {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
}

.wrapper {
	max-width: 1200px;
	height: auto;
	margin-left: 10px;
	margin-right: 10px;
}

.detail-wrapper {
	width: 960px;
	margin: 0 auto;
}

.colorlayer {
	width: 100%;
	height: 100%;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 2;
}

.ui-card {
	border: 10px #fff solid;
	border-radius: 10px;
	background-color: #fff;
}

.ui-btn {
	display: inline-block;
	padding: .5em 2em;
	background: linear-gradient(to right, #006ec7, #157cb4);
	color: #fff;
	border-radius: 5px;
}

.ui-btn:hover {
	background: linear-gradient(to right, #157cb4, #157cb4);
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
}

.section-bg-layer {
	position: absolute;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.5);
}

/* section1 */
.section1 {
	background: url(images/banner_contact.jpg) center center;
	background-size: auto 100%;
}

.section2 {
	background: #f2f2f2 url(images/banner3.jpg) center center no-repeat;
	background-size: auto 100%;
}

.section4 {
	background: #f2f2f2 url(images/banner4.jpg) center center no-repeat;
	background-size: auto 100%;
	position: relative;
}

.section-page-down {
	position: absolute;
	width: 100%;
	bottom: 0;
	z-index: 99;
	font-size: 12px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
}

.section-page-down .arrow {
	background: url(images/left_arrow.png);
	background-size: auto 100%;
	display: block;
	width: 16px;
	height: 16px;
	transform: rotate(-90deg);
}

.section-page-down p {
	margin-top: 4px;
	color: #fff;
	border: 1px #fff3 solid;
	border-bottom: none;
	border-radius: 10px 10px 0 0;
	padding: 4px 8px;
	background: linear-gradient(to bottom, #b0883366, #b08833);
	/* box-shadow: 0 -5px 10px rgba(0, 0, 0, .1); */
	/* background-color: var(--color-second-hover)66; */
	font-weight: lighter;
}

.animate-blink {
	animation: animate-blink 1.2s infinite;
}

.swiper-page-bg {
	background: url(../images/banner_lake.jpg) center center;
	background-size: auto 100%;
}

.top-bar {
	position: fixed;
	top: 0;
	left: 0;
	display: flex;
	padding: 1em;
	align-items: center;
	flex-wrap: wrap;
}

.top-bar .inner-logo {
	margin-right: 10px;
	margin-bottom: 10px;
}

.top-bar .file-title {
	margin-right: 10px;
	margin-bottom: 10px;
	background-color: #3339;
	color: #fff;
	border-radius: 20px;
	padding: .5em 1em;
	line-height: 1;
}

.top-bar .file-link {
	margin-right: 10px;
	margin-bottom: 10px;
	background-color: var(--color-second-hover);
	color: #333;
	line-height: 1;
	border-radius: 20px;
	padding: .5em 1em;
	font-size: 12px;
}

.top-bar .file-link:hover {
	background-color: #333;
	color: #fffc;
}

.top-banner {
	position: absolute;
	top: 20px;
	left: 0;
	text-align: center;
}

@keyframes animate-blink {
	0% {
		opacity: 0;
	}

	50% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}


@-webkit-keyframes sdb05 {
	0% {
		-webkit-transform: rotate(-45deg) translate(0, 0);
		opacity: 0;
	}

	50% {
		opacity: 1;
	}

	100% {
		-webkit-transform: rotate(-45deg) translate(-3px, 3px);
		opacity: 0;
	}
}

@keyframes sdb05 {
	0% {
		transform: rotate(-45deg) translate(0, 0);
		opacity: 0;
	}

	50% {
		opacity: 1;
	}

	100% {
		transform: rotate(-45deg) translate(-3px, 3px);
		opacity: 0;
	}
}

.page-title {
	font-size: 72px;
	color: #fff;
	font-weight: bold;
	text-align: center;
}

.section-title {
	font-size: 48px;
	color: #333;
	font-weight: bold;
	text-align: center;
}

.section-title-re {
	color: #fff;
}
.section-title.fixed {
	position: fixed;
}

/* 走进新津 */
.banner-logo {
	/* margin-top: -50%; */
	width: 500px;
}

.index-more {
	display: flex;
	align-items: center;
	margin-top: 2em;
}

.index-more a {
	margin: 0 .5em;
	/* 背景色渐变 */
	display: inline-block;
	background: linear-gradient(to bottom, var(--color-second-hover), #b08833);
	color: #333;
	padding: .8em 2em;
	line-height: 1em;
	border-radius: 2em;
	font-size: 18px;
}

.index-more a:hover {
	background: linear-gradient(to top, var(--color-second-hover), #b08833);
	/* box-shadow: 0 10px 10px rgba(255, 255, 255, 0.5) inset; */

}

.reverse {
	transform: scale(-1);
}

.polygon-nav-box {
	margin-top: 50px;
	align-items: stretch;
	margin-left: 10px;
	margin-right: 10px;
}
.polygon-nav {
	display: flex;
	justify-content: space-between;
	flex-direction: column;
	flex-grow: 1;
}

.polygon-nav a {
	margin-top: 1em;
	margin-left: .5em;
	margin-right: .5em;
	border-radius: 40px;
	background: linear-gradient(to left, var(--color-second-hover), #b08833);
	color: #333;
	padding: .5em;
	text-align: center;
	width: 6em;
	/* flex-grow: 1; */
	display: flex;
	justify-content: center;
	align-items: center;
}
.polygon-nav .longer {
	width: 13em;
}
.polygon-nav a:hover {
	background: linear-gradient(to top, var(--color-second-hover), #b08833);
}
.polygon-nav .left {
	 right: 30px;
}
.polygon-nav .right {
	left: 30px;
}


/* 视频 */
.section-video {
	background: #f2f2f2 url(images/banner4.jpg) center center no-repeat;
	background-size: auto 100%;
}

.video-page-title {

	background-color: var(--color-primary);
	background: linear-gradient(to bottom, #006ec7, #157cb4);
	color: #fff;
	font-size: 18px;
	padding: .5em 2em;
	border-radius: 4em;
	display: inline-block;
	text-align: center;
}

.video-page-title-dot1 {
	margin-left: 2px;
	margin-right: 2px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background-color: var(--color-primary);
}

.video-page-title-dot2 {
	margin-left: 2px;
	margin-right: 2px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background-color: var(--color-primary);
}

.video-page-title-dot3 {
	margin-left: 2px;
	margin-right: 2px;
	width: 4px;
	height: 4px;
	border-radius: 50%;
	background-color: var(--color-primary);
}

/* 城市宣传片 */
.video-box {
	margin-top: 2em;
}

.video-card {
	max-width: 600px;
	margin-top: 1em;
	background-color: #fff;
	border-radius: 10px;
	border: 10px #fff solid;
	box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
}

.video-controls {
	display: block;
}

/* 园区推介 */
.section-intro {
	background: #f2f2f2 url(images/banner1.jpg) center center no-repeat;
	background-size: auto 100%;
}

.intro-swiper {
	width: 100%;
	margin-top: 2em;
}

.intro-swiper .swiper-slide {
	height: auto;
}

.project {
	display: flex;
	flex-wrap: wrap;
	margin-top: 1em;
}

.project-item {
	height: 100%;
	margin: 0 7px;
	flex-grow: 1;
	background-color: #fff;
	padding: 15px;
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.project-item .thumb {
	width: 100%;
	height: 200px;
	object-fit: cover;
	transition: .2s;
}
.project-item .thumb:hover {
	border-radius: 10px;
	box-shadow: 0 5px 5px rgba(0,0,0,.2);
}

.project-item .text {
	color: #999;
	font-size: 14px;
	line-height: 1.6;
	padding: .5em 0 .3em 0;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
}

.project-attr {
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}

.project-title {
	margin-top: .8em;
	font-size: 18px;
	color: var(--color-second);
	display: flex;
	align-items: center;
}

.project-title img {
	height: 1em;
	margin-right: .2em;
	margin-top: 2px;
}

.project-btn {
	background-color: var(--color-primary);
	color: #fff;
	margin-top: .5em;
	padding: .8em 3em;
	border-radius: 4em;
	transition: .2s;
	font-size: 14px;

}

.project-btn:hover {
	background-color: #007aff;
	box-shadow: 0 5px 5px rgba(0,0,0,.2);
}

.intro-swiper .swiper-wrapper {
	padding-bottom: 25px;
}


.custom-swiper-pagination.swiper-pagination-bullets {
	bottom: 0;
}

.custom-swiper-pagination .swiper-pagination-bullet {
	width: 40px;
	height: 6px;
	border-radius: 10px;
	text-align: center;
	line-height: 20px;
	font-size: 12px;
	color: #fff;
	opacity: 1;
	background-color: #007aff;
}

.custom-swiper-pagination .swiper-pagination-bullet-active {
	color: #fff;
	background: var(--color-second);
}

.custom-swiper-pagination .swiper-pagination-bullet:hover {
	background-color: var(--color-second-hover);
}


.ppt-dialog {
	position: fixed;
	z-index: 999;
	width: 100vw;
	height: 100vh;
	left: -100%;
	top: 0;
}

.ppt-dialog-close-btn {
	display: inline-block;
	width: 30px;
	height: 30px;
	background: url(images/sprite.png);
}


/* 文件政策 */
.section-policy {
	background: #f2f2f2 url(images/banner1.jpg) center bottom no-repeat;
	background-size: auto 100%;
}


.news {
	margin-top: 40px;
	display: inline-flex;
	border-radius: 20px;
}

.news li {
	position: relative;
	margin-top: 2px;
	margin-left: 5px;
	margin-right: 5px;
	padding: 10px 10px;
	background-color: #f9f9f9;
	border-top: 5px #d7b878 solid;
	border-radius: 10px;
	width: calc(25% - 10px);
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.1);
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}
.news li:hover {
	box-shadow: 0 0 20px rgba(0, 0, 0, 0.3);
}
.news .main {
	width: 100%;
	padding-left: 10px;
	padding-right: 10px;
	flex-grow: 1;
	min-height: 150px;
	border-radius: 10px;
	background: #fff url(images/policy.png) center bottom no-repeat;
	background-size: 150% auto;
	transition: .3s;
	background-color: #fff;
	font-size: 15px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.news .main:hover {
	background-size: 200% auto;
}
.news .title {
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 18px;
	margin-top: 1em;
	margin-bottom: 2em;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
}
.news .title:hover {
	color: var(--color-primary);
}
.news .more {
	margin-top: 1em;
	background-color: var(--color-primary);
	color: #fff;
	padding: .5em 3em;
	border-radius: 2em;
	font-size: 14px;
	transition: .2s;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}
.news .more:hover {
	background-color: var(--color-second);
	color: #333;
}
/* 产业推介 */
.section-industry {
	background: #f2f2f2 url(images/banner_field.jpg) center bottom no-repeat;
	background-size: auto 100%;
}

/* 招商要素指引 */
.section-guide {
	background: #f2f2f2 url(images/banner_inderstry.jpg) center bottom no-repeat;
	background-size: auto 100%;
}

.guide-swiper {
	margin-top: 2em;
	margin-left: 10px;
	margin-right: 10px;
	border-radius: 10px;
	box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
	background-color: #fff;
	transition: .3s;
}
.guide-swiper .thumb {
	width: 100%;
	height: 100%;
	object-fit: scale-down;
}

/* 载体PPT */
.section-support {
	background: #f2f2f2 url(images/banner1.jpg) center bottom no-repeat;
	background-size: auto 100%;
}
.support-swiper {
	margin-top: 2em;
	padding-bottom: 30px;
}

.support-item {
	background-color: #fff;
	border-radius: 10px;
	padding: 10px;
	margin-left: 10px;
	margin-right: 10px;
}

.support-item .thumb {
	width: 100%;
	height: 140px;
	object-fit: cover;
}
.support-item .thumb:hover {
	border-radius: 5px;
	box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
}

.support-item .title {
	font-size: 18px;
	color: var(--color-second);
	font-weight: bold;
	padding: .5em 0;
	text-align: center;
}

.support-item .more {
	margin-top: .5em;
	display: block;
	background-color: var(--color-primary);
	color: #fff;
	border-radius: 20px;
	padding: 5px 10px;
	font-size: 14px;
	text-align: center;
}

.support-item .more:hover {
	background-color: var(--color-second);
	color: #000;
}



.full-img {
	width: 100%;
	height: 100%;
	object-fit: scale-down;
}

.ppt-swiper {
	margin-left: 10px;
	margin-right: 10px;
	border-radius: 10px;
	box-shadow: 0 0 30px rgba(0, 0, 0, 0.2);
	background-color: #fff;
	transition: .3s;
}

.ppt-swiper .swiper-pagination-bullet {
	width: 20px;
	height: 20px;
	text-align: center;
	line-height: 20px;
	font-size: 12px;
	color: #fff;
	opacity: 1;
	background: rgba(0, 0, 0, 0.2);
}

.ppt-swiper .swiper-pagination-bullet-active {
	color: #fff;
	background: #007aff;
}

.ppt-swiper .swiper-pagination-bullet:hover {
	background-color: #555;
}

.ppt-box {
	height: 100%;
}

.ppt-img {
	width: 100%;
	height: 100%;
	object-fit: scale-down;
}


.landscape .ppt-swiper {
	width: calc(100vh - 20px);
	height: calc(100vw - 20px);
	transform: translateX(calc(-25% - 40px)) rotate(90deg);
}

.landscape-btn {
	position: absolute;
	z-index: 9999;
	width: 32px;
	height: 32px;
	right: 10px;
	top: 10px;
	border-radius: 50%;
	background-color: #0009;
	display: none;
	justify-content: center;
	align-items: center;
}

.landscape-btn img {
	width: 18px;
	height: 18px;
}

#aboutZone .wrapper {
	height: 100%;
	width: 800px;
}

#aboutZone .ppt-swiper {
	height: 100%;
}


/* 我要报名 */
.section-apply {
	background: url(images/banner_contact.jpg) center bottom no-repeat;
	background-size: auto 100%;
}

.apply-phone {
	width: 100%;
	text-align: center;
	position: relative;
	margin-bottom: 20px;
	padding: 15px 50px;
	font-size: 24px;
	background-color: #0003;
	border-radius: 40px;
	border: 1px #d7b878 solid;
}
.apply-phone:hover {
	background: linear-gradient(to right, #d7b878, transparent, #d7b878);
}

.apply-phone::before {
	content: "";
	position: absolute;
	left: 5px;
	top: 5px;
	bottom: 5px;
	width: 150px;
	border: 1px #fff solid;
	border-radius: 50px;
	border-width: 0 0 0 1px;
	/* 边框渐变 */
	/* border: 1px #fff solid;
	border-right: 0;
	border-image: linear-gradient(to right,  #d7b878, transparent) 1;
	border-image-source: linear-gradient(to right,  #d7b878, transparent);
	border-image-slice: 1; */
}

.apply-phone::after {
	content: "";
	position: absolute;
	left: auto;
	right: 5px;
	top: 5px;
	bottom: 5px;
	width: 150px;
	border: 1px #fff solid;
	border-radius: 50px;
	border-width: 0 1px 0 0;
}

.apply-phone a {
	position: relative;
	z-index: 3;
	font-weight: bold;
	color: #d7b878;
	width: 100%;
	display: flex;
	justify-content: space-between;
	align-items: center;
	background-image: linear-gradient(to bottom, #fff, #d7b878);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	
}
.apply-phone a em {
	margin-left: 20px;
}
.apply-phone a:hover {
	background-image: linear-gradient(to bottom, #eecd8b, #fff);
}
.qr-card {
	margin-top: 2em;
	color: #fff;
	font-size: 18px;
}

.qr-card img {
	/* border: 5px #fff solid; */
	width: 150px;
	margin-bottom: 10px;
}


.contact {
	margin-top: 3em;
	display: flex;
	flex-wrap: wrap;
}

.con-tel {
	line-height: 25px;
	background: url(images/footicon.png) left 1px no-repeat;
	padding-left: 30px;
	margin-right: 1em;
	margin-top: .5em;
}

.con-address {
	display: inline-block;
	margin-top: .5em;
	line-height: 25px;
	background: url(images/footicon.png) left -100px no-repeat;
	padding-left: 30px;
}

.copy {
	display: inline-block;
	margin-top: 40px;
	padding: 5px 1.5em;
	font-size: 12px;
	text-align: center;
	background-color: #0005;
	border-radius: 20px;
	color: #ccc;
	opacity: .7;
}
.goManage {
	width: 110px;
	height: 38px;
	margin-top: 25px;
	/*background: linear-gradient(270deg, #ff7e5f, #feb47b, #86a8e7, #4fd9ff);*/
	/*background: linear-gradient(270deg, #dbb769, #e3cea7, #386db6, #3c73bd);*/
	background-size: 400% 400%;
	animation: gradientMove 10s ease-in-out infinite;
	border-radius: 20px;

	/* 居中 */
	display: flex;
	justify-content: center;
	align-items: center;

	/* 字体样式优化 */
	font-family: 'Poppins', sans-serif;
	font-size: 15px;
	font-weight: 650;
	color: white;
	text-transform: uppercase;
	letter-spacing: 0.1px;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
	/* 抗锯齿优化 */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
@keyframes gradientMove {
	0% {
		background-position: 0% 50%;
	}
	25% {
		background-position: 50% 100%;
	}
	50% {
		background-position: 100% 50%;
	}
	75% {
		background-position: 50% 0%;
	}
	100% {
		background-position: 0% 50%;
	}
}

.copy a,
.copy a:link {
	color: #fff;
}

.copy a:hover {
	color: #ff6600;
}

/* 详细页 */
.body-bg {
	background: url(images/bodybg.jpg) center top no-repeat;
	background-size: 100% auto;
	background-attachment: fixed;
}

.detail-card {
	margin-bottom: 5em;
	padding: 2em 0 3em 0;
	background-color: #fff;
	border-radius: 10px;
	box-shadow: 0 0 20px rgba(0, 0, 0, .1);
}

.detail-padding {
	margin: 0 3em;
}

.detail-title {
	padding: 0 1em .5em 1em;
	font-size: 32px;
	text-align: center;
	border-radius: 10px;
	border-bottom: 3px var(--color-primary) solid;
}

.detail-text {
	margin-top: 1.5em;
	line-height: 1.8;
	color: #333;
	text-align: justify;
}

.detail-text img {
	max-width: 100%;
}

.detail-attr {
	display: flex;
	margin-top: 1em;
}

.detail-attr .btn {
	display: flex;
	padding: .2em 1em;
	border: 1px #ccc solid;
	border-radius: 3em;
	align-items: center;
}

.detail-attr .btn .icon {
	height: 30px;
	margin-left: 5px;
}

.detail-attr .btn:hover {
	color: #007aff;
	border-color: #006ec7;
}

.detail-banner {
	padding: 5em 0;
}

.inner-logo {
	width: 25%;
}


.section-swiper-bg {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	background-position: center center;
	background-size: auto 100%;
	opacity: 0;
	animation: fadeInOut 10s 0s infinite;
}


.animated {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both
}

.infinite {
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite
}

.hinge {
	-webkit-animation-duration: 2s;
	animation-duration: 2s
}

.moveLeft {
	animation-name: moveLeft;
	animation-duration: 2s;
}

.moveRight {
	animation-name: moveRight;
	animation-duration: 2s;
}

@keyframes moveLeft {
	0% {
		transform: scale(-1) translateX(0);
		opacity: 1;
	}

	30% {
		transform: scale(-1) translateX(10px);
		opacity: 0.3;
	}

	100% {
		transform: scale(-1) translateX(0px);
		opacity: 1;
	}
}

@keyframes moveRight {
	0% {
		transform: translateX(0);
		opacity: 1;
	}

	30% {
		transform: translateX(10px);
		opacity: 0.3;
	}

	100% {
		transform: translateX(0px);
		opacity: 1;
	}
}

@keyframes fadeInOut {
	0% {
		opacity: 0
	}

	25% {
		opacity: 0
	}

	50% {
		opacity: 1
	}

	75% {
		opacity: 1
	}

	100% {
		opacity: 0
	}
}

@-webkit-keyframes fadeInLeft {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-20px);
		transform: translateX(-20px)
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		transform: translateX(0)
	}
}

@keyframes fadeInLeft {
	0% {
		opacity: 0;
		-webkit-transform: translateX(-20px);
		-ms-transform: translateX(-20px);
		transform: translateX(-20px)
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0)
	}
}

@-webkit-keyframes fadeInRight {
	0% {
		opacity: 0;
		-webkit-transform: translateX(20px);
		transform: translateX(20px)
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		transform: translateX(0)
	}
}

@keyframes fadeInRight {
	0% {
		opacity: 0;
		-webkit-transform: translateX(20px);
		-ms-transform: translateX(20px);
		transform: translateX(20px)
	}

	100% {
		opacity: 1;
		-webkit-transform: translateX(0);
		-ms-transform: translateX(0);
		transform: translateX(0)
	}
}

@-webkit-keyframes fadeInUp {
	0% {
		opacity: 0;
		-webkit-transform: translateY(20px);
		transform: translateY(20px)
	}

	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}
}

@keyframes fadeInUp {
	0% {
		opacity: 0;
		-webkit-transform: translateY(20px);
		-ms-transform: translateY(20px);
		transform: translateY(20px)
	}

	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		transform: translateY(0)
	}
}

@-webkit-keyframes fadeInDown {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-20px);
		transform: translateY(-20px)
	}

	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
		transform: translateY(0)
	}
}

@keyframes fadeInDown {
	0% {
		opacity: 0;
		-webkit-transform: translateY(-20px);
		-ms-transform: translateY(-20px);
		transform: translateY(-20px)
	}

	100% {
		opacity: 1;
		-webkit-transform: translateY(0);
		-ms-transform: translateY(0);
		transform: translateY(0)
	}
}

@-webkit-keyframes fadeIn {
	0% {
		opacity: 0
	}

	100% {
		opacity: 1
	}
}

@keyframes fadeIn {
	0% {
		opacity: 0
	}

	100% {
		opacity: 1
	}
}

@-webkit-keyframes fadeOut {
	0% {
		opacity: 1
	}

	100% {
		opacity: 0
	}
}

@keyframes fadeOut {
	0% {
		opacity: 1
	}

	100% {
		opacity: 0
	}
}


.animate {
	opacity: 0
}

.fadeIn {
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn;
	-webkit-animation-duration: 1.5s;
	animation-duration: 1.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both
}

.fadeOut {
	-webkit-animation-name: fadeOut;
	animation-name: fadeOut
}

.fadeInLeft {
	-webkit-animation-name: fadeInLeft;
	animation-name: fadeInLeft;
	-webkit-animation-duration: 1.5s;
	animation-duration: 1.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both
}

.fadeInRight {
	-webkit-animation-name: fadeInRight;
	animation-name: fadeInRight;
	-webkit-animation-duration: 1.5s;
	animation-duration: 1.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both
}

.fadeInUp {
	-webkit-animation-name: fadeInUp;
	animation-name: fadeInUp;
	-webkit-animation-duration: 1.5s;
	animation-duration: 1.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both
}

.fadeInDown {
	-webkit-animation-name: fadeInDown;
	animation-name: fadeInDown;
	-webkit-animation-duration: 1.5s;
	animation-duration: 1.5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both
}




@media screen and (max-width: 1200px) {
	.wrapper {
		max-width: 100%;
	}

	.m-flex-wrap {
		flex-wrap: wrap;
	}

	.m-flex-grow {
		flex-grow: 1;
	}

	.m-width-auto {
		width: auto;
	}

	.m-width-full {
		width: 100%;
	}

	.m-ml-0 {
		margin-left: 0;
	}

	.m-mr-0 {
		margin-right: 0;
	}

	.about-nav li {
		width: 3em;
		padding-left: 1em;
		padding-right: 1em;
	}

	.foot-card {
		width: 100%;
	}

	.banner-logo {
		width: 70%;
	}

}

@media screen and (max-width: 768px) {
	.animate {
		opacity: 1;
	}

	#menu {
		display: none;
	}

	.news {
		margin-top: 1em;
		flex-direction: column;
	}
	.news .thumb {
		display: none;
	}
	.news .main {
		min-height: auto;
	}
	.news li {
		width: 100%;
		margin-left: 0;
		margin-right: 0;
		margin-top: .5em;
		padding-top: .5em;
		padding-bottom: .5em;
		flex-direction: row;
	}
	.news .title {
		font-size: 16px;
		margin-top: .2em;
		margin-bottom: 3.5em;
	}
	.news .more {
		border-radius: 5px;
		padding-left: 1em;
		padding-right: 1em;
		width: 50px;
		margin-top: 0;
		margin-left: .5em;
	}

	.project li {
		width: 100%;
		margin-top: 1em;
	}

	.project .thumb {
		width: 100%;
		height: 150px;
		object-fit: cover;
	}

	.project .text {
		display: none;
	}



	.section2 .full {
		/* align-items: flex-start; */
	}

	.about-card {
		padding-left: 1em;
		padding-right: 1em;
		height: 500px;
	}

	.about-nav {
		bottom: calc(100% - 50px);
	}

	.about-nav li {
		font-size: 16px;
	}

	.about-text {
		font-size: 12px;
	}

	.section-title {
		font-size: 24px;
	}

	.landscape-btn {
		display: flex;
	}

	.foot-card {
		padding-left: 1em;
		padding-right: 1em;
	}

	.form li {
		flex-direction: column;
		align-items: stretch;
	}

	.form li label {
		margin-bottom: .2em;
	}

	/* .section1 {
		height: 100vh;
	}
	.section2 {
		padding-top: 15em;
		padding-bottom: 5em;
	}
	.section-video,.section-apply,.section-intro,.section-policy,.section-guid {
		padding-top: 5em;
		padding-bottom: 5em;
	} */
	.section-apply .wrapper {
		width: 100%;
	}

	.detail-wrapper {
		width: auto;
	}

	.detail-padding {
		margin-left: .5em;
		margin-right: .5em;
	}

	.detail-banner {
		text-align: center;
	}

	.detail-title {
		font-weight: bold;
		font-size: 18px;
	}

	.apply-phone {
		padding-left: 20px;
		padding-right: 20px;
	}
	.apply-phone a {
		font-size: 18px;
	}
	.custom-swiper-pagination .swiper-pagination-bullet  {
		width: 15px;
	}


}

.landscape {
	transform: rotate(90deg) translateY(-50%) translateX(-50%);
	transform-origin: left center;
	margin-left: 0;
	margin-top: 0;
	margin-bottom: 0;
	width: 92vh;
	height: 100vw;
}

@media screen and (orientation: portrait) {}