@font-face {
    font-family: 'DINPro bold';
    src: url('../fonts/DINPro-Bold.eot');
    src: url('../fonts/DINPro-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DINPro-Bold.woff2') format('woff2'),
        url('../fonts/DINPro-Bold.ttf') format('truetype'),
        url('../fonts/DINPro-Bold.svg#DINPro-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
}
.common-section .content{
	padding: 0 6.64%;
}
.sec1{
	padding: 4.84% 0 7.82%;/*60 0 97*/
	-webkit-display: flex;
	-webkit-align-items: flex-start;
	-webkit-justify-content: space-around;
	-webkit-flex-direction: row;
	display: flex;
	align-items: flex-start;
	justify-content: space-around;
	flex-direction: row;
}
.sec1 .icon1{
	width: 2.5em;
}
.sec1 .icon2{
	width: 3.25em;
}
.sec1 .text{
	display: inline-block;
	margin-left: 2em;
}
.sec1 h5{
	font-size: 1.375em;
	color: #000;
	font-weight: bold;	
}
.sec1 p{
	font-size: 1.125em;
	color: #000;
	margin-top: 1em;
}
.sec2{
	position: relative;
	margin-bottom: 3.87%;
}
.sec2 .swiper-container{
	width: 80%;
	overflow: hidden !important;
}
.sec2 .swiper-slide{
	opacity: 0;
	width: 38.65%;
}
.sec2 .swiper-slide.swiper-slide-prev,.sec2 .swiper-slide.swiper-slide-next{
	opacity: 0.5;
}
.sec2 .swiper-slide.swiper-slide-active{
	opacity: 1;
}
.sec2 .swiper-prev,.sec2 .swiper-next{
	position: absolute;
	border: 1px solid #ccc;
	border-radius: 50%;
	width: 3.125em;
	height: 3.125em;
	-webkit-display: flex;
	-webkit-align-items: center;
	-webkit-justify-content: center;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	background-color: #fff;
	top: 50%;
	z-index: 51;
	margin-top: -1.5625em;
}
.sec2 .swiper-prev{
	left: 0;
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
}
.sec2 .swiper-next{
	right: 0;
}
.sec2 .swiper-prev:hover,.sec2 .swiper-next:hover{
	border-color: #c7000b;
	background-color: #c7000b;
}
.sec2 .swiper-prev.swiper-button-disabled,.sec2 .swiper-next.swiper-button-disabled{
	cursor: default;
}
.sec2 .swiper-prev img,.sec2 .swiper-next img{
	width: 28%;
	background-repeat: no-repeat;
	background-size: auto 200%;
	background-position: center top;
	background-image: url(../images/about_history_arrow_bg.png);
}
.sec2 .swiper-prev:hover img,.sec2 .swiper-next:hover img{
	background-position: center bottom;
}

.sec3{
	text-align: center;
	margin-bottom: 7.258%;/*90*/
}
.sec3 h5{
	font-size: 1.375em;
	color: #000;
	font-weight: bold;	
}
.sec3 p{
	font-size: 1.125em;
	color: #000;
	margin-top: 1em;
	line-height: 1.56;
}



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

	.common-section .content{
		padding: 0;
	}
	.sec1{
		-webkit-justify-content: space-between;
		justify-content: space-between;
	}
	.sec1 li{
		max-width: 55%;
		-webkit-display: flex;
		-webkit-align-items: flex-start;
		-webkit-justify-content: flex-start;
		-webkit-flex-direction: row;
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		flex-direction: row;
	}
	.sec1 .text{
		margin-left: 1.5em;
		-webkit-flex-grow: 1;
		flex-grow: 1;
	}
	.sec1 p{
		line-height: 1.5;
	}


	.sec2{
		margin-bottom: 5%;
	}
	.sec2 .swiper-container{
		width: 100%;
	}
	.sec2 .swiper-slide{
		width: 60%;
	}


	.sec3{
		margin-bottom: 10%;/*90*/
	}
}