﻿.WorldCupRules{ width: calc(100% - 320px); margin-left: 20px;display:inline-block;float:right;}
.WorldCupRules .rules-Div{background:#fff;padding:34px 80px 0;border-radius: 6px;border: 1px solid #E8E8E8;margin-bottom:40px}
.WorldCupRules .title{width:100%;padding-bottom:10px;border-bottom:1px solid #AAA;margin-bottom:25px}
.WorldCupRules .title h1{color: #000;font-family:DroidBold, arial;font-size: 20px;display:flex;align-items:center}
.WorldCupRules .title h1:before{content:'';display:inline-block;width: 33px;height: 50px;background:url(../Images/worldCup26.svg) no-repeat center center;background-size:100%;margin-left:20px}
.WorldCupRules .title h1 .number{margin-right:5px}
.WorldCupRules .number{display:inline-block;font-family:ykLight;font-weight:700}


.WorldCupRules .rules-content{display: flex;flex-direction: column;}
.WorldCupRules .rules-content p{color: #000;text-align: right;font-family: DroidLight, arial;font-size: 14px;line-height: 28px;margin-bottom:20px}
.WorldCupRules .rules-content .customMargin{margin-bottom:16px}
.WorldCupRules .rules-content .bold{font-family:DroidBold, arial;font-weight:700}
.WorldCupRules .rules-content h2{width:100%;height:48px;border-radius: 6px;background: #F2F2F2;padding: 0 12px;display:flex;align-items:center;margin-top:20px;color: #000;font-family: DroidBold, arial;font-size: 16px;font-weight:700;margin-bottom:20px}
.WorldCupRules .rules-content ul {   list-style: disc;padding-right: 16px;}
.WorldCupRules .rules-content ul li{    list-style: disc;color: #000;font-family: DroidLight, arial;font-size: 14px;line-height: 28px;}
.WorldCupRules .rules-content ul li::marker{font-size:10px;font-family: DroidLight, arial}
.WorldCupRules .rules-content ul li .secondUl {margin-top:16px}
.WorldCupRules .rules-content ul li .secondUl li{margin-bottom:10px}
.WorldCupRules .rules-content ul li .secondUl li p{margin-bottom:0 ;    display: inline-block;}

.showcaseDiv .adTtl:not(.divVideoStep p){border-radius:8px 8px 0 0}
.interestedArticles{border-radius:8px}

.proNews { display: inline-block; padding-top: 20px; width: 100%;}
.proNews .listing { padding-top: 0; margin-bottom: 0; border: none;width:100%;margin-left:0 }
.proNews .ttl{display:none}
.proNews .title{display: flex;justify-content: space-between;margin-bottom:10px}
.proNews .title h2 {font-size:18px;font-family: DroidBold, arial;color:#000}
.proNews .more { display: none }
.proNews .title a { display: inline-block;  color: #fff !important; background: #0277BD;  font-size: 14px !important; padding:0 12px;  border-radius: 6px;height:30px;display:flex;justify-content:center;align-items:center; }
.proNews .title:after {background-color: #efefef;}
.proNews ul { min-height: unset !important}
.proNews ul li .desc .time { color: #AAAAAA; display: inline-block }
.proNews ul li .desc .time span:after { display: none }
.proNews ul li .desc .time span:nth-of-type(2n) { display: none }
.proNews .listing ul li:nth-last-child(-n+3) { margin-bottom: 16px }
.proNews .listing ul li{border-radius: 6px;border: 1px solid #E8E8E8;background: #FFF;margin-left:16px;;margin-bottom:16px;    width: calc((100% - 32.1px) / 3);}
.proNews .listing ul li .secName{display:none}
.mainTour .proNews .listing ul li .desc{padding:10px}
@media screen and (min-width:1280px) and (max-width:1919px) {
    .WorldCupRules .rules-Div{padding: 34px 50px 0;}
}

@media screen and (min-width:1024px) and (max-width:1279px) {
    .WorldCupRules .rules-Div{padding: 20px 20px 0;}
    .proNews .listing ul li{width: calc((100% - 16.1px) / 2);}
     .listing ul li:nth-of-type(3n){    margin-left: 16px!important;}
     .listing ul li:nth-of-type(2n){    margin-left: 0!important;}
     .WorldCupRules .title h1 {font-size:18px}
     .WorldCupRules .title h1:before{width: 26px; height: 42px;}
     .WorldCupRules .rules-content h2{font-size:14px}

}

@media screen and (min-width:320px) and (max-width:1023px) {
    .WorldCupRules{width:100%;margin-left:0}
    .proNews .listing ul li .desc {    width: 100%; margin-top: 0;}
    .WorldCupRules .rules-Div{padding: 20px 20px 0;}
    }

@media screen and (min-width:320px) and (max-width:767px) {
    .WorldCupRules .title h1{font-size:16px}
    .WorldCupRules .title h1:before{    width: 26px;height: 40px;    margin-left: 12px;}
    .WorldCupRules .title{margin-bottom:16px}
    .WorldCupRules .rules-content h2{font-size:14px;margin-top:0;    line-height: 1.6;}

    .proNews .listing ul li{width:100%}
        .proNews  .listing ul li:first-child .desc {
        height: auto;
      padding: 0 10px 10px 0;
        width: 100%;
        right: 0;
        left: 0;
        position: absolute;
        bottom: 0;
        background: transparent linear-gradient(180deg, #00000000 0%, #000000 100%) 0% 0% no-repeat padding-box;
    }
     .proNews .listing ul li:first-child .imageCntnr {
        padding-bottom: calc(67% + 2px);
        width: auto;
        height: auto;
        display: block;
        float: unset;
    }

          .proNews  .listing ul li:first-child .desc p {
        font-size: 16px;
        max-height: 56px;
        padding: 0;
        color: #fff;
        height: auto;
    }
    .proNews .listing ul li .desc {
        width: calc(100% - 100px);
        padding: 0 10px;
    }
             .proNews .listing ul li .imageCntnr { width: 100px; padding-bottom: calc((100px * 66.5)/ 100); padding: 8px 10px; height: 66px; float: right; }

       .proNews  .listing ul li .desc p {max-height: 41px;
        font-size: 13px;
        -webkit-line-clamp: 2;}
    .proNews .listing.multimedia .listing { border: none; background: none }

    .proNews .listing .more { width:130px; height: 36px;margin:30px calc((100% - 130px) / 2) 0;font-size: 12px; line-height:36px }

    .proNews  .listing ul li .desc p{
        height: 48px;
        font-size: 13px;
    }
       .proNews ul li, .mainTour .remainContent .multimedia ul li {
        margin-left: 0;
    }
     .proNews  .listing ul li:first-child .desc .time span{color:#fff}
     .mainTour .proNews .listing ul li .desc {
    padding: 2px 10px 0;
}
     .proNews  .listing ul li .desc .time{font-size:11px}
}