@charset "UTF-8"; .pic { padding-top: 75%; position: relative; overflow: hidden; } .pic .a { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-position: 50%; background-repeat: no-repeat; background-size: cover; transition: all 0.3s ease-in; } .bg-mask:hover .pic .a { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .n_container { padding-bottom: .64rem; } /**/ .pagination { text-align: center; font-size: 0; padding-top: 0.17rem; } .pagination a { display: inline-block; border: 1px solid #dcdcdc; padding: 0 0.12rem; height: 0.35rem; font-size: 0.14rem; line-height: 0.35rem; text-align: center; color: #666; margin: 0 7px; } .pagination a.active { background: #018a3f; color: #fff; border: 1px solid #01883f; } .pagination a:hover { background: #c31c14; color: #fff; border: 1px solid #c31c14; } .pagination span { display: inline-block; font-size: 0.14rem; } .leftNav { align-self: flex-start; position: relative; margin-top: 0.3rem; width: 2.6rem; background: #c31c14; padding-left: .05rem; box-shadow: 0 0 .2rem rgba(0, 0, 0, 0.2); } .leftNav h4 { font-size: .24rem; color: #fff; line-height: 2; padding: 0.175rem 0; position: relative; padding-left: .42rem; font-weight: 600; } .leftNav .lv1>li h2 { font-size: .18rem; color: #333; line-height: .3rem; padding: 0.17rem .42rem; border-top: 1px solid #e5e5e5; position: relative; } .leftNav .lv1>li:first-child h2 { border: 0; } .leftNav .lv1>li h2 i { position: absolute; width: 0.09rem; right: .3rem; top: 0; bottom: 0; background: no-repeat 50%; background-size: .09rem; opacity: 0; visibility: hidden; } .leftNav .lv1 { background: #fff; } .leftNav .lv2>li a { display: block; font-size: .16rem; line-height: 2em; padding: .1rem; border-top: 1px solid #e7e7e7; } .leftNav .lv2>li:first-child a { border: 0; } .leftNav .lv2>li { padding-left: .32rem; } .leftNav .lv2 { padding: .1rem 0; display: none; } .leftNav .lv2>li:hover a { color: #c31c14; } .leftNav .lv1>li:hover h2 i, .leftNav .lv1>li.active h2 i, .leftNav .lv1>li.on h2 i { opacity: 1; visibility: visible; } .leftNav .lv1>li:hover h2, .leftNav .lv1>li.active h2, .leftNav .lv1>li.on h2 { color: #c11b13; } .rightBox { width: calc(100% - 3.35rem); padding-top: .35rem; } .position { font-size: 0; display: flex; justify-content: flex-end; flex-wrap: wrap; align-items: center; margin-bottom: .18rem; } .position>* { font-size: .14rem; color: #666666; line-height: .24rem; margin-right: .05rem; } .position img { width: .23rem; height: .32rem; margin-right: .1rem; } .n_tit { padding-bottom: .18rem; border-bottom: 1px solid #dcdcdc; } .n_tit h4 { font-size: .3rem; line-height: .34rem; color: #333; } /*n_list*/ .n_list li a { display: flex; justify-content: space-between; flex-wrap: wrap; } .n_list li a time { width: .73rem; height: .76rem; background: #def1eb; color: #222; display: flex; flex-direction: column; justify-content: center; text-align: center; } .n_list li a time span { font-size: .24rem; line-height: 1; font-weight: 600; margin-bottom: .05rem; } .n_list li a time em { font-size: .14rem; line-height: .24rem; } .n_list li a .txt { width: calc(100% - 1rem); } .n_list li a .txt h3 { font-size: .18rem; line-height: .2rem; color: #000; margin-bottom: 0.08rem; font-weight: normal; } .n_list li a .txt p { font-size: .14rem; line-height: .24rem; color: #999999; } .n_list li { padding-top: .3rem; padding-bottom: .3rem; border-top: 1px solid #e5e5e5; } .n_list li:first-child { border: 0; } .n_list li a:hover h3 { color: #0a7a4c; font-weight: bold } /*师资列表*/ .t-list li { width: 47.12%; box-shadow: 0 0 .12rem rgba(153, 153, 153, 0.2); margin-bottom: .48rem; } .t-list li a { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; transition: all .3s; } .t-list li a .pic { width: 1.62rem; height: 2.32rem; padding-top: 40%; } .t-list li a .txt { width: calc(100% - 1.95rem); padding-right: .25rem; } .t-list li a .txt i { display: block; width: .3rem; background: #795548; } .t-list li a .txt h3 { font-size: .2rem; color: #000000; line-height: 3em; border-bottom: 1px solid #e5e5e5; margin-bottom: .14rem; } .t-list li a .txt p { font-size: .14rem; line-height: .26rem; color: #666666; -webkit-line-clamp: 3; height: .78rem; } .t-list li:hover { box-shadow: 0 0 .12rem rgba(153, 153, 153, 0.5); } .t-list { padding-top: .42rem; } /*n_pic_txt*/ .n_pic_txt li a { position: relative; z-index: 3; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; } .n_pic_txt li a .pic { width: 3.5rem; height: 2.2rem; padding-top: 20%; } .n_pic_txt li a .txt { width: calc(100% - 3.9rem); } .n_pic_txt li a .txt h3 { font-size: .18rem; color: #333333; line-height: .32rem; margin-bottom: .1rem; } .n_pic_txt li a .txt time { display: block; font-size: .14rem; color: #c31c14; line-height: 1; margin-bottom: .15rem; } .n_pic_txt li a .txt i { display: inline-block; font-size: .24rem; font-weight: 600; margin-right: .1rem; line-height: 1; } .n_pic_txt li a .txt p { font-size: .14rem; line-height: .25rem; color: #999999; -webkit-line-clamp: 4; height: 1rem; } .n_pic_txt li:after { position: absolute; content: ''; left: -.28rem; right: -.28rem; top: 0; bottom: 0; background: #058448; opacity: 0; visibility: hidden; transition: .3s; } .n_pic_txt li { position: relative; padding-top: .4rem; padding-bottom: .4rem; border-top: 1px solid #e5e5e5; } .n_pic_txt li:first-child { border: 0; } .n_pic_txt li:hover:after { opacity: 1; visibility: visible; } .n_pic_txt li:hover a .txt h3, .n_pic_txt li:hover a .txt time, .n_pic_txt li:hover a .txt p { color: #fff; } /*n_detail*/ .n_detail p { font-size: .16rem; color: #666666; text-indent: 2em; line-height: 2em; margin-top: .34rem; } .n_detail img, .n_con_txt img { display: block; width: auto; max-width: 100%; margin: 0 auto; } /*n_content*/ .n_con_tit h2 { font-size: .24rem; color: #333; text-align: center; line-height: 2em; margin-bottom: .06rem; } .n_con_tit p { font-size: 0; text-align: center; } .n_con_tit p .lll { display: inline-block; font-size: .16rem; color: #999999; line-height: 2em; margin: 0 .59rem; } .n_con_tit { padding-bottom: .22rem; margin-bottom: .3rem; border-bottom: 1px solid #e5e5e5; } .n_con_txt p { font-size: .16rem; color: #333333; line-height: 2.125em; text-indent: 2em; margin-bottom: .15rem; text-align: justify; } .n_con_txt { padding: 0 .42rem; } .n_content { padding-top: .35rem; } .img-lists ul { overflow: hidden; margin-left: -2%; margin-right: -2%; } .img-lists ul li { float: left; width: 29%; margin: 40px 2% 0 2%; border: 1px solid #eee; transition: all 0.3s; position: relative; top: 0; } .img-lists ul li:hover { box-shadow: 0 0 10px rgba(51, 51, 51, 0.16); top: -10px; } .img-lists ul li a { display: block; width: 100%; } .img-lists ul li a .pic { padding-top: 70%; } .img-lists .pic { padding-top: 75%; position: relative; overflow: hidden; } .img-lists .pic img { position: absolute; left: 0; top: 0; width: 100%; height: 100%; transition: all 0.5s; } .img-lists .pic img:hover { transform: scale(1.2); cursor: pointer; } .img-lists ul li a>img { display: block; width: 100%; height: 196px; } .img-lists ul li a>div.info { padding: 10px; font-size: 0; text-align: center; } .img-lists ul li a>div.info p { color: #333; font-size: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 5px; } .img-lists ul li:hover a>div.info p { color: #083059; } @media screen and (max-width: 1024px) { .banner { margin-top: .75rem; } .n_container { padding: .3rem 0; } .position { justify-content: flex-start; } .leftNav { width: 100%; margin-top: 0; box-shadow: none; } .leftNav .lv1 { border-radius: 0; display: none; } .leftNav .lv1>li h2 { text-align: left; padding: .15rem .2rem; } .leftNav h4 { text-align: left; padding: .1rem .2rem; } .leftNav h4 i { position: absolute; width: .24rem; right: .2rem; top: 0; bottom: 0; background: no-repeat 50%; background-size: .24rem; } .leftNav .lv2>li { padding-left: .2rem; } .leftNav .lv1>li h2 i { opacity: 1; visibility: visible; } .rightBox { width: 100%; padding-top: .2rem; } .n_list li a .txt h3 { font-size: .18rem; } .n_list li a .txt p { font-size: .27rem; line-height: .4rem; } .n_list li { padding: .25rem 0; } .n_con_txt { padding: 0 .2rem; } .n_content {} .n_con_tit h2 { line-height: 0.5rem; font-size: .38rem; } .n_con_tit p { font-size: .3rem; } .n_con_tit p .lll { font-size: .27rem; } } @media screen and (max-width: 768px) { .img-lists ul li { width: 46%; margin: 20px 2% 0 2%; } .leftNav .lv1>li h2 { font-size: .2rem; } .leftNav .lv2>li a { font-size: .18rem; } .n_tit h4 { font-size: .28rem; } .n_list li a .txt h3 { font-size: .3rem; line-height: .4rem; } .t-list li a .txt p { font-size: .16rem; } .t-list li { width: 100%; margin-bottom: .3rem; } .t-list { padding-top: .3rem; } .t-list li a .txt h3 { font-size: 16px; } .n_pic_txt li a .txt h3 { font-size: .3rem; line-height: .5rem; } .n_pic_txt li a .txt time { font-size: .24rem; line-height: .5rem; } .n_pic_txt li a .txt p { font-size: .27rem; line-height: .5rem; height: 3rem; } .n_detail p, .n_con_txt p { font-size: .27rem; } .n_con_txt { padding: 0.2rem 0 1rem 0; } } @media screen and (max-width: 640px) { .n_pic_txt li a .pic { width: 100%; height: auto; padding-top: 62.86%; } .n_pic_txt li a .txt { width: 100%; padding: .2rem 0.1rem; } .n_pic_txt li { padding: .2rem 0 0; } } @media screen and (max-width: 480px) { .t-list li a .txt { width: calc(100% - 1.8rem); } }