﻿.top-header .is-bg{height:80%;top:0;right:0;z-index:-1}
.top-header .search-area{margin-top:200px;backdrop-filter:blur(40px);background-color:rgba(238, 238, 238, 0.5);padding:25px}
.top-header .search-area .search-lists{margin:15px calc(50% - 200px);width:400px}
.top-header .search-area .search-lists .inputs .input{padding:11px 15px 11px 50px;border:0}
.top-header .search-area .search-lists .inputs .sub{left:0;top:0;z-index:2;background:none;border:0;padding:15px}
.top-header .search-area .sub2{padding:8px 20px;border:3px rgba(255, 255, 255, 0.4) solid;margin:7.5px 0}
.top-header .search-area .sub2:hover{opacity:.8}
.top-header .search-area .fields{width:calc(100% - 105px)}
.top-header .search-area .fields .field{width:14.28%;padding:7.5px}
.top-header .search-area .fields .field .inp{border:0;padding:10px}
.top-header .search-area .fields .field .swicher{padding:6px 0}
.top-header .search-area .fields .field .swicher .lab-name{padding:5px 10px}
.top-header .search-area .fields .field .swicher .roud{height:calc(100% - 10px);top:5px;right:6px;width:60px}
.top-header .search-area .fields .field .swicher input{display:none}
.top-header .search-area .fields .field .swicher input:checked ~ .roud{right:70px}


.list-archive-box .entery{display:flex;flex-wrap:wrap}
.list-archive-box .entery .mini-p{flex:1 0 16.66%;max-width:16.66%}


@media only screen and (max-width:1215px){
.top-header .search-area .fields{width:calc(100% - 120px)}
.top-header .search-area .fields .field{width:25%}
.top-header .search-area .sub2{font-size:16px;padding:15px 25px}
}
@media only screen and (max-width:1080px){
.list-archive-box .entery .mini-p{flex:1 0 20%;max-width:20%}
}
@media only screen and (max-width:920px){
.list-archive-box .entery .mini-p{flex:1 0 25%;max-width:25%}
.top-header .search-area .fields .field{width:25%}
.top-header .search-area .fields{width:100%}
.top-header .search-area .sub2{width:100%;padding:10px}
}
@media only screen and (max-width:700px){
.list-archive-box .entery .mini-p .pic{height:200px}
.top-header .search-area .search-lists{width:100%;margin:0 0 10px}
.top-header .search-area .fields .field{width:33.33%}
}
@media only screen and (max-width:600px){
.list-archive-box .entery .mini-p{flex:1 0 33.33%;max-width:33.33%}
.list-archive-box .entery .mini-p .pic{height:240px}
.list-archive-box .entery .mini-p{flex:1 0 50%;max-width:50%}
.list-archive-box .entery .mini-p .pic{height:280px}
.top-header .search-area .fields .field{width:50%}
.top-header .search-area .sub2{margin-bottom:0}
}
@media only screen and (max-width:500px){
.list-archive-box .entery .mini-p{flex:1 0 50%;max-width:50%}
.list-archive-box .entery .mini-p .pic{height:240px}
}
@media only screen and (max-width:400px){
.list-archive-box .entery .mini-p .pic{height:200px}
.top-header .search-area .fields .field .swicher,.top-header .search-area .fields .field .inp{font-size:12px}
.top-header .search-area .fields .field .swicher .lab-name,.top-header .search-area .fields .field .swicher{padding:5px}
.top-header .search-area .sub2{font-size:14px}
.top-header .search-area{padding:20px;margin-top:100px}
.top-header .search-area .fields .field .swicher .roud{width:55px}
.top-header .search-area .fields .field .swicher input:checked ~ .roud{right:60px}
}