.wow{animation:fadeIn 1.5s both;-webkit-animation:fadeIn 1.5s both;animation-duration:1s;-webkit-animation-duration:1s}
.delay1{animation-delay:0.5s;-webkit-animation-delay:0.5s}
.delay2{animation-delay:1.0s;-webkit-animation-delay:1.0s}
.delay3{animation-delay:1.5s;-webkit-animation-delay:1.5s}
#articleInfo12{overflow:hidden}
#articleInfo12 .row{margin:0;position:relative}
#articleInfo12 .row h3{font-size:22px;color:var(--info);animation-name:fadeInLeft;-webkit-animation-name:fadeInLeft;line-height:170%;font-weight:500;margin-bottom:20px}
#articleInfo12 .row article{margin:20px 0;animation-name:fadeInRight;-webkit-animation-name:fadeInRight}
#articleInfo12 .row h4{margin:10px 0;font-size:25px;color:var(--primary);animation-name:fadeInLeft;-webkit-animation-name:fadeInLeft}
#articleInfo12 .row:nth-child(2){width:45%}
#articleInfo12 .row .topBox{overflow:hidden}
#articleInfo12 .row p{margin:0 2% 0 0;float:left;width:48%;animation-name:fadeInLeft;-webkit-animation-name:fadeInLeft}
#articleInfo12 .row p:nth-child(2){margin:0 0 0 2%;animation-name:fadeInRight;-webkit-animation-name:fadeInRight}
#articleInfo12 .four{display:grid;grid-template-columns:repeat(2,1fr);gap:40px;margin-top:60px}
#articleInfo12 .four .box .downBox{margin:0;display:grid;grid-template-columns:repeat(5,1fr);gap:15px}
#articleInfo12 .four .box .downBox img{}
#articleInfo12 .four .box ol{padding-left:30px}
#articleInfo12 .four .box li{list-style:circle}
#articleInfo12 .row .downBox{animation-name:fadeInUp;-webkit-animation-name:fadeInUp;text-align:center;margin:50px 0}
#articleInfo12 .row .downBox.px{width:90%;margin:130px 0 50px}
#articleInfo12 .mapteacher{display:grid;grid-template-columns:repeat(3,1fr);width:65%;gap:15px;position:relative;z-index:2;animation-name:fadeInUp;-webkit-animation-name:fadeInUp;align-items:start}
#articleInfo12 .mapteacher .box{display:grid;grid-template-columns:50px 1fr;gap:10px;border-radius:15px;align-items:center;position:relative}
#articleInfo12 .mapteacher .box svg{position:absolute;fill:#434141;width:25px;height:25px;z-index: 10;}
#articleInfo12 .mapteacher .box:hover svg{fill:#aa3c3c;width:30px;height:30px}
#articleInfo12 .mapteacher .box:nth-child(1) svg{bottom: -70px;right:70px}
#articleInfo12 .mapteacher .box:nth-child(2) svg{bottom: -70px;left:-72px}
#articleInfo12 .mapteacher .box:nth-child(3) svg{right:-3px;bottom: -94px;}
#articleInfo12 .mapteacher .box:nth-child(4) svg{left:-42px;bottom: -99px;}
#articleInfo12 .mapteacher .box:nth-child(5) svg{top: 5px;right:36px}
#articleInfo12 .mapteacher .box:nth-child(6) svg{bottom: -93px;right:65px}
#articleInfo12 .mapteacher .box:nth-child(7) svg{bottom: -13px;left: -72px;}
#articleInfo12 .mapteacher .box:nth-child(8) svg{top: -158px;right:74px}
#articleInfo12 .mapteacher .box:nth-child(9) svg{right:-309px;top: 24px;}
#articleInfo12 .mapteacher .box:nth-child(10) svg{right: -18px;top: -44px;}
#articleInfo12 .mapteacher .box:nth-child(11) svg{bottom: -10px;left: -13px;}
#articleInfo12 .mapteacher .photo img{aspect-ratio:1/1;width:100%;border-radius:5px;object-fit:cover}
#articleInfo12 .mapteacher .tt{display:flex;flex-direction:column}
#articleInfo12 .mapteacher .img{display:flex;grid-column:1 / 3}
#articleInfo12 .mapteacher .img img{height:30px}
#articleInfo12 .mapteacher .tt p{float:none;width:100%;margin:0;font-size: 13px;display:flex;align-items:center;flex-wrap:wrap;gap:4px;margin:5px 0}
#articleInfo12 .mapteacher .tt p span{font-size:13px;border:1px solid #7b7b7b;border-radius:5px;padding:0 6px}
#articleInfo12 .mapteacher .tt p.name{font-weight:700;margin:5px 0 0;font-size: 16px;}
#articleInfo12 .mapteacher .tt article{margin:0 0;display:flex;flex-wrap:wrap;gap:6px}
#articleInfo12 .mapteacher .tt article b{background:#f59b5b;padding:3px 5px;border-radius:5px;font-size:14px;font-weight:400;color:white}
#articleInfo12 .mapteacher .tt article b.gr{background:#8cbc4a}

@media screen and (min-width: 1025px) {
	#articleInfo12 .row .mo{display:none;}
    #articleInfo12 .mapteacher{position:absolute;top: 120px;width: 100%;grid-template-columns: repeat(4, 1fr);gap: 55px;}
    #articleInfo12 .mapteacher:before{content:'';order: 1;}
    #articleInfo12 .mapteacher .box:nth-child(6){order:2;margin-left: -70px;}
    #articleInfo12 .mapteacher .box:nth-child(7){order:2}
    #articleInfo12 .mapteacher .box:nth-child(8){order:2}
    #articleInfo12 .mapteacher .box:nth-child(9){order:2}
    #articleInfo12 .mapteacher .box:nth-child(10){order:2}
    #articleInfo12 .mapteacher .box:nth-child(11){order:2}
}
@media screen and (max-width: 1280px) {
	#articleInfo12 .mapteacher{top:90px}
	#articleInfo12 .row .downBox.px{margin-bottom:150px}
	#articleInfo12 .mapteacher .box:nth-child(1) svg{bottom:-60px;right:60px}
	#articleInfo12 .mapteacher .box:nth-child(5) svg{top: -16px;right:23px}
	#articleInfo12 .mapteacher .box:nth-child(8) svg{top: -198px;right:64px}
	#articleInfo12 .mapteacher .box:nth-child(3) svg{right:-6px;bottom: -80px;}
	#articleInfo12 .mapteacher .box:nth-child(4) svg{bottom: -79px;}
	#articleInfo12 .mapteacher .box:nth-child(7) svg{bottom: 35px;left:-65px}
	#articleInfo12 .mapteacher .box:nth-child(9) svg{right:-283px;top: -37px;}
	#articleInfo12 .mapteacher .box:nth-child(10) svg{right:-20px;top: -90px;}
	#articleInfo12 .mapteacher .box:nth-child(11) svg{bottom: 70px;left: -23px;}
	#articleInfo12 .mapteacher .box:nth-child(6) svg{bottom: -57px;right:52px}
	#articleInfo12 .mapteacher .box:nth-child(6){margin-left:-100px}
}
@media screen and (max-width: 1024px) {
    #articleInfo12 .mapteacher .box:nth-child(6){margin:0}
	#articleInfo12 .row .downBox.px{display:none}
	#articleInfo12 .mapteacher{top:unset;width:100%;gap:25px}
	#articleInfo12 .mapteacher .box svg{display:none}
}
@media screen and (max-width: 768px) {
    #articleInfo12 .mapteacher{    grid-template-columns: repeat(2, 1fr);}
	#articleInfo12 .four{grid-template-columns: 1fr;gap: 10px;}
	#articleInfo12 .row ,
	#articleInfo12 .row:nth-child(2){margin-bottom:15px;width:100%}
}
@media screen and (max-width: 480px) {
    #articleInfo12 .four{margin-top:30px;}
    #articleInfo12 .mapteacher .box{grid-template-columns: 80px 1fr;gap: 10px 20px;}
	#articleInfo12 .mapteacher{    grid-template-columns:1fr;}
}