@charset "utf-8";

:root {
	/* "Microsoft Yahei", sans-serif，tahoma; */
	--txt-font: system-ui, -apple-system, Arial, sans-serif;
	--color-primary: #FFD337;
	--color-white: white;
	--color-lightwhite: #f5f5f5;
	--color-black: #212529;

	--txt-size-normal: 1rem;
	--txt-size-little: .8rem;
	--txt-size-llittle: .6em;
	--txt-size-big: 1.2rem;
	--txt-size-bbig: 1.4rem;
	--border-radius: .4rem;
	font-size:16px;
}

*,
*::before,
*::after {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	text-decoration: none;
	list-style: none;
	cursor: default;
	font-family: var(--txt-font);
	border-spacing: 0;
	font-style: normal;
}

/*可选*/
html,body {width: 100%;height: 100%;font-size: 1rem;margin: 0 !important;background-color: #eee;}
var,area,map,bdo,dfn,font,ins,sup,time,tt,small{display:none;}
/*行内块元素*/
input,button,img {
	border: 0 none;
	outline-style: none;
	max-width: 100%;
	max-height: 100%;
	display: block;
	text-align: right;
	object-fit: cover;
}
.lrcenter {margin: 0 auto;}
/* 使用伪元素清除浮动 */
.clearfix::before, .clearfix::after {
	content: "";
	height: 0;
	line-height: 0;
	display: block;
	visibility: none;
	clear: both;
}

.clearfix {clear: both;}
span,a {display: block;color: var(--color-black);text-decoration: none;}
a:hover {text-decoration: none;cursor: pointer;}
.bshadow {box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 8px 0px;}
.nowrap {overflow: hidden;text-overflow: ellipsis;white-space: nowrap;text-align: right;}
.nowrap2 {overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;line-clamp: 2;-webkit-box-orient: vertical;display: -moz-box;-moz-box-orient: vertical;word-wrap: break-word;word-break: break-all;white-space: normal;max-height: 3rem;text-align: right;}
.emp {border: none !important;height: 0 !important;padding: 0 !important;margin: 0 !important;}
.hide {display: none !important;}
.bd {border: 1px solid red}
.pd {padding: .4rem;}
.pdlr {padding: 0 .4rem;}
.pdtb {padding: .4rem 0;}
.brds {border-radius: var(--border-radius)}
.ltxt {font-size: var(--txt-size-little);}
.lltxt {font-size: var(--txt-size-llittle);}
.btxt {font-size: var(--txt-size-big);}
.bbtxt {font-size: var(--txt-size-bbig);}
.textl {text-align: left;}
.textr {text-align: right;}
.textc{text-align: center;}
::placeholder {color: #B2B2B2;}
::-webkit-scrollbar {display: none;}
.fxwrap {flex-wrap: wrap;}
.fxnowrap {flex-wrap: nowrap;overflow-x: scroll;}
.fxnone {flex: none}
.fxauto {flex: auto}
.sticky {position: sticky;top: 0;z-index: 666;}

div.mask {position: fixed;top: 0;bottom: 0;z-index: 2;left: 0;right: 0;background-color: rgba(0, 0, 0, 0.2);display: none;transition: display .2s, opacity 1.2s;}
div.mask_active {display: block;}

.fx {display: flex;}
.fxrow {flex-direction: row;}
.fxrowrev {	flex-direction: row-reverse;}
.fxcolumn {	flex-direction: column;}
.fxcolumnrev {	flex-direction: column;}
.fxnowrap {flex-wrap: nowrap;}
.fx_jc_start {justify-content: left;}
.fx_jc_end {justify-content: end;}
.fx_jc_between {justify-content: space-between;}
.fx_jc_around {justify-content: space-around;}
.fx_jc_center {justify-content: center;}
.fx_ai_start {align-items: flex-start;}
.fx_ai_end {align-items: flex-end;}
.fx_ai_center {align-items: center;}
.fx_ai_baseline {align-items: baseline;}
.fx_ai_stretch {align-items: stretch;}
.fx_ai_baseline {align-items: baseline;}
.gap {gap: .4rem;}
div.pagelist{margin-top:1rem;}
div.pagelist>a{
	line-height:2rem;
	padding:0 1rem;
	border-radius:.4rem;
	background-color:#fff;
}
header{}
h1{font-size: var(--txt-size-bbig);}
h2{font-size: var(--txt-size-big);align-self: flex-end;}
h3{font-size: var(--txt-size-normal);}

div.mainblock{width: 1200px;margin:0 auto;padding: .8rem;}
div.mainblock>h1{flex:none;}
div.mainblock>div.search{flex:auto;}
div.mainblock>div.search>form>input{
	border: 1px solid #fff;
	height: 2rem;
	min-width: 16rem;
	font-size: var(--txt-size-big);
	padding: 0 .8rem;	
}
div.mainblock>div.search>form>button{
	height: 2rem;
	border: 1px solid #fff;
	width: 3rem;	
	text-align: center;
	background: url(../schoolala2/imgs/search.png) no-repeat center;
	border-left: none;
}
.nopadding{padding: 0 !important;}
img.menuicon{width: 2rem;height:2rem;display: none;}
.pcmenulist{background-color: #e7e8eb;}
.pcmenulist >div > nav{}
.pcmenulist >div > nav > a{
	padding:.8rem 1.2rem;
	height: 4rem;
	line-height: 2.5rem;
	color:#0277bd;
}
.pcmenulist >div > nav > a:hover{
	font-weight: bold;
}
.pcmenulist >div > nav > a:last-child{
	font-size: var(--txt-size-bbig);
	font-weight: bold;
}

.mbmenulist{
	position: absolute;
	right: -100%;
	top:0;
	bottom: 0;
	background-color:white;
	min-width: 18rem;
	max-width: 80%;
	transition: right .3s;
	z-index:666;
	display: none;

}
.mbmenulist_active{right:0;display:flex;}
.mbmenulist>img{width: 2rem;height: 2rem;	align-self: flex-end;margin:.8rem;}
.mbmenulist>nav{width: 100%;	}
.mbmenulist>nav>a{padding: .5rem 0;}

div.container{gap:.8rem;}
div.container>div.content{flex:2;gap:.8rem;max-width: 66%;}
div.container>div.slide{flex:1;gap:.8rem;max-width: 33%;}
div.catsblock{gap:.8rem;}
div.catblock{width: 100%;border-radius: var(--border-radius);}
div.catblock > div.head{line-height: 3rem;padding: 0 .8rem;border-top: 5px solid #0277bd;}

div.catblock > ul{}
div.catblock > ul > li{line-height: 2rem;}
div.slide > div.catblock{width: 100%;background-color: #fff;}

div.catblock >div.title{
	line-height: 3rem;
	background-color: #e8e8e8;
	margin-bottom: 1rem;
	border-right: 4px solid black;
	padding-right: 1rem;
}
div.catblock >div.title > a{
    display: inline-block;
    width: 5rem;
    padding: 0 10px;
    color: #fff;
	background: url(../schoolala2/imgs/left.svg) no-repeat left center,#0277bd;
	background-size: 2rem 1rem;
	padding-left: 2rem;
}
div.catblock >div.title > h2{
	font-weight: bold;
	font-size: var(--txt-size-bbig);
}

div.alist{
	margin:1rem 0;
}
div.alist > ul{padding: 0 .8rem;}
div.alist > ul > li{line-height: 2rem;}

div.article{
	text-align: right;
	background-color: white;
	width: 100%;
	word-break: break-all;
}
div.article>h1{
	margin:1rem auto;	
}
div.article>span{
	line-height: 3rem;
	color:#888;
	border-bottom: 2px dashed #fff;
	font-size: var(--txt-size-little);
}
div.article>div{
	margin:1rem;
	text-align:right;
}
div.article>div img{
	max-width:50%;
}

div.article>div > p{
	margin:.8rem 0;
	line-height:1.8rem;
	word-break: break-all;
	display: grid;
	justify-items: end;
}
div.updown > a{
	background-color: #f9f9f9;
	height: 3rem;
	line-height: 3rem;
	padding: 0 1rem;
	border-radius: var(--border-radius);
	max-width: 20rem;
}

footer{background-color:#e7e8eb;}

div.tabblock{
	border: 1px solid #fff;
	border-radius: var(--border-radius);
	padding: .8rem;
	margin-bottom: .8rem;
}
div.tabblock > div.head{
	padding: .4rem 0;
	border-bottom: 1px solid #fff;
	
}
div.tabblock > div.head > h2{
	margin-right: 2rem;
}
div.tabblock > div.head > span{
	padding: .4rem 1rem;
}
div.tabblock > div.head > span:hover{
	cursor: pointer;
}
div.tabblock > div.head > span.active{
	background-color: #fff;
}
div.tabblock > div.list > ul{
	display: none;
}
div.tabblock > div.list > ul.active{
	display: block;
}

ul.newslist {gap:1rem;text-align: right;}
ul.newslist > li{
	background-size: .4rem;
	width: 31%;
	background-color: white;
}
ul.newslist > li > a{
	width: 100%;
}
ul.newslist > li > a > img{
	height: 10rem;
	width: 100%;
	object-fit: cover;
}

ul.newslist > li > a > span{padding: .8rem;}
ul.newslist > li > a > span.date{
	font-size: var(--txt-size-little);
	color:#AFAFAF;
	flex: none;
}

div.tags{padding: .8rem;}
div.tags>a{
	background-color: #fff;
	padding: .4rem .8rem;
	border-radius: var(--border-radius);
	line-height:2.2rem;
	overflow: hidden;
	text-align: right;

}
div.tags>a > span{
	color:#0277bd;
	background-color: #eee;
	width: 3rem;
	height: 3rem;	
	flex: none;
	line-height: 3rem;
	text-align: center;
	font-weight: bold;
	margin-left:1rem;
}
div.matchs{
    padding: .8rem;
    margin:1rem;
    border-radius: .8rem;
    background-color: white;
}

div.matchs > section.matchblock{
    display: grid;
    grid-template-columns: 8fr 2fr;  
    padding: .4rem;  
    background-color: white;
    border-bottom: 1px solid #eee;
    margin:1rem auto;
}
div.matchs > section.matchblock:last-child{
    border: none;
}
div.matchs > section.matchblock > div.right{
    display: grid;
    justify-items: end;
    gap:.6rem;
}
div.matchs > section.matchblock > div.left{
    display: grid;
    grid-template-columns: 4fr 1fr 4fr;
    justify-items: center;
    align-items: center;
}
div.matchs > section.matchblock > div.left > div{
    width: 100%;
    text-align: center;
    display: grid;
    justify-items: center;
    align-items: center;
    
}
div.matchs > section.matchblock > div.left > div > img{width: 2rem; height: 2rem;}
div.matchs > section.matchblock > div.left > div:first-child{
    text-align: right;
    grid-template-columns: 3fr 1fr; 
}
div.matchs > section.matchblock > div.left > div > span{
    width: 100%;
}
div.matchs > section.matchblock > div.left > div:nth-child(2){
    display: grid;
    gap:.6rem;
    justify-items: center;
    align-items: center;
}
div.matchs > section.matchblock > div.left > div:nth-child(2) > div{
    display: grid;
    grid-template-columns: 1fr 1fr;
  
}
div.matchs > section.matchblock > div.left > div:nth-child(2) > div > span{
    width: 2rem;
    font-weight: bold;
}
div.matchs > section.matchblock > div.left > div:nth-child(2) > div > span:first-child{
    border-right: 2px solid #eee;
}
div.matchs > section.matchblock > div.left > div:last-child{
    text-align: left;
    grid-template-columns: 1fr 3fr ;
}
@media (max-width: 1200px) {div.mainblock{width: 100% ;}}
@media (max-width: 1024px) {}
@media (max-width: 768px) {
	div.mainblock>div.search>form{display: none;}
	img.menuicon{display: block;margin-left:2rem;}
	div.mainblock>h1{font-size: var(--txt-size-bbig);}
	.pcmenulist{display: none;}
	div.slide{display: none;}
	div.container>div.content{max-width: 100%;}
	header{background-color: #e7e8eb;}
	ul.newslist > li{width: 47%;}
}
@media (max-width: 576px){
	div.catblock {width: 100%;}
	div.matchs > section.matchblock{grid-template-columns: auto;}
    div.matchs > section.matchblock > div.right{
        grid-template-columns: repeat(3,3rem);
    }
    div.matchs > section.matchblock > div.left{
        grid-template-columns: auto ;        
    }
    div.matchs > section.matchblock > div.left>div:nth-child(1){
        grid-row-start: 2;
        /* grid-row-end: 3; */
        grid-column-start: 3;
        grid-column-end: 4;
        margin-top: 1rem;
    }
    div.matchs > section.matchblock > div.left>div:nth-child(2){
        grid-column-start: 1;
        grid-column-end: 3;
        grid-row-start: 1;
        grid-row-end: 4;
        display: grid;
        grid-template-columns: repeat(3,3rem);
    }
    div.matchs > section.matchblock > div.left>div:nth-child(2) > div{
        display: grid;
        grid-template-columns: 1fr;
    }
    div.matchs > section.matchblock > div.left > div:nth-child(2) > div > span{
        padding: .5rem 0;
    }
    div.matchs > section.matchblock > div.left > div:nth-child(2) > div > span:first-child{
        border-right: none;
        border-bottom: 2px solid #eee;
    }
    div.matchs > section.matchblock > div.left>div:nth-child(3){
        grid-column-start: 3;
        grid-column-end: 4;  
        grid-template-columns: 3fr 1fr;

    }    
    div.matchs > section.matchblock > div.left>div:nth-child(3) > img{
        grid-column-start: 2;
    }
    div.matchs > section.matchblock > div.left>div:nth-child(3) > span{
        grid-column-start: 1;
        grid-row-start: 1;
        text-align: right;
    }
    div.matchs > section.matchblock{
        border: none;
        margin-bottom: 1rem;
        border-radius: .8rem;
    }
    div.matchs{
        margin:1rem 0.4rem;
        background-color: #eee;
    }
}