/* process1.html */ .index_box { width: 1500px; margin: 50px auto; } .inSec1L { line-height: 0; float: left; width: 261px; } .inSec1L img { width: 100%; } .inSec1In { float: left; margin-top: 60px; } .inSec1In div { display: inline-block; vertical-align: middle; width: 13px; height: 13px; border-radius: 50%; margin: 0 3px; } .inSec1In1 div { background-color: #1D9CFF; } .inSec1In1 div:first-child { margin-left: 0; } .inSec1In1 div:last-child { margin-right: 0; } .inSec1R { margin-left: 343px; } .inSec1Box>* { display: inline-block; vertical-align: middle; } .inSec1Box:first-child .inSec1Con { margin-top: 30px; } .inSec1Con { position: relative; font-size: 28px; font-weight: bold; width: 318px; border: 4px solid #5BB7FF; color: #272727; padding: 15px 50px; line-height: 44px; transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; -webkit-transition: all 0.3s; text-align: left; cursor:pointer; } .inSec1Num { background-color: #fff; position: absolute; left: 10px; top: -25px; z-index: 3; font-size: 68px; font-weight: bold; font-style: italic; color: #E5E5E5; padding: 0 15px 0 0; } .inSec1Con i { height: 34px; width: 34px; border-radius: 18px; line-height: 34px; background-color: #7BC5FF; position: absolute; right: 20px; top: 0; bottom: 0; margin: auto; text-align: center; color: #fff; transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; -webkit-transition: all 0.3s; } .inSec1Box>img { width: 70px; margin: 0 10px 0; } .inSec1Box:first-child>img { margin-top: 30px; } .inSec1Down { margin: 8px 0; text-align: right; } .inSec1Down img { width: 30px; margin-right: 145px; } .inSec1Box2 { text-align: right; } .index_box1 .inSec1Con:hover, .index_box1 .inSec1Con.active { border-color: #EFB142; color: #EFB142; } .index_box1 .inSec1Con:hover i, .index_box1 .inSec1Con.active i { background-color: #EFB142; } /* process1.html */ /* process2.html */ .inSec1In2 div { background-color: #8BBED5; } .index_box2 .inSec1Con { border: 2px solid #2175D6; border-radius: 4px; padding: 18px 20px 12px; width: 213px; font-size: 23px; } .index_box2 .inSec1Num { font-style: normal; font-size: 48px; padding: 0 5px 0 5px; } .index_box2 .inSec1Con i { position: relative; top: 0; right: 0; background-color: #B6CFE5; height: 28px; width: 28px; border-radius: 14px; line-height: 28px; } .index_box2 .inSec1Con span { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .icon { text-align: center; margin-top: 10px; } .index_box2 .inSec1Down img { margin-right: 95px; } .index_box2 .inSec1Con:hover, .index_box2 .inSec1Con.active { border-color: #6AA8C6; color: #EFB142; } .index_box2 .inSec1Con:hover i, .index_box2 .inSec1Con.active i { background-color: #EFB142; } /* process2.html */ /* process3.html */ .inSec1In3 div { background-color: #ADBBCD; } .index_box3 .inSec1Con { border: 2px solid #3A95E1; border-radius: 4px; padding: 18px 20px 12px; width: 213px; font-size: 23px; } .index_box3 .inSec1Num { font-style: normal; font-size: 48px; padding: 0 5px 0 5px; } .index_box3 .inSec1Con i { position: relative; top: 0; right: 0; background-color: #B6CFE5; height: 28px; width: 28px; border-radius: 14px; line-height: 28px; } .index_box3 .inSec1Con span { display: block; } /* .icon{ text-align: center; margin-top: 10px; } */ .index_box3 .inSec1Down img { margin-right: 95px; } .index_box3 .inSec1Con:hover, .index_box3 .inSec1Con.active { border-color: #3A95E1; color: #EFB142; } .index_box3 .inSec1Con:hover i, .index_box3 .inSec1Con.active i { background-color: #EFB142; } /* process3.html */ /* process4.html */ /* process4.html */