﻿*{max-width: 100%;transition: all .2s;box-sizing: border-box;}
.bg_img{background-size: cover;background-repeat: no-repeat;background-position: center;}


/*首页*/
#index{padding: 15px;}
#index .title{font-size: 40px;text-align: center;font-weight: bold;color: #ff0000;margin-bottom: 15px;}
#index .search{display: flex;flex-wrap: wrap;justify-content: center;}
#index .search .layui-form-label{overflow: unset;text-overflow: unset;}
#index .search .layui-inline{margin-bottom: 10px;}
#index .intro{padding: 30px 15px;}
#index .list{display: flex;flex-wrap: wrap;width: 100%;}
#index .item{display: flex;align-items: center;justify-content: center;width: calc((100% - 91px) / 10);margin-right: 10px;margin-bottom: 10px;border: 2px solid #aaa;cursor: pointer;border-radius: 5px;overflow: hidden;position: relative;}
#index .item:nth-child(10n){margin-right: 0;}
#index .item .img{width: 100%;pointer-events: none;}
#index .item input[type=checkbox]{display: none!important;}
#index .item span{position: absolute;background: #5FB878;border-radius: 50%;width: 40px;height: 40px;display: flex;align-items: center;justify-content: center;opacity: 0;box-shadow: 0 0 5px #5FB878;}
#index .item span i{font-size: 30px;color: #fff;}
#index .item.on{border-color: #5FB878;box-shadow: 0 0 5px #5FB878;}
#index .item.on span {opacity: 1;}

#copy_input{opacity: 0;position: absolute;pointer-events: none;}
#search .top{display: flex;align-items: center;justify-content: center;padding: 20px;}
#search table tbody td:nth-child(1){white-space: nowrap;line-height: 40px;}
#search table{width: auto;margin: auto;}
#search table th{text-align: center;}
#search table td ,#search table th{font-size: 22px;}
#search .imgs{display: flex;flex-wrap: wrap;min-width: 500px;}
#search .imgs .img{width: 80px;margin-right: 5px;margin-bottom: 5px;}
#search .tuijian{font-size: 30px;margin-top: 50px;font-weight: bold;}

/*分页*/
#pages{padding: 10px 0;min-height: 40px;text-align: center;}
#pages a {font-size:20px;min-width: 40px;height: 40px;background-color: #F2F2F2;display: inline-block;box-sizing: border-box;padding: 0 10px;color: #666666;line-height: 40px;text-align: center;font-family: Arial;margin-right: 5px;transition: background-color 0.2s ease-out;cursor: pointer;}
#pages a.active, #pages a:not(.no):hover {background-color: rgb(0,150,136);color: #fff;}
#pages .no{cursor: not-allowed !important;background: #C8C8C8;color: white;}
#pages .none{font-weight: bold;font-size: 20px;color:#333333;line-height: 50px;}
#pages .none i{font-size: 35px;color:#E4332D;margin-right: 10px;vertical-align: sub;}

@media only screen and (max-width: 1200px)  and (min-width: 992px){
    #index .item{width: calc((100% - 71px) / 8);margin-right: 10px!important;}
    #index .item:nth-child(8n){margin-right: 0!important;}
}

@media only screen and (max-width: 992px)  and (min-width: 768px){
    #index .item{width: calc((100% - 51px) / 6);margin-right: 10px!important;}
    #index .item:nth-child(6n){margin-right: 0!important;}
}

@media only screen and (max-width: 768px) and (min-width: 500px)  {
    #index .item{width: calc((100% - 41px) / 5);margin-right: 10px!important;}
    #index .item:nth-child(5n){margin-right: 0!important;}

}

@media only screen and (max-width: 500px) {
    #index .item{width: calc((100% - 31px) / 4);margin-right: 10px!important;}
    #index .item:nth-child(4n){margin-right: 0!important;}
    #index .intro{padding: 30px 0;}
    #index .item span{width: 30px;height: 30px;}
    #index .item span i{font-size: 22px;}
}
