:root{
  --color1:#333;
  --color1-light:#3686e8;
  --color1-dark:#1268d2;
  --color2:#8ebb34;
}
.container{max-width:1230px;margin-left:auto;margin-right:auto}
.container.blank{padding-left:15px;padding-right:15px}
.header{padding-top:20px;padding-bottom:20px;justify-content:space-between;align-items:center;background:#fff}
.logo{font-size:35px;font-family: Poppins,Helvetica,Arial,sans-serif;}
.logo img{max-height:42px;backface-visibility:hidden;display:block}
.nav{display:flex;justify-content:flex-end;align-items:center}
.nav__item{padding:12px 25px;position:relative}
.nav__item > a{font-size:16px;transition:color .3s}
.nav__item > a:hover{color:var(--color1)}
.nav__item > a:after{content:'';position:absolute;bottom:0;left:50%;width:0;height:1px;transform:translateX(-50%);background:#555;transition:width .3s}
.nav__item > a:hover:after,
.nav__item.cur > a:after{width:28px}
.nav__item.icon:after{content:'\e83a';font-size:12px;font-family:iconfont;position:absolute;top:15px;right:5px}
.nav-switch{display:none}
@media (max-width:768px){
  :root{--header-height:63px}
  body:before{content:'';display:block;height:var(--header-height)}
  .header{padding-top:12px;padding-bottom:12px;position:fixed;top:0;right:0;width:100%;border-bottom:solid 1px #eee;z-index:101}
  .logo{font-size:25px}
  .logo img{max-height:32px}
  .nav{padding:0 8%;position:fixed;top:var(--header-height);left:0;right:0;height:0;background:#fcfcfc;flex-direction:column;justify-content:flex-start;overflow:hidden;transition:height .3s}
  .nav[is-open]{overflow:auto;height:calc(100vh - var(--header-height));z-index:11;}
  .nav__item{width:100%;border-bottom:solid 1px #eee;padding:0 10px}
  .nav__item.icon:after{display:none}
  .nav__item > a{font-weight:600;font-size:15px;display:inline-block;padding:13px 0}
  .nav__item > a:after{display:none}
  .nav-switch{display:flex;width:22px;height:16px;;position:relative;border-top:solid 2px #555;border-bottom:solid 2px #555;transition:.4s}
  .nav-switch:before,
  .nav-switch:after{content:'';height:2px;width:100%;position:absolute;right:0;top:5px;background:#555;transition:.3s}
  .nav-switch.open{border-color:#fff}
  .nav-switch.open:before{transform:rotate(45deg)}
  .nav-switch.open:after{transform:rotate(-45deg)}
  .nav-switch-lang{margin-right:15px;width:16px;height:16px;border-radius:100%;font-size:16px;display:flex;justify-content:center;align-items:center}
}
.home-banner{position:relative;height:800px!important;background-repeat:no-repeat;background-position:center 0;background-size:cover}
.home-banner:after{content:'';position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background:rgba(0,0,0,.3)}
.home-banner__txt{position:absolute;top:0;right:0;bottom:0;left:0;z-index:2;display:flex;align-items:center;justify-content:center}
.home-banner__txt article{max-width:800px;padding:0 12px}
.home-banner__title{font-size:36px;text-align: center;font-family: Muli;color:#fff;text-transform: uppercase}
.home-banner__desc{margin-top:15px;font-size:23px;color:#fff;text-align:center}
.home-banner__media{position:absolute;z-index:3;right:0;bottom:20px;width:100%;display:flex;justify-content:center}
.home-banner__icon{margin:0 20px;width:50px;height:50px;border:solid 1px #ddd;border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative}
.home-banner__icon a{position:absolute;top:0;right:0;bottom:0;left:0;z-index:1}
.home-banner__icon:hover{background:rgba(255,255,255,.2)}
.home-banner__icon:before{font-size:20px;font-family: iconfont;color:#eee;}
.home-banner__icon.wx:before{content:'\e6b2';}
.home-banner__icon.instagram:before{content:'\e88f';}
.home-banner__icon.youtube:before{content:'\e7ad';}
@media (max-width:1280px){
  .home-banner{height:66vw!important}
}
@media (max-width:1024px){
  .home-banner__title{font-size:26px}
  .home-banner__desc{font-size:18px}
}
@media (max-width:512px){
  .home-banner{height:75vw!important;background-position:70% 0;}
  .home-banner__title{font-size:17px}
  .home-banner__desc{font-size:14px}
  .home-banner__icon{margin:0 12px;width:40px;height:40px}
}
.home-box{padding-top:clamp(25px,6vw,80px);padding-bottom:clamp(25px,6vw,80px)}
.main-more{text-align:center;margin-top:35px;display:flex;justify-content: center}
.main-more a{background:#fff;border:solid 1px #ddd;color:#333;padding:9px 25px 9px 25px;border-radius:6px;transition:.3s}
.main-more a:hover{background:var(--color1);border-color:var(--color1);color:#fff}
.main-more a:after{content:'\e649';font-family:iconfont}
@media (max-width:768px){
  .main-more{margin-top:25px}
}
@media (max-width:512px){
  .main-more{margin-top:20px}
  .main-more a{font-size:12px}
}
.page-banner{height:700px;background-repeat:no-repeat;background-position:center 0;background-size:cover}
@media (max-width:1024px){
  .page-banner{height:50vw}
}
.page-title{text-align:center;position:relative;margin-bottom:30px;padding-bottom:15px}
.page-title:before{content:'';position:absolute;bottom:0;left:50%;margin-left:-25px;width:50px;height:2px;background:#333}
.page-title.white:before{background:#eee}
.page-title span{font-size:clamp(23px,3vw,33px);font-family: Poppins,Helvetica,Arial,sans-serif;}
.page-title.white span{color:#fff}
.page-title small{display:block;color:#999;font-size:min(16px,3vw);margin-top:9px;text-transform:uppercase}
.page-text p{font-size:15px;line-height:1.8;margin-bottom:12px}
.page-text img{max-width:100%}
.article-h1{margin:30px 0 22px;text-align:center}
.article-meta{font-size:12px;text-align:right;padding:5px;background:#fbfbfb;margin:22px 0;color:#777}
.article-detail{font-size:16px}
.article-detail p{line-height:1.8;margin-bottom:12px}
.article-detail img{max-width:100%}
.article-detail ul{padding-left:12px;margin:16px 0}
.article-detail li{list-style-type:disc;margin:11px 0;}
.detail-neighbor{margin:50px 0;border-top:solid 1px #ddd;padding-top:12px;justify-content:space-between}
.detail-neighbor div{color:#777}
.detail-neighbor a:hover{text-decoration:underline}
@media (max-width:768px){
  .article-detail h1{margin-top:20px;font-size:17px}
  .article-detail .neighbor div{flex:0 0 100%;margin-bottom:9px}
}
.home-about{max-width:1000px;margin:0 auto;text-align: center}
.home-about p{font-size:18px;line-height:1.6}
.home-philosophy-wrap{background:#f9f9f9}
.home-philosophy{}
.home-philosophy__row{display:grid;grid-template-columns:repeat(2,50%)}
.home-philosophy__img{}
.home-philosophy__img img{width:100%;height:100%;object-fit:cover}
.home-philosophy__txt{padding:30px;background: #fff;display:flex;align-items:center;}
.home-philosophy__txt p{font-size:16px;line-height:1.7}
.home-philosophy__row:nth-child(even) .home-philosophy__img{grid-area:1/2/2/3}
.home-philosophy__row:nth-child(even) .home-philosophy__txt{}
@media (max-width:1024px){
  .home-philosophy__txt{padding:20px}
}
@media (max-width:768px){
  .home-philosophy__row{grid-template-columns:100%}
  .home-philosophy__img{height:50vw}
  .home-philosophy__row:nth-child(even) .home-philosophy__img{grid-area:1/1/2/2;}
}
.home-course{display:grid;grid-template-columns:repeat(3,30%);justify-content: space-between}
.home-course__box{background:#fbfbfb;text-align: center;padding:30px 20px 20px;border-radius:2px}
.home-course__img{}
.home-course__img img{width:64px}
.home-course__name{font-size:20px;margin:20px 0 12px}
.home-course__tips{color:#777}
.home-course__desc{font-size:16px;line-height:1.7;margin-top:20px;}
@media (max-width:1024px){
  .home-course{grid-template-columns:repeat(3,31%)}
}
@media (max-width:768px){
  .home-course{grid-template-columns:100%;row-gap: 20px;}
}
.home-bottom-wrap{background: url("../images/home-bottom.jpg") no-repeat center center;background-size:cover;position:relative}
.home-bottom-wrap:before{content:'';position:absolute;top:0;right:0;bottom:0;left:0;z-index:1;background:rgba(0,0,0,.5)}
.home-bottom-wrap .page-title{position:relative;z-index:2}
.home-form{position:relative;z-index:2;max-width:900px;margin:0 auto;padding:0 15px}
.home-form__row{margin-bottom:20px;text-align: center}
.home-form__row input[type=text],
.home-form__row input[type=email]{width:100%;border:0;background:rgba(255,255,255,.3);padding:15px;border-radius:6px}
.home-form__row textarea{width:100%;height:100px;border:0;background:rgba(255,255,255,.3);padding:15px;border-radius:6px}
.home-form__row input[type=submit]{padding:12px 40px;border:0;font-size:15px;border-radius:6px}
.footer{background:#222;text-align: center;padding:50px 12px;color:#999}
@media (max-width:1024px){
  .home-bottom-wrap{background: url("../images/home-bottom.jpg") no-repeat 60% center;background-size:auto 100%}
}
@media (max-width:768px){
  .footer{padding:30px 12px}
}
.page-main{margin:20px auto min(35px,9vw)}
.page-title{text-align:center;position:relative;margin:40px 0;padding-bottom:15px}
.page-title:before{content:'';position:absolute;bottom:0;left:50%;margin-left:-25px;width:50px;height:2px;background:#333}
.page-title span{font-size:clamp(22px,3vw,30px)}
.page-title small{display:block;color:#999;font-size:min(16px,3vw);margin-top:9px;text-transform:uppercase}
@media (max-width:1024px){
  .page-title{margin:30px 0 20px}
  .page-title small{margin-top:6px}
}
.page-text p{font-size:16px;line-height:1.7;margin-bottom:12px}
.page-text img{max-width:100%}
.page-text ul{padding-left:12px;margin:16px 0}
.page-text li{font-size:16px;list-style-type:disc;margin:11px 0;}
.page-philosophy{margin-bottom:30px;display:grid;grid-template-columns:40% 60%}
.page-philosophy__img{}
.page-philosophy__img img{width:100%;height:100%;object-fit:cover}
.page-philosophy__txt{background: #fbfbfb;padding:20px;}
.page-philosophy__txt p{font-size:16px;line-height:1.7;margin-bottom:12px}
@media (max-width:768px){
  .page-philosophy{margin-bottom:30px;grid-template-columns:100%}
}
.page-course__row{margin-bottom:30px;display:grid;grid-template-columns:190px auto;box-shadow: 0 0 5px 1px rgba(0,0,0,.1)}
.page-course__img{background:#f9f9f9;display:flex;align-items:center;justify-content:center;}
.page-course__img img{max-width:64px}
.page-course__txt{padding:20px;background: #fff}
.page-course__name{font-size:20px}
.page-course__tips{color:#777;margin:12px 0;}
.page-course__desc{font-size:16px;line-height:1.6}
@media (max-width:768px){
  .page-course__row{grid-template-columns:100%}
  .page-course__img{padding:30px}
  .page-course__img img{max-width:50px}
}
@media (max-width:512px){
  .page-course__txt{padding:15px}
}
.feedback-top{margin-bottom:40px;font-size:16px;color:#888;text-align:center}
.feedback-wrap{padding:20px 0 70px;background:#f9f9f9}
.feedback{}
.feedback-row{margin-bottom:20px;font-family:"Muli"}
.feedback-row label{margin-bottom:9px;display:block;font-family:'Microsoft YaHei';color:#666}
.feedback-row label.required:after{content:'*';color:#ee0a24}
.feedback-row input[type=text],
.feedback-row input[type=email]{width:100%;height:50px;padding-left:9px;border:solid 1px #eee;font-family:"Muli"}
.feedback-row.textarea{grid-area:2/1/3/3}
.feedback-row textarea{width:100%;height:100px;padding:9px;border:solid 1px #eee}
.feedback-row.submit{grid-area:3/1/4/3}
.feedback-row input[type=submit]{width:150px;height:40px;color:#fff;background:var(--color1);cursor:pointer;display:block;margin:0 auto}
@media (max-width:768px){
  .feedback-wrap{padding:5px 0 30px;background:#f9f9f9}
  .feedback{grid-template-columns:100%;column-gap:0}
  .feedback-row.textarea{grid-area:auto}
}
.wechat-popup{position:fixed;z-index:-1;opacity:0;text-align:center;padding:30px;width:260px;border-radius:3px;margin-left:-130px;left:50%;top:30%;background:#fff}
.wechat-popup.visible{z-index:930;opacity:1}
.wechat-popup .close{position:absolute;top:10px;right:10px;cursor:pointer}
.wechat-popup .close:before{content:'\e732';font-family:iconfont;font-size:1.2rem}
.wechat-popup img{max-width:92%}
.wechat-popup p{margin:5px 0}
.wechat-popup button{background:var(--color1);color:#fff;border-radius:3px;padding:3px 9px}
.wechat-popup label{opacity:0;position:absolute;top:0}
.article-list{margin:20px auto}
.article-list__item{display:flex;justify-content:space-between;margin-bottom:30px;padding-bottom:30px;border-bottom:solid 1px #ddd}
.article-list__date{flex:0 0 120px;width:120px;min-height:76px;display:flex;justify-content:center;align-items:center;background:#f2f2f2}
.article-list__date dl{text-align:center;color:#555}
.article-list__date dt{font-size:25px;line-height:1.2}
.article-list__date dd{font-size:14px;color:#999}
.article-list article{flex-grow:2;margin-left:20px}
.article-list article a{font-size:17px}
.article-list article a:hover{color:#0093d6}
.article-list article p{color:#999;margin-top:9px;line-height:1.7}
@media (max-width:1024px){
  .article-list__date{flex:0 0 100px;width:100px}
}
@media (max-width:512px){
  .article-list__item{margin-bottom:20px;padding-bottom:20px}
  .article-list__date{display:none}
  .article-list article{margin-left:0}
  .article-list article a{font-size:15px}
  .article-list article p{font-size:12px}
}
.article-h1{margin:30px 0 22px;text-align:center}
.article-meta{font-size:12px;text-align:right;padding:5px;background:#fbfbfb;margin:22px 0;color:#777}
.article-detail p{line-height:1.8;margin-bottom:12px}
.article-detail img{max-width:100%}
.article-detail ul{padding-left:12px;margin:16px 0}
.article-detail li{list-style-type:disc;margin:11px 0;}
.detail-neighbor{margin:50px 0;border-top:solid 1px #ddd;padding-top:12px;justify-content:space-between}
.detail-neighbor div{color:#777}
.detail-neighbor a:hover{text-decoration:underline}
@media (max-width:768px){
  .article-detail h1{margin-top:20px;font-size:17px}
  .article-detail .neighbor div{flex:0 0 100%;margin-bottom:9px}
}