@charset "utf-8"; .gp-container2{max-width:1500px;margin-left: auto;margin-right: auto;width: 100%;} /* .ft_logo img{ transform: none; opacity: 1;} */ .top .logo, .topNav{ transform: unset; opacity: unset;} .divPlayerImgResponsive{max-width: 680px;overflow: hidden;position: relative;margin: 15px auto;} .subBanner{ position: relative; z-index: 0;} .subBanner::before{content: '';display: block;width: 100%;height: 10px;/* background: #971E25; */position: absolute;top: 0;left: 0;z-index: 2;} .subBanner .gp-img-responsive{ padding-bottom: calc(600% / 19.2); position: relative; z-index: 1;} .subBanner .gp-img-responsive::after{ content: ''; display: block; width: 100%; height: 100px; background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%); background: -webkit-linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%); background: -moz-linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%); background: -o-linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%); position: absolute; bottom: 0; left: 0; z-index: 2; opacity: 0.8;} .subBanner .gp-img-responsive img:hover{ transform: scale(1); opacity: 1;} .subBanner .gp-img-responsive::before{ content: ''; display: block; width: 100%; height: 140px; background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%); background: -webkit-linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0) 100%); position: absolute; top: 0; left: 0; z-index: 1;} .subBanner .currentPage{ width: 100%; height: auto; padding-bottom: 24px; position: absolute; bottom: 0; left: 0; z-index: 3;} .subBanner .currentPage .flex{ align-items: flex-end;} .subBanner .pageTitle{ line-height: 51px;} .subBanner .bread{ line-height: 26px;} .gp-left{ width: 300px; flex-shrink: 0; padding-left: 20px; padding-top: 20px; background: url(../images/sider_bg.png) no-repeat center top; background-size: 100% auto;} .gp-right{ width: calc(100% - 350px);} .curTitle a{ display: inline-block; line-height: 39px; padding-bottom: 10px; border-bottom: 4px solid #971E25; min-width: 120px;} /*侧边栏*/ .gp-subLeft{background: #F2F2F2 url(../images/sider_bg2.png) no-repeat right bottom; min-height: 404px; padding: 10px 30px 0; box-sizing: border-box; position: relative;} .gp-subLeft::before{ content: ''; display: block; width: 100%; height: 8px; background: url(../images/sider_bottom.png) no-repeat center/cover; position: absolute; top: 100%; left: 0;} .gp-subLeft > ul >li{position: relative;} .gp-subLeft > ul >li::marker{ content: '';} .gp-subLeft > ul >li > a{padding:20px 0;padding-right: 40px;line-height: 26px;display: block;border-bottom: 1px dashed rgba(0, 0, 0, 0.1);/* margin-right: 0px; */transition: all 0.35s ease-in-out;} .gp-subLeft > ul >li > a:hover,.gp-subLeft > ul >li > a.active{transition: all 0.35s ease;/* background: transparent; *//* margin-right: 0; *//* color:#971E25; */} .gp-subLeft > ul >li > a:hover::before,.gp-subLeft > ul >li > a.active::before{ content: "\e642"; font-family: "iconfont"; color:#971E25; display: block; width: 20px; height: 20px; position: absolute; right: 0; top: 50%; transform: translateY(-50%) rotateZ(90deg);} .gp-subLeft .gp-toggles{width: 58px;height: 58px;position: absolute;right: 0px;top: 0;line-height: 48px;text-align: center;cursor: pointer;transform: rotate(180deg);color:#666;} .gp-subLeft .icon-a-gong1:before{font-size: 20px;} .gp-second-nav{font-size: 14px;display: none;background: rgba(255,255,255,.1);} .gp-second-nav dd a{display: block;padding:10px 15px 10px 20px;color:#666;border-bottom: 1px dotted #fff;transition: all 0.35s ease-in-out;font-size: 16px;} .gp-second-nav dd a:hover,.gp-second-nav dd a.active{color: #971E25;} .gp-subLeft > ul > li > a.active::before{display: none;} /*侧边栏移动端 */ .gp-m-subNav{display:none;} .gp-m-inner-header{width:100%;height:50px;background-color:rgba(151,30,37,1);cursor:pointer;line-height: 50px;} .gp-m-inner-header > span{ display: inline-block; max-width: calc(100% - 65px); height: 50px;padding-left: 15px;font-size: 18px;color:#fff;} .gp-m-subNav .gp-m-inner-header-icon{float: right;width: 50px;height: 50px;text-align: center; color: #fff;} .gp-m-subNav .gp-m-inner-header-icon-click i{display: block;} .gp-m-subNav .gp-m-inner-header-icon i::before{ font-size: 18px;} .gp-subNavm{ width:100%; overflow: hidden;display: none;} .gp-subNavm h2{width:100%;height:48px;line-height:48px;background-color:#003c7f;} .gp-subNavm h2 a{padding-left:13px;font-size:20px;font-family:Tahoma;display:block;color:#fff;} .gp-subNavm ul{} .gp-subNavm li{position: relative;} .gp-subNavm li::marker{ content: '';} .gp-subNavm li > a{ font-size: 16px;padding-left:13px;line-height:20px; padding: 15px 10px; border-bottom:1px solid #e6e6e6;display:block;} .gp-subNavm li.sub_has span{ margin-left: 10px;} .gp-subNavm li.on a{ color:#003c7f; display:block; width:100%;} .gp-m-toggle{width: 40px;height: 40px;position: absolute;right: 0;top: 0;line-height: 40px;text-align: center;} .gp-subNavm dl{ display: none; background-color:#fff; padding:5px 0px;} .gp-subNavm dl dd{ padding-left: 30px; line-height:18px; padding:8px 0px 8px 30px;border-bottom: 1px dotted #e6e6e6;} .gp-subNavm li dl dd a{ font-size: 12px; font-weight:normal; display:inline; border:none; padding:0px;} .gp-subNavm li dl dd a:hover{ color:#a70510} .icon-jia::before{ content: '\e889';} .icon-down::before{ content: '\e729';} @media screen and (max-width:998px) { .gp-subLeft{display: none;} .gp-m-subNav{display: block;} } /* article */ .article{ padding-top: 80px;} .subContent > .article{padding-bottom: 60px} .article .pageCon{ padding-top: 50px;} .gp-title{ text-align: center; font-weight: bold; line-height: 39px;} .gp-info{ background: #F8F8F8; margin-top: 30px; padding: 20px 0; font-size: 0; text-align: center;} .gp-info span{ margin-right: 30px; color: #999999; line-height: 20px;} .gp-info span:last-child{ margin-right: 0px;} .gp-content{ padding-top: 25px;} .gp-content p{ line-height: 30px; margin-bottom: 20px; text-align: justify;} .gp-content h3{ margin-bottom:20px} .gp-content p:nth-last-of-type(1){ margin-bottom: 0px;} .Annex{ margin: 50px 0 60px;} .Annex h2{ line-height: 60px; background: #F8F8F8; padding-left: 30px; color: #971E25; font-weight: normal;} .Annex ul{ padding-left: 0; margin: 0;} .Annex li::marker{ content: '';} .Annex li{ padding: 0 30px; box-sizing: border-box;} .Annex a{ display: block; padding: 20px 0px; line-height: 26px; border-bottom: 1px solid rgba(0, 0, 0, 0.1);} .Annex li:last-child a{border-bottom: none;} /* introduct */ .introduct{ padding: 80px 0;} .introduct .pageCon.article{ padding-top: 0;} .introduct .gp-content{ padding-top: 30px;} /* 科大简介 - intro */ .intro{ padding: 80px 0;} .intro .enterTil{ font-weight: bold; line-height: 39px; align-items: center;} .intro .enterTil .til{ padding: 25px 0 0 31px; position: relative;} .intro .enterTil .til::before{ content: ''; display: block; width: 54px; height: 64px; background: url(../images/enter_icon.svg) no-repeat center/cover; position: absolute; top: 0; left: 0;} .intro .more{ display: inline-block; color: #fff; font-weight: normal; padding: 10px 53px 9px 13px; box-sizing: border-box; line-height: 20px; background: #971E25; position: absolute; right: -130px; bottom: 20px; z-index: 2;} .intro .more::before, .intro .more::after{ content: ''; display: block; width: 0; height: 0; position: absolute; top: 0; right: -9px;} .intro .more::before{border-top: 11px solid transparent;border-right: 5px solid transparent;border-bottom: 10px solid #971E25;border-left: 5px solid #971E25;box-sizing: border-box;} .intro .more::after{ top: auto; bottom: 0; border-top: 10px solid #971E25; border-right: 5px solid transparent; border-bottom: 10px solid transparent; border-left: 5px solid #971E25;} .intro .more i{ position: absolute; top: 50%; right: 3px; transform: translateY(-50%);} .introModeCon{ margin-top: 52px;} .introMode01 .introModeCon{ position: relative;} .introMode01 .left{ width: calc(800% / 15); flex-shrink: 0; padding: 72px 180px 72px 70px; box-sizing: border-box; background: #F2F2F2; position: relative;} .introMode01 .left p{ line-height: 34px; text-align: justify;} .introMode01 .right{ width: calc(784% / 15); position: absolute; right: 0; top: -116px;} .introMode01 .right .gp-img-responsive{ padding-bottom: 56.25%;} /* .introMode02{ margin-top: 80px; padding: 105px 0 172px; box-sizing: border-box; background: url(../images/introMode02_bg.png) no-repeat center/cover;} */ .introMode02{ height: 0; padding-bottom: calc(366% / 19.2); margin-top: 80px;} .introMode02 .introModeCon{ text-align: center;} .introMode02 ul{ margin: 0 -1px;} .introMode02 li{ margin-bottom: 1px;} .introMode02 li a{ display: block; background: rgba(255, 255, 255, 0.2); padding: 40px 0 36px; box-sizing: border-box; margin: 0 1px; transition: all 0.35s ease;} .introMode02 li:nth-of-type(2){ width: 50%;} .introMode02 li a:hover{ background: rgba(255, 255, 255, 0.26);} .introMode02 li .dept{ line-height: 29px;} .introMode02 li .address{ line-height: 24px;} .introMode03{ overflow: hidden;} .introMode03 .enterTil{ margin-top: 90px;} .introMode03 .left{ width: calc(609% / 15);} .introMode03 .lable{ line-height: 30px; padding-top: 38px; margin-top: 80px; position: relative;} .introMode03 .left .lable{ max-width: 510px;} .introMode03 .left .lable::before{ content: ''; display: block; width: 100px; height: 8px; background: #971E25; position: absolute; top: 0px; left: 0;} .introMode03 .left .more{ position: relative; top: 0; right: 0; margin-top: 45px;} .introMode03 .right{ width: calc(889% / 15); background-image: linear-gradient(to top, #f2f2f2 0%, #f2f2f2 50%, rgba(0,0,0,0) 51%);} .introMode03 .right .up{ font-size: 0; width: calc(700% / 8.89); background: #fff; position: relative;} .introMode03 .right .up .img2{ position: absolute; bottom: 0; left: 100%; margin-left: -50%; width: 100%; min-width: 750px;} .introMode03 .right .down{ font-size: 0; width: calc(700% / 8.89); position: relative;} .introMode03 .right .down .img1{ position: absolute; top: 0; right: 100%; width: 100%; max-width: 610px; height: 100%; background: #912228;} .introMode03 .song{ color: #fff; text-align: center; position: absolute; top: 50%; transform: translateY(-50%); left: 0; width: 100%; line-height: 1;} .introMode03 .song > div{ margin-bottom: 40px;} .introMode03 .song > div:last-child{ margin-bottom: 0px;} .introMode03 .song > div:last-child span{ margin-right: 45px;} .introMode03 .song > div:last-child span:last-child{ margin-right: 0px;} .introMode03 .right .up .img1{ width: 50%; } .introMode03 .right .down .img2{ width: 50%; } .introMode03 .right .down .img3{ padding-left: 50%;} .introMode03 .right .down .img4{ position: absolute; top: 100%; right: 0; width: 50%;} .introMode03 .identification{ width: calc(860% / 15);} .introMode03 .identification .enterTil{ margin-top: 50px;} .introMode03 .identification .more{ position: relative;top: 0; right: 0;} .introMode03 .identification .lable{ margin-top: 50px; padding-top: 0; padding-bottom: 50px;} /* 院所设置 - deptList */ .deptList{ background: url(../images/dept_bg.png) no-repeat center top; background-size: 100% auto; padding-top: 80px;} .deptList .lable{color: #fff;/* text-align: center; */padding-top: 60px;position: relative;} .deptList .lable::before{ content: ''; display: block; width: 150px; height: 10px; background: #F5DA4D; position: absolute; top: 0; left: 50%; transform: translateX(-50%);} .deptList .lable p{ line-height: 40px;} .deptList ul{ background: #F2F2F2; padding: 90px 100px 40px; box-sizing: border-box; margin: 80px -25px 0;} .deptList ul a{ display: block; margin: 0 25px; background: #fff; line-height: 120px; padding-left: 50px; color: #951D22; position: relative; transition: all 0.35s ease;} .deptList ul a:hover{ transform: translateY(-8px);} .deptList li{ margin-bottom: 40px;} .deptList li:nth-of-type(4n + 1) a{ background: #fff url(../images/dept_li_bg1.png) no-repeat right center;} .deptList li:nth-of-type(4n) a{ background: #fff url(../images/dept_li_bg2.png) no-repeat right center;} /* 师资队伍 - teacher */ .teacher{ padding-top: 80px; position: relative; background: url(../images/teacher_bg.png) no-repeat top right; background-position: 108.3% -25.3%;} .teacher .enterTil{ font-weight: bold; line-height: 39px; align-items: center;} .teacher .enterTil .til{ padding: 25px 0 0 31px; position: relative;} .teacher .enterTil .til::before{ content: ''; display: block; width: 54px; height: 64px; background: url(../images/enter_icon.svg) no-repeat center/cover; position: absolute; top: 0; left: 0;} .teacher .people{ margin-top: 50px; background: url(../images/teacher_bg2.png) no-repeat center/cover; padding: 70px 0 106px;} .teacher .left{ width: calc(687% / 15);} .teacher .right{ width: calc(687% / 15);} .teacher .people ul{ flex-wrap: wrap;} .teacher .people li{ margin-top: 47px; width: calc(50% - 20.5px); border-bottom: 1px dashed #fff;} .teacher .people li:hover{ border-bottom: 1px solid #fff;} .teacher .people li a{ padding-left: 45px; padding-bottom: 16px; justify-content: flex-start; position: relative; transition: all 0.35s ease;} .teacher .people li a::before{ content: ''; display: block; width: 30px; height: 30px; border-radius: 50%; background: rgba(255, 255, 255, 0.3); position: absolute; left: 0; top: 0px; transition: all 0.35s ease;} .teacher .people li a::after{ content: ''; display: block; width: 14px; height: 14px; border-radius: 50%; background: rgba(255, 255, 255, 1); position: absolute; left: 8px; top: 8px;} .teacher .people li a:hover::before{ background: #DA0D2B;} .teacher .people li .til{ font-weight: bold; line-height: 31px;} .teacher .people li .year{ padding-right: 16px; margin-right: 16px; flex-shrink: 0; position: relative;} .teacher .people li .year::before{ content: ''; display: block; width: 1px; height: 21px; background: rgba(255, 255, 255, 0.2); position: absolute; right: 0; top: 6px; } .teacher .people li .name{ font-size: 0; min-height: 31px;} .teacher .people li .name span{ display: inline-block; margin-bottom: 11px;} .teacher .people li .name span:nth-of-type(odd){ margin-right: 21px;} .teacher .chilChannel{ padding: 100px 0 150px; background: url(../images/teacher_bg3.png) no-repeat center/cover;} .teacher .chilChannel ul{margin: 0 -5px;} .teacher .chilChannel li:nth-of-type(2), .teacher .chilChannel li:nth-of-type(4){ position: relative; top: 50px;} .teacher .chilChannel a{ display: block; margin: 0 5px; height: 0; padding-bottom: calc(500% / 2.92); overflow: hidden; position: relative;} .teacher .chilChannel a .bg{ max-width: unset; position: absolute; top: 0; left: 0; right: 0; bottom: 0; z-index: 0; transition: all 0.35s ease;} .teacher .chilChannel a:hover .bg{ transform: scale(1.02); opacity: 0.8;} .teacher .chilChannel a div{ color: #fff; max-width: 20px; line-height: 25.5px; position: relative; z-index: 1;} .teacher .chilChannel a .name{ padding-top: 30px; padding-left: 50px; font-weight: bold;} .teacher .chilChannel a .more{ font-size: 16px; line-height: 20.5px; position: absolute; right: 50px; bottom: 30px;} .teacher .chilChannel a .more::before{ content: ''; display: block; width: 1px; height: 150px; background: #fff; position: absolute; bottom: calc(100% + 20px); left: calc(50% - 4px);} /* 期刊 - journal */ .journal ul{ margin: 0 -22.5px; padding: 80px 0;} .journal ul li{ margin-bottom: 30px;} .journal li a{ display: block; margin: 0 22.5px; transition: all 0.35s ease;} .journal li a:hover{ transform: translateY(-8px);} .journal .gp-img-responsive{ padding-bottom: 56.25%;} .journal li:hover .gp-img-responsive img{ transform: scale(1.08); opacity: 0.85;} .journal .title{ line-height: 26px; margin-top: 30px;} /* 学员风采 - student */ .student { padding-top: 80px;} .student .pageCon ul{ margin: 0 -20px; padding: 40px 0;} .student .pageCon li{ margin-bottom: 30px;} .student .pageCon li a{ display: block; margin: 0 20px; transition: all 0.35s ease;} .student .pageCon li a:hover{ transform: translateY(-8px);} .student .pageCon .gp-img-responsive{ padding-bottom: 56.25%;} .student .pageCon li:hover .gp-img-responsive img{ transform: scale(1.08); opacity: 0.85;} .student .pageCon .title{ line-height: 26px; margin-top: 30px;} .student .pageCon .summary{ color: #999; line-height: 30px; margin-top: 20px;} /* 人物风采 - celebrity */ .celebrity{ } .celebrity ul{padding: 80px 0 40px; margin: 0 -20px;} .celebrity li{ margin-bottom: 40px;} .celebrity ul a{ display: block; box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1); border-radius: 20px; padding: 30px; margin: 0 20px; transition: all 0.35s ease;} .celebrity ul a:hover{ transform: translateY(-8px);} .celebrity ul .subtitle{ margin-top: 42px; height: 52px;} .celebrity ul .name{ font-weight: bold; line-height: 30px; min-height: 30px; position: relative;} .celebrity ul .name::before{ content: ''; display: block; width: 120px; height: 2px; background: #F5DA4D; position: absolute; bottom: -22px; left: 0px; transition: all 0.35s ease;} .celebrity li:hover .name::before{ background: url(../images/name_line.png) no-repeat center/cover;} .celebrity ul .img{ margin-top: 30px; border-radius: 8px; overflow: hidden;} .celebrity ul .summary{ line-height: 30px; margin-top: 20px;} .celebrity ul a:hover .summary{ color: #666;} /* 新媒体矩阵 - media */ .media{ padding-top: 80px;} .media .cascade{ margin: 50px -20px 0; position: relative;} .media .cascade li{ width: 33.33%; padding-bottom: 30px; position: absolute; transition: all 0.35s ease;} .media .cascade li a{ display: block; margin: 0 20px; transition: all 0.35s ease; } .media .cascade li a:hover{ transform: translateY(-8px);} .media .cascade .liImg{ width: 100%; font-size: 0;} .media .cascade .liImg img{ width: 100%;} .media .cascade .title{ line-height: 25.5px; padding: 29px 30px; box-sizing: border-box; border: 1px solid #F0F0F0;} .noLeft .gp-right{ width: 100%;} /* notice */ .notice{ padding-top: 110px;} .notice .pageCon ul{ margin: 0 -20px;} .notice.noLeft .pageCon ul{ margin: 0 -25px;} .notice.noLeft .pageCon ul a{ margin: 0 25px;} .notice .pageCon li{ margin-bottom: 40px; padding-top: 30px;} .notice .pageCon ul a{ display: block; margin: 0 20px; padding: 40px 180px 40px 50px; box-sizing: border-box; box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1); position: relative; transition: all 0.35s ease;} .notice .noLeft .pageCon ul a{ padding: 40px 240px 40px 50px; } .notice .pageCon ul a:hover{ background: #971E25;} .notice .pageCon ul a:hover .title, .notice .pageCon ul a:hover i{ color: #fff;} .notice .pageCon ul a::before{ content: ''; display: block; width: 4px; height: 50px; background: #971E25; position: absolute; left: 0px; top: 50px;} .notice .pageCon .date{ width: 120px; height: 150px; background: url(../images/notice_date_bg.png) no-repeat center/cover; position: absolute; right: 50px; top: -30px;} .notice .pageCon .date span{ display: block; text-align: center; color: #971E25; line-height: 21px;} .notice .pageCon span.day{ font-weight: bold; line-height: 51px; margin-top: 15px; padding-bottom: 32px;} .notice .pageCon .title{ line-height: 40px; height: 80px; position: relative; transition: all 0.35s ease;} .notice .pageCon i{ display: block; width: 20px; height: 20px; overflow: hidden; color: #971E25; font-size: 20px; margin-top: 20px; transition: all 0.35s ease;} /*分页*/ .gp-page { padding:10px 0 70px; color:#999; font-size: 0;} .gp-page:after,.gp-page:before { content:" "; display:table} .gp-page>a,.gp-page>span{display:inline-block;*display: inline;*zoom:1;cursor: pointer;width: 40px;height: 40px;line-height: 39px;box-sizing: border-box; position:relative;text-align: center; border:1px solid #ddd; margin-left:10px;vertical-align: top; font-size: 20px;} .gp-page .gp-page-start,.gp-page .gp-page-end,.gp-page .gp-page-next,.gp-page .gp-page-prev,.gp-page > span {width: auto;padding:0 15px; border: none;} .gp-page .gp-page-start{ margin: 0; padding: 0 20px 0 0;} .gp-page .gp-page-end{ margin: 0; padding: 0 0 0 20px;} .gp-page span{border:none; color: #333;} .gp-page > a:hover, .gp-page > a.active{ background-color:#961D22; color: #fff;} .gp-page > a.gp-page-start:hover, .gp-page > a.gp-page-end:hover { background-color:transparent; color: #961D22;} .gp-page .gp-page-next, .gp-page .gp-page-prev{ margin: 0; padding: 0;} .gp-page .gp-page-prev{ padding-right: 20px;} .gp-page .gp-page-next{ padding-left: 20px;} .gp-page .gp-page-next:hover, .gp-page .gp-page-prev:hover{ background: transparent; color: #961D22;} .gp-m-page{ display: none;} .gp-m-page a{display: inline-block;margin:0 10px} /*居中*/ .gp-page-centered {text-align:center} /*右对齐*/ .gp-page-right {text-align:right} .gp-page .inlineBlock{ padding-left: 30px; line-height: 40px;} .gp-page .gp-page-select{ margin: 0 10px; display: inline-block; width: auto; height: 40px; line-height: 39px; box-sizing: border-box; border: 1px solid rgba(0, 0, 0, 0.1); vertical-align: top; position: relative;} .gp-page .gp-page-select dl{ width: 100%; max-height: 0px; overflow: hidden; background: #fff; box-shadow: 0px 2px 10px rgba(0, 0, 0, 0.1); position: absolute; bottom: 100%; transition: all 0.35s ease;} .gp-page .gp-page-select:hover dl{ max-height: 300px;} .gp-page .gp-page-select dl dd{ border-bottom: 1px solid rgba(0, 0, 0, 0.05);} .gp-page .gp-page-select dl dd:hover a{ display: block; background: #961D22; color: #fff;} .gp-page .gp-page-select p{ display: inline-block; width: auto; min-width: 40px; height: 100%; opacity: 0;} .gp-page .gp-page-select input{ padding: 0; margin: 0; outline: none; height: 100%; width: 100%; text-align: center; font-size: 20px; position: absolute; left: 0; top: 0; z-index: 2;} .gp-page .gp-page-select input::placeholder{ color: #333; font-size: 20px; line-height: 40px;} .gp-page .inlineBlock .tips{ display: inline-block; font-size: 16px; color: #961D22; margin-left: 10px;} .inlineBlock{ display: inline-block;} /* 科学研究 */ .research{ padding: 80px 0 0;} .research .swiper{ overflow: hidden; position: relative;} .research .swiper .left{ width: calc(800% / 15); flex-shrink: 0;} .research .swiper .left .gp-img-responsive{ padding-bottom: calc(450% / 8);} .research .swiper .right{ width: calc(660% / 15); } .research .swiper .date{ color: #971E25; line-height: 26px; margin-top: 50px;} .research .swiper .date .line{ margin: 0 10px;} .research .swiper .title{ line-height: 26px; margin-top: 30px;} .research .swiper .summary{ color: #999; line-height: 30px; padding-top: 30px; margin-top: 20px; -webkit-line-clamp: 3; position: relative;} .research .swiper .summary::before{ content: ''; display: block; width: 100%; height: 1px; background: rgba(0, 0, 0, 0.1); position: absolute; top: 0; left: 0;} .research .position{ position: absolute; right: 0; bottom: 50px; width: calc(660% / 15); min-height: 64px; z-index: 2;} .research .swiper-button-prev, .research .swiper-button-next{ position: absolute; bottom: 0; right: 0; display: block; width: 64px; height: 64px; line-height: 64px; border: 1px solid rgba(151,30,37,0.3); box-sizing: border-box; border-radius: 50%; text-align: center; font-size: 30px; color: #971E25; transition: all 0.35s ease;} .research .swiper-button-prev:hover, .research .swiper-button-next:hover{ background: #971E25; border-color: #971E25;} .research .swiper-button-prev:hover::before, .research .swiper-button-next:hover::before{ transition: all 0.35s ease; color: #fff;} .research .swiper-button-prev{ transform: rotateZ(180deg); left: auto; right: 94px;} .research .swiper-button-prev::after, .research .swiper-button-next::after{ display: none;} .research .swiper-pagination{ position: absolute; left: 0; bottom: 0; width: auto; color: #971E25; letter-spacing: -3px;} .research .swiper-pagination-current{ font-size: 40px;} .research .listCon{ padding-top: 0px;} .research.noLeft .listCon{ padding-top: 50px;} .research .listCon li{ margin-bottom: 40px;} .research .listCon a{padding: 20px;padding-right: 130px;position: relative;transition: all 0.35s ease;box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);} .research .listCon a:hover{ transform: translateY(-8px);} .research .listCon a:hover .title{ font-weight: bold;} .research .listCon .liImg{ width: calc(400% / 13.7); flex-shrink: 0;} .research .listCon .liImg .gp-img-responsive{ padding-bottom: calc(225% / 4);} .research .listCon .info{ width: calc(920% / 13.7); border-right: 1px solid #971E25; padding-right: 50px; box-sizing: border-box;} .research .listCon .noImg .info{ width: 100%;} .research .listCon .noLeft .title{ margin-top: 35px;} .research .listCon .title{ line-height: 26px; margin-top: 10px;} .research .listCon .summary{ line-height: 30px; color: #999; margin-top: 20px; padding-top: 20px; position: relative;} .research.noLeft .listCon .summary{ padding-top: 40px; margin-top: 30px;} .research .listCon .summary::before{ content: ''; display: block; width: 100%; height: 1px; background: rgba(0, 0, 0, 0.1); position: absolute; top: 0; left: 0;} .research .listCon .date{position: absolute;right: 20px;top: 50%;transform: translateY(-50%);color: #971E25;text-align: center;line-height: 26px;} .research .listCon .date .day{ font-weight: bold; line-height: 51px; margin-bottom: 20px;} /* picture */ .picture{ padding: 80px 0;} .picture .pageCon{ padding-top: 30px; overflow: hidden;} .picture .swiper-slide{ position: relative;} .picture .swiper-slide .gp-img-responsive{ padding-bottom: calc(646.88% / 11.5);} .picture .lable{ width: auto; max-width: 90%; line-height: 26px; padding: 20px 50px; box-sizing: border-box; color: #fff; background: rgba(0, 0, 0, 0.4); position: absolute; bottom: 60px; left: 50%; transform: translateX(-50%); z-index: 2;} .picture .bigSwiper{ position: relative;} .picture .bigSwiper .swiper-button-prev, .picture .bigSwiper .swiper-button-next{ display: block; width: 60px; height: 100px; background: rgba(0, 0, 0, 0.4); transform: translateY(-50%); z-index: 2; left: 0;} .picture .bigSwiper .swiper-button-next{ left: auto; right: 0;} .picture .bigSwiper .swiper-button-prev::after, .picture .bigSwiper .swiper-button-next::after{ font-size: 28px; position: absolute; top: 50%; left: 50%; transform: translate3d(-50%,-50%,0); color: #fff;} .limitWidth{ width: calc(880% / 11.5); margin: 0 auto; position: relative; z-index: 10;} .limitWidth .swiper-slide{ transition: all 0.35s ease; } .limitWidth .swiper-slide-thumb-active{ border: 3px solid #F5DA4D; box-sizing: border-box;} .picture .listSwiper{ width: 100%; margin-top: -30px; position: relative; overflow: hidden;} .picture .limitWidth .swiper-button-prev, .picture .limitWidth .swiper-button-next{ display: block; width: 50px; height: 50px; border-radius: 50%; border: 1px solid rgba(151,30,37,0.3); left: -80px; z-index: 2; line-height: 50px; text-align: center; transition: all 0.35s ease; top: auto; bottom: 0;} .picture .limitWidth .swiper-button-next{ left: auto; right: -80px;} .picture .limitWidth .swiper-button-prev::before, .picture .limitWidth .swiper-button-next::before{ font-size: 23px; color: #971E25; transition: all 0.35s ease;} .picture .limitWidth .swiper-button-prev{ transform: rotateZ(180deg);} .picture .limitWidth .swiper-button-prev::after, .picture .limitWidth .swiper-button-next::after{ display: none;} .picture .limitWidth .swiper-button-prev:hover, .picture .limitWidth .swiper-button-next:hover{ background: #971E25; border-color: #971E25;} .picture .limitWidth .swiper-button-prev:hover::before, .picture .limitWidth .swiper-button-next:hover::before{ color: #fff;} /* enter-校园生活 / 科大故事 */ .enter{ padding: 80px 0 0;} .enter01, .enter03{ padding-bottom: 80px;} .enter03{ flex-direction: row-reverse; padding-top: 96px;} .enter01 .left, .enter03 .left{ width: calc(600% / 15);} .enter01 .left .gp-img-responsive, .enter03 .left .gp-img-responsive{ padding-bottom: calc(900% / 6);} .enter01 .right, .enter03 .right{ width: calc(820% / 15);} .enter .enterTil{ font-weight: bold; line-height: 39px; align-items: center;} .enter .enterTil .til{ padding: 25px 0 0 31px; position: relative;} .enter .enterTil .til::before{ content: ''; display: block; width: 54px; height: 64px; background: url(../images/enter_icon.svg) no-repeat center/cover; position: absolute; top: 0; left: 0;} .enter .enterTil .more{ display: block; color: #fff; font-weight: normal; padding: 10px 53px 9px 13px; box-sizing: border-box; line-height: 20px; background: #971E25; position: relative;} .enter .enterTil .more::before, .enter .more::after{ content: ''; display: block; width: 0; height: 0; position: absolute; top: 0; right: 0;} .enter .more::before{ border-top: 10px solid #fff; border-right: 5px solid #fff; border-bottom: 10px solid transparent; border-left: 5px solid transparent;} .enter .more::after{ top: auto; bottom: 0; border-top: 10px solid transparent; border-right: 5px solid #fff; border-bottom: 10px solid #fff; border-left: 5px solid transparent;} .enter .enterTil .more i{ position: absolute; top: 50%; right: 13px; transform: translateY(-50%);} .enterFirstNew{ display: block; margin-top: 49px; padding-bottom: 50px; border-bottom: 1px solid rgba(0, 0, 0, 0.1); transition: all 0.35s ease;} .enterFirstNew:hover{ transform: translateY(-8px);} .enterFirstNew:hover .title{ font-weight: bold;} .enter01 .title, .enter03 .title{ line-height: 26px;} .enter01 .summary, .enter03 .summary{ line-height: 30px; height: 60px; margin-top: 31px; color: #999;} .enter01 .date, .enter03 .date{ color: #971E23; line-height: 21px; margin-top: 30px;} .enterModeCon{ padding-top: 50px; position: relative;} .enter01 .enterModeCon li, .enter03 .enterModeCon li{ padding-bottom: 28px; border-bottom: 1px dashed rgba(0, 0, 0, 0.1); margin-bottom: 28px;} .enter01 .enterModeCon li:last-child, .enter03 .enterModeCon li:last-child{ margin-bottom: 0px; border-bottom: none; padding-bottom: 0;} .enter01 .enterModeCon li a, .enter03 .enterModeCon li a{ transition: all 0.35s ease;} .enter01 .enterModeCon li a:hover, .enter03 .enterModeCon li a:hover{ transform: translateY(-8px);} .enter01 .enterModeCon .pic, .enter03 .enterModeCon .pic{ width: calc(240% / 8.2);} .enter01 .enterModeCon .pic .gp-img-responsive, .enter03 .enterModeCon .pic .gp-img-responsive{ padding-bottom: calc(135% / 2.4);} .enter01 .enterModeCon li.noImg .info, .enter03 .enterModeCon li.noImg .info{ width: 100%;} .enter01 .enterModeCon .info, .enter03 .enterModeCon .info{ width: calc(550% / 8.2);} .enter01 .enterModeCon .summary, .enter03 .enterModeCon .summary{ margin-top: 10px;} .enter01 .enterModeCon .date, .enter03 .enterModeCon .date{ margin-top: 18px;} .enter .enter04 .more::before{ border-top: 10px solid #F2F2F2; border-right: 5px solid #F2F2F2; border-bottom: 10px solid transparent; border-left: 5px solid transparent;} .enter .enter04 .more::after{ top: auto; bottom: 0; border-top: 10px solid transparent; border-right: 5px solid #F2F2F2; border-bottom: 10px solid #F2F2F2; border-left: 5px solid transparent;} /* enter-校园风光 */ .enter02{ padding: 50px 0 80px; background: url(../images/enter_bg.png) no-repeat center/cover;} .enter02 .large .swiper-slide{ padding-bottom: 15px;} .enter .enter02 .more::before{ border-top-color: #0E4481; border-right-color: #0E4481;} .enter .enter02 .more::after{ border-right-color: #0E4481; border-bottom-color: #0E4481;} .enter02 .enterTil .til{ color: #fff;} .enter02 .enterTil .til::before{ background: url(../images/enter_icon_yellow.svg) no-repeat center/cover;} .enter02 .enterModeCon{ position: relative;} .enter02 .large{ overflow: hidden; position: relative;} .enter02 .thumbnail{ overflow: hidden; width: calc(820% / 15); position: absolute; bottom: 0; right: 0;} .enter02 .gp-img-responsive{ /* padding-bottom: calc(600% / 15); */ padding-bottom: 56.25%;} .enter02 .swiper-button-prev, .enter02 .swiper-button-next{ z-index: 2; width: 60px; height: 100px; background: rgba(0, 0, 0, 0.4); transform: translateY(-50%);} .enter02 .swiper-button-prev::after, .enter02 .swiper-button-next::after{ font-size: 28px; color: #fff;} .enter02 .lable{ color: #fff; line-height: 26px; margin-top: 30px; width: 45%;} .enter02 .thumbnail .gp-img-responsive{ border: 4px solid #fff; box-sizing: border-box; padding-bottom: 56.25%;/* padding-bottom: calc(134% / 2.4); */ transition: all 0.35s ease;} .enter02 .thumbnail .swiper-slide:hover img{ opacity: 1; transform: none;} .enter02 .thumbnail .swiper-slide-thumb-active .gp-img-responsive{ border-color: #F5DA4D;} /* entter - 学员风采 */ .enter04{ padding: 80px 0; background: #F2F2F2;} .enter04 ul{ margin: 0 -22.5px;} .enter04 li a{ display: block; margin: 0 22.5px; transition: all 0.35s ease;} .enter04 li a:hover{ transform: translateY(-8px);} .enter04 .gp-img-responsive{ padding-bottom: calc(264% / 4.7);} .enter04 li:hover .gp-img-responsive img{ transform: scale(1.08); opacity: 0.85;} .enter04 .title{ line-height: 26px; margin-top: 30px;} .enter04 .summary{ color: #999; line-height: 30px; margin-top: 20px;} /* 响应式样式 */ @media screen and (max-width:1800px){ .introMode03 .right .up .img2{ min-width: unset;} .introMode01 .left{ padding: 50px 150px 50px 50px;} } @media screen and (max-width:1600px){ .gp-container2{ max-width: 1400px;} .deptList{ padding-top: 40px;} .deptList .lable{ padding-top: 30px;} .deptList ul{ margin-top: 40px; padding: 50px;} .enterFirstNew{ margin-top: 30px; padding-bottom: 30px;} .enter01 .summary, .enter03 .summary{ margin-top: 20px;} .enter01 .date, .enter03 .date{ margin-top: 20px;} .enter01 .enterModeCon li, .enter03 .enterModeCon li{ padding-bottom: 20px; margin-bottom: 20px;} .research .listCon .liImg{ width: 240px; flex-shrink: 0;} .research .listCon .info{ width: calc(100% - 260px);} .intro{ padding-top: 40px;} .introMode01 .right{ top: -80px;} .introMode02{ margin-top: 40px;} } @media screen and (max-width:1480px) { .gp-container2{ max-width: 1300px;} .subBanner .pageTitle{ transition: all -0.35s ease; font-size: 34px;} .enterFirstNew{ margin-top: 30px; padding-bottom: 30px;} .enterModeCon{ padding-top: 30px;} .enter01 .enterModeCon li, .enter03 .enterModeCon li{ padding-bottom: 20px; margin-bottom: 20px;} .enter01 .enterModeCon .date, .enter03 .enterModeCon .date{ margin-top: 10px;} .teacher .left, .teacher .right{ width: calc(50% - 20px);} .teacher .people li{ width: calc(50% - 10px);} .introMode03 .left .more{ margin-top: 20px;} .introMode03 .left .lable{ margin-top: 30px;} .introMode01 .left{ padding: 50px 100px 50px 40px;} } @media screen and (max-width:1400px) { .gp-container2{ max-width: 1200px;} .deptList ul{ padding: 30px;} .teacher{ padding-top: 50px;} .teacher .people{ margin-top: 30px; padding: 50px 0;} .teacher .people li a{ padding-left: 35px;} .teacher .people li .year{ padding-right: 10px; margin-right: 10px;} .enter01 .left, .enter03 .left{ width: calc(650% / 15);} .enter03{ padding: 50px 0;} .enter04{ padding: 50px 0;} .picture .lable{ width: 80%; padding: 20px 0; text-align: center;} .notice .pageCon ul a{ padding: 30px 150px 30px 30px;} .notice .pageCon .date{ right: 20px;} .research .position{ bottom: 10px;} .celebrity ul{ margin: 0 -10px;} .celebrity ul a{ margin: 0 10px;} .media .cascade{ margin: 30px -10px 0;} .media .cascade li a{ margin: 0 10px;} .media .cascade .title{ padding: 20px 15px;} .journal ul{ margin: 0 -10px;} .journal li a{ margin: 0 10px;} .student .pageCon ul{ margin: 0 -10px;} .student .pageCon li a{ margin: 0 10px;} .introMode01 .right{ top: -20px;} .introMode03 .identification .enterTil{ margin-top: 30px;} .introMode03 .identification .lable{ margin-top: 30px;} .intro{ padding: 30px 0;} .introModeCon{ margin-top: 30px;} } @media screen and (max-width:1280px) { .gp-container2{ max-width: 1100px;} .subBanner .pageTitle{ font-size: 30px; line-height: 1.2;} .deptList ul{ margin: 40px -15px 0;} .deptList ul a{ margin: 0 15px;} .teacher .people > .flex{ flex-direction: column;} .teacher .left, .teacher .right{ width: 100%;} .teacher .people ul{ justify-content: flex-start;} .teacher .people li{ width: calc(33.33% - 10px); margin-right: 10px; margin-top: 30px;} .teacher .right{ margin-top: 50px;} .teacher .chilChannel ul{ text-align: center;} .teacher .chilChannel li{ display: inline-block; float: none; width: 33.33%; margin-bottom: 40px;} .teacher .chilChannel li:nth-of-type(2), .teacher .chilChannel li:nth-of-type(4){ top: 0;} .teacher .chilChannel{ padding: 50px 0;} .picture .bigSwiper .swiper-button-prev, .picture .bigSwiper .swiper-button-next{ width: 40px; height: 80px;} .notice .pageCon ul{ margin: 0 -10px;} .notice .pageCon ul a{ margin: 0 10px;} .research .listCon a{ padding: 15px; padding-right: 100px;} .research .listCon .info{ padding-right: 30px;} .research .swiper .summary{ -webkit-line-clamp: 2;} .research .swiper .date{ margin-top: 10px;} .research .listCon .date{ right: 10px;} .student .pageCon li{ width: 50%;} .introMode01 .left{ padding: 30px 80px 30px 20px;} .intro .more{ bottom: 40px;} .introMode03 .lable{ font-size: 18px;} .introMode03 .enterTil{ margin-top: 60px;} } @media screen and (max-width:1200px) { .gp-container2{ max-width: 1000px;} .enterModeCon{ padding-top: 20px;} .enter01 .summary, .enter03 .summary{ line-height: 24px; height: 48px; margin-top: 10px;} .enter01 .date, .enter03 .date{ margin-top: 10px;} .enter01 .enterModeCon .pic, .enter03 .enterModeCon .pic{ width: 180px; flex-shrink: 0;} .enter01 .enterModeCon .info, .enter03 .enterModeCon .info{ width: calc(100% - 190px);} .enter01 .enterModeCon .date, .enter03 .enterModeCon .date{ margin-top: 6px;} .notice .pageCon ul li{ width: 100%;} .research .listCon a{ padding-right: 90px;} .research .listCon .info{ padding-right: 20px;} .celebrity ul .subtitle{ margin-top: 32px;} .celebrity ul .name::before{ bottom: -15px;} .celebrity ul .summary{ margin-top: 10px; line-height: 24px;} .celebrity ul .img{ margin-top: 15px;} .introMode03 .enterTil{ margin-top: 10px;} .introMode03 .identification .enterTil{ margin-top: 30px;} } @media screen and (max-width:1100px) { .gp-container2{ max-width: unset; width: auto; margin-left: 30px; margin-right: 30px;} .gp-info span{ display: inline-block;} .student .pageCon .title{ margin-top: 15px;} .student .pageCon .summary{ margin-top: 15px;} .introMode03 .left .lable{ margin-top: 20px; padding-top: 20px;} } @media screen and (max-width:1024px) { .celebrity ul li{ width: 50%;} .media .cascade li{ padding-bottom: 20px;} .media .cascade .title{ padding: 10px; font-size: 18px;} } @media screen and (max-width:998px) { .gp-page{ display: none;} .gp-m-page{ display: block;} .gp-left{ width: 100%; background: none; padding: 0; margin-bottom: 20px;} .subContent > .flex{ flex-direction: column; padding: 30px 0 40px;} .gp-right{ width: 100%;} .deptList{ background-size: auto 40%;} .deptList ul{ margin: 30px -10px 0; padding: 30px 10px;} .deptList ul li{ width: 50%; margin-bottom: 20px;} .deptList ul a{ margin: 0 10px;} .deptList .lable p{ line-height: 34px;} .enter{ padding: 40px 0 0 ;} .enter01, .enter03{ flex-direction: column; display: block; padding-bottom: 40px;} .enter01 .left, .enter03 .left{ width: 100%; max-width: 430px; margin: 0 auto; display: none;} .enter01 .right, .enter03 .right{ width: 100%; } .enter02 .thumbnail{ position: relative; left: 0; top: 0; width: 100%; margin-top: 40px;} .enter02{ padding: 40px 0;} .enter04 ul{ margin: 0 -10px;} .enter04 li{ width: 33.33%;} .enter04 li a{ margin: 0 10px;} .Annex{ margin: 30px 0;} .Annex h2{ line-height: 50px;} .Annex li{ padding: 0 10px;} .Annex a{ padding: 10px 0;} .notice .pageCon ul li{ margin-bottom: 30px; width: 50%;} .notice .pageCon .date{ right: 10px;} .notice .pageCon ul a{ padding: 20px 130px 20px 20px;} .notice .pageCon .title{ line-height: 34px; height: 68px;} .notice .pageCon i{ margin-top: 10px;} .research .position{ bottom: 0; min-height: 56px;} .research .swiper-button-prev, .research .swiper-button-next{ width: 50px; height: 50px; line-height: 50px; box-sizing: border-box;} .research .swiper-button-prev, .research .swiper-button-next{ font-size: 24px;} .research .swiper .title{ margin-top: 20px;} .research .swiper .summary{ padding-top: 20px;} .celebrity ul{ padding: 30px 0 40px;} .gp-page{ padding: 10px 0 20px;} .journal ul li{ width: 50%;} .intro{ padding-top: 0;} .introMode01 .left{ width: 100%; padding: 30px 30px 60px 30px;} .intro .more{ right: 20px; bottom: 20px;} .introMode01 .right{ position: relative; top: 0; right: 0; width: 100%; max-width: 560px; margin: 30px auto 0;} .introMode03 .left .lable{ max-width: 480px; padding-right: 20px;} .intro .enterTil{ margin-top: 20px;} .introMode03 .left .lable{ margin-top: 20px; padding-top: 20px;} .introMode03 .left .more{ margin-top: 20px;} .subBanner .currentPage{ transition: all 0.35s ease; position: relative; padding-bottom: 0px; bottom: 0; top: 0;} .subBanner .currentPage .flex{ flex-direction: column;} .subBanner .pageTitle{ transition: all 0.35s ease; width: 100%; padding-bottom: 10px; padding-left: 30px; box-sizing: border-box; position: absolute; left: 0px; bottom: 100%;} .subBanner .bread{ transition: all 0.35s ease; padding-top: 10px;} .subBanner .bread *{ color: #999;} .subBanner .bread a{ display: inline-block; margin-top: 5px; font-size: 14px;} .introMode03 .left .lable, .introMode03 .identification .lable{ line-height: 22px; font-size: 16px;} .introMode03 .left .more{ margin-top: 10px;} } @media screen and (max-width:870px) { .teacher .people li{ width: calc(50% - 10px);} .enter04 li{ width: 100%; margin-bottom: 20px;} .research .swiper a.flex{ flex-direction: column;} .research .swiper .left{ width: 100%;} .research .swiper .right{ width: 100%; margin-top: 20px;} .research .position{ position: relative; bottom: 0; left: 0; width: 100%;} .celebrity ul li{ margin-bottom: 20px;} .celebrity ul a{ padding: 20px;} .introMode03 > .gp-container2 > .flex{ flex-direction: column;} .introMode03 .left{ width: 100%; padding-bottom: 10px;} .introMode03 .left .lable{ max-width: unset; padding-right: 0;} .introMode03 .left .more{ position: relative; float: right;} .introMode03 .right{ width: 100%;} .introMode03 .right .up{ width: 100%;} .introMode03 .right .up .img1{ width: 40%;} .introMode03 .right .up .img2{ width: 60%; margin-left: -60%;} .introMode03 .right .down{ width: 100%;} .introMode03 .right .down .img1{ position: relative; padding-bottom: calc(180% / 6.1); right: 0; max-width: unset; width: 100%;} .introMode03 .right .down img{ width: 100%;} .introMode03 .identification{ width: 50%; padding-right: 20px; box-sizing: border-box;} .introMode03 .right{ background: #f2f2f2;} .introMode03 .right .up{ background: transparent;} } @media screen and (max-width:767px) { .deptList ul li{ width: 100%;} .deptList ul a{ line-height: 90px;} .teacher .chilChannel a .name{ padding-top: 20px; padding-left: 20px;} .teacher .chilChannel a .more{ bottom: 20px; right: 30px;} .enter02 .thumbnail{ display: none;} .picture .limitWidth .swiper-button-prev{ left: -60px;} .picture .limitWidth .swiper-button-next{ right: -60px;} .notice .pageCon ul li{ width: 100%; margin-bottom: 20px;} .research .listCon li{ margin-bottom: 30px;} .celebrity ul li{ width: 100%;} .media .cascade li{ width: 50%;} .journal ul{ padding: 40px 0;} } @media screen and (max-width:680px) { .gp-left{ margin-bottom: 10px;} .subContent > .flex{ padding-top: 30px;} .curTitle a{ padding-bottom: 0;} .introduct .gp-content{ padding-top: 20px;} .gp-content p{ margin-bottom: 15px;} .subBanner .currentPage{ padding-bottom: 15px;} .subBanner .pageTitle{ font-size: 26px;} .article .pageCon{ padding-top: 20px;} .gp-content{ padding-top: 10px;} .teacher{ padding-top: 30px;} .teacher .chilChannel li{ width: 50%;} .notice .pageCon ul li{ padding-top: 0;} .notice .pageCon ul a{ padding: 15px 100px 15px 15px;} .notice .pageCon .date{ width: 80px; height: 100px; top: 10px;} .notice .pageCon span.day{ font-size: 28px; line-height: 30px; margin-top: 12px; padding-bottom: 20px;} .notice .pageCon span.year{ font-size: 16px; line-height: 18px;} .research .listCon a{ flex-wrap: wrap; padding-right: 10px;} .research .listCon .date{ position: relative; top: 0; left: 0; width: 100%; transform: none; text-align: left;} .research .listCon .date .day{ display: inline-block; margin-bottom: 0; font-size: 28px; line-height: 1.2;} .research .listCon .date .year{ display: inline-block; line-height: 1.2;} .research .listCon .info{ padding-right: 0; border-right: none;} .research .listCon .summary{ margin-top: 10px; padding-top: 10px;} .celebrity ul{ padding: 20px 0;} .journal ul{ padding: 0px;} .journal ul li{ width: 100%;} /* .journal ul li:last-child{ margin-bottom: 0;} */ .student .pageCon .title{ margin-top: 10px;} .student .pageCon .summary{ line-height: 1.5; margin-top: 10px;} .intro .enterTil{ margin-top: 0;} .introMode01 .introModeCon{ margin-top: 10px;} .introMode03 .right .down .img4{ position: relative;} .introMode03 .identification{ width: 100%; padding-right: 0;} .introMode03 .identification .more{ right: 10px;} .introMode03 .identification .lable{ padding-bottom: 30px;} .introMode03 .left{ padding-left: 0;} .introMode02{ padding-bottom: calc(900% / 19.2); background-position: 60% 100% !important;} .subBanner .bread a{ font-size: 14px;} } @media screen and (max-width:540px) { .subContent > .flex{/* padding-bottom: 10px; */} .deptList{ padding-top: 30px; } .deptList .lable{ padding-top: 20px;} .deptList ul a{ padding-left: 30px;} .teacher .people li{ width: 100%;} .enter04 ul{ margin: 0;} .enter04 li a{ margin: 0;} .limitWidth{ display: none;} .picture .lable{ position: relative; top: 0; left: 0; width: 100%; transform: none; margin: 15px auto 0; padding: 10px 0;} .picture .bigSwiper .swiper-button-prev, .picture .bigSwiper .swiper-button-next{ width: 30px; height: 60px;} .research .listCon .liImg{ width: 100%;} .research .listCon .info{ width: 100%;} .research .listCon .info .title{ margin-top: 6px;} .media .cascade ul{ margin: 20 -5px 0;} .media .cascade li a{ margin: 0 5px;} .student .pageCon ul{ padding: 20px 0;} .student .pageCon li{ width: 100%;} .student .pageCon li:last-child{ margin-bottom: 0;} .introMode01 .left{ padding: 20px 20px 50px 20px; } .introMode03 .left{ padding-top: 20px;} .intro .more{ bottom: 10px;} .introMode03 .left .more{ margin-top: 10px; margin-right: 20px;} } @media screen and (max-width:479px) { .subContent > .flex, .gp-container2{margin-left: 15px;margin-right: 15px;/* padding-bottom: 0px; */} .deptList ul{ margin: 20px 0 0; padding: 20px 10px;} .deptList ul li{ margin-bottom: 15px;} .deptList ul a{ line-height: 70px; margin: 0;} .teacher .chilChannel li{ display: block; float: none; width: 80%; margin: 0 auto 30px;} .enter01 .enterModeCon li, .enter03 .enterModeCon li{ padding-bottom: 0px; margin-bottom: 20px;} .enter01 .enterModeCon li a, .enter03 .enterModeCon li a{ flex-direction: column;} .enter01 .enterModeCon .pic, .enter03 .enterModeCon .pic{ width: 100%;} .enter01 .enterModeCon .info, .enter03 .enterModeCon .info{ width: 100%; margin: 10px 0;} .enter04 .title, .enter04 .summary{ margin-top: 10px;} .notice .pageCon ul a::before{ display: none;} .research .swiper-button-prev, .research .swiper-button-next{ width: 40px; height: 40px; line-height: 40px;} .research.noLeft .listCon{ padding-top: 30px;} .research.noLeft .listCon .summary{ padding-top: 15px; margin-top: 15px;} .research .swiper .right{ margin-top: 0;} .research .swiper .title{ margin-top: 10px;} .research .swiper .summary{ margin-top: 10px; padding-top: 10px;} .celebrity ul{ margin: 0;} .celebrity ul a{ margin: 0;} .media .cascade li{ width: 100%;} .journal .title{ margin-top: 15px;} .introMode03 .right{ background: #fff;} .introMode03 .right .up .img1{ width: 100%; max-width: 240px; margin: 0 auto; margin-bottom: 15px;} .introMode03 .right .up .img2{ position: relative; left: 0; margin-left: 0; width: 100%; margin-bottom: 15px;} .introMode03 .right .down .img1{ margin-bottom: 15px;} .introMode03 .right .down .img2, .introMode03 .right .down .img3{ float: none; width: 100%; max-width: 240px; margin: 0 auto 15px; padding-left: 0;} .introMode03 .right .down .img4{ margin: 0 auto; width: 100%; max-width: 240px;} .introMode03 .identification .lable{ padding-bottom: 20px; margin-top: 20px;} .introMode03 .song > div{ margin-bottom: 25px;} .introMode03 .right .down .img1{ padding-bottom: calc(200% / 6.1);} .subBanner .pageTitle{ font-size: 20px;} .curTitle a{ font-size: 18px;} .notice .pageCon .title{ font-size: 16px;} } @media screen and (max-width:380px) { .picture .lable{ max-width: unset;} .notice .pageCon .date{ width: 60px; height: 75px; top: 20px;} .notice .pageCon span.day{ font-size: 22px; margin-top: 6px; padding-bottom: 6px;} .notice .pageCon ul a{ padding: 10px 75px 10px 10px;} .celebrity ul a{ padding: 10px;} .introMode03 .song > div{ margin-bottom: 15px;} }