* {

	margin: 0;

	padding: 0;

}



@font-face {

	font-family: 'SourceHanSerifCN-Regular';

	src: url('../font/SourceHanSerifCN-Regular.TTF');

}



@font-face {

	font-family: 'JiangChengLvDongSong';

	src: url('../font/JiangChengLvDongSong.ttf');

}



@font-face {

	font-family: 'CaoShuSimp2Trad-regular';

	src: url('../font/CaoShuSimp2Trad-regular.ttf');

}



@font-face {

	font-family: 'Athene';

	src: url('../font/Athene.otf');

}



@font-face {

	font-family: 'MaokenHeavyLabourer-Ming-Regular';

	src: url('../font/SourceHanSerifCN-Bold-2.otf');

}



@font-face {

	font-family: 'SourceHanSerifTC-Bold';

	src: url('../font/SourceHanSerifCN-Bold.TTF');

}



@font-face {

	font-family: 'ZHJBT-XJHZJ';

	src: url('../font/ZHJBT-XJHZJ.otf');

}



@font-face {

	font-family: 'SourceHanSerifTC-Bold';

	src: url('../font/SourceHanSerifCN-Bold.TTF');

}



@font-face {

	font-family: 'SourceHanSerifTC-Regular';

	src: url('../font/SourceHanSerifTC-Regular.otf');

}



body {

	background-color: #f4f4f4;

}



a {

	text-decoration: none;

}



ul li {

	list-style: none;

}



input,

textarea,

select {

	outline: none;

}



iframe {

	width: 100%;

}



.wrap {

	width: 1170px;

	margin: 0 auto;

}



/* header */

.had {

	background: url(../images/hadBj.jpg) center no-repeat;

	background-size: cover;

	padding: 15px 0;

	width: 100%;

	position: relative;

	z-index: 999;

	box-shadow: 0 0 10px transparent;

}



.head {

	display: flex;

	align-items: center;

	justify-content: space-between;

}



.menu {

	width: 30px;

	height: 20px;

	display: flex;

	align-items: center;

	position: relative;

	display: none;

}



.menu::before,

.menu::after {

	content: '';

	width: 100%;

	height: 3px;

	border-radius: 2px;

	background-color: #222;

	position: absolute;

	left: 0;

	transition: all .8s;

}



.menu::before {

	top: 0;

}



.menu::after {

	bottom: 0;

}



.menu span {

	display: block;

	width: 20px;

	height: 3px;

	border-radius: 2px;

	background-color: #222;

}



.menu.menuActive::before,

.menu.menuActive::after {

	top: 0;

	bottom: 0;

	left: 0;

	right: 0;

	margin: auto;

}



.menu.menuActive::before {

	transform: rotate(45deg);

}



.menu.menuActive::after {

	transform: rotate(-45deg);

}



.menu.menuActive span {

	display: none;

}



.modLogo {

	opacity: 0;

}



.headUl {

	width: 700px;

	display: flex;

	justify-content: space-between;

}



.headUl a {

	display: block;

	width: 70px;

	height: 70px;

	text-align: center;

	line-height: 70px;

	font-family: 'SourceHanSerifCN-Regular';

	font-size: 16px;

	color: #201513;

	border-radius: 50%;

	box-sizing: border-box;

}



.headUl .hadActive a {

	background: url(../images/menuBj.png) center no-repeat;

	background-size: cover;

}



.banner {

	width: 100%;

	overflow: hidden;

	/* margin-top: -5px; */

	position: relative;

}



.banner img {

	display: block;

	width: 100%;

	animation-duration: 8s;

}



.banTxt {

	width: 100%;

	height: 100%;

	position: absolute;

	top: 0;

	left: 0;

	display: flex;

	justify-content: center;

	align-items: center;

}



.banTxt h1 {

	font-family: 'ZHJBT-XJHZJ';

	font-size: 58px;

	font-weight: normal;

	font-stretch: normal;

	color: #555555;

	background: url(../images/frame.png) center no-repeat;

	background-size: 100% 100%;

	padding: 22px 50px;

}



.btm {

	background: url(../images/footer.jpg) bottom no-repeat;

	background-size: cover;

	padding: 40px 0;

}



/* footer */

.fotUl {

	width: 700px;

	margin: 0 auto;

	display: flex;

	justify-content: space-between;

}



.fotUl li {

	text-align: center;

}



.fotUl li p {

	width: 100%;

	writing-mode: tb-rl;

	font-family: 'SourceHanSerifCN-Regular';

	font-size: 16px;

	font-weight: normal;

	font-stretch: normal;

	line-height: 40px;

	letter-spacing: 8px;

	color: #201513;

}



.fotUl li img {

	width: 16px;

	transform: rotateY(180deg);

	display: inline-block;

	margin-bottom: 20px;

}



.appointment {

	border: solid 1px #393b3a;

	padding: 5px 0;

}



.appointment p {

	border-top: 1px solid #393B3A;

	border-bottom: 1px solid #393B3A;

}



.fotUl li h5 {

	writing-mode: tb-rl;

	font-family: 'MaokenHeavyLabourer-Ming-Regular';

	font-size: 26px;

	font-weight: normal;

	font-stretch: normal;

	line-height: 30px;

	letter-spacing: 0px;

	color: #333333;

	text-align: right;

	width: 100%;

}



.fotUl li h6 {

	margin-top: 20px;

	font-family: 'Athene';

	font-size: 20px;

	font-weight: normal;

	font-stretch: normal;

	line-height: 30px;

	letter-spacing: 0px;

	color: #333333;

	text-align: right;

}



.fot {

	margin-top: 140px;

	font-family: 'SourceHanSerifCN-Regular';

	font-size: 14px;

	font-weight: normal;

	font-stretch: normal;

	letter-spacing: 0px;

	color: #222;

	opacity: 0.6;

	text-align: center;

}



@media screen and (max-width:1300px) {



	.wrap {

		width: 1100px;

	}



}





@media screen and (max-width:1200px) {



	.wrap {

		width: 950px;

	}



	.headUl {

		width: 600px;

	}



	.banner img {

		width: 200%;

	}



}



@media screen and (max-width:1020px) {



	.wrap {

		width: 85%;

	}



	.headUl {

		width: 450px;

	}



	.headUl a {

		width: 65px;

		height: 65px;

		line-height: 60px;

	}



	.banTxt h1 {

		font-size: 50px;

		padding: 12px 35px;

	}



	.fotUl {

		width: 550px;

	}



	/* .banner {

		margin-top: -20px;

	} */



}





@media screen and (max-width:767px) {

	.wrap {

		width: 90%;

	}



	.had {

		padding: 5px 0;

	}



	.modLogo {

		opacity: 1;

		width: 50px;

	}

	

	.modLogo img{

		display: block;

		width: 100%;

	}



	.headUl {

		position: absolute;

		top: 50px;

		left: 0;

		background: #fff;

		z-index: 9;

		width: 100%;

		box-sizing: border-box;

		padding: 0 10%;

		display: none;

	}



	.mask::before {

		content: '';

		position: fixed;

		height: 100%;

		width: 100%;

		background-color: rgba(0, 0, 0, .8);

		left: 0;

		top: 80px;

		display: block;

	}



	.headUl a {

		font-size: 17px;

		width: 100%;

		height: 40px;

		line-height: 40px;

	}



	.headUl .logo {

		display: none;

	}



	.headUl .hadActive a {

		background: none;

	}



	.menu {

		display: flex;

	}



	.banTxt h1 {

		font-size: 30px;

		padding: 10px 15px;

	}



	.fotUl {

		width: 90%;

	}



	.btm {

		background-size: 100%;

	}



	.fot {

		margin-top: 40px;

	}





}