pfhwyigou/frontend/web/overseas/css/lp_list.css

body{background:#F4F7FA;}

/*导航*/
#nav{color:#43A6F5;}

.m_nav_box{width:1200px;overflow:hidden;margin:auto;margin-top:30px;background:#FFF; padding: 30px 0 15px;}
.m_nav_qy{margin-bottom:20px;}
.m_nav_qy:last-child{border-bottom:0px;}
.m_nav_qy_l{width:145px;float:left;text-align:center;}
.m_nav_qy_l em{font-size:14px;color:#333;font-weight:bold;position:relative;}
.m_nav_qy_l a{font-size:14px;margin:10px;position:relative;left:16px;border-radius:3px;color:#333;}
.m_nav_qy_list{width:1040px;float:left;}
.m_nav_qy_list a{font-size:14px;color:#737373;margin:0px 24px 10px 0;display:block;float:left;border-radius:3px;}
.m_nav_qy a:hover {color:#43A6F5;}
.m_nav_qy_listsf{ margin-bottom: 15px;}
.m_nav_qy_listsf i{display:inline-block; width:11px; height: 5px; margin-left: 5px; background: url('/overseas/img/ico_Dn.png') no-repeat center;}
.m_nav_qy_listsf a:hover i{background: url('/overseas/img/ico_Dn_2.png') no-repeat center;}
.m_nav_qy_listsf a#nav i{background: url('/overseas/img/ico_Up.png') no-repeat center; position: relative; top: -2px;}
.m_nav_qy_listsjs{ background: #EAECF6; height: auto; width: 1015px; margin: 0 auto; position: relative; left: 50px;}
.m_nav_qy_listsjs a{font-size:14px;color:#737373;margin:0px 24px 10px 0;display:block;float:left;border-radius:3px;}
.m_nav_qy_listsjs2{
    background: #fff;
    left: 0px;
    width: 910px;
}
.yv2_selected{
  display: none;
  border-top: 1px dashed #eee;
  padding-top: 15px;
  display: -webkit-flex; /* Safari */
  display: flex;
  justify-content:flex-start;
  align-items:center;
}
.yv2_selected .yv2_selected_main{
  font-size: 16px;
  color: #555;
  margin-left: 30px;
}
.yv2_selected .yv2_selected_cnter{
  display: -webkit-flex; /* Safari */
  display: flex;
  justify-content:flex-start;
  align-items:center;
  margin-left: 25px;
}
.yv2_selected .yv2_selected_cnter .yv2_selected_list{
  display: -webkit-flex; /* Safari */
  display: flex;
  justify-content:flex-start;
  align-items:center;
}
.yv2_selected .yv2_selected_cnter .yv2_selected_list a{
  display: inline-block;
  border:1px dashed #F88627;
  font-size: 14px;
  color: #F88627;
  border-radius: 4px;
  display: -webkit-flex; /* Safari */
  display: flex;
  align-items:center;
  height: 26px;
  padding: 0 7px;
  background: #fff;
}
.yv2_selected .yv2_selected_cnter .yv2_selected_list a i{
  display: inline-block;
  margin-left: 5px;
}
.yv2_selected .yv2_selected_cnter .yv2_selected_list a+a{
  margin-left: 10px;
}
.yv2_selected .yv2_selected_cnter .yv2_selected_right{
  margin-left: 22px;
}
.yv2_selected .yv2_selected_cnter .yv2_selected_right a{
  display: -webkit-flex; /* Safari */
  display: flex;
  align-items:center;
  font-size: 14px;
  color: #507DAF;
}
.yv2_selected .yv2_selected_cnter .yv2_selected_right img{
  width: 18px;
  height: 18px;
  display: inline-block;
  margin-right: 3px;
}
/*排序*/
.m_sort{width:1200px;height:50px;margin:auto;margin-top:30px;background:#FFF;position:relative; border-bottom: 1px solid #43A6F5;}
.m_sort ul{float:left;}
.m_sort ul li{width:110px;height:50px;float:left;text-align:center;line-height:50px;font-size:16px;color:#444;cursor:pointer;}
.m_sort .m_sort_gs{font-size:14px;color:#666;float:right;display:block;line-height:50px;margin-right:20px;}
.m_sort .m_sort_gs i{color:#FF5849;}
.m_sort ul li:hover{background:#43A6F5;color:#fff;}
.m_sort ul li.sort{background:#43A6F5;color:#fff;}

.m_sort_jg{width:110px;overflow:hidden;position:absolute;top:50px;left:110px;background:#FFF;z-index:1;display:none;}
.m_sort_jg span{display:block;line-height:50px;font-size:14px;color:#666;text-align:center;cursor:pointer;}
.m_sort_jg span:hover{background:#43A6F5;color:#fff;}
.yv2_map{
  margin-left: 20px;
  height: 50px;
  display: -webkit-flex; /* Safari */
  display: flex;
  align-items:center;
}
.yv2_map a{
  display: -webkit-flex; /* Safari */
  display: flex;
  align-items:center;
  font-size: 16px;
  color: #333;
}
.yv2_map a img{
  width: 20px;
  height: 20px;
  display: inline-block;
  margin-right: 5px;
}
.yv2_map:hover{
  background: none;
}


/* v2 改版 列表 */

.m_lp_box{
  width:1200px;
  margin:auto;
  margin-top:30px;
  display: -webkit-flex; /* Safari */
  display: flex;
  justify-content:space-between;
  align-items:flex-start;
}
.m_lp_list{
  width:880px;
}
.m_lp_list li{
  width:880px;
  background:#FFF;
  padding: 25px 0 15px;
  margin-bottom: 30px;
}
.m_lp_list li:hover{
  box-shadow: 0px 0px 10px 0px rgba(124, 124, 124, 0.3);
}
.m_lp_list li:hover .lpright_text .lpright_text_l p.title a{
  color: #01A4FE;
}
.m_lp_list li .list_main{
  display: -webkit-flex; /* Safari */
  display: flex;
  justify-content:flex-start;
  align-items:flex-start;
  width: 100%;
}
.m_lp_list li .lpleft_img{
  width: 285px;
  height: 208px;
  margin-left: 20px;
  position: relative;
  background: #f9f9f9;
}
.m_lp_list li .lpleft_img p.lpico,.m_lp_list li .lpleft_img p.lpico img{
  width: 100%;
  height: 100%;
}
.m_lp_list li .lpleft_img p.city{
  position: absolute;
  z-index: 2;
  right: 8px;
  top: 8px;
  background: rgba(0,0,0,0.5);
  font-size: 12px;
  color: #fff;
  height: 20px;
  line-height: 20px;
  padding: 0 10px;
  border-radius: 10px;
}
.m_lp_list li .lpleft_img p.video_ico{
  display: -webkit-flex; /* Safari */
  display: flex;
  justify-content:flex-start;
  align-items:center;
  position: absolute;
  left: 10px;
  bottom: 10px;
  z-index: 2;
}
.m_lp_list li .lpleft_img p.video_ico i{
  width: 32px;
  height: 32px;
  display: inline-block;
}
.m_lp_list li .lpleft_img p.video_ico i+i{
  margin-left: 8px;
}
.m_lp_list li .lpleft_img p.video_ico i img{
  width: 100%;
  height: 100%;
}
.m_lp_list li .lpleft_img .sdin {
  width:54px;
  height:54px;
  background:rgba(0,0,0,0.3);
  position: absolute;;
  border-radius:50%;
  margin-top:8px;
  left: 50%;
  top: 50%;
  margin-left: -27px;
  margin-top: -27px;
  border:2px solid #fff;
  z-index: 2;
}
.m_lp_list li .lpleft_img .vvid_pic_ico {
  border-radius: 100%;
  width:100%;
  height:100%;
  background: url(/overseas/img/vr_animation.png);
  background-position-y: 0;
  background-repeat: no-repeat;
  background-size: 100%;
}
.m_lp_list li .lpleft_img .vr-animation-forever { 
  -webkit-animation:vr 5s steps(80) infinite;
  animation:vr 5s steps(80) infinite;
}
@-webkit-keyframes vr {to{background-position-y:100%}}
@keyframes vr {to{background-position-y:100%}}

.m_lp_list li .lpright_text{
  margin-left: 20px;
  position: relative;
  width: 530px;
  height: 205px;
}
.m_lp_list li .lpright_text .lpright_text_l{
  width: 370px;
}
.m_lp_list li .lpright_text .lpright_text_l p.title{
  display: -webkit-flex; /* Safari */
  display: flex;
  justify-content:flex-start;
  align-items:center;
}
.m_lp_list li .lpright_text .lpright_text_l p.title a{
  font-size: 22px;
  color: #333;
  font-weight: bold;
  max-width: 290px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.m_lp_list li .lpright_text .lpright_text_l p.title span{
  font-size: 12px;
  height: 20px;
  line-height: 20px;
  background: #3882D2;
  color: #fff;
  border-radius: 2px;
  padding: 0 5px;
  margin-left: 7px;
}
.m_lp_list li .lpright_text .lpright_text_l p.lp_puic{
  display: -webkit-flex; /* Safari */
  display: flex;
  justify-content:flex-start;
  align-items:center;
  margin-top:13px;
}
.m_lp_list li .lpright_text .lpright_text_l p.lp_puic i{
  display: inline-block;
  height: 20px;
  height: 20px;
  margin-right: 10px;
}
.m_lp_list li .lpright_text .lpright_text_l p.lp_puic i img{
  width: 100%;
  height: 100%;
}
.m_lp_list li .lpright_text .lpright_text_l p.lp_puic span{
  font-size: 14px;
  color: #666;
  max-width: 250px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.m_lp_list li .lpright_text .lpright_text_l p.lpzk span{
  color: #FF5849;
}
.m_lp_list li .lpright_text .lpright_text_l p.lpzk a{
  display: inline-block;
  font-size: 12px;
  color: #fff;
  background: #FF5849;
  height: 24px;
  line-height: 24px;
  border-radius: 4px;
  padding: 0 10px;
  margin-left: 10px;
}
.m_lp_list li .lpright_text .lpright_text_l p.lphx span{
  width: 315px;
}
.m_lp_list li .lpright_text .lpright_text_l p.lpdiz a{
  display: -webkit-flex; /* Safari */
  display: flex;
  align-items:center;
  font-size: 14px;
  color: #4AA9F5;
}
.m_lp_list li .lpright_text .lpright_text_l p.lpdiz a img{
  display: inline-block;
  width: 20px;
  height: 20px;
}
.m_lp_list li .lpright_text .lpright_text_l .lptell_main{
  display: -webkit-flex; /* Safari */
  display: flex;
  align-items:center;
  justify-content:flex-start;
  margin-top:13px;
}
.m_lp_list li .lpright_text .lpright_text_l .lptell_main .lptell_main_l{
  display: -webkit-flex; /* Safari */
  display: flex;
  align-items:center;
}
.m_lp_list li .lpright_text .lpright_text_l .lptell_main .lptell_main_l img{
  width: 20px;
  height: 20px;
  display: inline-block;
}
.m_lp_list li .lpright_text .lpright_text_l .lptell_main .lptell_main_l span{
  font-weight: bold;
  font-size: 18px;
  color: #43A6F5;
  margin-left: 10px;
}
.m_lp_list li .lpright_text .lpright_text_l .lptell_main .lptell_main_r{
  position: relative;
  margin-left: 12px;
}
.m_lp_list li .lpright_text .lpright_text_l .lptell_main .lptell_main_r .lptell_main_r_main a{
  display: -webkit-flex; /* Safari */
  display: flex;
  align-items:center;
  font-size: 14px;
  color: #555;
  font-weight: bold;
}
.m_lp_list li .lpright_text .lpright_text_l .lptell_main .lptell_main_r .lptell_main_r_main a:hover{
  color: #43A6F5;
}
.m_lp_list li .lpright_text .lpright_text_l .lptell_main .lptell_main_r .lptell_main_r_main a img{
  width: 20px;
  height: 20px;
  display: inline-block;
  margin-right: 5px;
}
.lptell_main .lptell_main_show{
  display: none;
  position: absolute;
  background: #fff;
  width: 120px;
  height: auto;
  right: 0px;
  top: 30px;
  z-index: 5 !important;
  padding-top: 2px;
  box-shadow: 0px 0px 10px 3px rgba(187, 186, 186, 0.34);
}
.lptell_main .lptell_main_show p.ewm_main{
  width: 90px;
  height: 90px;
  margin: 0 auto;
  background: #ccc;
  margin-top: 10px;
  display: block;
}
.lptell_main .lptell_main_show p.text{
  text-align: center;
  font-size: 12px;
  color: #999;
  line-height: 18px;
  padding: 5px 0 10px;
}
.lptell_main .lptell_main_show p.text i{
  display:block;
}
.lptell_main_show:after{
  position: absolute;
  right: 50%;
  margin-left: -3.5px;
  top: -7px;
  content: " ";
  width: 0;
  height: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-bottom: 7px solid #fff;
  z-index: 2;
}
.m_lp_list li .lpright_text .lpright_text_l .style{
  margin-top: 13px;
  display: -webkit-flex; /* Safari */
  display: flex;
  align-items:center;
}
.m_lp_list li .lpright_text .lpright_text_l .style i{
  display: inline-block;
  font-size: 12px;
  color: #507DAF;
  background: #EEF3F9;
  height: 24px;
  line-height: 24px;
  border-radius: 2px;
  padding: 0 10px;
}
.m_lp_list li .lpright_text .lpright_text_l .style i+i{
  margin-left: 10px;
}

.m_lp_list li .lpright_text .lpright_text_r{
  position: absolute;
  right: 0px;
  top: 0px;
  z-index: 2;
  text-align: center;
}
.m_lp_list li .lpright_text .lpright_text_r .lppric_main p.lppric{
  font-size: 12px;
  color: #FF3131;
}
.m_lp_list li .lpright_text .lpright_text_r .lppric_main p.lppric span{
  display: inline-block;
  font-size: 24px;
  font-weight: bold;
}
.m_lp_list li .lpright_text .lpright_text_r .lppric_main p.lptime{
  font-size: 12px;
  color: #999;
  margin-top: 10px;
}
.m_lp_list li .lpright_text .lpright_text_r .lpzx_main{
  margin-top: 30px;
}
.m_lp_list li .lpright_text .lpright_text_r .lpzx_main p.ico_top{
  width: 74px;
  height: 74px;
  background: radial-gradient(circle, #FFFFFF 0%, #D0DDE8 100%);
  border-radius: 100%;
  overflow: hidden;
  margin: 0 auto;
}
.m_lp_list li .lpright_text .lpright_text_r .lpzx_main p.ico_top img{
  width: 100%;
  height: auto;
}
.m_lp_list li .lpright_text .lpright_text_r .lpzx_main  a{
  display: inline-block;
  margin-top: 5px;
  width: 94px;
  height: 30px;
  line-height: 30px;
  font-size: 12px;
  color: #fff;
  text-align: center;
  background: linear-gradient(90deg, #01A4FE 0%, #2BC0F8 100%);
  border-radius: 4px;
}

.yv2List_news{
  margin:0 20px;
  margin-top: 14px;
  display: -webkit-flex; /* Safari */
  display: flex;
  align-items:center;
  justify-content:flex-start;
  font-size: 0;
  background: #fff;
}
.yv2List_news span{
  background: #F9EFEA;
  font-size: 15px;
  color: #B4765A;
  font-weight: bold;
  width: 108px;
  text-align: center;
  border:1px solid #eee;
  border-right: none;
  height: 32px;
  line-height: 32px;
}
.yv2List_news a h2{
  font-size: 15px;
  color: #666;
  font-weight: normal;
  padding: 0 20px;
  border:1px solid #eee;
  border-left: none;
  height: 32px;
  line-height: 32px
}
.yv2List_news a:hover h2{
  color: #01A4FE;
}





/*广告图*/
.m_lp_list_gg{width:880px;height:100px;position:relative;margin-bottom:30px;}
.m_lp_list_gg img{width:100%;height:100%;}
.m_lp_list_gg .m_lp_list_gg_form{width:365px;height:47px;background:#FFF;border-radius:25px;position:absolute;top:27px;right:20px;overflow:hidden;}
.m_lp_list_gg .f_input{width:250px;height:47px;border:0;margin-left:15px;outline:none;font-size:15px;color:#72423E;float:left;}
.m_lp_list_gg .f_submit{float:right;width:99px;height:37px;background:#F88627;border-radius:25px;border:0;outline:none;font-size:15px;color:#FFF;position:relative;top:5px;right:5px;}


/*分页*/
.m_lp_list .page_list{width: 880px; height: auto; text-align: center; margin: 0 auto; }
.m_lp_list .page_list ul {width: 100%; height: auto; display: flex;justify-content: center;align-items: center;}
.m_lp_list .page_list li{width: auto; height: auto;margin-bottom:0;box-shadow:none;padding: 0; }
.m_lp_list .page_list .pagination > li > a,.m_lp_list .page_list .pagination > li > span {
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #337ab7;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;
}
.m_lp_list .page_list  .pagination > li > a:hover,.m_lp_list .page_list .pagination > li > span:hover,.m_lp_list .page_list .pagination > li > a:focus, .m_lp_list .page_list .pagination > li > span:focus {
    z-index: 2;
    color: #23527c;
    background-color: #eee;
    border-color: #ddd;
}

.m_lp_list .page_list .pagination > .active > a, .m_lp_list .page_list .pagination > .active > span, .m_lp_list .page_list .pagination > .active > a:hover, .m_lp_list .page_list .pagination > .active > span:hover, .m_lp_list .page_list .pagination > .active > a:focus, .m_lp_list .page_list .pagination > .active > span:focus {
    z-index: 3;
    color: #fff;
    cursor: default;
    background-color: #337ab7;
    border-color: #337ab7;
}


/*右边*/
.m_lp_r{
  width:290px;
}

.listHothome{
  width: 100%;
  height: auto;
}
.listHothome_title{
  display: -webkit-flex; /* Safari */
  display: flex;
  align-items:center;
  justify-content:flex-start
}
.listHothome_title i{
  display: inline-block;
  width: 4px;
  height: 20px;
  background: #43A6F5;
  border-radius: 0px 2px 2px 0px;
}
.listHothome_title span{
  display: inline-block;
  font-size: 18px;
  color: #333;
  font-weight: bold;
  margin-left: 10px;
}
.listHothome_main{
  margin-left: 10px;
}
.listHothome_main ul li{
  margin-top: 20px;
}
.listHothome_main ul li .top_texzt{
  display: -webkit-flex; /* Safari */
  display: flex;
  align-items:center;
  justify-content:flex-start
}
.listHothome_main ul li .top_texzt i{
  display: inline-block;
  font-size: 14px;
  color: #fff;
  background: #CACACA;
  width: 17px;
  height: 17px;
  border-radius: 100%;
  line-height: 17px;
  text-align: center;
}
.listHothome_main ul li:nth-child(1) .top_texzt i{
  background: #FE2C45;
}
.listHothome_main ul li:nth-child(2) .top_texzt i{
  background: #FF6500;
}
.listHothome_main ul li:nth-child(3) .top_texzt i{
  background: #FBA90E;
}
.listHothome_main ul li .top_texzt span{
  display: inline-block;
  font-size: 14px;
  color: #2D2D2D;
  width: 105px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-left: 5px;
}
.listHothome_main ul li .top_texzt em{
  font-size: 14px;
  color: #666;
  display: inline-block;
  margin-left: 10px;
}
.listHothome_main ul li .top_texzt b{
  font-size: 14px;
  color: #FF5849;
  font-weight: normal;
  display: inline-block;
  margin-left: 10px;
}
.listHothome_main ul li .bot_img{
  width: 100%;
  height: 148px;
  margin-top: 13px;
  display: none;
}
.listHothome_main ul li .bot_img img{
  width: 100%;
  height: 100%;
}
.listHothome_main ul li:nth-child(1) .bot_img{
  display: block;
}
.listHothome_main ul li:hover .top_texzt span{
  color: #43A6F5;
}
.yv2_customization{
  margin-top: 30px;
  border: 1px solid #E8EDF1;
  background: #F8FAFC;
  padding-top: 25px;
}
.yv2_customization_Box{
  width: 258px;
  margin: 0 auto;
  margin-top: 20px;
}
.yv2_customization_Box .yv2_maing_text p{
  font-size: 14px;
  color: #666;
  line-height: 18px;
}
.yv2_customization_Box .yv2_customization_form{
  margin-top: 25px;
}
.yv2_customization_Box .yv2_customization_form input.in_text{
  width: 245px;
  height: 40px;
  font-size: 14px;
  color: #666;
  background: #E9EEF2;
  border-radius: 4px;
  border:none;
  padding-left: 13px;
  margin-bottom: 14px;
}
.yv2_customization_Box .yv2_customization_form a.in_buttom{
  display: block;
  height: 40px;
  line-height: 40px;
  border-radius: 4px;
  text-align: center;
  font-size: 14px;
  color: #fff;
  background: #FF5849;
}
.yv2_customization_ico{
  width: 258px;
  height: auto;
}
.yv2_customization_ico img{
  width: 100%;
  height: 100%;
}