#main {
	margin-top:104px;
	max-width:1170px
}
@media (max-width:992px) {
	#main {
	padding:0 20px
}
}#main h1 {
	color:#333;
	text-align:center;
	margin:54px 0;
	font-size:48px;
	font-weight:300;
	line-height:1.1;
	letter-spacing:1px
}
#main .img {
	width:100%;
	height:480px;
	background-color:#eee;
	margin:0 auto;
	display:block;
	background-image:url(../image/join.png);
	position:relative
}
#main .img .warp {
	position:absolute;
	top:0;
	right:0;
	background-color:hsla(0,0%,100%,.59);
	width:30%;
	height:100%;
	color:#333;
	overflow:hidden
}
#main .img .warp .text {
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	top:0;
	padding:18px 24px;
	background-color:hsla(0,0%,100%,.8)
}
#main .img .warp .text h3 {
	font-size:24px;
	margin-bottom:18px;
	line-height:1.1;
	letter-spacing:1px;
	font-weight:200
}
#main .img .warp .text p {
	font-size:16px;
	line-height:1.8;
	font-weight:200
}
#main .img .warp .mask {
	position:absolute;
	right:0;
	top:0;
	-webkit-filter:blur(25px);
	-ms-filter:blur(25px);
	filter:blur(25px);
	filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius=25,MakeShadow=false);
	background-image:url(../image/join.png);
	background-position:50%;
	background-size:cover;
	width:100%;
	height:480px
}
@media (min-width:768px) {
	#main .img .warp .mask {
	width:720px
}
}@media (min-width:992px) {
	#main .img .warp .mask {
	width:940px
}
}@media (min-width:1200px) {
	#main .img .warp .mask {
	width:1140px
}
}#main .summary {
	margin:40px 0
}
#main .summary p {
	color:#333;
	margin-top:20px;
	font-weight:200;
	font-size:16px;
	line-height:1.8;
	text-indent:2em
}
#main .career .row {
	margin-left:0;
	margin-right:0;
	display:-webkit-box;
	display:-ms-flexbox;
	display:flex
}
#main .career .row .box {
	border:1px solid #eee;
	margin-top:24px;
	border-radius:10px;
	-webkit-box-flex:1;
	-ms-flex:1;
	flex:1;
	padding:0 30px
}
#main .career .row .box:first-child {
	margin-right:15px
}
#main .career .row .box:last-child {
	margin-left:15px
}
#main .career h2 {
	position:relative;
	color:#333;
	padding-left:16px;
	font-size:24px;
	line-height:24px;
	margin:30px 0;
	font-weight:200
}
#main .career h2:before {
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:4px;
	height:100%;
	background-color:#2887f0;
	border-radius:8px
}
#main .career p {
	font-size:16px;
	color:#333;
	line-height:1.8;
	margin-bottom:24px;
	font-weight:200
}
#main .career h3 {
	font-size:18px;
	color:#333;
	line-height:30px;
	margin-top:54px;
	font-weight:400
}
@media (max-width:768px) {
	#main .img {
	height:200px
}
#main .img .warp {
	width:100%
}
#main .img .warp .mask {
	height:200px
}
#main .img .warp .text {
	padding:10px;
	background-color:hsla(0,0%,100%,.4)
}
#main .img .warp .text h3 {
	font-size:18px;
	margin-bottom:8px
}
#main .img .warp .text p {
	font-size:14px;
	line-height:1.15
}
#main .career .row {
	-webkit-box-orient:vertical;
	-webkit-box-direction:normal;
	-ms-flex-direction:column;
	flex-direction:column
}
#main .career .row .box {
	margin-left:0!important;
	margin-right:0!important
}
}