@media only screen and (min-width:768px){
.form h1{
    text-align: center;
    font-size: 20px;
    margin-bottom: 10px;
}
.section1{padding:30px 0;display:flex;justify-content:space-between;align-items:center}
section>.title{height:66px;display:flex;justify-content:space-between;align-items:center;font-size:20px}
section>.title>a{color:#999;font-size:14px}
section>.title>h2{display:flex;align-items:center;font-size:20px;font-weight:400}
.section2>.surname li{display:inline-block;height:60px;width:60px;background:url(../img/tian.png) no-repeat;background-size:100% 100%;line-height:60px;text-align:center;font-weight:700;font-size:30px;margin-right:13px;margin-bottom:20px}
.section2>.surname li:nth-of-type(13n){margin-right:0}
section>.article{padding:20px 0;display:flex}
section>.article .left{width:328px;border-right:1px solid #ebebeb;min-height:100px;flex-shrink:0;padding-right:10px}
section>.article .right{display:inline-block;width:658px;padding-left:10px;flex-shrink:0}
section>.article .right>.warp{display:inline-block;width:323px;vertical-align:top;border-bottom:1px solid #ebebeb;margin-bottom:20px}
section>.article .right>.warp:nth-of-type(n+3){border-bottom:0;margin-bottom: 0;}
section>.article .tap{height:24px;border-radius:6px;color:#7090a8;text-align:center;line-height:24px;margin-bottom:10px;font-size:12px;display:inline-block;padding:0 8px;font-size: 16px;font-weight: 700;}
.article .tap .iconfont{display:none}
section>.article ul{padding-bottom:10px}
section>.article .left .grapic{display:flex;margin-bottom:10px}
section>.article .left .grapic>a{margin-right:5px}
section>.article .left .grapic>div{display:flex;flex-direction:column;width: 100%;
    overflow: hidden;}
section>.article .left .grapic img{width: 110px;
    height: 80px;
    display: inline-block;
    border-radius: 4px;
    margin-right: 5px;}
section>.article .left .grapic>div>a{    color: #7a59c2;
    font-weight: 700;
    margin-bottom: 6px;
    font-size: 16px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;}
section>.article .left .grapic>div>span{color:#999;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:30px;width:190px;height:60px}
section>.article .left .up li,section>.article .right>.warp li{width:47%;display:inline-block;overflow:hidden;color:#666;font-size:14px;white-space:nowrap;padding-left:10px;position:relative;line-height:30px}
section>.article .right>.warp li{width:100%;line-height:30px;font-size: 16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
section>.article .left .down li{line-height:30px;color:#666;display:flex;align-items:center}
section>.article .left .down li i{width:32px;display:inline-block;height:32px;background:#d1d1d1;border-radius:50%;line-height:32px;text-align:center;color:#fff;font-size:24px;transform:scale(.5);flex-shrink:0}
section>.article .left .down li:nth-of-type(1) i{background:#c083ec}
section>.article .left .down li:nth-of-type(2) i{background:#e878a5}
section>.article .left .down li:nth-of-type(3) i{background:#71b5de}
section>.article .left .down li a{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:80%;font-size:16px;}
section>.article li a:hover{color:#2c74ab;text-decoration:underline}
.baby-icon,.book-icon{display:inline-block;width:30px;height:30px;background:url(../img/fenghuang.png) no-repeat;background-size:30px 30px;overflow:hidden;margin-right:10px}
#qiming-form input{background:#f3f3f3}
#qiming-form>p{text-align:center}
#qiming-form>p span{color:#ba4a57}
.a-warp,.b-warp,.c-warp{display:flex;height:45px;width:100%;background:#f3f3f3;margin-bottom:10px;border-radius:6px;align-items:center;padding:0 10px;font-size:16px}
.a-warp label>span,.b-warp label>span,.c-warp label>span{display:none}
.a-warp>label{width:140px}
.a-warp>div{display:flex}
.a-warp>div>label i{padding-left:18px;margin-right:10px;position:relative}
.a-warp>div>label i::before{content:'';width:16px;height:16px;position:absolute;left:0;top:50%;transform:translateY(-50%);background:#cecece;border-radius:50%}
.a-warp>div>label input:checked+i::before{content:'✓';background:#2f3a65;color:#fff;text-align:center;line-height:16px;font-size:12px}
.x-warp{width:100%;height:52px;background:url(../img/subbg.png) no-repeat;background-size:100% 100%;text-align:center;line-height:52px;font-size:18px;color:#fff;cursor:pointer;margin-bottom:10px}
.friend_link{background: #282828;
    color: #a5a5a5;
    line-height: 30px;
    font-size: 12px;}
.friend_link>div{
    display: flex;
    width: 1200px;
    margin: 0 auto;
    padding-bottom: 20px;
}
.friend_link>div a:hover{
    color: #fff;
}
.friend_link a{color:#a5a5a5;margin-left:10px}
.swiper-slide{position:relative}
.swiper-slide .text{position:absolute;top:0;left:0;height:30px;background:rgba(0,0,0,.4);color:#fff;text-align:center;width:100%;line-height:30px;font-size:16px}
.index-ceming-red .tit{line-height: 40px;font-size: 16px;}
.tools{width: 290px;height: 230px;border: 1px solid #7090a8;flex-shrink: 0;padding: 15px;}
.tools>div{display: flex;flex-wrap: wrap;justify-content: center;align-items: center;}
.tools a{color: #999;font-size: 12px;display: flex;align-items: center;line-height: 20px;flex-direction: column;width: 25%;margin-bottom: 10px;justify-content: center;}
.tools a img{display: inline-block;height: 40px;width: 40px;margin-bottom: 5px;}
.tools a:hover,.tools a:hover .iconfont{color: #7090a8;}
.tools a .iconfont{margin-right: 6px;font-size: 18px;color: #e4b06d;}
.section1 .swiper-container{margin-left:0;margin-right:0;}
}
.chachongming{
    text-align: center;
    line-height: 1.6;
}
.chachongming #surname{
    width: 60%;
    flex: 1;
}
.chachong_top {
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.chachong_top a{
    position: relative;
    left: -20px;
}
.chachong_top h1 {
    position: absolute;
    right: 0;
    top: 0;
    border-top-left-radius: 22px;
    border-bottom-right-radius: 22px;
    background-color: #EEE;
    font-size: 14px;
    color: #757575;
    padding: 12px 20px;
    transform: translateX(100%);
}
.chachongming form>label {
    display: flex;
    align-items: center;
    background: #FFFAE7;
    width: 400px;
    height: 44px;
    padding: 0 15px;
    border-radius: 20px;
    margin: 0 auto 20px;
    border: 1px solid #D8CA8D;
}
.chachongming .w-btn {
    background-image: -webkit-linear-gradient(0deg, #f7dfab 0, #E9B931 100%);
    color: #5E3F00;
    width: 400px;
    height: 40px;
    border-radius: 20px;
    display: block;
    margin: 20px auto 10px;
    font-size: 18px;
    cursor: pointer;
    line-height: 40px;
    text-align: center;
}
.chachongming .info {
    text-align: left;
    color: #999;
    margin-top: 30px;
    padding-bottom: 10px;
    border-bottom: 1px solid #ebebeb;
}
.num-total{
    margin-bottom: 20px;
}
.num-total span{
    color: #29a1f7;
    font-size: 14px;
}
.red-name a{
    color: #29a1f7;
    font-size: 14px;
    margin-right: 8px;
    cursor: pointer;
}

@media only screen and (max-width:768px){
.form .form-tab{
    text-align: center;
    font-size: 20px;
    margin-bottom: 30px;
    margin-top: 10px;
}
.chachongming{
    padding-top: 10px;
}
.chachong_top{
    padding-top: 20px;
}
.chachongming form>label{
   width: 300px; 
}
.chachongming .info{
    border-bottom: none;
}
.chachongming .w-btn {
    width: 300px;
}
.red-name{
    font-size: 13px;
}
.chachong_top h1{
    right: 73%;
    white-space: nowrap;
    top: -25px;
}
.tools{border: 1px solid #7090a8;flex-shrink: 0;padding: 15px;margin-bottom: 10px;}
.tools>div{display: flex;flex-wrap: wrap;align-items: center;}
.tools a{color: #999;font-size: 14px;display: flex;align-items: center;line-height: 20px;flex-direction: column;width: 25%;margin-bottom: 10px;justify-content: center;}
.tools a img{display: inline-block;height: 60px;width: 60px;margin-bottom: 5px;}
.tools a:hover{color: #7090a8;}
.tools a .iconfont{margin-right: 6px;font-size: 18px;color: #e4b06d;}
.swiper-container{margin-bottom:20px}
.swiper-slide{position:relative}
.swiper-slide .text{position:absolute;bottom:0;left:0;color:#fff;text-align:center;width:100%;line-height:20px;height:28%;font-size:16px;background-image:linear-gradient(-180deg,transparent,rgba(0,0,0,.8))}
section{padding:0 10px;border-bottom:8px solid #f8f8f8}
section a{color:#666;font-size:18px}
.section1{padding-top:10px}
.section1 .swiper-container{width:100%;height:160px;display: none;}
.section1 .swiper-container img{height:100%;width:100%}
.section1 .form{overflow:hidden}
.container section>.title{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #f8f8f8;height:46px;font-size:16px}
.container section>.title h2{font-size:18px;font-weight:400;display: flex;align-items: center;color: #caa456;}
.container section>.title>a{color:#caa456}
.section2>.surname{padding:10px 0;display:flex;flex-wrap: wrap;justify-content: space-between;}
.section2>.surname li{display:inline-block;height:40px;width:40px;background:url(../img/tian.png) no-repeat;background-size:100% 100%;line-height:40px;text-align:center;margin:5px 10px;}
.section2>.surname li a{color:#666;font-size:20px}
.section3 .line{display:none}
.article .tap a{font-size:18px;height:40px;line-height:40px;color: #caa456;font-weight:400}
.article .tap .iconfont{font-size:18px;margin-right:5px;color:#caa456}
.article li{height:50px;line-height:50px;border-bottom:1px dotted #ebebeb;    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;}
.grapic{display:flex;margin-bottom: 10px;}
.grapic>a img{width:100px;height:70px;margin-right:10px;border-radius: 4px;}
.grapic>div{padding-bottom:10px}
.grapic>div>a{display:block;margin-bottom:5px;}
.grapic>div>span{color:#c1c1c1;font-size:14px;line-height:1.6;display:inline-block;height:40px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.friend_link{display:none}
.index-ceming-red .tit{line-height: 30px;font-size: 16px;}
}
