* {
  padding: 0;
  margin: 0;
}

body {
  width: 100%;
  height: 100%;
  font-family: '微软雅黑', YaHei, tahoma, arial, "Hiragino Sans GB", '宋体';
  color: #333;
}

.main {
  background-color: #E9E9E9;
}

.banner {
  width: 100%;
  height: 642px;
  background-image: url(../images/sea001.png);
}

.banner_text1 {
  font-size: 56px;
  color: #fff;
  padding: 150px 0px 50px 250px;
  font-weight: 600;
}

.banner_text2 {
  font-size: 30px;
  color: #fff;
  padding: 10px 0px 10px 250px;
}

.banner_text3 {
  font-size: 30px;
  color: #fff;
  padding: 10px 0px 10px 250px;
}

.banner_text4 {
  font-size: 30px;
  color: #fff;
  padding: 0px 0px 10px 250px;
  display: flex;
  align-items: center;
}

.title {
  width: 100%;
  height: 72px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 73px;
}

.line {
  width: 200px;
  height: 1px;
  background-color: #C5C5C5;
}

.bg_title {
  background-color: #138CC5;
  width: 358px;
  height: 72px;
  line-height: 72px;
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  text-align: center;
  letter-spacing: 10px;
}

.bg_lil_title {
  width: 358px;
  height: 72px;
  line-height: 72px;
  color: #333;
  font-size: 20px;
  text-align: center;
  letter-spacing: 10px;
}

.lil_title {
  padding: 52px 0;
  font-size: 20px;
  color: #333;
  text-align: center;
  letter-spacing: 10px;
}

.show {
  height: 478px;
  display: flex;
  justify-content: space-between;
  padding: 0 258px;
}

.show_item {
  width: 264px;
  height: 443px;
  box-sizing: border-box;
  padding-bottom: 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  cursor: pointer;
  opacity: 0;
}

.show_item_text {
  text-align: center;
  color: #666;
  font-size: 20px;
}

.show_item_img{
  width: 139px;height: 243px;
}

.example {
  height: 398px;
  display: flex;
  justify-content: space-between;
  padding: 64px 258px 54px;
}

.example_item {
  width: 412px;
  height: 443px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  opacity: 0;
}

.example_item_text {
  text-align: center;
  color: #666;
  font-size: 20px;
}

.app_item {
  width: 264px;
  height: 443px;
  box-sizing: border-box;
  padding-bottom: 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  cursor: pointer;
}

.app_item_text {
  text-align: center;
  color: #666;
  font-size: 20px;
  letter-spacing: 7px;
}

.service-item {
  width: 600px;
  height: 260px;
  line-height: 260px;
  text-align: center;
  margin-top: 20px;
  cursor: pointer;
  transition: all 0.5s ease 0s;
}

.service-item-text {
  color: #fff;
  font-size: 20px;
}

.service-item:hover {
  transform: scale(0.96);
}

.service-item:hover .service-item-text {
  font-weight: 600;
  font-size: 24px;
}

.idea-item {
  width: 260px;
  height: 260px;
  text-align: center;
  margin-top: 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  cursor: pointer;
  transition: all 0.5s ease 0s;
}

.idea-item_p1 {
  color: #666;
  font-size: 20px;
  font-weight: 600;
}

.idea-item_p2 {
  color: #333333;
  font-size: 18px;
}

.app_item_img{
  width: 139px;height: 243px;
}

.app_item_img:hover {
  width: 159px;
  height: 263px;
}

.show_item_img:hover {
  width: 159px;
  height: 263px;
}

.value {
  width: 100%;
  height: 642px;
  background-image: url(./images/14.png);
}

.value_text1 {
  font-size: 42px;
  color: #FFF;
  padding-left: 200px;
  padding-top: 150px;
  font-weight: bold;
  cursor: pointer;
  transition: all 0.5s ease 0s;
}

.value_text1:hover {
  font-size: 48px;
}

.value_text2:hover {
  font-size: 40px;
}

.value_text3:hover {
  font-size: 40px;
}

.value_text2 {
  font-size: 32px;
  color: #FFF;
  padding-left: 200px;
  padding-top: 100px;
  cursor: pointer;
  transition: all 0.5s ease 0s;
}

.value_text3 {
  font-size: 32px;
  color: #FFF;
  padding-left: 200px;
  padding-top: 100px;
  cursor: pointer;
  transition: all 0.5s ease 0s;
}

.left {
  line-height: 2;
  color: #666;
  font-size: 20px;
  padding-top: 100px;
  opacity: 0;
}

.left_text{
  background-color: #eee;
  border-radius: 24px;
  padding: 80px 20px;
}

.right {
  opacity: 0;
}



/* mobile */
.sea_phone_banner{
  width: 100%;
  height: 8.4844rem;
  background: url(../images/seaphone001.png) no-repeat;
  background-size: cover;

}

.sea_phone_main{
  background-color: #E9E9E9;
}

.banner_txt1{
  color: #fff;
  font-weight: bold;
  font-size: 1.25rem;
  padding-top: .9375rem;
  padding-bottom: .625rem;
  padding-left: 3.125rem;
}

.banner_txt2{
  color: #fff;
  font-size: .75rem;
  padding-bottom: .3125rem;
  padding-left: 3.125rem;
  display: flex;
  align-items: center;
}

.big_title{
  padding: 1.25rem 0;
  padding-bottom: 0;
  display: flex;
  justify-content: center;
  background-color: #fff;
}

.big_title_text{
  width: 9.425rem;
  height: 1.9825rem;
  line-height: 1.9825rem;
  text-align: center;
  background-color: #047FBB;
  color: #fff;
}

.little_title{
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.25rem 0 1.25rem;
}

.little_title_text{
  width: 9.425rem;
  height: 1.9825rem;
  line-height: 1.9825rem;
  text-align: center;
  color: #333333;
}

.seaphone_line{
  background-color: #C5C5C5;
  height: .0625rem;
  width: 3.375rem;
}

.seaphone_show{
  background-color: #fff;
  display: flex;
  flex-wrap: wrap;
  padding: 0 1.5rem;
}

.seaphone_show_item{
  width: 33.3%;
  height: 9.375rem;
  padding-bottom: .625rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.seaphone_show_item_img{
  width: 3.8675rem;
  height: 7.2475rem;
}

.seaphone_show_item_text{
  font-size: .625rem;
  color: #666;
  text-align: center;
}

.seaphone_app_show{
  background-color: #fff;
  display: flex;
  justify-content: space-between;
  padding: 0 1.5rem;
  align-items: center;
  padding-bottom: 1.25rem;
}

.seaphone_app_show_left{
  background-color: #eee;
  width: 55%;
  height: 7.995rem;
  font-size: .75rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: .75rem;
  padding: .3125rem .3125rem;
}

.seaphone_app_show_right{
  width: 30%;
  height: 12.48rem;
}

.argument{
  background-color: #fff;
  padding: 0 1.5rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.argument_item{
  display:flex;
  text-align: center;
  align-items: center;
  width: 40%;
  padding: 0 .625rem;
  height: 3.9rem;
  margin-bottom: .625rem;
  color: #fff;
  font-size: .5rem;
}

.seaphone_idea{
  background-color: #fff;
  display: flex;
  justify-content: space-between;
  padding-bottom: 4.25rem;
}

.seaphone_idea_item{
  width: 25%;
  height: 8.5rem;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
}

.seaphone_idea_item_img{
  width: 4.55rem;
  height: 4.225rem;
}

.seaphone_idea_item_text1{
  font-size: 1rem;
  font-weight: bold;
  text-align: center;
}

.seaphone_idea_item_text2{
  font-size: .625rem;
  text-align: center;
  letter-spacing: .1875rem;
}