

.jmlc{  background:url(images/jmlc_bg.jpg) no-repeat; min-height:440px;}
.jmlc h2 {
    font-size: 48px;
    color: #fff;
    text-align: center;
    height: 70px;
    line-height: 70px;
    margin-bottom: 15px;
    font-weight: normal;
}
.jmlc_con {
    width: 1200px;
    margin: 0 auto;
	padding-top:50px;
}
.jmlc_con dl{ float:left; width:180px; height:180px; border-radius:93px; background:#fff; margin: 30px 10px;} 
.jmlc_con dl dt{ width:51px; height:51px; background:#1989fa; border-radius:25px; font-size:34px; color:#fff; text-align:center; line-height:50px;margin: 0 auto;margin-top: 30px; }
.jmlc_con dl dd{ font-size:24px; text-align:center; height:50px; line-height:50px; color:#444; margin-top:5px;}

.container{ position:relative;}

.container:hover .back{
  -webkit-transform: rotateY(0deg);
          transform: rotateY(0deg);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}

.container:hover .front{
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}


.ys_con dl dt{
    transition:all 1s ease-in-out;
    -webkit-transition:all 1s ease-in-out;
    -moz-transition:all 1s ease-in-auto;
    -ms-transition:all 1s ease-in-out;
    -o-transition:all 1s ease-in-out;
}
.ys_con dl:hover dt{
    transform: rotate(360deg);
    -webkit-transform:rotate(360deg);
    -moz-transform:rotate(360deg);
    -ms-transform:rotate(360deg);
    -o-transform:rotate(360deg);
}


.container{
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
	-webkit-perspective: 1000px;
	        perspective: 1000px;
			float:left;
			width:180px;
			margin:0 10px;
}

.front,
.back{
  background-size: cover;
	background-position: center;
	-webkit-transition: -webkit-transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
	transition: -webkit-transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
	-o-transition: transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
	transition: transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
	transition: transform .7s cubic-bezier(0.4, 0.2, 0.2, 1), -webkit-transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
	-webkit-backface-visibility: hidden;
	        backface-visibility: hidden;
	text-align: center;
}

.container .back{ background:#1989fa !important; color:#fff !important;display: flex;align-items: center;}
.container .back dd{ color:#fff !important; font-size:14px; line-height:20px; padding:30px 15px;}

.front:after{
	position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    content: '';
    display: block;
    opacity: .6;
    -webkit-backface-visibility: hidden;
            backface-visibility: hidden;
    border-radius: 10px;
}
.container:hover .front,
.container:hover .back{
    -webkit-transition: -webkit-transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
    transition: -webkit-transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
    -o-transition: transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
    transition: transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
    transition: transform .7s cubic-bezier(0.4, 0.2, 0.2, 1), -webkit-transform .7s cubic-bezier(0.4, 0.2, 0.2, 1);
}

.back{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}



.container .back{
    -webkit-transform: rotateY(180deg);
            transform: rotateY(180deg);
    -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d;
}

.container .front{
    -webkit-transform: rotateY(0deg);
            transform: rotateY(0deg);
    -webkit-transform-style: preserve-3d;
            transform-style: preserve-3d;
}

.container:hover .back{
  -webkit-transform: rotateY(0deg);
          transform: rotateY(0deg);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}

.container:hover .front{
  -webkit-transform: rotateY(-180deg);
          transform: rotateY(-180deg);
  -webkit-transform-style: preserve-3d;
          transform-style: preserve-3d;
}


.joinIn {
  /* width: 610px; */
  /*height: 380px;*/
  float:left;
  background: rgba(14, 14, 65, 0.6);
  padding: 20px 36px;
}
.joinIn01 {
  width: 610px;
  /* height: 380px; */

}
.joinIn h2 {
  color: #ffffff;
  font-size: 24px;
  line-height: 58px;
  text-align:center;
}
.joinIn .textbox {
  width: 131px;
  float: left;
  color: #ffc900;
  font-size: 14px;
  line-height: 26px;
  height: 26px;
  margin-top: 19px;
  margin-left: 12px;
}
.joinIn .myForm input {
  width: 206px;
  height: 36px;
  line-height: 36px;
  outline: none;
  font-size: 14px;
  color: #999999;
  text-indent: 14px;
  border: none;
  margin-top: 6px;
  margin-bottom: 6px;
  border-radius: 3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  -ms-border-radius: 3px;
  -o-border-radius: 3px;
}
.joinIn .myForm input:first-child {
  margin-top: 0;
}
.joinIn .myForm .condition {
  width: 252px;
  height: 72px;
  border: none;
  line-height: 28px;
  text-indent: 14px;
  outline: none;
  margin-top: 12px;
  font-size: 14px;
}
.joinIn .myForm .submit {
  background: #ffd023;
  font-size: 18px;
  color: #12122d;
}

.jm_form{ width:1200px; margin:15px auto;}
.jm_list{ float:left; margin-top:5px;}

.jm_list label{ width: 60px; display: inline-block;text-align: right; margin-right:5px; color:#fff; font-size:14px;}
.joinIn .myForm .jm_list01 input,.joinIn .myForm .jm_list01 textarea{ width: 481px; border-radius:3px ; -webkit-border-radius:3px ; -moz-border-radius:3px ; -ms-border-radius:3px ; -o-border-radius:3px ; }

.jm_btn{     margin: 0 32%;
    margin-top: 20px;}

.jm_r{ float:right; width:500px;}

.jm_r p{ margin-top:15px;}
.jm_r p:nth-of-type(2){ margin-left:33px;}


#shutOff {
	position: absolute; 
	color:#fff;
	display:inline-block;
	padding:10px;
	background-color:#000;
	font-size: 14px;
}
