@font-face {
    font-family: 'din';
    src:url("../fonts/DIN Alternate Bold.ttf");
}
* {outline-color: #666666}
a {color: black;text-decoration: none}
ul {}
ul li {list-style-type: none;float: left;}
em {font-style: normal;font-family: 'din';font-size: 18px;text-align: center}
.main {margin: auto}

.f-logo {margin-top: 100px}

.f-class {display: inline-block;margin: 23px 0 15px}
.f-class ul li{width: 71px;height: 26px;line-height: 26px;color: #333333;font-weight: 400;font-size: 16px;cursor: pointer;user-select: none}
.f-class ul li font{font-size: 14px}
.f-class ul li:first-child {margin-right: 23px;}
.f-class ul li:nth-child(2) {margin-right: 20px;}
.f-class ul li:nth-child(3) {margin-right: 19px;}
.f-class ul li:nth-child(4) {margin-right: 19px;}
.f-class ul li:nth-child(5) {margin-right: 29px;}
.f-class ul li.on,.f-class ul li:hover{background: RGBA(153,153,153,0.2);border-radius: 13px 13px 13px 13px;}
.f-class ul li img{ margin-top: -3px;width: 24.71px;height: 24.71px}
.f-class ul li:first-child img{margin-right: -0.2px;}
.f-class ul li:nth-child(2) img{margin-right: 2.8px;padding-top: 2px;}
.f-class ul li:nth-child(3) img{margin-right: 0.3px;}
.f-class ul li:nth-child(4) img{margin-right: 0.3px;}
.f-class ul li:nth-child(5) img{margin-right: -0.6px;}

.f-search {height: 44px;position: relative;z-index: 10}
.f-search .box {width: 664px;height: 44px;border-radius: 9px;border:1px solid #999999;margin: auto;}
.f-search .s-border-bottom{border-bottom: none ; border-bottom-left-radius: unset;border-bottom-right-radius: unset}
.f-search .box img {}
.f-search .box .icon-logo {padding: 9px;}
.f-search .box .icon-search {}
.f-search .box button{display: inline-block;font-weight: 400;line-height: 1.5;color: #212529;text-align: center;text-decoration: none;cursor: pointer;-webkit-user-select: none;-moz-user-select: none;user-select: none;background-color: transparent;border: none;padding: .375rem .75rem;font-size: 1rem;border-radius: .25rem;transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;outline-color: #666666}
.f-search .box button:focus {border: none;user-select:none}
.f-search .box input{border:none ;outline: none;width: 83.5%;vertical-align: middle;color: #666666}
.f-search .hot {display: none;width: 664px;height: 428px;border: 1px solid #999999;border-top: none;border-bottom-right-radius: 9px;border-bottom-left-radius: 9px;background: #fff;z-index: 1000}
.f-search .hot .line-bar {height: 2px;width: 632px;background:RGBA(112,112,112,0.2);margin: auto; }
.f-search .hot ul {width: 662px;height: 410px;border-top: none;padding: 0;overflow-y: auto;margin-top: 9px}
.f-search .hot ul::-webkit-scrollbar {width: 6px;height: 0;}
.f-search .hot ul::-webkit-scrollbar-thumb {border-radius: 13px;-webkit-box-shadow: inset  0 0 5px RGBA(0,0,0,.2);background: RGBA(112,112,112,0.2);}
.f-search .hot ul::-webkit-scrollbar-track {border-radius: 13px;RGBA(112,112,112,0.2)}
.f-search .hot ul li {width: 662px;height:31px;line-height:31px;text-align: left;margin: 5px 0;padding-left: 15px;}
.f-search .hot ul li:hover,.f-search .hot ul li.on {background: #D6D6D6;}
.f-search .hot ul li a {font-size: 16px;font-weight: 400;color: #666666;}
.f-search .hot ul li a div {cursor: pointer}
.f-search .hot ul li a em {width: 22px;display: inline-block; overflow: hidden;}
.f-search .hot ul li:first-child a em {color: #E7444D;}
.f-search .hot ul li:nth-child(2) a em {color: #EA702E}
.f-search .hot ul li:nth-child(3) a em {color: #EDAC3E}
.f-search .hot ul li a span.title{margin-left: 11px;max-width: 500px;text-overflow: ellipsis;white-space: nowrap;display: inline-block;overflow:hidden}
.f-search .hot ul li a span.t-z {display: inline-block;text-align:center;height: 19px;color: #fff;line-height: 19px;margin-left: 6px;overflow: hidden;vertical-align: top;margin-top: 7px;border-radius: 2px;padding: 0 1.5px}
.f-search .hot ul li a span.t-hot{background: #E54725;}
.f-search .hot ul li a span.t-shang{background: #566FEA;}
.f-search .hot ul li a span.t-fei{background: #EA6F2D;}
.f-search .hot ul li a span.t-new{background: RGB(255,85,120);}
.f-search .hot ul li a span.views {float: right;margin-right: 16px}

.f-ad {min-height:485px}
.f-ad ul.ad-img {    display: inline-block;padding-left: 0}
.f-ad ul.ad-img li {margin:73px 31px 0;}
.f-ad ul.ad-img li p {margin-top: 10px;line-height: 21px;font-family: Microsoft YaHei-Regular, Microsoft YaHei;font-weight: 400;color: #333333;font-size:12px}
.f-ad .ad-text{width: 835px;margin:0 auto}
.f-ad .ad-text ul {width: 100%;height: 300px;border-top: none;padding: 0;}
.f-ad .ad-text ul::-webkit-scrollbar {width: 6px;height: 0;}
.f-ad .ad-text ul::-webkit-scrollbar-thumb {border-radius: 13px;-webkit-box-shadow: inset  0 0 5px RGBA(0,0,0,.2);background: RGBA(112,112,112,0.2);}
.f-ad .ad-text ul::-webkit-scrollbar-track {-webkit-box-shadow: inset 0 0 5px RGBA(0,0,0,.2);border-radius: 13px;RGBA(112,112,112,0.2)}
.f-ad .ad-text ul li {width: inherit;height:24px;line-height:24px;text-align: left;margin: 4px 0;}
.f-ad .ad-text ul li:hover {background: #D6D6D6;}
.f-ad .ad-text ul li a {font-size: 16px;font-weight: 400;color: #333;}
.f-ad .ad-text ul li a em {width: 22px;display: inline-block; overflow: hidden}
.f-ad .ad-text .swiper-slide:first-child ul li:first-child a em {color: #E7444D;}
.f-ad .ad-text .swiper-slide:first-child ul li:nth-child(2) a em {color: #EA702E}
.f-ad .ad-text .swiper-slide:first-child ul li:nth-child(3) a em {color: #EDAC3E}
.f-ad .ad-text ul li a span.title{margin-left: 24px;max-width: 600px;text-overflow: ellipsis;white-space: nowrap;display: inline-block;overflow:hidden}
.f-ad .ad-text ul li a span.t-z {display: inline-block;text-align:center;height: 15px;color: #fff;line-height: 15px;font-size:13px;margin-left: 6px;overflow: hidden;vertical-align: top;margin-top: 6px;border-radius: 2px;padding:0 1.5px;background: #EA7278}
.f-ad .ad-text ul li a span.t-hot{background: #E54725;}
.f-ad .ad-text ul li a span.t-shang{background: #566FEA;}
.f-ad .ad-text ul li a span.t-fei{background: #EA6F2D;}
.f-ad .ad-text ul li a span.t-new{background: RGB(255,85,120);}
.f-ad .ad-text ul li a span.views {float: right;}
.f-ad .ad-text ul li a span.views img {padding-right: 25px}
.f-ad .ad-video{width: 920px;margin: 0 auto}
.f-ad .ad-video ul {height: 385px;padding: 0;margin-top: 24px}
.f-ad .ad-video ul li{width: 420px;height: 85px;margin-bottom:15px;position: relative}
.f-ad .ad-video ul li:nth-child(2n+1) {float: left}
.f-ad .ad-video ul li:nth-child(2n) {float: right}
.f-ad .ad-video ul li .thumb {float: left;height: 100%}
.f-ad .ad-video ul li .author {font-size: 12px;color: #666;}
.f-ad .ad-video ul li .views {font-size: 12px;color: #666666;margin-right: 35px;width: 95px;display: inline-block}
.f-ad .ad-video ul li .comments {font-size: 12px;color: #666666;}
.f-ad .ad-video ul li .info {width:264px;float: left;text-align: left;margin-left: 16px}
.f-ad .ad-video ul li .info .title {width: 100%;;line-height: 21px;overflow: hidden;-webkit-line-clamp: 2;-webkit-box-orient: vertical;display: -webkit-box;max-height: 42px;font-size: 14px;font-family: Microsoft YaHei-Regular, Microsoft YaHei;font-weight: 400;color: #333333;}
.f-ad .ad-video ul li:hover a {color:#DF668E}
.f-ad .ad-video ul li p {margin-bottom: 2px}
.f-ad .ad-video ul li p:last-child {position: absolute;bottom: -5px}
.f-ad .ad-video ul li img {display: inline-block;}
.f-ad .ad-video ul li .thumb img {width: 110px;border-radius: 5%}
.f-ad .ad-video ul li .author img {width: 24px;height: 16px;border-radius: 5%;margin-right: 8px;display: inline-block;vertical-align: sub}
.f-ad .ad-video ul li .comments img ,.f-ad .ad-video ul li .views img {width: 18px;height: 16px;border-radius: 5%;margin-right: 12px;display: inline-block;vertical-align: sub}
/*.f-ad .ad-video ul li :hover {transition: 0.1s 0.1s;}*/
.f-ad .ad-video ul li :hover .info .title {color:#DF668E;}
/*.f-ad .ad-video ul li :hover .info {width:284px}*/
/*.f-ad .ad-video ul li :hover .info .title {color:#DF668E;font-size: 16px ;width: 285px}*/
/*.f-ad .ad-video ul li :hover .thumb img {width: 120px;height: 90px}*/
/*.f-ad .ad-video ul li :hover .f-ad .ad-video ul li .comments img ,.f-ad .ad-video ul li :hover .f-ad .ad-video ul li .views img  {font-size: 13px}*/




.ad-title {font-size: 16px;font-family: Microsoft YaHei-Regular, Microsoft YaHei;font-weight: 400;margin-top: 39px;}
.ad-title strong{float: left;user-select: none;font-size: 18px;font-weight: bold;color: #333333;}
.ad-title a{float: right;color: #333;user-select: none;cursor: pointer}
.ad-title a:focus,.swiper-pagination-bullet:focus {outline: none;}
.ad-list-head {float: left;font-size: 16px;padding-top:12px;font-weight: 400;color: #636674;}

.f-footer {margin-bottom:20px;}
.f-footer a {font-size: 12px;color: #999999;}

.f-setting {top: 32px;right: 32px;position: absolute}


/*swiper*/
.swiper {width: 100%;height: 100%;}
.swiper-slide {text-align: center;font-size: 18px;background: #fff;/* Center slide text vertically */display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}
.swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;}
.swiper-pagination-bullet {width: 6px;height: 6px;background: #E4E4E4;border-radius: 5px 5px 5px 5px;opacity: 1;display: inline-block;}
.swiper-pagination-bullet-active {display: inline-block;color: #fff;width: 30px;height: 6px;background: #556EEA;border-radius: 5px 5px 5px 5px;opacity: 1;border: none;}

/*bootstrap*/
.form-switch {padding-left: 5.3em}
.form-check label{color: #666666;font-size: 15px}
.form-switch .form-check-input {width: 3.5em;height: 1.15em;margin-right: 80px;margin-top: 0.65em}
