@charset "utf-8";
/* CSS Document */

.mainArea{
	padding: 0;
}

/*newsArea*/
	.newsArea{
		padding: 100px 0;
	}
	.newsArea .wrap{}
	.newsArea ul{}
	.newsArea ul li{
		padding: 0 30px;
		float: right;
		position: relative;
		padding-bottom: 10px;
	}
	.newsArea ul li::before{
		content: '';
		width: 1px;
		height: 150px;
		background: url(../images/line.png);
		position: absolute;
		top: 0;
		left: 0;
	}
	.newsArea ul li .item{
		position: relative;
	}
	.newsArea ul li .Img{
		width: 150px;
		float: left;
		box-shadow: 5px 5px 8px rgba(0, 0, 0, 0.15);
		overflow: hidden;
	}
	.newsArea ul li .Img img{
		width: 100%;
	    -webkit-transition: all 1s ease-out;
	    -moz-transition: all 1s ease-out;
	    -o-transition: all 1s ease-out;
	    transition: all 1s ease-out;
	}
	.newsArea ul li:hover .Img img{
		-webkit-transform: scale(1.1);
	    -ms-transform: scale(1.1);
	    transform: scale(1.1);
	    -webkit-transition: all 2s ease-out;
	    -moz-transition: all 2s ease-out;
	    -o-transition: all 2s ease-out;
	    transition: all 2s ease-out;
	}
	.newsArea ul li .Txt{
		width: calc(100% - 150px);
		float: left;
		padding: 5px 0 5px 20px;
	}
	.newsArea ul li .dateBox{
		color: #7b6929;
		font-size: 13px;
		font-family: 'Bellefair', serif;
		line-height: 26px;
		letter-spacing: 1px;
	}
	.newsArea ul li h3{
		color: #2c2c2c;
		font-size: 18px;
		font-weight: normal;
		line-height: 40px;
		letter-spacing: 0.5px;
		margin-bottom: 5px;
		overflow : hidden;
	 	text-overflow : ellipsis;
	  	white-space : nowrap;
	}
	.newsArea ul li h3 a{
		color: #2c2c2c;
	}
	.newsArea ul li p{
		color: #9c9c9c;
		height: 60px;
	}

/*linkArea*/
	.linkArea{
		padding-top: 80px;
	}
	.linkArea .wrap{
		width: 100%;
	    position: relative;
	    padding: 0;
	    text-align: center;
	}
	.linkArea p{
		color: #2c2c2c;
		max-height: 90px;
		margin-bottom: 80px;
	}
	.linkArea li .item{
		position: relative;
		border-left: 1px solid #fff;
		border-right: 1px solid #fff;
	}
	.linkArea li .item img{
		width: 100%;
	}
	.linkArea li .item h3{
		color: #7b6929;
		font-size: 30px;
		font-family: "仿宋";
		font-weight: normal;
		width: 140px;
		height: 350px;
		background: rgba(255, 255, 255, 0.9);
		box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);	
		padding-top: 110px;
		position: absolute;
		top: calc(50% - 170px);
		left: 160px;
	}
	.linkArea li .item h3::after{
		content: '';
		width: 120px;
		height: 330px;
		border: 1px solid rgba(123, 105, 41, 0.3);
		position: absolute;
		top: 10px;
		left: 10px;
	}
	.linkArea li .item h3 a{
		color: #7b6929;
		display: block;
		line-height: 140px;
		letter-spacing: 10px;
	    -webkit-writing-mode: vertical-lr;
	    writing-mode: vertical-lr;
	    position: relative;
	    z-index: 5;
	}
	.linkArea li .item h3 a::after{
		content: '';
		width: 19px;
		height: 19px;
		background: url(../images/icon.png);
		position: absolute;
		top: -60px;
		left: calc(50% - 9px);
	}

/*aboutArea*/
	.aboutArea{
		padding:195px 0 210px 0;
		background: url(../images/bg_about.png) no-repeat center right;
		background-attachment: fixed;
		position: relative;
	}
	.aboutArea .warp{
		width: 100%;
	}
	.aboutArea .leftBox{
		float: left;
	}
	.aboutArea .titleBox{
		text-align: right;
	}
	.aboutArea .titleBox::before{
		display: none;
	}
	.aboutArea .titleBox h2{
		font-size: 0;
	}
	.aboutArea .titleBox h2::before{
		content: '';
		width: 251px;
		height: 373px;
		background: url(../images/title.png);
		position: absolute;
		top: -90px;
		left: auto;
		right: 90px;
	}
	.aboutArea .rightBox{
		float: left;
	}
	.aboutArea .rightBox p{
		color: #2c2c2c;
		line-height: 40px;
		max-height: 200px;
	}


/**********響應式**********/
@media (max-width: 1180px){
	.aboutArea{
		padding: 195px 0 100px 0;
	}
	.aboutArea .titleBox{
		width: 100%;
		text-align: center;
	}
	.aboutArea .titleBox h2::before{
		right: calc(50% - 125px);
	}
	.aboutArea .rightBox{
		width: 100%;
		text-align: center;
		margin-top: 200px;
	}
	.aboutArea .rightBox p{
		line-height: 30px;
	}
}
@media (max-width: 960px){
	.linkArea p{
		padding: 0 30px;
	}
}
@media (max-width: 768px){
}
@media (max-width: 640px){
	.newsArea{
		padding: 100px 0 50px 0;
	}

	.linkArea p{
		max-height: 120px;
		margin-bottom: 50px;
	}
	.linkArea li .item h3{
		height: 94%;
	    top: 3%;
	    left: 50px;
	    padding-top: 10%;
	}
	.linkArea li .item h3::after{
		height: 92%;
	}
	.linkArea li .item h3 a::after{
		display: none;
	}
}
@media (max-width: 480px){
	.newsArea ul li{
		padding: 0;
	}
	.newsArea ul li::before{
		display: none;
	}
	.newsArea ul li .Img{
		width: 100%;
	}
	.newsArea ul li .Txt{
		width: 100%;
		margin-top: 20px;
	}

	.linkArea li .item h3 a{
		letter-spacing: 3px;
	}
}
@media (max-width: 360px){
	.linkArea li .item h3{
		font-size: 24px;
		height: 100%;
		top: 0;
		left: 20px;
		padding-top: 30px;
	}
	.linkArea li .item h3::after{
		height: 94%;
		top: 3%;
	}

	.aboutArea .titleBox h2::before{
		display: block;
	}
}