.wrap-div{padding: 80px 20px;}

.sec-1 *{text-align: center;}


.sec-1 .ul-0{margin-bottom: 80px;}
.sec-1 .ul-0 li{width: 33.333%;border: 1px solid #d7d7d7;background: #fff;height: 90px;cursor: pointer;}
.sec-1 .ul-0 div{display: table;width: 100%;height: 100%;}
.sec-1 .ul-0 p{display: table-cell;vertical-align: middle;}
.sec-1 .ul-0 .li-2{border-left: none;border-right: none;}
.sec-1 .ul-0 .history-li-on{background:#33cdd5; border-color: #33cdd5;}
.sec-1 .ul-0 .history-li-on p{color: #fff;}

.sec-1 .div{position: relative;height: 100%;padding-bottom: 70px;display: none;}
.sec-1 .history-div-on{display: block;animation: fadein 0.5s;}


.sec-1 .div:before{content: "";position: absolute;width:1px;height: 100%;left: 50%;top: 0;margin-left: -0.5px;background: #33cdd5;z-index: 0; }
.sec-1 .div:after{content: "";position: absolute;width:7px;height: 7px;left: 50%;bottom:-3.5px;margin-left: -3.5px;background: #33cdd5;z-index: 0;
border-radius: 50%;}
.sec-1 .div .dd{width: 100%;height: 50px;border: 3px solid #33cdd5;border-radius: 30px;margin: 0 auto;position: relative;z-index: 1;
background: #fff;padding: 0 15px;max-width: 300px;}
.sec-1 .div .dd span{display: table;width: 100%;height: 100%;}
.sec-1 .div .dd span p{display: table-cell;vertical-align: middle;line-height: 17px;}
.sec-1 .div .dd p{color: #33cdd5; }

.sec-1 .ddd{position: relative;width: 50%;margin-top: 70px;}
.sec-1 .dd-r{margin-left: 50%;padding-left: 40px;}
.sec-1 .dd-l{margin-right: 50%;padding-right: 40px;}
.sec-1 .dd-r p{text-align: left;}
.sec-1 .dd-l p{text-align: right;}
.sec-1 .ddd .s{position: absolute;width: 25px;height: 25px;background: #fff;top: 25px;}
.sec-1 .dd-r .s{left: -12.5px;}
.sec-1 .dd-l .s{right: -12.5px;}
.sec-1 .ddd .ss{position: absolute;width: 17px;height: 17px;background: #33cdd5;top: 50%;left: 50%;margin-top: -8.5px;margin-left: -8.5px;
border-radius: 5px;}
.sec-1 .ddd .ss:before {position: absolute;content: "";width: 5px;height: 5px;background: #fff;top: 50%;left: 50%;margin-top: -2.5px;margin-left: -2.5px;}
.sec-1 .ddd .p{margin-bottom:10px; }
.sec-1 .ddd .pp{color:#585858; margin-bottom: 3px;}



@media only screen and (max-width: 1023px) {
	.wrap-div{padding: 40px 20px;}
	
	.sec-1 .ul-0 li{height: 60px;}
	.sec-1 .ul-0{margin-bottom: 50px;}
	
	.sec-1 .dd-r{padding-left: 20px;}
	.sec-1 .dd-l{padding-right: 20px;}
	.sec-1 .ddd{margin-top:40px;}
	.sec-1 .div{padding-bottom: 40px;}
}

@media only screen and (max-width: 640px) {
	
	.sec-1 .ul-0 p{font-size: 16px;}
}