@charset "utf-8";

* {
  margin: 0;
  padding: 0;
}

:focus {
  outline: 0 !important;
}

body {
  margin: 0;
  width: 100%;
  font-size: 14px;
  /*background:#F9F9F9;*/
  font-family: 'Microsoft YaHei', '微软雅黑';
  min-width: 1200px;
}





/* telephone */
.blue {
  background: url("/Shared/images/homev1/indexv1/lefttop.png") no-repeat left bottom;
  text-align: left;
  padding-bottom: 30px;
  position: relative;
  padding-left:80px;
}
.blue .bgline{
  position: absolute;
  bottom:0;
  left:0;
}
.blue .layout{
  padding: 40px 80px 0 80px;
}
.blue h3 {
  line-height: 78px;
  color: #fff;
  
}

.blue p {
  color: #fff;
  font-weight: bold;
 
}
.telephone {
  padding-top: 60px;
  padding-bottom: 60px;
  background: url("/Shared/images/homev1/indexv1/lefttop.png") no-repeat left bottom;
  position: relative;
}
.telephone .bgline{
  position: absolute;
  bottom:0;
  left:0;
}
.telephonebox {
  width: 1044px;
  height: 520px;
  margin: 0px auto;
  position: relative;

}

.telephone .layout {}

.telephone .telup {
  position: absolute;
  right: -40px;
  top: 80px;
}

.telephone .telup .telbottom {
  text-align: right;
  color: #fff;
  margin-top: 40px;
  font-weight: bold;
}

.telephone .telup p .right {
  color: #ff2045;
}

.telephonebox .telimgbox {
  width: 870px;
  height: 480px;
  position: absolute;
  left: 45PX;
  top: 0;
  background: url("/Shared/images/homev1/userstoryv1/userstory1.png") no-repeat center;
  background-size:100% 100%;
}

.telephonebox .telright {
  /* margin-top:84px;
  margin-left:395px; */


}

.telephonebox .telright p {
  color: #fff;
  text-align: right;
}

.telephonebox .telright p span {
  /* float:right; */
}

.telephonebox .telright p .right {
  color: #ff2045;
  margin-right: 20px;
}

.telephonebox .telright p .bottom {
  color: #333;
  margin-left: 100px;
}

.telephonebox .telimgbox .telbottom {
  text-align: right;
  margin-top: 40px;
  margin-right: -145px;
  color: #fff;
}

.telephonebox .telimgbox .telbottom span {
  color: #ff2045;

}

.telephonebox .zero {
  position: absolute;
  bottom: 0;
  right: 130px;
  color: #fff;
  /* font-size:20px; */
}

.telephone .telbottom .amore {
  display: block;
  color: #fff;
  text-align: center;
  height: 44px;
  width: 176px;
  border: 2px solid #fff;
  border-radius: 5px;
  background: #1368ce;
  font-size: 16px;
  line-height: 46px;
  box-shadow: 0px -5px #115db9 inset;
  margin: 60px auto 100px;
  margin-right: 0;
}

.telephone .telbottom .amore:hover {
  box-shadow: none;
  background: #fff;
  color: #333;
}
.telephone .telbottom .contentmiddle{
  background: #79C061;
    box-shadow: 0px -5px #5cac34 inset;
}

/* 课件常见问题部分 */
.phone {
  text-align: center;
}

.phone p {
  margin-top: 30px;
  width: 910px;
  margin: 0 auto;
}

.phoneul {
  margin-top: 80px;
  width: 1000px;

}

.phoneul li {
  display: flex;
  justify-content: space-evenly;
  margin-bottom: 40px;
  align-items: center;

}

.phoneul li .lileft h3 {
  position: relative;
}

.phoneul li .describe {
  background: #44a2e5;
  border-radius: 5px;
  box-shadow: 1px 3px 5px rgba(0, 0, 0, .2);
  padding: 13px;
  position: absolute;
  left: 0;
  top: 45px;
  color: #fff;
  z-index: 1;
  display: none;

}

.phoneul .lileft .describe .triangle {
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  border-bottom: 10px solid #44a2e5;
  position: absolute;
  top: -10px;
  left: 30px;
}

.phoneul h3.bottom:hover .describe {
  display: block;
}







.phoneul .liright {
  width: 450px;
  height: 300px;
}

.phoneul .liright img {
  width: 450px;
  height: 300px;
  object-fit: contain;
  border-radius: 5px;
}

.phoneul .lileft1 {
  width: 450px;
}



.phoneul .lileft p.bottom {
  color: #333;
  position: relative;
 
}

.phoneul .lileft .p1 {

  color: #44a2e5;
}

.phoneul .lileft .p2 {

  color: #ffa602;
}

.phoneul .lileft .p3 {

  color: #79c061;
}

.phoneul .lileft .p4 {

  color: #333;
}

.phoneul .lileft .p5 {

  color: #33cccc;
}

.phoneul .lileft p.last {
  width: 254px;
}

.moreul {
  display: flex;
  text-align: center;
  justify-content: space-evenly;
}

.moreul .imgbox1 {

  text-align: center;
}

.moreul .imgbox1 img {
  width: 120px;
  height: 120px;
  object-fit: cover;
}

/* teamlogo */
.teamlogo {
  text-align: center;
}

.teamlogo img {
  width: 60px;
  height: 60px;
}

.teamgreen {
  color: #fff;
  text-align: center;
  overflow: hidden;
  background: #864cbf;
  background-image: url(/Shared/images/homev1/solutionv1/leftbottom.png), url(/Shared/images/homev1/solutionv1/lefttop.png);
  background-position: left top, left bottom;
  background-repeat: no-repeat no-repeat;
}

.teamgreen h3 {
  line-height: 50px;
  text-align: center;
  margin: 24px auto 36px;
}

.teamgreen a {
  display: block;
  color: #fff;
  text-align: center;
  height: 44px;
  width: 176px;
  border: 2px solid #fff;
  border-radius: 5px;
  background: #1368ce;
  font-size: 16px;
  line-height: 46px;
  box-shadow: 0px -5px #115db9 inset;
  margin: 60px auto 100px;
}

.teamgreen a:hover {
  box-shadow: none;
  background: #fff;
  color: #333;
}

.bgpublic {
  color: #fff;
  text-align: center;
  overflow: hidden;
  background: #66bf3a;
  background-image: url(/Shared/images/homev1/solutionv1/leftbottom.png), url(/Shared/images/homev1/solutionv1/righttop.png);
  background-position: left top, left bottom;
  background-repeat: no-repeat no-repeat;
}
.bgpublic1{
  background: #ffa602;
  background-image: url(/Shared/images/homev1/solutionv1/leftbottom.png), url(/Shared/images/homev1/solutionv1/righttop.png);
    background-position: left top, left bottom;
    background-repeat: no-repeat no-repeat;

}
.bgpublic2{
  background: #33cccc;
  background-image: url(/Shared/images/homev1/solutionv1/leftbottom.png), url(/Shared/images/homev1/solutionv1/righttop.png);
    background-position: left top, left bottom;
    background-repeat: no-repeat no-repeat;

}
.bgpublic h3 {
  text-align: center;
 
}

.bgpublic a {
  display: block;
  color: #fff;
  text-align: center;
  height: 44px;
  width: 176px;
  border: 2px solid #fff;
  border-radius: 5px;
  background: #1368ce;
  font-size: 16px;
  line-height: 46px;
  box-shadow: 0px -5px #115db9 inset;
  margin: 40px auto 60px;
}

.bgpublic a:hover {
  box-shadow: none;
  background: #fff;
  color: #333;
}
 a.contentmiddle{
  background:#79C061;
  box-shadow: 0px -5px #5cac34 inset;
}
.bgpublic a.contentmiddle:hover {
  box-shadow: none;
  background: #fff;
  color: #333;
}
.flex{
  display:flex;
  justify-content: space-between;
  align-items: center;
}
.flex .gametextdetail{
  display:block;
}