style.css 33 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543
  1. @import "./base.css";
  2. .headtop {
  3. background-color: #fff;
  4. }
  5. .header_wapper {
  6. position: fixed;
  7. left: 0;
  8. top: 0;
  9. z-index: 200;
  10. width: 100%;
  11. box-shadow: 0px 3px 12px rgba(0, 0, 0, 0.06);
  12. }
  13. .header_layout {
  14. display: flex;
  15. align-items: center;
  16. padding: 16px 25px;
  17. background: #fff;
  18. }
  19. .header_logo a {
  20. display: block;
  21. font-size: 0;
  22. }
  23. .header_logo img {
  24. max-width: 440px;
  25. height: 65px;
  26. object-fit: contain;
  27. }
  28. .header_layout .header_menu {
  29. position: relative;
  30. padding-left: 50px;
  31. flex: 1;
  32. }
  33. .header_layout .nav .wp-menu {
  34. display: flex;
  35. justify-content: flex-end;
  36. align-items: center;
  37. }
  38. .header_layout .nav .wp-menu .menu-item {
  39. width: 10%;
  40. margin-top: 16px;
  41. padding-bottom: 22px;
  42. max-width: 120px;
  43. position: relative;
  44. }
  45. .header_layout .nav .wp-menu .menu-item .menu-link {
  46. display: inline-block;
  47. width: 100%;
  48. font-size: 18px;
  49. line-height: 20px;
  50. text-align: center;
  51. white-space: nowrap;
  52. color: #767676;
  53. }
  54. .header_layout .nav .wp-menu .menu-item::before {
  55. content: "";
  56. position: absolute;
  57. bottom: 10px;
  58. left: 50%;
  59. transform: translateX(-50%);
  60. width: 0;
  61. height: 2px;
  62. background-color: var(--vt-c-primary);
  63. transition: width 0.3s ease-in-out;
  64. }
  65. .header_layout .nav .wp-menu .menu-item a:hover {
  66. color: var(--vt-c-primary);
  67. }
  68. .header_layout .nav .wp-menu .menu-item.hover::before {
  69. width: 24px;
  70. }
  71. .header_layout .nav .wp-menu .menu-item.hover .menu-link {
  72. color: var(--vt-c-primary);
  73. }
  74. .header_layout .nav .wp-menu .menu-item::after {
  75. content: "";
  76. position: absolute;
  77. top: 2px;
  78. right: 0;
  79. height: 20px;
  80. border-right: 1px solid rgba(132, 132, 132, 20%);
  81. }
  82. .header_layout .nav .sub-menu {
  83. display: none;
  84. position: absolute;
  85. left: 50%;
  86. top: 38px;
  87. min-width: 130px;
  88. transform: translateX(-50%);
  89. z-index: 100;
  90. padding: 10px 0;
  91. background: #fff;
  92. box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12),
  93. 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
  94. }
  95. .header_layout .nav .sub-menu .sub-item {
  96. position: relative;
  97. white-space: nowrap;
  98. vertical-align: top;
  99. _zoom: 1;
  100. }
  101. .header_layout .nav .sub-menu .sub-item a {
  102. display: block;
  103. line-height: 32px;
  104. padding: 4px 12px;
  105. font-size: 14px;
  106. text-align: center;
  107. }
  108. .header_layout .nav .sub-menu .sub-item a:hover {
  109. color: var(--vt-c-primary);
  110. background-color: #f5f5f5;
  111. }
  112. .header_layout .mobile_menu {
  113. position: relative;
  114. display: none;
  115. margin-left: 15px;
  116. padding-left: 15px;
  117. }
  118. .header_layout .mobile_menu .menu_divider {
  119. position: absolute;
  120. top: 50%;
  121. left: 0;
  122. height: 20px;
  123. transform: translateY(-50%);
  124. border-left: 1px solid rgba(132, 132, 132, 0.2);
  125. }
  126. .mobile_menu .mobile_menu_taggle {
  127. width: 40px;
  128. height: 40px;
  129. }
  130. .wp-navi-aside {
  131. display: none;
  132. }
  133. .banner_wrapper {
  134. padding-top: 98px;
  135. background: #fff;
  136. }
  137. .banner_wrapper .inner {
  138. width: auto;
  139. padding: 0;
  140. max-width: 1920px;
  141. text-align: center;
  142. position: relative;
  143. }
  144. .banner_wrapper .focus .focus-pagination {
  145. position: absolute;
  146. left: 50%;
  147. bottom: 12px;
  148. right: auto;
  149. height: auto;
  150. transform: translateX(-50%);
  151. display: inline-block;
  152. padding: 6px 9px;
  153. border-radius: 30px;
  154. background-color: rgba(0, 0, 0, 0.56);
  155. z-index: 60;
  156. font-size: 0;
  157. }
  158. .banner_wrapper .focus .focus-page {
  159. display: inline-block;
  160. width: 12px;
  161. height: 12px;
  162. margin: 0 4px;
  163. line-height: 1;
  164. font-size: 0;
  165. border-radius: 6px;
  166. background-color: rgba(255, 255, 255, 0.6);
  167. -webkit-transition: all 0.3s ease-in-out;
  168. transition: all 0.3s ease-in-out;
  169. cursor: pointer;
  170. }
  171. .banner_wrapper .focus .focus-page-active {
  172. width: 24px;
  173. background-color: rgba(255, 255, 255, 1);
  174. }
  175. .banner_wrapper .focus .focus-navigation {
  176. width: 66px;
  177. height: 66px;
  178. opacity: 0.7;
  179. filter: alpha(opacity=70);
  180. font-size: 0;
  181. }
  182. .banner_wrapper .focus .focus-navigation:hover {
  183. opacity: 1;
  184. filter: alpha(opacity=100);
  185. }
  186. .banner_wrapper .focus .focus-navigation:active {
  187. opacity: 1;
  188. filter: alpha(opacity=100);
  189. }
  190. .banner_wrapper .focus .focus-prev {
  191. background: url("../images/botton_prev.png") no-repeat center/contain;
  192. }
  193. .banner_wrapper .focus .focus-next {
  194. background: url("../images/botton_next.png") no-repeat center/contain;
  195. }
  196. .header_btm_wrapper {
  197. padding: 130px 0;
  198. display: flex;
  199. width: 100%;
  200. max-width: 1280px;
  201. margin: 0 auto;
  202. }
  203. .home_lay_title {
  204. margin-bottom: 30px;
  205. font-size: 30px;
  206. color: var(--vt-c-indigo);
  207. line-height: 1;
  208. }
  209. .home_lay_title span {
  210. text-transform: uppercase;
  211. padding-left: 10px;
  212. font-weight: 100;
  213. color: rgba(123, 123, 123, 1);
  214. }
  215. .home_lay_title.white {
  216. color: #fff;
  217. }
  218. .home_lay_title.white span {
  219. color: #fff;
  220. }
  221. .home_lay_item_box {
  222. padding: 60px 0;
  223. }
  224. .news_tit {
  225. display: flex;
  226. align-items: center;
  227. justify-content: space-between;
  228. font-size: 20px;
  229. color: var(--vt-c-indigo);
  230. line-height: 1;
  231. margin-bottom: 14px;
  232. }
  233. .news_tit .list_more {
  234. font-size: 16px;
  235. }
  236. .news_lay_box {
  237. display: grid;
  238. grid-template-columns: 2fr 1fr 1fr;
  239. gap: 24px;
  240. }
  241. .news_lay_box .news_lay_item {
  242. /* flex: 1; */
  243. /* max-width: 390px; */
  244. padding: 20px;
  245. overflow: hidden;
  246. background-color: #fff;
  247. }
  248. .news_lay_box .news_lay_item .list_item {
  249. position: relative;
  250. padding: 20px 0;
  251. font-size: 14px;
  252. line-height: 28px;
  253. border-bottom: 1px solid #e5e5e5;
  254. }
  255. .news_lay_box .news_lay_item .list_item img {
  256. width: 100%;
  257. height: 430px;
  258. object-fit: cover;
  259. }
  260. .news_lay_box .news_lay_item .list_item .cover {
  261. display: none;
  262. height: 430px;
  263. width: 100%;
  264. overflow: hidden;
  265. }
  266. .news_lay_box .news_lay_item .list_item.news_1 {
  267. display: block;
  268. }
  269. .news_lay_box .news_lay_item .list_item .item_info {
  270. display: flex;
  271. align-items: center;
  272. justify-content: space-between;
  273. }
  274. .news_lay_box .news_lay_item .list_item.news_1 .item_info {
  275. position: absolute;
  276. display: block;
  277. left: 0;
  278. bottom: 20px;
  279. width: 100%;
  280. height: 80px;
  281. padding: 10px 20px;
  282. background: linear-gradient(180deg, rgba(3, 3, 3, 0) 0%, #000000 100%);
  283. color: #fff;
  284. }
  285. .news_lay_box .news_lay_item .list_item.news_1 .cover {
  286. display: block;
  287. }
  288. .news_lay_box .news_lay_item .list_item.news_1 .first_date {
  289. display: block;
  290. }
  291. .news_lay_box .news_lay_item .list_item.news_1 .item_date {
  292. display: none;
  293. }
  294. .news_lay_box .news_lay_item .list_item .first_date {
  295. display: none;
  296. font-size: 16px;
  297. }
  298. .news_lay_box .news_lay_item .list_item .item_date {
  299. display: block;
  300. color: #848484;
  301. font-size: 12px;
  302. }
  303. .news_lay_box .news_lay_item .list_item.news_1 {
  304. padding-top: 0;
  305. font-size: 24px;
  306. line-height: 28px;
  307. }
  308. .news_lay_box .news_lay_item .list_item.news_1 .title {
  309. padding-right: 0;
  310. }
  311. .news_lay_box .news_lay_item .list_item.news_1 a {
  312. color: #fff;
  313. }
  314. .news_lay_box .news_lay_item .list_item.news_1.item:hover a {
  315. color: #fff;
  316. }
  317. .news_lay_box .news_lay_item .list_item .title {
  318. flex: 1;
  319. padding-right: 30px;
  320. text-overflow: ellipsis;
  321. white-space: nowrap;
  322. overflow: hidden;
  323. }
  324. .news_lay_box .news_lay_item .s_item {
  325. padding: 12px 0;
  326. font-size: 14px;
  327. line-height: 28px;
  328. border-bottom: 1px solid #e5e5e5;
  329. }
  330. .news_lay_box .news_lay_item .s_item .title {
  331. width: 100%;
  332. overflow: hidden;
  333. text-overflow: ellipsis;
  334. white-space: nowrap;
  335. }
  336. .news_lay_box .news_lay_item .s_item .item_date {
  337. font-size: 12px;
  338. color: #848484;
  339. }
  340. .news_lay_box .news_lay_item .s_item img {
  341. width: 100%;
  342. height: 210px;
  343. object-fit: cover;
  344. }
  345. .news_lay_box .news_lay_item .s_item .cover {
  346. display: none;
  347. height: 210px;
  348. width: 100%;
  349. overflow: hidden;
  350. margin-bottom: 10px;
  351. }
  352. .news_lay_box .news_lay_item .s_item.news_1 {
  353. padding-top: 0;
  354. font-size: 16px;
  355. }
  356. .news_lay_box .news_lay_item .s_item.news_1 .cover {
  357. display: block;
  358. }
  359. .news_lay_box .news_lay_item .item {
  360. width: 100%;
  361. color: var(--vt-c-indigo);
  362. cursor: pointer;
  363. overflow: hidden;
  364. transition: all 0.2s ease-in-out;
  365. }
  366. .news_lay_box .news_lay_item .item:hover a {
  367. color: var(--vt-c-primary);
  368. }
  369. .news_lay_box .news_lay_item .item a:hover {
  370. color: var(--vt-c-primary);
  371. }
  372. .news_lay_box .news_lay_item .item:hover img {
  373. transform: scale(1.2);
  374. transition: all 0.2s ease-in-out;
  375. }
  376. .list_more {
  377. text-align: center;
  378. }
  379. .list_more.mt {
  380. margin-top: 50px;
  381. }
  382. .list_more .more_text {
  383. color: var(--vt-c-primary);
  384. cursor: pointer;
  385. }
  386. .list_more .arrow {
  387. display: inline-block;
  388. margin-left: 6px;
  389. width: 18px;
  390. height: 18px;
  391. object-fit: contain;
  392. vertical-align: text-bottom;
  393. background: url("../images/arrow_right_primary.png") no-repeat center/contain;
  394. }
  395. .spe_cards {
  396. display: flex;
  397. height: 460px;
  398. }
  399. .spe_cards .cards_item {
  400. position: relative;
  401. flex: 1;
  402. margin: 0 12px;
  403. height: 460px;
  404. padding: 70px 20px 40px;
  405. color: #fff;
  406. box-sizing: border-box;
  407. background-color: #fff;
  408. transition: all 0.3s ease-in-out;
  409. }
  410. .spe_cards .cards_item:first-child {
  411. margin-left: 0;
  412. }
  413. .spe_cards .cards_item:last-child {
  414. margin-right: 0;
  415. }
  416. .spe_cards .cards_item .card_icon {
  417. line-height: 1;
  418. }
  419. .spe_cards .cards_item .card_icon {
  420. width: 72px;
  421. height: 72px;
  422. }
  423. .spe_cards .cards_item .card_icon.icon_1 {
  424. background: url("../images/icon_home_specialty_1.png") no-repeat center /
  425. contain;
  426. }
  427. .spe_cards .cards_item:hover .card_icon.icon_1 {
  428. background: url("../images/icon_home_specialty_1_hover.png") no-repeat center /
  429. contain;
  430. }
  431. .spe_cards .cards_item .card_icon.icon_2 {
  432. background: url("../images/icon_home_specialty_2.png") no-repeat center /
  433. contain;
  434. }
  435. .spe_cards .cards_item:hover .card_icon.icon_2 {
  436. background: url("../images/icon_home_specialty_2_hover.png") no-repeat center /
  437. contain;
  438. }
  439. .spe_cards .cards_item .card_icon.icon_3 {
  440. background: url("../images/icon_home_specialty_3.png") no-repeat center /
  441. contain;
  442. }
  443. .spe_cards .cards_item:hover .card_icon.icon_3 {
  444. background: url("../images/icon_home_specialty_3_hover.png") no-repeat center /
  445. contain;
  446. }
  447. .spe_cards .cards_item .card_icon.icon_4 {
  448. background: url("../images/icon_home_specialty_4.png") no-repeat center /
  449. contain;
  450. }
  451. .spe_cards .cards_item:hover .card_icon.icon_4 {
  452. background: url("../images/icon_home_specialty_4_hover.png") no-repeat center /
  453. contain;
  454. }
  455. .spe_cards .cards_item .card_icon.icon_5 {
  456. background: url("../images/icon_home_specialty_5.png") no-repeat center /
  457. contain;
  458. }
  459. .spe_cards .cards_item:hover .card_icon.icon_5 {
  460. background: url("../images/icon_home_specialty_5_hover.png") no-repeat center /
  461. contain;
  462. }
  463. .spe_cards .cards_item .card_tit {
  464. margin-top: 20px;
  465. font-size: 20px;
  466. line-height: 1;
  467. color: var(--vt-c-primary);
  468. }
  469. .spe_cards .cards_item .card_tit a {
  470. color: var(--vt-c-primary);
  471. }
  472. .spe_cards .cards_item:hover .card_tit,
  473. .spe_cards .cards_item:hover .card_tit a {
  474. color: #fff;
  475. }
  476. .spe_cards .cards_item .card_desc a {
  477. color: #fff;
  478. }
  479. .spe_cards .cards_item .card_desc {
  480. position: absolute;
  481. bottom: 0;
  482. left: 0;
  483. width: 100%;
  484. padding: 0 20px 40px;
  485. opacity: 0;
  486. }
  487. .spe_cards .cards_item .card_desc .desc {
  488. font-size: 14px;
  489. line-height: 24px;
  490. }
  491. .spe_cards .cards_item .card_desc .more {
  492. margin-top: 20px;
  493. text-align: r;
  494. }
  495. .spe_cards .cards_item .card_desc .more .more_text {
  496. font-size: 16px;
  497. color: #fff;
  498. }
  499. .spe_cards .cards_item .card_desc .more .arrow {
  500. margin-left: 6px;
  501. width: 18px;
  502. height: 18px;
  503. display: inline-block;
  504. object-fit: contain;
  505. vertical-align: text-bottom;
  506. background: url("../images/arrow_right.png") no-repeat center/contain;
  507. }
  508. .spe_cards .cards_item:hover {
  509. flex: 2;
  510. background-color: var(--vt-c-primary);
  511. }
  512. .spe_cards .cards_item:hover .card_desc {
  513. animation: fadeInUp 0.3s ease-in-out;
  514. animation-fill-mode: forwards;
  515. }
  516. .wrapper.wrapper_teacher_bg {
  517. background: url("../images/bg_teachers.png") no-repeat center/cover;
  518. }
  519. /*teacher*/
  520. .teachers_box .teachers_swiper {
  521. width: 100%;
  522. display: grid;
  523. gap: 24px;
  524. grid-template-columns: repeat(5, 1fr);
  525. }
  526. .teachers_box .teachers_swiper .teacher_slide {
  527. text-align: center;
  528. }
  529. .teachers_box .teacher_item {
  530. width: 100%;
  531. position: relative;
  532. }
  533. .teachers_box .teacher_item a {
  534. display: block;
  535. position: relative;
  536. padding-top: 100%;
  537. }
  538. .teachers_box .teacher_item img {
  539. position: absolute;
  540. top: 0;
  541. left: 0;
  542. width: 100%;
  543. height: 100%;
  544. object-fit: cover;
  545. border-radius: 50%;
  546. transition: all 0.3s linear;
  547. }
  548. .teachers_box .teacher_item:hover img {
  549. transform: scale(1.1);
  550. }
  551. .teachers_box .teacher_slide .item_footer {
  552. margin-top: 20px;
  553. display: block;
  554. }
  555. .teachers_box .teacher_slide .name a {
  556. color: #000;
  557. font-size: 20px;
  558. font-weight: 600;
  559. }
  560. .teachers_box .teacher_slide:hover .name a {
  561. color: var(--vt-c-primary);
  562. }
  563. .tabs_header {
  564. display: flex;
  565. align-items: center;
  566. margin-bottom: 30px;
  567. }
  568. .tabs_header .home_lay_title {
  569. margin-bottom: 0;
  570. }
  571. .tabs_header .tabs_nav_list {
  572. flex: 1;
  573. position: relative;
  574. display: flex;
  575. align-self: stretch;
  576. overflow: hidden;
  577. white-space: nowrap;
  578. justify-content: flex-end;
  579. }
  580. .tabs_header .tabs_nav_list .list_item {
  581. position: relative;
  582. padding: 14px 0;
  583. font-size: 18px;
  584. color: rgba(0, 0, 0, 0.8);
  585. cursor: pointer;
  586. }
  587. .works_tab .tabs_header .tabs_nav_list .list_item {
  588. color: rgba(255, 255, 255, 0.8);
  589. }
  590. .tabs_header .tabs_nav_list .list_item.selected {
  591. color: #000;
  592. }
  593. .works_tab .tabs_header .tabs_nav_list .list_item.selected {
  594. color: #fff;
  595. }
  596. .tabs_header .tabs_nav_list .list_item.selected::after {
  597. position: absolute;
  598. content: "";
  599. bottom: 0;
  600. left: 50%;
  601. -webkit-transform: translateX(-50%);
  602. -ms-transform: translateX(-50%);
  603. transform: translateX(-50%);
  604. width: 28px;
  605. height: 2px;
  606. background-color: var(--vt-c-primary);
  607. }
  608. .works_tab .tabs_header .tabs_nav_list .list_item.selected::after {
  609. background-color: #fff;
  610. }
  611. .tabs_header .tabs_nav_list .list_item + .list_item {
  612. margin-left: 30px;
  613. }
  614. .tab_list {
  615. display: grid;
  616. grid-template-columns: repeat(4, 1fr);
  617. gap: 24px;
  618. }
  619. .tab_list.research_list {
  620. grid-template-columns: repeat(2, 1fr);
  621. }
  622. .tab_list .list_item,
  623. .page_article_list .list_item {
  624. width: 100%;
  625. background-color: #fff;
  626. overflow: hidden;
  627. position: relative;
  628. }
  629. .tab_list .list_item .item {
  630. position: relative;
  631. display: block;
  632. /* border-bottom: 2px solid rgba(159, 159, 159, 0.5); */
  633. cursor: pointer;
  634. }
  635. .page_article_list .list_item .item {
  636. display: flex;
  637. align-items: center;
  638. margin-bottom: 20px;
  639. }
  640. .page_article_list .list_item .item:hover {
  641. background-color: #f5f5f5;
  642. }
  643. /* .tab_list .list_item .item::before {
  644. content: "";
  645. position: absolute;
  646. bottom: 0;
  647. right: 0;
  648. border-width: 6px;
  649. border-style: solid;
  650. border-color: transparent rgba(159, 159, 159, 0.5) rgba(159, 159, 159, 0.5)
  651. transparent;
  652. } */
  653. /* .tab_list .list_item .item::after {
  654. content: "";
  655. position: absolute;
  656. bottom: -2px;
  657. right: 0;
  658. width: 0;
  659. height: 2px;
  660. background-color: var(--vt-c-primary);
  661. transition: width 0.3s ease-in-out;
  662. }
  663. .tab_list .list_item .item:hover::before {
  664. border-color: transparent var(--vt-c-primary) var(--vt-c-primary) transparent;
  665. }
  666. .tab_list .list_item .item:hover::after {
  667. width: 100%;
  668. } */
  669. .tab_list .list_item .item:hover img,
  670. .page_article_list .list_item .item:hover img {
  671. transform: scale(1.2);
  672. }
  673. .tab_list.research_list .list_item .item {
  674. position: relative;
  675. }
  676. .tab_list.research_list .list_item .item .list_img {
  677. width: 100%;
  678. height: 400px;
  679. overflow: hidden;
  680. }
  681. .tab_list.research_list .list_item img {
  682. height: 400px;
  683. }
  684. .tab_list.research_list .list_item .item_tit a {
  685. color: #fff;
  686. }
  687. .tab_list.research_list .list_item .item:hover .item_tit a {
  688. color: #fff;
  689. }
  690. .tab_list.research_list .list_item .item .info_box {
  691. position: absolute;
  692. left: 0;
  693. bottom: 0;
  694. padding: 30px 20px;
  695. width: 100%;
  696. color: #fff;
  697. background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
  698. opacity: 0;
  699. overflow: hidden;
  700. }
  701. .tab_list.research_list .list_item .item:hover .info_box {
  702. animation: fadeInUp 0.3s ease-in-out;
  703. animation-fill-mode: forwards;
  704. }
  705. .tab_list.research_list .list_item .item .info_box .item_tit {
  706. height: auto;
  707. font-size: 20px;
  708. font-weight: 600;
  709. width: 100%;
  710. overflow: hidden;
  711. text-overflow: ellipsis;
  712. white-space: nowrap;
  713. color: #fff;
  714. }
  715. .tab_list.research_list .list_item .item .info_box .item_date {
  716. color: #fff;
  717. }
  718. .tab_list .list_item .list_img {
  719. width: 100%;
  720. height: 300px;
  721. overflow: hidden;
  722. }
  723. .tab_list .list_item img {
  724. width: 100%;
  725. height: 300px;
  726. object-fit: cover;
  727. transition: all 0.3s ease-in-out;
  728. }
  729. .tab_list .list_item .info_box {
  730. padding: 16px 18px;
  731. }
  732. .tab_list .list_item .item_tit {
  733. height: 48px;
  734. font-size: 16px;
  735. line-height: 24px;
  736. color: var(--vt-c-indigo);
  737. overflow: hidden;
  738. }
  739. .tab_list .list_item .item:hover .item_tit a {
  740. color: var(--vt-c-primary);
  741. }
  742. .tab_list .list_item .item_tit a {
  743. color: var(--vt-c-indigo);
  744. }
  745. .tab_list .list_item .item_tit a:hover {
  746. color: var(--vt-c-primary);
  747. }
  748. .tab_list .list_item .item_desc {
  749. height: 72px;
  750. overflow: hidden;
  751. margin-top: 20px;
  752. font-size: 16px;
  753. line-height: 24px;
  754. font-weight: 400;
  755. color: #666666;
  756. word-break: break-all;
  757. }
  758. .tab_list .list_item .item_desc a {
  759. color: #666666;
  760. }
  761. .tab_list .list_item .item_desc a:hover {
  762. color: var(--vt-c-primary);
  763. }
  764. .tab_list .list_item .item_date {
  765. font-size: 14px;
  766. margin-top: 10px;
  767. font-weight: 400;
  768. color: #999999;
  769. }
  770. .page_article_list .list_img {
  771. width: 240px;
  772. height: 160px;
  773. overflow: hidden;
  774. }
  775. .page_article_list img {
  776. width: 100%;
  777. height: 160px;
  778. object-fit: cover;
  779. transition: all 0.3s ease-in-out;
  780. }
  781. .page_article_list .info_box {
  782. flex: 1;
  783. height: 160px;
  784. padding: 16px;
  785. overflow: hidden;
  786. }
  787. .page_article_list .item_tit {
  788. width: 100%;
  789. font-weight: 500;
  790. font-size: 20px;
  791. color: #333333;
  792. line-height: 24px;
  793. white-space: nowrap;
  794. text-overflow: ellipsis;
  795. overflow: hidden;
  796. }
  797. .page_article_list .item_tit a {
  798. color: var(--vt-c-indigo);
  799. }
  800. .page_article_list .item_tit a:hover {
  801. color: var(--vt-c-primary);
  802. }
  803. .page_article_list .item_desc {
  804. height: 70px;
  805. margin-top: 15px;
  806. font-size: 12px;
  807. line-height: 20px;
  808. font-weight: 400;
  809. color: #666666;
  810. overflow: hidden;
  811. word-break: break-all;
  812. }
  813. .page_article_list .item_desc a {
  814. color: #666666;
  815. }
  816. .page_article_list .item_desc a:hover {
  817. color: var(--vt-c-primary);
  818. }
  819. .page_article_list .item_date {
  820. font-size: 12px;
  821. font-weight: 300;
  822. color: #999999;
  823. }
  824. .research_bg {
  825. background: url("../images/bg_research.png") no-repeat center top/100% auto;
  826. }
  827. .teach_bg {
  828. position: relative;
  829. }
  830. .talent_tab {
  831. position: relative;
  832. z-index: 2;
  833. }
  834. .work_bg {
  835. background: url("../images/bg_works.png") no-repeat center top/100% auto;
  836. }
  837. .works_tab .tab_list .list_item {
  838. height: 320px;
  839. }
  840. .works_tab .tab_list .list_item .item_link {
  841. display: block;
  842. position: relative;
  843. width: 100%;
  844. height: 100%;
  845. overflow: hidden;
  846. cursor: pointer;
  847. }
  848. .works_tab .tab_list .list_item .item_link .item_txt {
  849. position: absolute;
  850. left: 0;
  851. bottom: 0;
  852. padding: 30px 20px;
  853. width: 100%;
  854. color: #fff;
  855. background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
  856. opacity: 0;
  857. overflow: hidden;
  858. }
  859. .works_tab .tab_list .list_item .item_link .item_txt .name {
  860. font-size: 20px;
  861. font-weight: 600;
  862. width: 100%;
  863. overflow: hidden;
  864. text-overflow: ellipsis;
  865. white-space: nowrap;
  866. }
  867. .works_tab .tab_list .list_item .item_link .item_txt .name a {
  868. color: #fff;
  869. }
  870. .works_tab .tab_list .list_item .item_link:hover img {
  871. transform: scale(1.2);
  872. }
  873. .works_tab .tab_list .list_item .item_link:hover .item_txt {
  874. animation: fadeInUp 0.3s ease-in-out;
  875. animation-fill-mode: forwards;
  876. }
  877. .works_tab .tab_list .list_item img {
  878. width: 100%;
  879. height: 100%;
  880. object-fit: cover;
  881. transition: all 0.3s ease-in-out;
  882. }
  883. @keyframes fadeInUp {
  884. from {
  885. opacity: 0;
  886. transform: translate3d(0, 100%, 0);
  887. }
  888. to {
  889. opacity: 1;
  890. transform: translate3d(0, 0, 0);
  891. }
  892. }
  893. .services_bg {
  894. position: relative;
  895. }
  896. /* .services_bg::after {
  897. position: absolute;
  898. content: "";
  899. left: 0;
  900. top: 40%;
  901. width: 60%;
  902. height: 200px;
  903. background-color: rgba(53, 152, 107, 0.1);
  904. } */
  905. .service_list {
  906. position: relative;
  907. display: grid;
  908. grid-template-columns: repeat(3, 1fr);
  909. gap: 24px;
  910. z-index: 2;
  911. }
  912. .service_list .ser_item {
  913. background-color: #fff;
  914. }
  915. .service_list .ser_item a {
  916. padding: 30px 50px;
  917. display: flex;
  918. align-items: center;
  919. color: var(--vt-c-indigo);
  920. }
  921. .service_list .ser_item a .ser_icon {
  922. padding-right: 40px;
  923. border-right: 1px solid #d3d9de;
  924. }
  925. .service_list .ser_item a .ser_icon img {
  926. width: 108px;
  927. height: 108px;
  928. object-fit: contain;
  929. }
  930. .service_list .ser_item a .ser_tit {
  931. flex: 1;
  932. font-size: 24px;
  933. padding-left: 40px;
  934. }
  935. .service_list .ser_item a .ser_tit p {
  936. margin: 0;
  937. }
  938. .service_list .ser_item a .ser_tit .desc {
  939. margin-top: 20px;
  940. font-size: 16px;
  941. line-height: 20px;
  942. color: #999;
  943. }
  944. .service_list .ser_item a:hover .ser_icon img {
  945. animation: heartBeat 2s ease-in-out infinite;
  946. }
  947. @keyframes heartBeat {
  948. 0% {
  949. transform: scale(1);
  950. }
  951. 14% {
  952. transform: scale(1.2);
  953. }
  954. 28% {
  955. transform: scale(1);
  956. }
  957. 42% {
  958. transform: scale(1.2);
  959. }
  960. 70% {
  961. transform: scale(1);
  962. }
  963. }
  964. .footer_layout .footer_fix_link {
  965. position: fixed;
  966. right: 0;
  967. top: 50%;
  968. z-index: 9;
  969. }
  970. .footer_layout .top_btn {
  971. display: none;
  972. position: fixed;
  973. right: 0;
  974. bottom: 40px;
  975. z-index: 9;
  976. cursor: pointer;
  977. }
  978. .footer_layout .top_btn img {
  979. width: 40px;
  980. height: 40px;
  981. object-fit: contain;
  982. }
  983. .footer_layout .footer_fix_link .link_vertical {
  984. display: inline-flex;
  985. flex-direction: column;
  986. }
  987. .footer_layout .footer_fix_link a {
  988. display: inline-flex;
  989. align-items: center;
  990. justify-content: center;
  991. color: #fff;
  992. writing-mode: vertical-lr;
  993. width: 40px;
  994. height: 105px;
  995. }
  996. .footer_layout .footer_fix_link .xihua_link {
  997. background: url("../images/bg_links_1.png") no-repeat center / 100%;
  998. }
  999. .footer_layout .footer_fix_link .index_link {
  1000. margin-top: 24px;
  1001. background: url("../images/bg_links_2.png") no-repeat center / 100%;
  1002. }
  1003. .footer_layout .lay_footer {
  1004. background-color: #454847;
  1005. }
  1006. .footer_layout .lay_footer .footer_menu {
  1007. padding: 100px 140px;
  1008. display: flex;
  1009. }
  1010. .footer_layout .lay_footer .footer_menu .logo {
  1011. padding-right: 75px;
  1012. border-right: 1px solid rgba(112, 112, 112, 0.5);
  1013. }
  1014. .footer_layout .lay_footer .footer_menu .logo .footer_logo img {
  1015. height: 65px;
  1016. object-fit: contain;
  1017. }
  1018. .footer_layout .lay_footer .footer_menu .logo .footer_tips {
  1019. margin-top: 88px;
  1020. }
  1021. .footer_layout .lay_footer .footer_menu .logo .footer_tips img {
  1022. height: 38px;
  1023. object-fit: contain;
  1024. }
  1025. .footer_layout .lay_footer .footer_menu .logo .contact_view {
  1026. margin-top: 90px;
  1027. color: #ffffff;
  1028. font-size: 14px;
  1029. }
  1030. .footer_layout .lay_footer .footer_menu .logo .contact_view p {
  1031. margin-top: 18px;
  1032. }
  1033. .footer_layout .lay_footer .footer_menu .logo .contact_view .title {
  1034. font-size: 18px;
  1035. margin-top: 0;
  1036. }
  1037. .footer_layout .lay_footer .footer_menu .logo .contact_view .qrcode {
  1038. margin-top: 35px;
  1039. }
  1040. .footer_layout .lay_footer .footer_menu .logo .contact_view .qrcode img {
  1041. height: 120px;
  1042. object-fit: contain;
  1043. }
  1044. .footer_layout .lay_footer .footer_menu .menus .wp-menu {
  1045. flex: 1;
  1046. padding: 30px 0 0 75px;
  1047. display: grid;
  1048. gap: 40px;
  1049. grid-template-columns: repeat(5, 1fr);
  1050. }
  1051. .footer_layout .lay_footer .footer_menu .menus .menu-link {
  1052. font-size: 18px;
  1053. color: #ffffff;
  1054. }
  1055. .footer_layout .lay_footer .footer_menu .menus .sub-link {
  1056. margin-top: 18px;
  1057. display: block;
  1058. font-size: 14px;
  1059. color: rgba(255, 255, 255, 0.5);
  1060. }
  1061. .footer_layout .lay_footer .footer_menu .menus .sub-link:hover {
  1062. color: #ffffff;
  1063. }
  1064. .footer_layout .lay_footer .footer_menu .menus .sub-menu {
  1065. margin-top: 20px;
  1066. }
  1067. .footer_layout .copyright {
  1068. padding: 28px 20px;
  1069. font-size: 12px;
  1070. line-height: 1.5;
  1071. text-align: center;
  1072. background-color: #242424;
  1073. color: rgba(255, 255, 255, 0.6);
  1074. }
  1075. .page_title_box {
  1076. position: relative;
  1077. height: 500px;
  1078. background-position: center center;
  1079. background-repeat: no-repeat;
  1080. background-size: cover;
  1081. }
  1082. .page_title_box img {
  1083. display: none;
  1084. }
  1085. .page_title_box::after {
  1086. content: "";
  1087. position: absolute;
  1088. bottom: 0;
  1089. left: 0;
  1090. width: 100%;
  1091. height: 220px;
  1092. background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
  1093. opacity: 0.7;
  1094. z-index: 1;
  1095. }
  1096. .page_title_box .title {
  1097. position: relative;
  1098. height: 100%;
  1099. display: flex;
  1100. flex-direction: column;
  1101. justify-content: flex-end;
  1102. padding-bottom: 28px;
  1103. z-index: 2;
  1104. }
  1105. .page_title_box .title h1 {
  1106. font-size: 36px;
  1107. font-weight: 400;
  1108. margin-bottom: 16px;
  1109. color: #fff;
  1110. }
  1111. .page_title_box .title h2 {
  1112. margin-bottom: 0;
  1113. height: 1em;
  1114. font-size: 14px;
  1115. font-weight: 300;
  1116. color: #fff;
  1117. }
  1118. .content_wrapper {
  1119. flex: 1;
  1120. padding-left: 40px;
  1121. overflow: hidden;
  1122. }
  1123. .content_wrapper .page_article_box {
  1124. padding: 20px 28px;
  1125. background-color: #fff;
  1126. }
  1127. .content_wrapper .page_article_box .list_title h2 {
  1128. padding-bottom: 20px;
  1129. font-weight: 500;
  1130. font-size: 20px;
  1131. color: #111111;
  1132. line-height: 26px;
  1133. border-bottom: 1px solid #e5e5e5;
  1134. }
  1135. .article {
  1136. padding: 20px 28px;
  1137. background-color: #fff;
  1138. }
  1139. .article h1.arti_title {
  1140. line-height: 36px;
  1141. font-family: "Microsoft YaHei";
  1142. font-size: 28px;
  1143. color: #333;
  1144. } /**文章标题**/
  1145. .article h2.arti_title {
  1146. line-height: 28px;
  1147. font-family: "Microsoft YaHei";
  1148. font-size: 16px;
  1149. color: var(--vt-c-text-light-2);
  1150. } /**文章副标题**/
  1151. .article .arti_metas {
  1152. padding-top: 10px;
  1153. }
  1154. .article .arti_metas span {
  1155. margin: 0 5px;
  1156. font-size: 12px;
  1157. color: #787878;
  1158. } /**文章其他属性**/
  1159. .article .entry {
  1160. margin: 0 auto;
  1161. overflow: hidden;
  1162. margin-top: 30px;
  1163. } /**文章内容**/
  1164. .article .entry .read,
  1165. .page_article_box .wp_entry {
  1166. font-size: 14px;
  1167. line-height: 1.5;
  1168. }
  1169. .article .entry .read p,
  1170. .page_article_box .wp_entry p {
  1171. margin-bottom: 1em;
  1172. }
  1173. .article .entry .read img,
  1174. .page_article_box .wp_entry img {
  1175. margin: 0 auto;
  1176. max-width: 100%;
  1177. } /**文章阅读部分图片大小限制**/
  1178. .article .entry .read table,
  1179. .page_article_box .wp_entry table {
  1180. border: none !important;
  1181. }
  1182. .article .entry .read table td {
  1183. background-color: transparent;
  1184. }
  1185. .page_tabs_box {
  1186. position: relative;
  1187. width: 220px;
  1188. }
  1189. .page_tabs_box .column_title_box {
  1190. display: flex;
  1191. align-items: center;
  1192. margin-bottom: 16px;
  1193. padding: 24px 20px;
  1194. background: var(--vt-c-primary);
  1195. overflow: hidden;
  1196. width: 100%;
  1197. }
  1198. .page_tabs_box .column_title_box > div {
  1199. width: 100%;
  1200. display: flex;
  1201. align-items: center;
  1202. }
  1203. .page_tabs_box .column_title {
  1204. flex: 1;
  1205. font-weight: 600;
  1206. font-size: 28px;
  1207. line-height: 28px;
  1208. color: #ffffff;
  1209. white-space: nowrap;
  1210. overflow: hidden;
  1211. }
  1212. .column_title_box .arrow {
  1213. display: none;
  1214. width: 40px;
  1215. height: 40px;
  1216. background: url("../images/arrow_down_white.png") no-repeat center/contain;
  1217. transition: all 0.4s ease-in-out;
  1218. cursor: pointer;
  1219. }
  1220. .column_title_box .arrow.up {
  1221. transform: rotate(-180deg);
  1222. }
  1223. .page_tabs_box .page_tab_list {
  1224. position: relative;
  1225. width: 100%;
  1226. background-color: #fff;
  1227. }
  1228. .page_tabs_box .page_tab_list .page_list_item {
  1229. width: 100%;
  1230. overflow: hidden;
  1231. border-bottom: 1px solid #e5e5e5;
  1232. }
  1233. .page_tabs_box .page_tab_list .page_list_item:last-child {
  1234. border-bottom: none;
  1235. }
  1236. .page_tabs_box .page_tab_list .page_list_item.selected .sub_list,
  1237. .page_tabs_box .page_tab_list .page_list_item.parent .sub_list {
  1238. display: block;
  1239. }
  1240. .page_tabs_box .page_tab_list .page_list_item .sub_list {
  1241. display: none;
  1242. padding: 0 20px 20px;
  1243. width: 100%;
  1244. }
  1245. .page_tab_list .sub_list .sub_item {
  1246. margin-bottom: 5px;
  1247. }
  1248. .page_tab_list .sub_list .sub_item:last-child {
  1249. margin-bottom: 0;
  1250. }
  1251. .page_tab_list .sub_list .sub_item .sub_item_link {
  1252. display: block;
  1253. padding: 8px 10px;
  1254. color: #666;
  1255. font-size: 14px;
  1256. font-weight: 500;
  1257. border-radius: 2px;
  1258. }
  1259. .page_tab_list .sub_list .sub_item .sub_item_link:hover,
  1260. .page_tab_list .sub_list .sub_item .sub_item_link.selected {
  1261. color: var(--vt-c-primary);
  1262. background-color: rgba(65, 150, 156, 0.1);
  1263. }
  1264. .page_tabs_box .page_tab_list .page_list_item .item_link {
  1265. position: relative;
  1266. display: block;
  1267. width: 100%;
  1268. padding: 20px 18px;
  1269. color: #666;
  1270. font-size: 16px;
  1271. text-overflow: ellipsis;
  1272. overflow: hidden;
  1273. white-space: nowrap;
  1274. }
  1275. .page_tabs_box .page_tab_list .page_list_item .item_link::after {
  1276. content: "";
  1277. position: absolute;
  1278. top: 50%;
  1279. left: 0;
  1280. -webkit-transform: translateY(-50%);
  1281. -ms-transform: translateY(-50%);
  1282. transform: translateY(-50%);
  1283. height: 0;
  1284. width: 0;
  1285. border-left: 3px solid var(--vt-c-primary);
  1286. }
  1287. .page_tabs_box .page_tab_list .page_list_item .item_link.selected,
  1288. .page_tabs_box .page_tab_list .page_list_item .item_link.parent {
  1289. font-weight: 500;
  1290. color: var(--vt-c-primary);
  1291. }
  1292. .page_tabs_box .page_tab_list .page_list_item .item_link.selected::after,
  1293. .page_tabs_box .page_tab_list .page_list_item .item_link.parent::after {
  1294. height: 18px;
  1295. }
  1296. .page_article_list,
  1297. .page_teacher_list {
  1298. display: block;
  1299. padding: 30px 0 50px;
  1300. }
  1301. .page_teacher_list {
  1302. width: 100%;
  1303. overflow: hidden;
  1304. }
  1305. .page_teacher_list .item {
  1306. display: flex;
  1307. align-items: center;
  1308. margin-bottom: 20px;
  1309. }
  1310. .page_teacher_list .item .list_img {
  1311. width: 160px;
  1312. height: 160px;
  1313. padding-bottom: 20px;
  1314. overflow: hidden;
  1315. }
  1316. .page_teacher_list .item .info_box {
  1317. flex: 1;
  1318. height: 160px;
  1319. padding: 0 16px 20px;
  1320. border-bottom: 1px solid #e5e5e5;
  1321. overflow: hidden;
  1322. }
  1323. .page_teacher_list .item .info_box .item_tit {
  1324. width: 100%;
  1325. font-weight: 500;
  1326. font-size: 18px;
  1327. color: #333333;
  1328. line-height: 24px;
  1329. white-space: nowrap;
  1330. text-overflow: ellipsis;
  1331. overflow: hidden;
  1332. }
  1333. .page_teacher_list .item .info_box .item_tit a {
  1334. color: var(--vt-c-indigo);
  1335. }
  1336. .page_teacher_list .item .info_box .item_tit a:hover {
  1337. color: var(--vt-c-primary);
  1338. }
  1339. .page_teacher_list .item .info_box .item_desc {
  1340. height: 70px;
  1341. margin-top: 15px;
  1342. font-size: 12px;
  1343. line-height: 20px;
  1344. font-weight: 400;
  1345. color: #666666;
  1346. overflow: hidden;
  1347. word-break: break-all;
  1348. }
  1349. .page_teacher_list .item .info_box .item_desc a {
  1350. color: #666666;
  1351. }
  1352. .page_teacher_list .item .info_box .item_desc a:hover {
  1353. color: var(--vt-c-primary);
  1354. }
  1355. .page_teacher_list .item .info_box .more {
  1356. display: none;
  1357. text-align: right;
  1358. }
  1359. .page_teacher_list .item:hover .info_box .more {
  1360. display: block;
  1361. }
  1362. .page_teacher_list .item .info_box .more_text {
  1363. color: var(--vt-c-primary);
  1364. cursor: pointer;
  1365. }
  1366. .page_teacher_list .item .info_box .arrow {
  1367. display: inline-block;
  1368. margin-left: 4px;
  1369. width: 16px;
  1370. height: 16px;
  1371. object-fit: contain;
  1372. vertical-align: text-bottom;
  1373. background: url("../images/arrow_right_primary.png") no-repeat center/contain;
  1374. }
  1375. .page_teacher_list .item img {
  1376. width: 160px;
  1377. height: 160px;
  1378. object-fit: cover;
  1379. border-radius: 80px;
  1380. transition: all 0.3s ease-in-out;
  1381. }
  1382. .page_def_list {
  1383. display: block;
  1384. padding: 30px 0 50px;
  1385. }
  1386. .page_def_list .item {
  1387. position: relative;
  1388. display: flex;
  1389. align-items: center;
  1390. border-bottom: 1px solid #e5e5e5;
  1391. }
  1392. .page_def_list .item:hover {
  1393. background-color: #f5f5f5;
  1394. }
  1395. .page_def_list .item .item_title {
  1396. flex: 1;
  1397. overflow: hidden;
  1398. }
  1399. .page_def_list .item .item_date {
  1400. padding-right: 20px;
  1401. font-size: 12px;
  1402. color: #747474;
  1403. }
  1404. .page_def_list .item:hover a {
  1405. color: var(--vt-c-primary);
  1406. }
  1407. .page_def_list .item a {
  1408. position: relative;
  1409. display: block;
  1410. line-height: 20px;
  1411. width: 100%;
  1412. font-size: 16px;
  1413. padding: 12px 20px;
  1414. text-overflow: ellipsis;
  1415. white-space: nowrap;
  1416. overflow: hidden;
  1417. }
  1418. .header_btns {
  1419. display: flex;
  1420. align-items: center;
  1421. }
  1422. .search_box {
  1423. position: relative;
  1424. padding-left: 20px;
  1425. }
  1426. .search_box .wp-search {
  1427. position: fixed;
  1428. top: -100%;
  1429. left: 0;
  1430. z-index: 201;
  1431. width: 100%;
  1432. padding: 16px 25px;
  1433. background-color: #fff;
  1434. overflow: hidden;
  1435. }
  1436. .search_box .wp-search .form_box {
  1437. display: flex;
  1438. align-items: center;
  1439. width: 100%;
  1440. height: 65px;
  1441. margin: 0 auto;
  1442. }
  1443. .search_box .wp-search .form_box .search-input {
  1444. flex: 1;
  1445. }
  1446. .search_box .wp-search .form_box .search-input input {
  1447. display: inline-block;
  1448. line-height: 1.5;
  1449. width: 100%;
  1450. padding: 6px 14px;
  1451. color: rgba(0, 0, 0, 0.85);
  1452. font-size: 14px;
  1453. background-color: transparent;
  1454. border: 1px solid #d9d9d9;
  1455. border-radius: 2px 0 0 2px;
  1456. transition: all 0.3s;
  1457. }
  1458. .search_box .wp-search .form_box .search-btn input {
  1459. background-color: var(--vt-c-primary);
  1460. color: #fff;
  1461. line-height: 1.5;
  1462. font-size: 14px;
  1463. padding: 6px 20px;
  1464. border: 1px solid var(--vt-c-primary);
  1465. border-radius: 0 2px 2px 0;
  1466. cursor: pointer;
  1467. }
  1468. .search_box .search_icon {
  1469. display: block;
  1470. width: 40px;
  1471. height: 40px;
  1472. background: url("../images/icon_search.png") no-repeat center/contain;
  1473. cursor: pointer;
  1474. }
  1475. .search_box .close_icon {
  1476. display: block;
  1477. margin-left: 10px;
  1478. width: 40px;
  1479. height: 40px;
  1480. background: url("../images/icon_close.png") no-repeat center/contain;
  1481. cursor: pointer;
  1482. }
  1483. .page_article_box .wp_paging {
  1484. margin-top: 20px;
  1485. float: none;
  1486. text-align: center;
  1487. }
  1488. .page_article_box .wp_paging li {
  1489. float: none;
  1490. }
  1491. .page_teacher_name_list {
  1492. display: grid;
  1493. grid-template-columns: repeat(3, 1fr);
  1494. gap: 12px;
  1495. padding: 30px 0 50px;
  1496. }
  1497. .page_teacher_name_list .item,
  1498. .page_teacher_name_list .item .item_tit {
  1499. width: 100%;
  1500. overflow: hidden;
  1501. }
  1502. .page_teacher_name_list .item .item_tit a {
  1503. display: block;
  1504. width: 100%;
  1505. padding: 16px 20px;
  1506. overflow: hidden;
  1507. text-overflow: ellipsis;
  1508. white-space: nowrap;
  1509. font-size: 16px;
  1510. color: var(--vt-c-indigo);
  1511. border: 1px solid #f5f5f5;
  1512. }
  1513. .page_teacher_name_list .item .item_tit a:hover {
  1514. color: var(--vt-c-primary);
  1515. background-color: #f5f5f5;
  1516. }