@charset "UTF-8"; @font-face { font-family: "DIN"; src: url(../fonts/DIN-Regular.otf) format("opentype"); font-weight: normal; } @font-face { font-family: "DIN"; src: url(../fonts/DIN-Medium.otf) format("opentype"); font-weight: 500; } @font-face { font-family: "DIN"; src: url(../fonts/DIN-Bold.otf) format("opentype"); font-weight: 800; } * { padding: 0; margin: 0; box-sizing: border-box; -webkit-overflow-scrolling: touch; overflow-scrolling: touch; } .clearfix:after { content: " "; display: table; height: 0; clear: both; visibility: hidden; } p { margin: 0; padding: 0; } a, a:hover, a:visited { color: #000; text-decoration: none; } .slide { position: absolute; top: 0; bottom: 0; left: 0; right: 0; background-size: cover; background-position: center; background-color: #333; } html { background-color: #d9d9d9; } body { color: #000; font-family: "DIN", "PingFang SC", "Hiragino Sans GB", "鍐潚榛戜綋", "Microsoft YaHei", "寰蒋闆呴粦", Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; background-color: #d9d9d9; font-size: 18px; line-height: 1.5; } .hide { display: none !important; } img { vertical-align: middle; } .flash-move { opacity: 0; filter: alpha(opacity=0); transform: translateY(100px); transition: all 0.8s; } .flash-move.move-on { opacity: 1; filter: alpha(opacity=100); transform: translateY(0); transition: all 0.7s; } .shadow { position: fixed; width: 100%; height: 100%; z-index: 10; background-color: rgba(0, 0, 0, 0.5); opacity: 0; display: none; } .shadow.open { display: block; -webkit-animation-name: shadowShow; animation-name: shadowShow; -webkit-animation-duration: 0.4s; animation-duration: 0.4s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .shadow.close { display: block; -webkit-animation-name: shadowHide; animation-name: shadowHide; -webkit-animation-duration: 0.4s; animation-duration: 0.4s; -webkit-animation-fill-mode: both; animation-fill-mode: both; } .display-pc { display: block; } .not-display-pc { display: none; } .btn-nav span { white-space: nowrap; font-weight: 500; } .wrapper { width: 100%; } .wrapper .topbar { width: 100%; height: 73px; position: fixed; left: 0; top: 0; z-index: 12; } .wrapper .topbar .logo { position: absolute; height: 33px; right: 40px; top: 40px; } .wrapper .topbar .logo-s { display: none; position: absolute; height: 23px; right: 40px; top: 18px; z-index: 2; } .wrapper .topbar .btn-menu-opener { position: fixed; left: 40px; top: 40px; width: 16px; cursor: pointer; z-index: 99; transition: all 0.3s; } .wrapper .topbar .btn-menu-opener .b-menu { display: inline-block; padding-left: 0; position: relative; user-select: none; width: 16px; height: 11px; z-index: 21; cursor: pointer; } .wrapper .topbar .btn-menu-opener .b-menu .b-bun { background-color: #fff; position: relative; width: 16px; height: 2px; float: left; } .wrapper .topbar .btn-menu-opener .b-menu .b-bun--top { top: 0; transition: all 0.4s; } .wrapper .topbar .btn-menu-opener .b-menu .b-bun--bottom { transition: all 0.4s; top: 5px; } .wrapper .topbar .btn-menu-opener.open { position: fixed; left: 50px; top: 49px; z-index: 10; } .wrapper .topbar .btn-menu-opener.open .b-menu .b-bun--top { top: 3px; transform: rotate(45deg) scale(1.08); } .wrapper .topbar .btn-menu-opener.open .b-menu .b-bun--bottom { top: 1px; transform: rotate(-45deg) scale(1.08); } .wrapper .topbar .btn-search { position: fixed; left: 96px; top: 40px; width: 15px; cursor: pointer; } .wrapper .topbar .btn-search img { width: 100%; } .wrapper .topbar .topbar-w { display: none; padding: 0 40px; width: 100%; height: 60px; background-color: #fff; position: relative; } .wrapper .topbar .topbar-w .topbar--w { display: flex; justify-content: flex-start; align-items: center; } .wrapper .topbar .topbar-w .topbar--w .navs { height: 60px; display: flex; justify-content: flex-start; align-items: center; } .wrapper .topbar .topbar-w .topbar--w .navs .nav { font-size: 14px; line-height: 60px; font-weight: 500; margin-right: 30px; cursor: pointer; transition: color 0.4s; } .wrapper .topbar .topbar-w .topbar--w .navs .nav:hover, .wrapper .topbar .topbar-w .topbar--w .navs .nav.active { color: #b81c22; } .wrapper .topbar .topbar-w .topbar--w .btn-search-2 { height: 60px; display: flex; justify-content: center; align-items: center; cursor: pointer; } .wrapper .topbar .topbar-w .topbar--w .btn-search-2 img { width: 15px; filter: invert(1); } .wrapper .topbar .topbar-w .sub-menus { position: absolute; left: 0; top: 60px; width: 100%; height: 60px; border-top: 1px rgba(0, 0, 0, 0.1) solid; z-index: 2; background-color: #fff; display: none; } .wrapper .topbar .topbar-w .sub-menus .menus-w { display: none; position: relative; } .wrapper .topbar .topbar-w .sub-menus .menus-w.active { display: block; } .wrapper .topbar .topbar-w .sub-menus .menus-w .s-navs { width: 100%; height: 60px; display: flex; justify-content: flex-start; align-items: center; padding: 0 40px; } .wrapper .topbar .topbar-w .sub-menus .menus-w .s-navs .fstt { font-size: 14px; margin-right: 30px; transition: color 0.4s; } .wrapper .topbar .topbar-w .sub-menus .menus-w .s-navs .fstt:hover { color: #b81c22; } .wrapper .topbar .topbar-w .sub-menus .menus-w .ct { position: absolute; right: 40px; top: 0; font-size: 14px; font-weight: 500; line-height: 60px; } .wrapper .topbar.wht { height: 60px; } .wrapper .topbar.wht .logo { display: none; } .wrapper .topbar.wht .logo-s { display: inline-block; } .wrapper .topbar.wht .btn-menu-opener { display: none; } .wrapper .topbar.wht .btn-search { display: none; } .wrapper .topbar.wht .topbar-w { display: block; } .wrapper .menus-f-w { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 14; background-color: #d9d9d9; padding-left: 160px; padding-top: 200px; display: none; } .wrapper .menus-f-w:before { content: " "; position: absolute; top: 100px; left: 0; width: 100%; height: 1px; background-color: rgba(0, 0, 0, 0.1); } .wrapper .menus-f-w .btn-close-menu { width: 40px; height: 40px; position: absolute; left: 28px; top: 34px; display: flex; justify-content: center; align-items: center; cursor: pointer; z-index: 12; } .wrapper .menus-f-w .btn-close-menu img { width: 16px; filter: invert(1); } .wrapper .menus-f-w .logo { position: absolute; right: 40px; top: 40px; height: 33px; } .wrapper .menus-f-w .menus-list { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; } .wrapper .menus-f-w .menus-list .nav { font-size: 35px; line-height: 55px; color: #808080; font-weight: 500; margin-bottom: 8px; cursor: pointer; position: relative; transition: color 0.4s; width: 124px; } .wrapper .menus-f-w .menus-list .nav:hover, .wrapper .menus-f-w .menus-list .nav.active { color: #000; } .wrapper .menus-f-w .menus-list .nav .menus-w { position: absolute; top: 0; left: 124px; padding-top: 4px; display: none; } .wrapper .menus-f-w .menus-list .nav .menus-w .s-navs { display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; font-size: 30px; line-height: 50px; font-weight: normal; } .wrapper .menus-f-w .menus-list .nav .menus-w .s-navs .fstt { white-space: nowrap; position: relative; transition: color 0.4s; color: #808080; margin-bottom: 10px; } .wrapper .menus-f-w .menus-list .nav .menus-w .s-navs .fstt .ar { position: absolute; left: 160px; height: 12px; top: 19px; opacity: 0; transition: opacity 0.4s; } .wrapper .menus-f-w .menus-list .nav .menus-w .s-navs .fstt:hover, .wrapper .menus-f-w .menus-list .nav .menus-w .s-navs .fstt.active { color: #000; } .wrapper .menus-f-w .menus-list .nav .menus-w .s-navs .fstt:hover .ar, .wrapper .menus-f-w .menus-list .nav .menus-w .s-navs .fstt.active .ar { opacity: 1; } .wrapper .footer { width: 100%; border-top: 1px rgba(0, 0, 0, 0.1) solid; } .wrapper .footer .tp { width: 100%; padding: 80px 40px; display: flex; justify-content: space-between; align-items: flex-start; } .wrapper .footer .tp .lp { display: flex; justify-content: flex-start; align-items: flex-start; } .wrapper .footer .tp .lp .col { margin-right: 80px; } .wrapper .footer .tp .lp .col:last-child { margin-right: 0; } .wrapper .footer .tp .lp .col .ftt { font-size: 16px; line-height: 21px; margin-bottom: 20px; font-weight: 500; } .wrapper .footer .tp .lp .col .cols { display: flex; justify-content: flex-start; align-items: flex-start; } .wrapper .footer .tp .lp .col .cols .col-2 { display: flex; flex-direction: column; margin-right: 40px; } .wrapper .footer .tp .lp .col .cols .col-2:last-child { margin-right: 0; } .wrapper .footer .tp .lp .col .cols .col-2 .fstt { font-size: 12px; line-height: 21px; } .wrapper .footer .tp .rp { display: flex; flex-direction: column; } .wrapper .footer .tp .rp .ftt { font-size: 16px; line-height: 21px; margin-bottom: 20px; font-weight: 500; } .wrapper .footer .tp .rp .cols { display: flex; justify-content: flex-end; align-items: flex-start; } .wrapper .footer .tp .rp .cols .col-2 { display: flex; flex-direction: column; margin-right: 75px; } .wrapper .footer .tp .rp .cols .col-2:last-child { margin-right: 0; } .wrapper .footer .tp .rp .cols .col-2 .way-w { display: flex; justify-content: flex-start; align-items: center; } .wrapper .footer .tp .rp .cols .col-2 .way-w .tag { width: 30px; font-size: 12px; line-height: 21px; font-weight: 500; } .wrapper .footer .tp .rp .cols .col-2 .way-w .way { font-size: 12px; line-height: 21px; } .wrapper .footer .footer-resp-w { display: none; } .wrapper .footer .bp { border-top: 1px rgba(0, 0, 0, 0.1) solid; width: 100%; height: 75px; padding: 0 40px; display: flex; justify-content: space-between; align-items: center; } .wrapper .footer .bp .cp { font-size: 10px; } .wrapper .footer .bp .cp a { color: #000; } .wrapper .footer .bp .email-sub { width: 400px; position: relative; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; } .wrapper .footer .bp .email-sub input { width: 100%; height: 44px; outline: none; border: none; background-color: transparent; font-size: 12px; padding-left: 30px; } .wrapper .footer .bp .email-sub .tag { position: absolute; left: 0; font-size: 12px; top: 12px; } .wrapper .footer .bp .email-sub .btn-send { position: absolute; top: 0; right: 0; width: 52px; height: 52px; cursor: pointer; display: flex; justify-content: center; align-items: center; } .wrapper .footer .bp .email-sub .btn-send img { width: 15px; } .wrapper .search-w { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.25); z-index: 12; display: none; } .wrapper .search-w .search--w { width: 100%; height: 100%; display: flex; justify-content: center; align-items: center; } .wrapper .search-w .search--w .search-bar { width: 1000px; height: 75px; background-color: #fff; position: relative; } .wrapper .search-w .search--w .search-bar input { width: 1000px; height: 75px; border: none; outline: none; border-radius: 0; padding-left: 46px; font-size: 18px; } .wrapper .search-w .search--w .search-bar:before { content: " "; position: absolute; left: 24px; top: 28px; width: 2px; height: 18px; background-color: #000; } .wrapper .search-w .search--w .search-bar .btn-confirm-search { position: absolute; right: 0; top: 0; width: 75px; height: 75px; display: flex; justify-content: center; align-items: center; cursor: pointer; } .wrapper .search-w .search--w .search-bar .btn-confirm-search img { width: 21px; } .wrapper .load-more { width: 100%; display: flex; justify-content: center; align-items: center; margin-top: 40px; } .wrapper .load-more .btn-more { display: inline-block; padding: 8px 12px; font-size: 12px; border-bottom: 1px black solid; cursor: pointer; } .wrapper .index-w .index-slides { width: 100%; margin: 0 auto; position: relative; overflow: hidden; height: 600px; } .wrapper .index-w .index-slides .index-slides-w { width: 100%; margin: 0 auto; position: relative; overflow: hidden; height: 100%; } .wrapper .index-w .index-slides .index-slides-w .swiper-slide { position: relative; display: block; } .wrapper .index-w .index-slides .index-slides-w .swiper-slide .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0 96px 42px; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; color: #fff; background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 85%, rgba(0, 0, 0, 0.25) 100%); } .wrapper .index-w .index-slides .index-slides-w .swiper-slide .info .tt { font-size: 14px; line-height: 1; color: #fff; } .wrapper .index-w .index-slides .index-slides-w .swiper-slide video { width: 100vw; height: 100vh; object-fit: cover; position: relative; top: 0; left: 0; } .wrapper .index-w .index-slides .index-slides-w .swiper-pagination-custom { padding-left: 40px; bottom: 40px; font-size: 12px; text-align: left; color: #fff; z-index: 5; width: 90px; } .wrapper .index-w .index-slides .index-slides-w .cp { position: absolute; left: 0; right: 0; bottom: 0; margin: 0 auto 40px; z-index: 5; color: #fff; font-size: 10px; text-align: center; } .wrapper .index-w .index-slides .index-slides-w .cp a { color: #fff; } .wrapper .index-w .index-slides .index-slides-w .nav-prev, .wrapper .index-w .index-slides .index-slides-w .nav-next { position: absolute; width: 25%; height: 80%; top: 10%; z-index: 5; cursor: pointer; } .wrapper .index-w .index-slides .index-slides-w .nav-prev { left: 0; } .wrapper .index-w .index-slides .index-slides-w .nav-next { right: 0; } .wrapper .index-w .index-slides .index-slides-w .btn-expand-collapse { position: absolute; right: 40px; bottom: 40px; width: 33px; cursor: pointer; z-index: 8; } .wrapper .index-w .index-slides .index-slides-w .btn-expand-collapse img { width: 100%; vertical-align: top; } .wrapper .index-w .index-slides .index-slides-w .btn-expand-collapse svg { vertical-align: top; } .wrapper .index-w .index-slides .index-slides-w .btn-expand-collapse .collapse { display: none; } .wrapper .index-w .index-slides .index-slides-w .btn-expand-collapse.open .collapse { display: inline; } .wrapper .index-w .index-slides .index-slides-w .btn-expand-collapse.open .expand { display: none; } .wrapper .index-w .index-slides .index-slides-w .categories-w { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #d9d9d9; z-index: 7; display: none; } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-w { width: 100%; height: 100%; display: flex; justify-content: space-between; align-content: space-between; flex-wrap: wrap; } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-w .item { width: calc((100% - 10px) / 3); height: calc((100vh - 10px) / 3); position: relative; } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-w .item .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 40px; color: #fff; } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-w .item .info .tt-en { font-size: 25px; line-height: 1; font-weight: 500; text-transform: uppercase; } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-w .item .info .tt-zh { font-size: 18px; line-height: 30px; font-weight: 500; } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-w .item .info .ar { height: 9px; position: absolute; right: 40px; bottom: 40px; } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-resp-w { display: none; width: 100%; height: 100%; } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-resp-w .item { width: 100%; height: calc(100vh / 9); position: relative; transition: height 0.4s; } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-resp-w .item .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #d9d9d9; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; transition: background-color 0.4s; } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-resp-w .item .info .tt-zh { position: absolute; left: 15px; bottom: 15px; font-size: 11px; font-weight: 500; } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-resp-w .item .info .ar { position: absolute; right: 15px; bottom: 15px; height: 7px; filter: invert(1); } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-resp-w .item.open { height: calc(100vh / 4); } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-resp-w .item.open .info { background-color: transparent; } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-resp-w .item.open .info .tt-zh { color: #fff; } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-resp-w .item.open .info .ar { filter: invert(0); } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-resp-w .item.mini { height: calc(100vh * 3 / 32); } .wrapper .index-w .idx-about-w { width: 100%; padding: 20px 40px 80px; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; } .wrapper .index-w .idx-about-w .tt { font-size: 21px; line-height: 30px; font-weight: 500; text-align: center; margin-bottom: 40px; } .wrapper .index-w .idx-about-w .btn-nav { display: flex; justify-content: center; align-items: center; font-size: 14px; } .wrapper .index-w .idx-about-w .btn-nav img { height: 10px; margin-left: 10px; } .wrapper .index-w .idx-prjs-w { width: 100%; padding: 80px 40px 80px; } .wrapper .index-w .idx-prjs-w .idx-prjs { width: 100%; } .wrapper .index-w .idx-prjs-w .idx-prjs .btt { width: 100%; display: flex; justify-content: space-between; align-items: center; margin-bottom: 40px; } .wrapper .index-w .idx-prjs-w .idx-prjs .btt .tt { font-size: 27px; font-weight: 500; } .wrapper .index-w .idx-prjs-w .idx-prjs .btt .btn-nav { display: flex; justify-content: flex-end; align-items: center; font-size: 14px; } .wrapper .index-w .idx-prjs-w .idx-prjs .btt .btn-nav img { height: 10px; margin-left: 10px; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w { width: 100%; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w { width: 100%; display: flex; justify-content: space-between; align-items: flex-start; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .col { width: 32.9%; position: relative; height: 0; padding-top: 50%; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .col-r { width: calc(100% - 32.9% - 10px); height: 0; padding-top: 50%; position: relative; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .col-r .col-r-w { width: 100%; height: 100%; position: absolute; left: 0; top: 0; display: flex; flex-direction: column; justify-content: space-between; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .col-r .row { width: 100%; height: calc(50% - 5px); position: relative; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .col-r .row-2 { width: 100%; height: calc(50% - 5px); display: flex; justify-content: space-between; align-items: flex-start; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .col-r .row-2 .row-col { width: calc(50% - 5px); height: 100%; position: relative; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .item { width: 100%; height: 100%; position: absolute; left: 0; top: 0; display: block; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .item .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 30px; color: #fff; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, transparent 30%, transparent 100%); } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .item .info .tt-en { font-size: 25px; line-height: 1; font-weight: 500; text-transform: uppercase; margin-bottom: 8px; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .item .info .tt-zh { font-size: 18px; line-height: 22px; font-weight: 500; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .item .info .ar { height: 9px; position: absolute; right: 40px; bottom: 40px; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w { width: 100%; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w { width: 100%; display: flex; justify-content: space-between; align-items: flex-start; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w .item { display: block; width: calc((100% - 30px) / 4); height: 0; padding-top: 38%; position: relative; cursor: pointer; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w .item .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 30px; color: #fff; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, transparent 30%, transparent 100%); } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w .item .info .tt { font-size: 21px; line-height: 30px; font-weight: 500; margin-bottom: 20px; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w .item .info .stt { font-size: 14px; line-height: 21px; margin-bottom: 25px; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w .item .info .dt { font-size: 12px; line-height: 1; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w .item.col-3 { width: calc((100% - 20px) / 3); } .wrapper .index-w .idx-prjs-w .idx-prjs .prj-type-switcher { width: 100%; margin-top: 20px; display: flex; justify-content: space-between; align-items: center; } .wrapper .index-w .idx-prjs-w .idx-prjs .prj-type-switcher .item { width: calc((100% - 10px) / 3); padding: 20px 0; text-align: center; border-bottom: 1px black solid; font-size: 14px; transition: color 0.4s; cursor: pointer; } .wrapper .index-w .idx-prjs-w .idx-prjs .prj-type-switcher .item.active, .wrapper .index-w .idx-prjs-w .idx-prjs .prj-type-switcher .item:hover { padding-bottom: 19px; font-weight: 500; color: #b81c22; border-bottom: 2px #b81c22 solid; } .wrapper .index-w .idx-prize-b-w { width: 100%; position: relative; } .wrapper .index-w .idx-prize-b-w .cover { width: 100%; } .wrapper .index-w .idx-prize-b-w .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0 20px 0 50%; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; color: #fff; } .wrapper .index-w .idx-prize-b-w .info .tt { font-size: 60px; line-height: 1.13; margin-bottom: 30px; } .wrapper .index-w .idx-prize-b-w .info .btn-nav { display: flex; justify-content: flex-start; align-items: center; color: #fff; font-size: 14px; } .wrapper .index-w .idx-prize-b-w .info .btn-nav img { height: 9px; margin-left: 10px; } .wrapper .index-w .idx-prize-b-w .btn-expand-collapse { position: absolute; right: 40px; bottom: 40px; width: 33px; cursor: pointer; z-index: 8; } .wrapper .index-w .idx-prize-b-w .btn-expand-collapse img { width: 100%; vertical-align: top; } .wrapper .index-w .idx-prize-b-w .btn-expand-collapse svg { vertical-align: top; } .wrapper .index-w .idx-prize-b-w .btn-expand-collapse .collapse { display: none; } .wrapper .index-w .idx-prize-b-w .btn-expand-collapse.open .collapse { display: inline; } .wrapper .index-w .idx-prize-b-w .btn-expand-collapse.open .expand { display: none; } .wrapper .index-w .idx-prize-b-w .categories-w { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #d9d9d9; z-index: 7; display: none; } .wrapper .index-w .idx-prize-b-w .categories-w .cats-w { width: 100%; height: 100%; display: flex; justify-content: space-between; align-content: space-between; flex-wrap: wrap; } .wrapper .index-w .idx-prize-b-w .categories-w .cats-w .item { width: calc((100% - 10px) / 3); height: calc((100% - 6px) / 2); position: relative; } .wrapper .index-w .idx-prize-b-w .categories-w .cats-w .item .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 40px; color: #fff; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, transparent 30%, transparent 100%); } .wrapper .index-w .idx-prize-b-w .categories-w .cats-w .item .info .tt-en { font-size: 18px; line-height: 30px; } .wrapper .index-w .idx-prize-b-w .categories-w .cats-w .item .info .tt-zh { font-size: 18px; line-height: 30px; font-weight: 500; } .wrapper .index-w .idx-prize-b-w .categories-w .cats-w .item .info .ar { height: 9px; position: absolute; right: 40px; bottom: 40px; } .wrapper .index-w .idx-news-w { width: 100%; padding: 80px 40px; } .wrapper .index-w .idx-news-w .idx-news { width: 100%; } .wrapper .index-w .idx-news-w .idx-news .btt { width: 100%; display: flex; justify-content: space-between; align-items: center; margin-bottom: 40px; } .wrapper .index-w .idx-news-w .idx-news .btt .tt { font-size: 27px; font-weight: 500; } .wrapper .index-w .idx-news-w .idx-news .btt .btn-nav { display: flex; justify-content: center; align-items: center; font-size: 14px; } .wrapper .index-w .idx-news-w .idx-news .btt .btn-nav img { height: 10px; margin-left: 10px; } .wrapper .index-w .idx-news-w .idx-news .news-list-w { width: calc(100% + 10px); margin-left: -5px; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .grid-sizer { width: 25%; margin-bottom: 0 !important; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news { width: 25%; padding: 0 5px; margin-bottom: 10px; float: left; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news .news-w { width: 100%; display: flex; flex-direction: column; justify-content: flex-start; align-items: flex-start; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news .news-w img { width: 100%; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news .news-w .cover-w { width: 100%; padding-top: 68.75%; height: 0; position: relative; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news .news-w .info { width: 100%; background-color: #c6c6c6; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; padding: 30px; height: 270px; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news .news-w .info .tt { font-size: 21px; line-height: 30px; font-weight: 500; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news .news-w .info .info-w .desc { font-size: 14px; line-height: 21px; max-height: 63px; overflow-y: hidden; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news .news-w .info .info-w .dt { margin-top: 12px; font-size: 12px; line-height: 1; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news .news-w.reverse { flex-direction: column-reverse; } .wrapper .index-w .idx-about-b-w { width: 100%; position: relative; } .wrapper .index-w .idx-about-b-w .cover { width: 100%; } .wrapper .index-w .idx-about-b-w .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0 20px 0 160px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; color: #fff; } .wrapper .index-w .idx-about-b-w .info .tt { font-size: 60px; line-height: 1.13; margin-bottom: 30px; } .wrapper .index-w .idx-about-b-w .info .btn-nav { display: flex; justify-content: flex-start; align-items: center; color: #fff; font-size: 14px; } .wrapper .index-w .idx-about-b-w .info .btn-nav img { height: 9px; margin-left: 10px; } .wrapper .index-w .idx-about-b-w .btn-expand-collapse { position: absolute; right: 40px; bottom: 40px; width: 33px; cursor: pointer; z-index: 8; } .wrapper .index-w .idx-about-b-w .btn-expand-collapse img { width: 100%; vertical-align: top; } .wrapper .index-w .idx-about-b-w .btn-expand-collapse svg { vertical-align: top; } .wrapper .index-w .idx-about-b-w .btn-expand-collapse .collapse { display: none; } .wrapper .index-w .idx-about-b-w .btn-expand-collapse.open .collapse { display: inline; } .wrapper .index-w .idx-about-b-w .btn-expand-collapse.open .expand { display: none; } .wrapper .index-w .idx-about-b-w .categories-w { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: #d9d9d9; z-index: 7; display: none; } .wrapper .index-w .idx-about-b-w .categories-w .cats-w { width: 100%; height: 100%; display: flex; justify-content: space-between; align-content: space-between; } .wrapper .index-w .idx-about-b-w .categories-w .cats-w .item { width: calc((100% - 10px) / 3); height: 100%; position: relative; } .wrapper .index-w .idx-about-b-w .categories-w .cats-w .item .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 40px; color: #fff; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, transparent 30%, transparent 100%); } .wrapper .index-w .idx-about-b-w .categories-w .cats-w .item .info .tt-zh { font-size: 21px; line-height: 30px; font-weight: 500; } .wrapper .index-w .idx-about-b-w .categories-w .cats-w .item .info .ar { height: 9px; position: absolute; right: 40px; bottom: 40px; } .wrapper .common-slides { width: 100%; margin: 0 auto; position: relative; overflow: hidden; height: 800px; } .wrapper .common-slides .common-slides-w { width: 100%; margin: 0 auto; position: relative; overflow: hidden; height: 100%; } .wrapper .common-slides .common-slides-w .swiper-slide { position: relative; } .wrapper .common-slides .common-slides-w .swiper-slide .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0 158px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; color: #fff; background-color: rgba(0, 0, 0, 0.25); } .wrapper .common-slides .common-slides-w .swiper-slide .info .hint { font-size: 14px; margin-bottom: 12px; } .wrapper .common-slides .common-slides-w .swiper-slide .info .tt { font-size: 75px; line-height: 1.13; margin-bottom: 40px; } .wrapper .common-slides .common-slides-w .swiper-slide .info .tt-s { font-size: 60px; line-height: 1.16; margin-bottom: 40px; } .wrapper .common-slides .common-slides-w .swiper-slide .info .htt { font-size: 14px; line-height: 1; margin-bottom: 15px; } .wrapper .common-slides .common-slides-w .swiper-slide .info .btn-nav { display: flex; justify-content: flex-start; align-items: center; color: #fff; font-size: 14px; } .wrapper .common-slides .common-slides-w .swiper-slide .info .btn-nav img { height: 9px; margin-left: 10px; } .wrapper .common-slides .common-slides-w .swiper-pagination-custom { padding-left: 40px; bottom: 40px; font-size: 12px; text-align: left; color: #fff; z-index: 5; } .wrapper .common-slides .common-slides-w .swiper-pagination-custom .swiper-pagination-current { color: #fff; } .wrapper .prj-cats-w .prj-categories-w { width: 100%; margin-top: 10px; margin-bottom: 80px; } .wrapper .prj-cats-w .prj-categories-w .cats-w { width: 100%; height: 100%; display: flex; justify-content: space-between; align-content: space-between; flex-wrap: wrap; } .wrapper .prj-cats-w .prj-categories-w .cats-w .item { width: calc((100vw - 20px) / 3); height: 0; padding-top: 25%; position: relative; margin-bottom: 10px; } .wrapper .prj-cats-w .prj-categories-w .cats-w .item .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 40px; color: #fff; } .wrapper .prj-cats-w .prj-categories-w .cats-w .item .info .tt-en { font-size: 25px; line-height: 1; font-weight: 500; text-transform: uppercase; } .wrapper .prj-cats-w .prj-categories-w .cats-w .item .info .tt-zh { font-size: 18px; line-height: 30px; font-weight: 500; } .wrapper .prj-cats-w .prj-categories-w .cats-w .item .info .ar { height: 9px; position: absolute; right: 40px; bottom: 40px; } .wrapper .prjs-w { width: 100%; } .wrapper .prjs-w .prjs-list-w { width: 100%; padding: 0 40px 80px; } .wrapper .prjs-w .prjs-list-w .btt { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 40px 0; } .wrapper .prjs-w .prjs-list-w .btt .tt { font-size: 27px; font-weight: 500; } .wrapper .prjs-w .prjs-list-w .btt .filters { display: flex; justify-content: flex-end; align-items: center; font-size: 14px; font-weight: 500; } .wrapper .prjs-w .prjs-list-w .btt .filters .item { padding: 5px 8px; cursor: pointer; border-bottom: 1px transparent solid; transition: all 0.4s; } .wrapper .prjs-w .prjs-list-w .btt .filters .item.active, .wrapper .prjs-w .prjs-list-w .btt .filters .item:hover { color: #b81c22; border-bottom: 1px #b81c22 solid; } .wrapper .prjs-w .prjs-list-w .btt .selector-w { display: none; } .wrapper .prjs-w .prjs-list-w .prjs-list { width: 100%; display: flex; justify-content: space-between; align-content: space-between; flex-wrap: wrap; } .wrapper .prjs-w .prjs-list-w .prjs-list .item { position: relative; width: calc(50% - 5px); height: 0; padding-top: 32%; margin-bottom: 10px; } .wrapper .prjs-w .prjs-list-w .prjs-list .item .tag { position: absolute; right: 0; top: 0; width: 33px; height: 33px; background-color: #b81c22; color: #fff; display: flex; justify-content: center; align-items: center; font-size: 10px; z-index: 2; font-weight: 800; } .wrapper .prjs-w .prjs-list-w .prjs-list .item .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 100%); color: #fff; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; padding: 0 36px 34px; } .wrapper .prjs-w .prjs-list-w .prjs-list .item .info .tt-en { font-size: 23px; line-height: 1; font-weight: 500; text-transform: uppercase; margin-bottom: 16px; } .wrapper .prjs-w .prjs-list-w .prjs-list .item .info .tt-zh { font-size: 18px; font-weight: 500; margin-bottom: 14px; } .wrapper .prjs-w .prjs-list-w .prjs-list .item .info .s-info { display: flex; justify-content: flex-start; align-items: center; font-size: 14px; } .wrapper .prjs-w .prjs-list-w .prjs-list .item .info .s-info span { margin-right: 18px; } .wrapper .prjs-w .prjs-list-w .prjs-list .item .info .ar { height: 9px; position: absolute; right: 40px; bottom: 40px; } .wrapper .top-filter-opener { position: fixed; right: 40px; bottom: 40px; cursor: pointer; width: 33px; height: 33px; background-color: #fff; display: flex; justify-content: center; align-items: center; z-index: 8; } .wrapper .top-filter-opener img { width: 15px; } .wrapper .top-filters { position: fixed; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.25); z-index: 10; display: none; } .wrapper .top-filters .filter-w { width: 300px; height: 100%; position: absolute; right: -300px; top: 0; background-color: #fff; padding: 40px 40px 0; transition: right 0.4s; overflow-y: scroll; } .wrapper .top-filters .filter-w.fadeIn { right: 0; } .wrapper .top-filters .filter-w .f-tt { font-size: 18px; display: flex; justify-content: flex-start; align-items: center; margin-bottom: 60px; } .wrapper .top-filters .filter-w .f-tt span { margin-right: 9px; font-weight: 500; } .wrapper .top-filters .filter-w .f-tt img { height: 15px; } .wrapper .top-filters .filter-w .filter-grp { width: 100%; margin-bottom: 60px; } .wrapper .top-filters .filter-w .filter-grp .fg-tt { width: 100%; font-size: 14px; font-weight: 500; margin-bottom: 20px; } .wrapper .top-filters .filter-w .filter-grp .filter-row { width: 100%; } .wrapper .top-filters .filter-w .filter-grp .filter-row .filter-crt { width: 100%; height: 60px; position: relative; border-bottom: 1px black solid; display: flex; justify-content: flex-start; align-items: center; font-size: 12px; cursor: pointer; margin-bottom: 10px; } .wrapper .top-filters .filter-w .filter-grp .filter-row .filter-crt .ar { position: absolute; right: 0; bottom: 25px; width: 6px; transform: rotate(90deg); transition: all 0.4s; } .wrapper .top-filters .filter-w .filter-grp .filter-row .filter-crt.open .ar { transform: rotate(-90deg); } .wrapper .top-filters .filter-w .filter-grp .filter-row .wait-select-w { display: none; } .wrapper .top-filters .filter-w .filter-grp .filter-row .wait-select-w .wait-select-years { width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; } .wrapper .top-filters .filter-w .filter-grp .filter-row .wait-select-w .wait-select-years .item { width: 25%; text-align: center; font-size: 12px; font-weight: 500; padding: 15px 0; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; cursor: pointer; transition: color 0.4s; } .wrapper .top-filters .filter-w .filter-grp .filter-row .wait-select-w .wait-select-years .item:hover, .wrapper .top-filters .filter-w .filter-grp .filter-row .wait-select-w .wait-select-years .item.active { color: #b81c22; } .wrapper .top-filters .filter-w .filter-grp .filter-row .wait-select-w .wait-select-dists { width: 100%; } .wrapper .top-filters .filter-w .filter-grp .filter-row .wait-select-w .wait-select-dists .item { width: 100%; padding: 15px 0; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; font-size: 12px; position: relative; transition: color 0.4s; cursor: pointer; } .wrapper .top-filters .filter-w .filter-grp .filter-row .wait-select-w .wait-select-dists .item .ar { position: absolute; right: 0; bottom: 20px; width: 6px; transition: all 0.4s; opacity: 0; } .wrapper .top-filters .filter-w .filter-grp .filter-row .wait-select-w .wait-select-dists .item:hover, .wrapper .top-filters .filter-w .filter-grp .filter-row .wait-select-w .wait-select-dists .item.active { color: #b81c22; } .wrapper .top-filters .filter-w .filter-grp .filter-row .wait-select-w .wait-select-dists .item:hover .ar, .wrapper .top-filters .filter-w .filter-grp .filter-row .wait-select-w .wait-select-dists .item.active .ar { opacity: 1; } .wrapper .prj-detail-w { width: 100%; } .wrapper .prj-detail-w .prj-cover { width: 100%; height: 800px; position: relative; } .wrapper .prj-detail-w .prj-cover .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.25); padding: 35px 40px; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; color: #fff; } .wrapper .prj-detail-w .prj-cover .info .tt-en { font-size: 60px; line-height: 1; margin-bottom: 20px; text-transform: uppercase; } .wrapper .prj-detail-w .prj-cover .info .tt-zh { font-size: 35px; } .wrapper .prj-detail-w .prj-cover .info .tt-news { font-size: 50px; line-height: 60px; } .wrapper .prj-detail-w .prj-cover .info .s-info { display: flex; justify-content: flex-start; align-items: center; font-size: 14px; margin-top: 26px; } .wrapper .prj-detail-w .prj-cover .info .s-info span { margin-right: 20px; } .wrapper .prj-detail-w .prj-cover .info .breadcrumb { position: absolute; right: 35px; bottom: 40px; display: flex; justify-content: flex-end; align-items: center; color: #fff; font-size: 14px; } .wrapper .prj-detail-w .prj-cover .info .breadcrumb a { color: #fff; margin: 0 6px; } .wrapper .prj-detail-w .prj-info-w { padding: 35px 40px; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; display: flex; justify-content: space-between; align-items: flex-end; } .wrapper .prj-detail-w .prj-info-w .prj-info { display: flex; justify-content: flex-start; align-items: flex-start; } .wrapper .prj-detail-w .prj-info-w .prj-info .col { margin-right: 60px; } .wrapper .prj-detail-w .prj-info-w .prj-info .col .col-w { display: flex; justify-content: flex-start; align-items: center; font-size: 14px; line-height: 1; margin-bottom: 8px; } .wrapper .prj-detail-w .prj-info-w .prj-info .col .col-w .kk { font-weight: 500; width: 70px; } .wrapper .prj-detail-w .prj-info-w .prj-info .col .col-w:last-child { margin-bottom: 0; } .wrapper .prj-detail-w .prj-info-w .prj-navs { display: flex; justify-content: flex-end; align-items: center; } .wrapper .prj-detail-w .prj-info-w .prj-navs .nav { display: flex; justify-content: flex-start; align-items: center; font-size: 12px; line-height: 1; margin-left: 50px; cursor: pointer; transition: color 0.2s; } .wrapper .prj-detail-w .prj-info-w .prj-navs .nav .ico-w { width: 15px; height: 15px; margin-right: 5px; } .wrapper .prj-detail-w .prj-info-w .prj-navs .nav .ico-w img { zoom: 0.5; -ms-zoom: 0.5; -webkit-zoom: 0.5; -moz-transform: scale(0.5, 0.5); -moz-transform-origin: center center; filter: grayscale(5); transition: all 0.2s; } .wrapper .prj-detail-w .prj-info-w .prj-navs .nav:hover { color: #b81c22; font-weight: 500; } .wrapper .prj-detail-w .prj-info-w .prj-navs .nav:hover .ico-w img { filter: grayscale(0); } .wrapper .prj-detail-w .content-w { width: 100%; padding: 80px 40px; } .wrapper .prj-detail-w .content-w .content { max-width: 1440px; width: 100%; left: 0; right: 0; margin: 0 auto; font-size: 18px; line-height: 30px; } .wrapper .prj-detail-w .content-w .content p { width: 100%; font-size: 18px; line-height: 30px; margin-bottom: 32px; color: #333; } .wrapper .prj-detail-w .content-w .content p img { width: 100%; } .wrapper .prj-detail-w .content-w .content h1, .wrapper .prj-detail-w .content-w .content h2, .wrapper .prj-detail-w .content-w .content h3, .wrapper .prj-detail-w .content-w .content h4, .wrapper .prj-detail-w .content-w .content h5, .wrapper .prj-detail-w .content-w .content h6 { color: #333; margin-bottom: 32px; } .wrapper .prj-detail-w .content-w .content h5 { font-size: 18px !important; line-height: 30px; } .wrapper .prj-detail-w .content-w .content h5 > * { font-size: 18px !important; } .wrapper .prj-detail-w .content-w .news-navs { max-width: 1440px; width: 100%; left: 0; right: 0; margin: 60px auto 0; display: flex; justify-content: space-between; align-items: center; } .wrapper .prj-detail-w .content-w .news-navs .btn-nav { display: flex; align-items: center; font-size: 14px; } .wrapper .prj-detail-w .content-w .news-navs .btn-nav .ar { width: 8px; } .wrapper .prj-detail-w .content-w .news-navs .btn-nav .ar.reverse { transform: rotate(180deg); } .wrapper .prj-detail-w .content-w .news-navs .btn-nav.nav-prev { justify-content: flex-start; } .wrapper .prj-detail-w .content-w .news-navs .btn-nav.nav-prev .ar { margin-right: 8px; } .wrapper .prj-detail-w .content-w .news-navs .btn-nav.nav-next { justify-content: flex-end; } .wrapper .prj-detail-w .content-w .news-navs .btn-nav.nav-next .ar { margin-left: 8px; } .wrapper .prj-detail-w .content-w .news-navs .btn-more { display: inline-block; padding: 4px 24px; font-size: 12px; border-bottom: 1px #b81c22 solid; cursor: pointer; color: #b81c22; } .wrapper .prj-detail-w .recommend-prjs-w { width: 100%; } .wrapper .prj-detail-w .recommend-prjs-w .btt { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 40px 40px; border-top: 1px rgba(0, 0, 0, 0.1) solid; } .wrapper .prj-detail-w .recommend-prjs-w .btt .tt { font-size: 27px; font-weight: 500; } .wrapper .prj-detail-w .recommend-prjs-w .btt .btn-nav { display: flex; justify-content: flex-end; align-items: center; font-size: 14px; } .wrapper .prj-detail-w .recommend-prjs-w .btt .btn-nav img { height: 10px; margin-left: 10px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list { width: 100%; display: flex; justify-content: flex-start; align-content: flex-start; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item { position: relative; width: calc((100% - 20px) / 3); height: 0; padding-top: 20%; margin-right: 10px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 100%); color: #fff; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; padding: 0 36px 40px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item .info .tt-en { font-size: 23px; line-height: 1; font-weight: 500; text-transform: uppercase; margin-bottom: 16px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item .info .tt-zh { font-size: 18px; margin-bottom: 14px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item .info .tt-news { width: 100%; font-size: 21px; line-height: 1; font-weight: 500; text-overflow: ellipsis; overflow-x: hidden; padding-right: 40px; white-space: nowrap; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item .info .s-info { display: flex; justify-content: flex-start; align-items: center; font-size: 14px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item .info .s-info span { margin-right: 18px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item .info .ar { height: 9px; position: absolute; right: 40px; bottom: 40px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item:nth-child(3n) { margin-right: 0; } .wrapper .gallery-w { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 99; background-color: #c6c6c6; display: none; } .wrapper .gallery-w .prj-info { position: absolute; left: 40px; top: 30px; color: #fff; z-index: 2; } .wrapper .gallery-w .prj-info .tt-zh { font-size: 14px; margin-bottom: 0; } .wrapper .gallery-w .prj-info .s-info { display: flex; justify-content: flex-start; align-items: center; font-size: 14px; } .wrapper .gallery-w .prj-info .s-info span { margin-right: 18px; } .wrapper .gallery-w .btn-close-slides { width: 40px; height: 40px; position: absolute; right: 27px; top: 24px; display: flex; justify-content: center; align-items: center; cursor: pointer; z-index: 12; } .wrapper .gallery-w .btn-close-slides img { width: 14px; } .wrapper .gallery-w .main-slides { width: 100%; height: 100%; position: relative; } .wrapper .gallery-w .main-slides .swiper-slide { height: 100%; width: 100%; display: flex; justify-content: center; align-items: center; } .wrapper .gallery-w .main-slides .swiper-slide img { max-height: 100%; max-width: 100%; } .wrapper .gallery-w .main-slides .swiper-pagination-custom { padding-left: 40px; bottom: 40px; font-size: 12px; text-align: left; color: #fff; z-index: 5; transition: bottom 0.4s; } .wrapper .gallery-w .main-slides .swiper-pagination-custom .swiper-pagination-current { color: #fff; } .wrapper .gallery-w .main-slides .btn-expand-collapse { position: absolute; right: 40px; bottom: 40px; width: 33px; cursor: pointer; z-index: 8; transition: bottom 0.4s; } .wrapper .gallery-w .main-slides .btn-expand-collapse img { width: 100%; } .wrapper .gallery-w .main-slides .btn-expand-collapse .collapse { display: none; } .wrapper .gallery-w .main-slides .btn-expand-collapse.open .collapse { display: inline; } .wrapper .gallery-w .main-slides .btn-expand-collapse.open .expand { display: none; } .wrapper .gallery-w .main-slides.open .swiper-pagination-custom { bottom: 150px; } .wrapper .gallery-w .main-slides.open .btn-expand-collapse { bottom: 150px; } .wrapper .gallery-w .sub-slides-w { width: 100%; height: 150px; padding: 30px 40px; display: flex; justify-content: center; position: absolute; left: 0; bottom: -150px; z-index: 2; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%); transition: bottom 0.4s; } .wrapper .gallery-w .sub-slides-w.open { bottom: 0; } .wrapper .gallery-w .sub-slides-w .sub-slides { max-width: 100%; height: 100%; } .wrapper .gallery-w .sub-slides-w .sub-slides .swiper-slide { height: 100%; width: auto; cursor: pointer; opacity: 1; } .wrapper .gallery-w .sub-slides-w .sub-slides .swiper-slide img { height: 100%; } .wrapper .videos-w { position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 99; background-color: #c6c6c6; display: none; } .wrapper .videos-w .prj-info { position: absolute; left: 40px; top: 30px; color: #fff; z-index: 2; } .wrapper .videos-w .prj-info .tt-zh { font-size: 14px; margin-bottom: 0; } .wrapper .videos-w .prj-info .s-info { display: flex; justify-content: flex-start; align-items: center; font-size: 14px; } .wrapper .videos-w .prj-info .s-info span { margin-right: 18px; } .wrapper .videos-w .btn-close-slides { width: 40px; height: 40px; position: absolute; right: 27px; top: 24px; display: flex; justify-content: center; align-items: center; cursor: pointer; z-index: 12; } .wrapper .videos-w .btn-close-slides img { width: 14px; } .wrapper .videos-w .main-slides { width: 100%; height: 100%; position: relative; } .wrapper .videos-w .main-slides .swiper-slide { height: 100%; width: 100%; position: relative; display: flex; justify-content: center; align-items: center; } .wrapper .videos-w .main-slides .swiper-slide video { height: 100%; width: 100%; object-fit: cover; } .wrapper .videos-w .main-slides .swiper-slide .btn-play { position: absolute; width: 100%; height: 100%; left: 0; top: 0; display: flex; justify-content: center; align-items: center; cursor: pointer; z-index: 2; background-color: rgba(0, 0, 0, 0.25); } .wrapper .videos-w .main-slides .swiper-slide .btn-play img { width: 32px; } .wrapper .videos-w .main-slides .swiper-pagination-custom { padding-left: 40px; bottom: 40px; font-size: 12px; text-align: left; color: #fff; z-index: 5; transition: bottom 0.4s; } .wrapper .videos-w .main-slides .swiper-pagination-custom .swiper-pagination-current { color: #fff; } .wrapper .videos-w .main-slides .btn-expand-collapse { position: absolute; right: 40px; bottom: 40px; width: 33px; cursor: pointer; z-index: 8; transition: bottom 0.4s; } .wrapper .videos-w .main-slides .btn-expand-collapse img { width: 100%; } .wrapper .videos-w .main-slides .btn-expand-collapse .collapse { display: none; } .wrapper .videos-w .main-slides .btn-expand-collapse.open .collapse { display: inline; } .wrapper .videos-w .main-slides .btn-expand-collapse.open .expand { display: none; } .wrapper .videos-w .main-slides.open .swiper-pagination-custom { bottom: 260px; } .wrapper .videos-w .main-slides.open .btn-expand-collapse { bottom: 260px; } .wrapper .videos-w .sub-slides-w { width: 100%; height: 260px; padding: 30px 40px; display: flex; justify-content: center; position: absolute; left: 0; bottom: -260px; z-index: 2; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 100%); transition: bottom 0.4s; } .wrapper .videos-w .sub-slides-w.open { bottom: 0; } .wrapper .videos-w .sub-slides-w .sub-slides { max-width: 100%; height: 100%; } .wrapper .videos-w .sub-slides-w .sub-slides .swiper-slide { height: 100%; width: auto; cursor: pointer; opacity: 1; } .wrapper .videos-w .sub-slides-w .sub-slides .swiper-slide video { height: 100%; } .wrapper .news-list-w { width: 100%; } .wrapper .news-list-w .news-list--w { width: 100%; padding: 0 40px 80px; } .wrapper .news-list-w .news-list--w .btt { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 40px 0; } .wrapper .news-list-w .news-list--w .btt .tt { font-size: 27px; font-weight: 500; } .wrapper .news-list-w .news-list--w .btt .filters { display: flex; justify-content: flex-end; align-items: center; font-size: 14px; font-weight: 500; } .wrapper .news-list-w .news-list--w .btt .filters .item { padding: 5px 8px; cursor: pointer; border-bottom: 1px transparent solid; transition: all 0.4s; } .wrapper .news-list-w .news-list--w .btt .filters .item.active, .wrapper .news-list-w .news-list--w .btt .filters .item:hover { color: #b81c22; border-bottom: 1px #b81c22 solid; } .wrapper .news-list-w .news-list--w .btt .selector-w { display: none; } .wrapper .news-list-w .news-list--w .news-list { width: 100%; position: relative; } .wrapper .news-list-w .news-list--w .news-list .grid-sizer { width: 25%; margin-bottom: 0 !important; } .wrapper .news-list-w .news-list--w .news-list .news { width: 25%; padding: 0 5px; margin-bottom: 10px; float: left; } .wrapper .news-list-w .news-list--w .news-list .news .news-w { width: 100%; } .wrapper .news-list-w .news-list--w .news-list .news .news-w img { width: 100%; } .wrapper .news-list-w .news-list--w .news-list .news .news-w .cover-w { width: 100%; padding-top: 68.75%; height: 0; position: relative; } .wrapper .news-list-w .news-list--w .news-list .news .news-w .info { width: 100%; background-color: #c6c6c6; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; padding: 30px; height: 283px; position: relative; } .wrapper .news-list-w .news-list--w .news-list .news .news-w .info .ar { position: absolute; right: 30px; top: 30px; height: 18px; width: auto; transform: rotate(180deg); } .wrapper .news-list-w .news-list--w .news-list .news .news-w .info .tt { font-size: 21px; line-height: 30px; font-weight: 500; padding-right: 15%; } .wrapper .news-list-w .news-list--w .news-list .news .news-w .info .info-w .desc { font-size: 14px; line-height: 21px; height: 63px; overflow-y: hidden; } .wrapper .news-list-w .news-list--w .news-list .news .news-w .info .info-w .dt { margin-top: 12px; font-size: 12px; line-height: 1; } .wrapper .news-list-w .news-list--w .news-list .news .news-w.reverse { display: flex; flex-direction: column-reverse; } .wrapper .news-list-w .news-list--w .news-list .news .news-w.reverse .info .ar { transform: rotate(0); } .wrapper .main-cover { width: 100%; position: relative; } .wrapper .main-cover .cover { width: 100%; } .wrapper .main-cover .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 0 158px; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; color: #fff; } .wrapper .main-cover .info .tt { font-size: 80px; line-height: 75px; text-transform: uppercase; font-weight: 500; margin-bottom: 20px; } .wrapper .main-cover .info .stt { font-size: 30px; line-height: 1; } .wrapper .main-cover .info.align-r { align-items: flex-end; } .wrapper .main-cover .info.align-r .tt { text-align: right; } .wrapper .about-w { width: 100%; overflow: hidden; } .wrapper .about-w.with-pt { padding-top: 40px; } .wrapper .about-w .about-navs { width: 100%; padding: 40px 40px; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; } .wrapper .about-w .about-navs .btt { width: 100%; display: flex; justify-content: space-between; align-items: center; } .wrapper .about-w .about-navs .btt .tt { font-size: 27px; font-weight: 500; } .wrapper .about-w .about-navs .btt .filters { display: flex; justify-content: flex-end; align-items: center; font-size: 14px; font-weight: 500; } .wrapper .about-w .about-navs .btt .filters .item { padding: 5px 8px; cursor: pointer; border-bottom: 1px transparent solid; transition: all 0.4s; } .wrapper .about-w .about-navs .btt .filters .item.active, .wrapper .about-w .about-navs .btt .filters .item:hover { color: #b81c22; border-bottom: 1px #b81c22 solid; } .wrapper .about-w .about--w { width: 100%; padding: 80px 40px; } .wrapper .about-w .about--w .about-iw { max-width: 1600px; width: 100%; left: 0; right: 0; margin: 0 auto; } .wrapper .about-w .about--w .about-iw.full { max-width: none; } .wrapper .about-w .about--w .about-us { width: 100%; display: flex; justify-content: space-between; align-items: flex-start; position: relative; } .wrapper .about-w .about--w .about-us .tt { width: 33.33%; font-size: 40px; line-height: 1; font-weight: 800; } .wrapper .about-w .about--w .about-us .desc { width: 66.66%; font-size: 16px; line-height: 27px; } .wrapper .about-w .about--w .about-us .next-nav { position: absolute; left: 0; bottom: 0; display: flex; justify-content: flex-start; align-items: center; cursor: pointer; } .wrapper .about-w .about--w .about-us .next-nav .ico { height: 29px; margin-right: 10px; } .wrapper .about-w .about--w .about-us .next-nav a { font-size: 12px; line-height: 16px; } .wrapper .about-w .about--w .about-concept { width: 100%; display: flex; justify-content: space-between; align-items: flex-start; position: relative; } .wrapper .about-w .about--w .about-concept .tt-w { width: 50%; } .wrapper .about-w .about--w .about-concept .tt-w .tt { font-size: 40px; line-height: 1; font-weight: 800; text-transform: uppercase; margin-bottom: 70px; } .wrapper .about-w .about--w .about-concept .tt-w .tt-q { font-size: 35px; font-weight: 500; margin-bottom: 32px; } .wrapper .about-w .about--w .about-concept .tt-w .tt-v { font-size: 16px; line-height: 27px; } .wrapper .about-w .about--w .about-concept .concept-cover { width: 50%; height: 450px; padding-left: 100px; } .wrapper .about-w .about--w .about-concept .concept-cover .cover-w { width: 100%; height: 100%; position: relative; } .wrapper .about-w .about--w .about-concept .next-nav { position: absolute; left: 0; bottom: 0; display: flex; justify-content: flex-start; align-items: center; cursor: pointer; } .wrapper .about-w .about--w .about-concept .next-nav .ico { height: 29px; margin-right: 10px; } .wrapper .about-w .about--w .about-concept .next-nav p { font-size: 12px; line-height: 16px; } .wrapper .about-w .about--w .about-us-cases { margin-top: 60px; width: 100%; display: flex; justify-content: space-between; align-items: flex-start; } .wrapper .about-w .about--w .about-us-cases .col { width: calc((100% - 20px) / 3); cursor: pointer; position: relative; } .wrapper .about-w .about--w .about-us-cases .col .cover { width: 100%; } .wrapper .about-w .about--w .about-us-cases .col .info { width: 100%; height: 100%; position: absolute; left: 0; top: 0; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; padding: 30px 26px; color: #fff; } .wrapper .about-w .about--w .about-us-cases .col .info .tt { font-size: 21px; line-height: 1; font-weight: 500; margin-bottom: 16px; } .wrapper .about-w .about--w .about-us-cases .col .info .stt { font-size: 14px; line-height: 21px; padding-right: 60px; } .wrapper .about-w .about--w .about-us-cases .col .info .ar { height: 9px; position: absolute; right: 26px; bottom: 30px; } .wrapper .about-w .about--w .teams-w { width: 100%; } .wrapper .about-w .about--w .teams-w .team-btt { width: 100%; display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 80px; } .wrapper .about-w .about--w .teams-w .team-btt .tt { font-size: 40px; line-height: 1; font-weight: 800; text-transform: uppercase; } .wrapper .about-w .about--w .teams-w .team-btt .filters { display: flex; justify-content: flex-end; align-items: center; font-size: 14px; font-weight: 500; } .wrapper .about-w .about--w .teams-w .team-btt .filters .item { padding: 5px 8px; cursor: pointer; border-bottom: 1px transparent solid; transition: all 0.4s; } .wrapper .about-w .about--w .teams-w .team-btt .filters .item.active, .wrapper .about-w .about--w .teams-w .team-btt .filters .item:hover { color: #b81c22; border-bottom: 1px #b81c22 solid; } .wrapper .about-w .about--w .teams-w .team-members { width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; } .wrapper .about-w .about--w .teams-w .team-members .member { width: calc((100% - 40px) / 5); height: 0; padding-top: 29.2%; position: relative; margin-right: 10px; margin-bottom: 10px; cursor: pointer; } .wrapper .about-w .about--w .teams-w .team-members .member.hide { display: none; } .wrapper .about-w .about--w .teams-w .team-members .member:nth-child(5n) { margin-right: 0; } .wrapper .about-w .about--w .teams-w .team-members .member .info { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, transparent 30%, transparent 100%); color: #fff; padding: 30px; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; } .wrapper .about-w .about--w .teams-w .team-members .member .info .name { font-size: 21px; font-weight: 500; margin-bottom: 10px; } .wrapper .about-w .about--w .teams-w .team-members .member .info .title { font-size: 14px; line-height: 1; } .wrapper .about-w .about--w .teams-w .team-members .member-more { width: calc((100% - 40px) / 5); height: 0; padding-top: 29.2%; cursor: pointer; position: relative; background-color: #c6c6c6; } .wrapper .about-w .about--w .teams-w .team-members .member-more .info { width: 100%; height: 100%; position: absolute; left: 0; top: 0; padding: 30px; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; } .wrapper .about-w .about--w .teams-w .team-members .member-more .info .name { font-size: 21px; font-weight: 500; margin-bottom: 10px; } .wrapper .about-w .about--w .teams-w .team-members .member-more .info .title { font-size: 14px; line-height: 1; } .wrapper .about-w .about--w .tt-desc-w { width: 100%; display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 80px; } .wrapper .about-w .about--w .tt-desc-w .tt { font-size: 40px; line-height: 1; font-weight: 800; text-transform: uppercase; width: 33.33%; } .wrapper .about-w .about--w .tt-desc-w .desc { width: 66.66%; font-size: 16px; line-height: 27px; } .wrapper .about-w .about--w .brand-w { width: 100%; } .wrapper .about-w .about--w .brand-w .awards-w { width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; } .wrapper .about-w .about--w .brand-w .awards-w img { width: calc((100% - 50px) / 6); margin-right: 10px; margin-bottom: 10px; } .wrapper .about-w .about--w .brand-w .awards-w img:nth-child(6n) { margin-right: 0; } .wrapper .about-w .about--w .fields-w { width: 100%; margin-bottom: 40px; position: relative; } .wrapper .about-w .about--w .fields-w .fields-list { width: 100%; margin-top: 20px; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper { width: 100%; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide { width: 400px; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .col { width: 100%; height: 0; padding-top: 183%; position: relative; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .col .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 30px; color: #fff; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .col .info .field-tt { font-size: 18px; font-weight: 500; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .col .info .ar { position: absolute; right: 30px; bottom: 30px; height: 10px; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .more-w { width: 100%; height: 0; padding-top: 183%; position: relative; top: auto; left: auto; background-color: #c6c6c6; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .more-w .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 30px; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .more-w .info .field-tt { font-size: 18px; font-weight: 500; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .more-w .info .ar { position: absolute; right: 30px; bottom: 30px; height: 10px; filter: invert(1); } .wrapper .about-w .about--w .fields-w .fields-list .nav { position: absolute; left: -12px; bottom: -60px; width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; opacity: 0.5; transition: opacity 0.4s; cursor: pointer; } .wrapper .about-w .about--w .fields-w .fields-list .nav img { height: 12px; } .wrapper .about-w .about--w .fields-w .fields-list .nav.nav-prev img { transform: rotate(180deg); } .wrapper .about-w .about--w .fields-w .fields-list .nav.nav-next { left: 28px; } .wrapper .about-w .about--w .fields-w .fields-list .nav:hover { opacity: 1; } .wrapper .member-f-w { position: fixed; width: 100%; height: 100%; left: 0; top: 0; z-index: 8; background-color: #fff; display: none; } .wrapper .member-f-w .btn-close-member { width: 40px; height: 40px; position: absolute; right: 24px; top: 18px; display: flex; justify-content: center; align-items: center; cursor: pointer; z-index: 12; } .wrapper .member-f-w .btn-close-member img { width: 14px; filter: invert(1); } .wrapper .member-f-w .member-f--w { width: 100%; height: 100%; display: flex; justify-content: flex-start; align-items: flex-start; } .wrapper .member-f-w .cover-w { width: 34%; height: 100%; position: relative; } .wrapper .member-f-w .cover-w .info { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, transparent 30%, transparent 100%); color: #fff; padding: 38px; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; } .wrapper .member-f-w .cover-w .info .name { font-size: 40px; font-weight: 500; margin-bottom: 10px; } .wrapper .member-f-w .cover-w .info .title { font-size: 16px; line-height: 27px; } .wrapper .member-f-w .intro-w { width: 66%; height: 100%; overflow-y: scroll; padding: 90px 40px; } .wrapper .member-f-w .intro-w .intro--w { width: 100%; } .wrapper .member-f-w .intro-w .intro--w .row { display: flex; justify-content: flex-start; align-items: flex-start; font-size: 16px; line-height: 27px; padding-bottom: 40px; margin-bottom: 40px; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; } .wrapper .member-f-w .intro-w .intro--w .row:last-child { padding-bottom: 0; margin-bottom: 0; border-bottom: none; } .wrapper .member-f-w .intro-w .intro--w .row .stt { width: 100px; font-weight: 500; } .wrapper .member-f-w .intro-w .intro--w .row .svv { width: calc(100% - 100px); } .wrapper .member-f-w .intro-w .intro--w .row .svv.works .workname { font-weight: 500; margin-bottom: 15px; } .wrapper .member-f-w .intro-w .intro--w .row .svv.works .prizes { color: rgba(0, 0, 0, 0.6); margin-bottom: 30px; } .wrapper .member-f-w .close-bar { position: fixed; right: 0; top: 0; height: 72px; width: 66%; background-color: #fff; z-index: 2; } .wrapper .contact-w { width: 100%; overflow: hidden; } .wrapper .contact-w .about-navs { width: 100%; padding: 40px 40px; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; } .wrapper .contact-w .about-navs .btt { width: 100%; display: flex; justify-content: space-between; align-items: center; } .wrapper .contact-w .about-navs .btt .tt { font-size: 27px; font-weight: 500; } .wrapper .contact-w .about-navs .btt .filters { display: flex; justify-content: flex-end; align-items: center; font-size: 14px; font-weight: 500; } .wrapper .contact-w .about-navs .btt .filters .item { padding: 5px 8px; cursor: pointer; border-bottom: 1px transparent solid; transition: all 0.4s; } .wrapper .contact-w .about-navs .btt .filters .item.active, .wrapper .contact-w .about-navs .btt .filters .item:hover { color: #b81c22; border-bottom: 1px #b81c22 solid; } .wrapper .contact-w .about--w { width: 100%; padding: 80px 40px; } .wrapper .contact-w .about--w .about-iw { max-width: 1600px; width: 100%; left: 0; right: 0; margin: 0 auto; } .wrapper .contact-w .about--w .tt-nav-w { width: 100%; display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 80px; position: relative; } .wrapper .contact-w .about--w .tt-nav-w .tt { font-size: 40px; line-height: 1; font-weight: 800; text-transform: uppercase; } .wrapper .contact-w .about--w .tt-nav-w .desc { font-size: 16px; line-height: 27px; position: absolute; left: 33.33%; top: 0; } .wrapper .contact-w .about--w .tt-nav-w .desc .btn-nav { display: none; } .wrapper .contact-w .about--w .tt-nav-w .btn-nav { display: flex; justify-content: flex-start; align-items: center; font-size: 14px; } .wrapper .contact-w .about--w .tt-nav-w .btn-nav img { height: 9px; margin-left: 10px; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps { display: flex; justify-content: flex-end; align-items: flex-start; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row { width: 196px; padding: 0 20px; position: relative; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row.open { background-color: #fff; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row.open .wait-select-w { background-color: #fff; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row.open .filter-crt { border-bottom-color: #000; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row.open .filter-crt .ar { transform: rotate(-90deg); } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .filter-crt { padding: 30px 0 20px; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; position: relative; font-size: 12px; cursor: pointer; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .filter-crt .ar { position: absolute; right: 0; top: 35px; transform: rotate(90deg); height: 10px; transition: all 0.4s; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .wait-select-w { position: absolute; top: 69px; left: 0; width: 100%; padding: 0 20px; display: none; z-index: 6; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .wait-select-w .item { width: 100%; padding: 20px 0; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; display: flex; justify-content: space-between; align-items: center; font-size: 12px; transition: all 0.4s; cursor: pointer; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .wait-select-w .item .ar { height: 10px; opacity: 0; transition: all 0.4s; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .wait-select-w .item:hover, .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .wait-select-w .item.active { color: #b81c22; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .wait-select-w .item:hover .ar, .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .wait-select-w .item.active .ar { opacity: 1; } .wrapper .contact-w .about--w .contact-ways-w { width: 100%; } .wrapper .contact-w .about--w .contact-ways-w .map-w { display: flex; justify-content: space-between; align-items: flex-start; padding-bottom: 60px; margin-bottom: 60px; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; } .wrapper .contact-w .about--w .contact-ways-w .map-w .map--w { width: calc(100% - 500px); } .wrapper .contact-w .about--w .contact-ways-w .map-w .map--w img { width: 100%; } .wrapper .contact-w .about--w .contact-ways-w .map-w .company-locations { display: flex; justify-content: flex-end; align-items: flex-start; } .wrapper .contact-w .about--w .contact-ways-w .map-w .company-locations .col-2 { display: flex; flex-direction: column; margin-right: 60px; } .wrapper .contact-w .about--w .contact-ways-w .map-w .company-locations .col-2:last-child { margin-right: 0; } .wrapper .contact-w .about--w .contact-ways-w .map-w .company-locations .col-2 .way-w { display: flex; justify-content: flex-start; align-items: center; } .wrapper .contact-w .about--w .contact-ways-w .map-w .company-locations .col-2 .way-w .tag { width: 30px; font-size: 14px; line-height: 24px; font-weight: 500; } .wrapper .contact-w .about--w .contact-ways-w .map-w .company-locations .col-2 .way-w .way { font-size: 14px; line-height: 24px; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples { width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples .col { width: 25%; display: flex; justify-content: flex-start; align-items: flex-start; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples .col .ctt { font-size: 14px; line-height: 24px; font-weight: 500; margin-right: 20px; text-align: right; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples .col .cvv { display: flex; flex-direction: column; margin-right: 60px; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples .col .cvv:last-child { margin-right: 0; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples .col .cvv .way-w { display: flex; justify-content: flex-start; align-items: center; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples .col .cvv .way-w .tag { width: 30px; font-size: 14px; line-height: 24px; font-weight: 500; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples .col .cvv .way-w .way { font-size: 14px; line-height: 24px; } .wrapper .contact-w .about--w .viewpoints-w { width: 100%; } .wrapper .contact-w .about--w .viewpoints-w .stories-w { width: 100%; } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w { width: 100%; display: flex; justify-content: space-between; align-items: flex-start; } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w .item { display: block; width: calc((100% - 30px) / 4); height: 0; padding-top: 38%; position: relative; cursor: pointer; } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w .item .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 30px; color: #fff; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, transparent 30%, transparent 100%); } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w .item .info .tt { font-size: 21px; line-height: 30px; font-weight: 500; margin-bottom: 20px; } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w .item .info .stt { font-size: 14px; line-height: 21px; margin-bottom: 25px; } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w .item .info .dt { font-size: 12px; line-height: 1; } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w .item.col-3 { width: calc((100% - 20px) / 3); } .wrapper .contact-w .about--w .viewpoints-w .prj-type-switcher { width: 100%; margin-top: 20px; display: flex; justify-content: space-between; align-items: center; } .wrapper .contact-w .about--w .viewpoints-w .prj-type-switcher .item { width: calc((100% - 10px) / 3); padding: 20px 0; text-align: center; border-bottom: 1px black solid; font-size: 14px; transition: color 0.4s; cursor: pointer; } .wrapper .contact-w .about--w .viewpoints-w .prj-type-switcher .item.active, .wrapper .contact-w .about--w .viewpoints-w .prj-type-switcher .item:hover { padding-bottom: 19px; font-weight: 500; color: #b81c22; border-bottom: 2px #b81c22 solid; } .wrapper .contact-w .about--w .talking-w { width: 100%; } .wrapper .contact-w .about--w .talking-w .talkings-w { width: 100%; } .wrapper .contact-w .about--w .talking-w .talkings-w .talkings--w { width: 100%; display: flex; justify-content: space-between; align-items: flex-start; } .wrapper .contact-w .about--w .talking-w .talkings-w .talkings--w .item { display: block; width: calc((100% - 20px) / 3); height: 0; padding-top: 25%; position: relative; } .wrapper .contact-w .about--w .talking-w .talkings-w .talkings--w .item .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 30px; color: #fff; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, transparent 30%, transparent 100%); } .wrapper .contact-w .about--w .talking-w .talkings-w .talkings--w .item .info .tt { font-size: 21px; line-height: 30px; font-weight: 500; margin-bottom: 12px; } .wrapper .contact-w .about--w .talking-w .talkings-w .talkings--w .item .info .stt { font-size: 14px; line-height: 21px; } .wrapper .contact-w .about--w .talking-w .talkings-w .talkings--w .item .info .dt { font-size: 12px; line-height: 1; } .wrapper .contact-w .about--w .jobs-w { width: 100%; } .wrapper .contact-w .about--w .jobs-w .jobs-slides { width: 100%; margin-bottom: 40px; position: relative; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper { width: 100%; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper .swiper-slide { width: 33.33%; height: 395px; position: relative; background-color: #c6c6c6; cursor: pointer; transition: background-color 0.4s; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper .swiper-slide.hide { display: none; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper .swiper-slide .item { width: 100%; height: 100%; padding: 30px; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; position: relative; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper .swiper-slide .item .ar { position: absolute; right: 30px; top: 30px; height: 10px; filter: invert(1); transition: all 0.4s; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper .swiper-slide .item .tp .location { font-size: 14px; line-height: 1; margin-bottom: 10px; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper .swiper-slide .item .tp .title { font-size: 21px; line-height: 25px; font-weight: 500; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper .swiper-slide .item .bp .stt { font-size: 16px; font-weight: 500; line-height: 27px; margin-bottom: 12px; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper .swiper-slide .item .bp .requirement { font-size: 16px; line-height: 27px; max-height: 162px; overflow-y: hidden; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper .swiper-slide .no-more { width: 100%; height: 100%; padding: 30px; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; position: relative; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper .swiper-slide .no-more .ar { position: absolute; right: 30px; top: 30px; height: 10px; filter: invert(1); transition: all 0.4s; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper .swiper-slide .no-more .tp .location { font-size: 14px; line-height: 1; margin-bottom: 10px; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper .swiper-slide .no-more .tp .title { font-size: 21px; line-height: 25px; font-weight: 500; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper .swiper-slide:hover { background-color: #b81c22; color: #fff; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper .swiper-slide:hover .item .ar { filter: invert(0); } .wrapper .contact-w .about--w .jobs-w .jobs-slides .swiper-wrapper .swiper-slide:hover .no-more .ar { filter: invert(0); } .wrapper .contact-w .about--w .jobs-w .jobs-slides .nav { position: absolute; left: -12px; bottom: -60px; width: 40px; height: 40px; display: flex; justify-content: center; align-items: center; opacity: 0.5; transition: opacity 0.4s; cursor: pointer; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .nav img { height: 12px; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .nav.nav-prev img { transform: rotate(180deg); } .wrapper .contact-w .about--w .jobs-w .jobs-slides .nav.nav-next { left: 28px; } .wrapper .contact-w .about--w .jobs-w .jobs-slides .nav:hover { opacity: 1; } .wrapper .job-detail-w { position: fixed; width: 100%; height: 100%; left: 0; top: 0; z-index: 8; background-color: #fff; display: none; } .wrapper .job-detail-w .btn-close-job { width: 40px; height: 40px; position: absolute; right: 24px; top: 24px; display: flex; justify-content: center; align-items: center; cursor: pointer; z-index: 12; } .wrapper .job-detail-w .btn-close-job img { width: 14px; filter: invert(1); } .wrapper .job-detail-w .detail--w { width: 100%; height: 100%; overflow-y: scroll; padding: 40px; } .wrapper .job-detail-w .detail--w .title-en { font-size: 40px; line-height: 1; font-weight: 800; text-transform: uppercase; margin-bottom: 5px; } .wrapper .job-detail-w .detail--w .title-zh { font-size: 27px; font-weight: 500; } .wrapper .job-detail-w .detail--w .row { margin-top: 40px; padding-top: 40px; width: 100%; border-top: 1px rgba(0, 0, 0, 0.1) solid; display: flex; justify-content: flex-start; align-items: flex-start; } .wrapper .job-detail-w .detail--w .row .col { width: 50%; padding-right: 40px; display: flex; justify-content: flex-start; align-items: flex-start; font-size: 16px; line-height: 27px; } .wrapper .job-detail-w .detail--w .row .col .ctt { width: 105px; font-weight: 500; } .wrapper .job-detail-w .detail--w .row .col .cvv { width: calc(100% - 105px); } .wrapper .job-detail-w .detail--w .row .col.col-f { width: 100%; padding-right: 0; } .wrapper .search-res-w { width: 100%; padding-top: 100px; } .wrapper .search-res-w .res-hint-bar { width: 100%; padding: 40px 40px 40px; display: flex; justify-content: space-between; align-items: center; } .wrapper .search-res-w .res-hint-bar .res-hint { font-size: 27px; font-weight: 500; } .wrapper .search-res-w .res-hint-bar .filters { display: flex; justify-content: flex-end; align-items: center; font-size: 14px; font-weight: 500; } .wrapper .search-res-w .res-hint-bar .filters .item { padding: 5px 8px; cursor: pointer; border-bottom: 1px transparent solid; transition: all 0.4s; } .wrapper .search-res-w .res-hint-bar .filters .item.active, .wrapper .search-res-w .res-hint-bar .filters .item:hover { color: #b81c22; border-bottom: 1px #b81c22 solid; } .wrapper .interview-w { width: 100%; } .wrapper .interview-w .interview-cover { width: 100%; position: relative; } .wrapper .interview-w .interview-cover .cover { width: 100%; } .wrapper .interview-w .interview-cover .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.25); padding: 35px 40px; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; color: #fff; } .wrapper .interview-w .interview-cover .info .tt-en { font-size: 60px; line-height: 1; margin-bottom: 20px; text-transform: uppercase; } .wrapper .interview-w .interview-cover .info .tt-zh { font-size: 35px; } .wrapper .interview-w .interview-cover .info .tt-news { font-size: 50px; line-height: 60px; } .wrapper .interview-w .interview-cover .info .s-info { display: flex; justify-content: flex-start; align-items: center; font-size: 14px; margin-top: 26px; } .wrapper .interview-w .interview-cover .info .s-info span { margin-right: 20px; } .wrapper .interview-w .interview-cover .info .breadcrumb { position: absolute; right: 35px; bottom: 40px; display: flex; justify-content: flex-end; align-items: center; color: #fff; font-size: 14px; } .wrapper .interview-w .interview-cover .info .breadcrumb a { color: #fff; margin: 0 6px; } .wrapper .interview-w .content-w { width: 100%; padding: 80px 40px; } .wrapper .interview-w .content-w .content { max-width: 1440px; width: 100%; left: 0; right: 0; margin: 0 auto; } .wrapper .interview-w .content-w .content .topic { width: 100%; padding-bottom: 60px; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; margin-bottom: 60px; font-weight: 500; color: #333; } .wrapper .interview-w .content-w .content .row { width: 100%; margin-bottom: 60px; display: flex; justify-content: space-between; align-items: flex-start; color: #333; font-size: 18px; line-height: 30px; } .wrapper .interview-w .content-w .content .row .col.col-l { width: 31.5%; } .wrapper .interview-w .content-w .content .row .col.col-l .rstt { font-size: 16px; line-height: 27px; } .wrapper .interview-w .content-w .content .row .col.col-r { width: 65.7%; } .wrapper .interview-w .content-w .content .row .col .rtt { font-weight: 500; margin-bottom: 10px; } .wrapper .interview-w .content-w .content .row .col .r-cover-w { width: 100%; margin-top: 40px; } .wrapper .interview-w .content-w .content .row .col .r-cover-w.no-mgt { margin-top: 0; } .wrapper .interview-w .content-w .content .row .col .r-cover-w img { width: 100%; } .wrapper .interview-w .content-w .content .row .col .r-cover-2-w { width: 100%; margin-top: 40px; display: flex; justify-content: space-between; align-items: flex-start; } .wrapper .interview-w .content-w .content .row .col .r-cover-2-w.no-mgt { margin-top: 0; } .wrapper .interview-w .content-w .content .row .col .r-cover-2-w img { width: 48%; } .wrapper .interview-w .content-w .news-navs { max-width: 1440px; width: 100%; left: 0; right: 0; margin: 60px auto 0; display: flex; justify-content: space-between; align-items: center; } .wrapper .interview-w .content-w .news-navs .btn-nav { display: flex; align-items: center; font-size: 14px; } .wrapper .interview-w .content-w .news-navs .btn-nav .ar { width: 8px; } .wrapper .interview-w .content-w .news-navs .btn-nav .ar.reverse { transform: rotate(180deg); } .wrapper .interview-w .content-w .news-navs .btn-nav.nav-prev { justify-content: flex-start; } .wrapper .interview-w .content-w .news-navs .btn-nav.nav-prev .ar { margin-right: 8px; } .wrapper .interview-w .content-w .news-navs .btn-nav.nav-next { justify-content: flex-end; } .wrapper .interview-w .content-w .news-navs .btn-nav.nav-next .ar { margin-left: 8px; } .wrapper .interview-w .content-w .news-navs .btn-more { display: inline-block; padding: 4px 24px; font-size: 12px; border-bottom: 1px #b81c22 solid; cursor: pointer; color: #b81c22; } .wrapper .interview-w .recommend-prjs-w { width: 100%; } .wrapper .interview-w .recommend-prjs-w .btt { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 40px 40px; border-top: 1px rgba(0, 0, 0, 0.1) solid; } .wrapper .interview-w .recommend-prjs-w .btt .tt { font-size: 27px; font-weight: 500; } .wrapper .interview-w .recommend-prjs-w .btt .btn-nav { display: flex; justify-content: flex-end; align-items: center; font-size: 14px; } .wrapper .interview-w .recommend-prjs-w .btt .btn-nav img { height: 10px; margin-left: 10px; } .wrapper .interview-w .recommend-prjs-w .prjs-list { width: 100%; display: flex; justify-content: flex-start; align-content: flex-start; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item { position: relative; width: calc((100% - 20px) / 3); height: 0; padding-top: 20%; margin-right: 10px; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; background-image: linear-gradient(to top, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 100%); color: #fff; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; padding: 0 36px 40px; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item .info .tt-en { font-size: 23px; line-height: 1; font-weight: 500; text-transform: uppercase; margin-bottom: 16px; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item .info .tt-zh { font-size: 18px; margin-bottom: 14px; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item .info .tt-news { width: 100%; font-size: 21px; line-height: 1; font-weight: 500; text-overflow: ellipsis; overflow-x: hidden; padding-right: 40px; white-space: nowrap; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item .info .s-info { display: flex; justify-content: flex-start; align-items: center; font-size: 14px; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item .info .s-info span { margin-right: 18px; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item .info .ar { height: 9px; position: absolute; right: 40px; bottom: 40px; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item:nth-child(3n) { margin-right: 0; } @media screen and (max-width: 1400px) { .wrapper .index-w .index-slides .index-slides-w .swiper-slide .info { padding-left: 60px; padding-right: 60px; } .wrapper .index-w .idx-about-b-w .info { padding-left: 60px; } .wrapper .footer .tp .lp .col { margin-right: 40px; } .wrapper .footer .tp .lp .col .cols .col-2 { margin-right: 20px; } .wrapper .footer .tp .rp .cols .col-2 { margin-right: 40px; } .wrapper .common-slides .common-slides-w .swiper-slide .info { padding-left: 60px; padding-right: 60px; } .wrapper .news-list-w .news-list--w .news-list .news { width: 33.33%; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples .col { width: 33.33%; } .wrapper .menus-f-w { padding-top: 160px; } } @media screen and (max-width: 1200px) { .wrapper .footer .tp .lp .col { margin-right: 25px; } .wrapper .footer .tp .lp .col .cols { flex-direction: column; } } @media screen and (max-width: 960px) { .display-pc { display: none; } .display-600 { display: block; } .not-display-600 { display: none; } .wrapper .topbar { height: 44px; } .wrapper .topbar .logo { height: 20px; right: 15px; top: 13px; } .wrapper .topbar .logo-s { height: 20px; right: 15px; top: 13px; } .wrapper .topbar .btn-menu-opener { left: 15px; top: 8px; width: 12px; } .wrapper .topbar .btn-menu-opener .b-menu { width: 14px; height: 9px; } .wrapper .topbar .btn-menu-opener .b-menu .b-bun { width: 12px; height: 1px; } .wrapper .topbar .btn-search { left: 45px; top: 7px; width: 12px; } .wrapper .topbar .topbar-w { display: none !important; } .wrapper .topbar.wht { height: 44px; background-color: #fff; } .wrapper .topbar.wht .logo { display: none; } .wrapper .topbar.wht .logo-s { display: inline-block; } .wrapper .topbar.wht .btn-menu-opener { display: inline-block; } .wrapper .topbar.wht .btn-menu-opener .b-menu .b-bun { background-color: #000; } .wrapper .topbar.wht .btn-search { display: block; } .wrapper .topbar.wht .btn-search img { filter: invert(1); } .wrapper .topbar.wht .topbar-w { display: block; } .wrapper .menus-f-w { padding-left: 60px; padding-top: 140px; display: none; } .wrapper .menus-f-w:before { top: 44px; } .wrapper .menus-f-w .btn-close-menu { width: 40px; height: 40px; left: 0; top: 4px; } .wrapper .menus-f-w .btn-close-menu img { width: 12px; } .wrapper .menus-f-w .logo { height: 20px; right: 15px; top: 13px; } .wrapper .menus-f-w .menus-list .nav { font-size: 20px; line-height: 1.6; margin-bottom: 5px; width: 124px; } .wrapper .menus-f-w .menus-list .nav .menus-w { left: 75px; padding-top: 0; display: none; } .wrapper .menus-f-w .menus-list .nav .menus-w .s-navs { font-size: 16px; line-height: 2; } .wrapper .menus-f-w .menus-list .nav .menus-w .s-navs .fstt { margin-bottom: 0; } .wrapper .menus-f-w .menus-list .nav .menus-w .s-navs .fstt .ar { left: 160px; height: 8px; top: 12px; } .wrapper .load-more { margin-top: 20px; padding-bottom: 40px; } .wrapper .load-more .btn-more { padding: 4px 16px; font-size: 9px; } .wrapper .search-w .search--w { padding: 0 15px; } .wrapper .search-w .search--w .search-bar { width: 100%; height: 56px; } .wrapper .search-w .search--w .search-bar input { width: 100%; height: 56px; padding-left: 32px; font-size: 13px; } .wrapper .search-w .search--w .search-bar:before { left: 16px; top: 22px; width: 1px; height: 12px; } .wrapper .search-w .search--w .search-bar .btn-confirm-search { width: 56px; height: 56px; } .wrapper .search-w .search--w .search-bar .btn-confirm-search img { width: 12px; } .wrapper .footer .tp { display: none; } .wrapper .footer .footer-resp-w { width: 100%; padding: 20px 15px; display: block; } .wrapper .footer .footer-resp-w .item .item-h { width: 100%; } .wrapper .footer .footer-resp-w .item .item-h .item-h-w { width: 100%; height: 32px; display: flex; justify-content: space-between; align-items: center; font-size: 10px; font-weight: 500; } .wrapper .footer .footer-resp-w .item .item-h .item-h-w .ar { transition: all 0.4s; transform: rotate(90deg); width: 4px; } .wrapper .footer .footer-resp-w .item .sub-navs { display: none; border-top: 1px rgba(0, 0, 0, 0.1) solid; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; padding: 10px 0; } .wrapper .footer .footer-resp-w .item .sub-navs .fstt { width: 100%; display: block; font-size: 10px; margin-bottom: 7px; } .wrapper .footer .footer-resp-w .item .sub-navs .fstt:last-child { margin-bottom: 0; } .wrapper .footer .footer-resp-w .item.open .item-h .item-h-w .ar { transform: rotate(-90deg); } .wrapper .footer .footer-resp-w .item:last-child .sub-navs { border-bottom: none; } .wrapper .footer .bp { border-top: none; width: 100%; height: auto; padding: 0 15px; display: flex; flex-direction: column-reverse; justify-content: flex-start; align-items: flex-start; } .wrapper .footer .bp .cp { width: 100%; font-size: 8px; padding: 20px 0; } .wrapper .footer .bp .cp a { color: #000; } .wrapper .footer .bp .email-sub { border-top: 1px rgba(0, 0, 0, 0.1) solid; width: 100%; } .wrapper .footer .bp .email-sub input { font-size: 10px; } .wrapper .footer .bp .email-sub .tag { font-size: 10px; top: 14px; } .wrapper .footer .bp .email-sub .btn-send { width: 44px; height: 44px; right: -15px; } .wrapper .footer .bp .email-sub .btn-send img { width: 12px; } .wrapper .index-w .index-slides .index-slides-w .swiper-slide .info { padding: 0 0 18px 45px; } .wrapper .index-w .index-slides .index-slides-w .swiper-slide .info .tt { font-size: 9px; } .wrapper .index-w .index-slides .index-slides-w .swiper-pagination-custom { padding-left: 15px; bottom: 15px; font-size: 9px; } .wrapper .index-w .index-slides .index-slides-w .cp { display: none; } .wrapper .index-w .index-slides .index-slides-w .btn-expand-collapse { right: 15px; bottom: 15px; width: 20px; } .wrapper .index-w .index-slides .index-slides-w .categories-w { display: none !important; } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-w { display: none; } .wrapper .index-w .index-slides .index-slides-w .categories-w .cats-resp-w { display: block; } .wrapper .index-w .idx-about-w { padding: 20px 15px 50px; border-bottom: none; } .wrapper .index-w .idx-about-w .tt { font-size: 14px; line-height: 1.4; margin-bottom: 20px; text-align: center; } .wrapper .index-w .idx-about-w .btn-nav { font-size: 10px; } .wrapper .index-w .idx-about-w .btn-nav img { height: 7px; margin-left: 7px; } .wrapper .index-w .idx-prjs-w { padding: 30px 15px 30px; } .wrapper .index-w .idx-prjs-w .idx-prjs .btt { margin-bottom: 20px; } .wrapper .index-w .idx-prjs-w .idx-prjs .btt .tt { font-size: 16px; } .wrapper .index-w .idx-prjs-w .idx-prjs .btt .btn-nav { font-size: 10px; } .wrapper .index-w .idx-prjs-w .idx-prjs .btt .btn-nav img { height: 8px; margin-left: 6px; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w { flex-direction: column; justify-content: flex-start; align-items: flex-start; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .col { width: 100%; height: auto; padding-top: 0; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .col-r { width: 100%; padding-top: 0; height: auto; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .col-r .col-r-w { width: 100%; height: auto; position: relative; left: auto; top: auto; display: flex; flex-direction: column; justify-content: flex-start; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .col-r .row { width: 100%; height: auto; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .col-r .row-2 { width: 100%; height: auto; flex-direction: column; justify-content: flex-start; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .col-r .row-2 .row-col { width: 100%; height: auto; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .col-r .row-2 .row-col:last-child { display: none; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .item { height: 0; padding-top: 68.8%; margin-bottom: 8px; position: relative; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .item .info { padding: 15px; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .item .info .tt-en { font-size: 16px; margin-bottom: 4px; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .item .info .tt-zh { font-size: 12px; line-height: 1.6; } .wrapper .index-w .idx-prjs-w .idx-prjs .prjs-w .prjs--w .item .info .ar { height: 6px; right: 15px; bottom: 20px; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w { flex-direction: column; justify-content: flex-start; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w .item { width: 100%; padding-top: 68.8%; margin-bottom: 8px; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w .item .info { padding: 20px 15px; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w .item .info .tt { font-size: 12px; line-height: 1.3; margin-bottom: 8px; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w .item .info .stt { display: none; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w .item .info .dt { font-size: 9px; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w .item:nth-child(3), .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w .item:nth-child(4) { display: none; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w .item.col-3 { width: 100%; } .wrapper .index-w .idx-prjs-w .idx-prjs .stories-w .stories--w .item.col-3:nth-child(3) { display: block; } .wrapper .index-w .idx-prjs-w .idx-prjs .prj-type-switcher { margin-top: 10px; } .wrapper .index-w .idx-prjs-w .idx-prjs .prj-type-switcher .item { width: calc((100% - 8px) / 3); padding: 10px 0; font-size: 9px; font-weight: normal; } .wrapper .index-w .idx-prjs-w .idx-prjs .prj-type-switcher .item.active { padding-bottom: 9px; } .wrapper .index-w .idx-prize-b-w .info { padding: 0 20px 0 15px; } .wrapper .index-w .idx-prize-b-w .info .tt { font-size: 26px; margin-bottom: 15px; } .wrapper .index-w .idx-prize-b-w .info .btn-nav { font-size: 9px; } .wrapper .index-w .idx-prize-b-w .info .btn-nav img { height: 6px; margin-left: 5px; } .wrapper .index-w .idx-prize-b-w .btn-expand-collapse { right: 15px; bottom: 15px; width: 20px; } .wrapper .index-w .idx-prize-b-w .categories-w { display: none !important; } .wrapper .index-w .idx-news-w { padding: 30px 15px 20px; } .wrapper .index-w .idx-news-w .idx-news .btt { margin-bottom: 20px; } .wrapper .index-w .idx-news-w .idx-news .btt .tt { font-size: 16px; } .wrapper .index-w .idx-news-w .idx-news .btt .btn-nav { font-size: 10px; } .wrapper .index-w .idx-news-w .idx-news .btt .btn-nav img { height: 8px; margin-left: 6px; } .wrapper .index-w .idx-news-w .idx-news .news-list-w { width: 100%; margin-left: 0; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .grid-sizer { width: 100%; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news { width: 100%; padding: 0; margin-bottom: 10px; float: left; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news .news-w { width: 100%; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news .news-w.reverse { flex-direction: column; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news .news-w img { width: 100%; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news .news-w .info { padding: 15px; height: 140px; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news .news-w .info .tt { font-size: 12px; line-height: 1.5; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news .news-w .info .info-w .desc { font-size: 11px; line-height: 1.5; max-height: 33px; overflow-y: hidden; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news .news-w .info .info-w .dt { margin-top: 10px; font-size: 11px; } .wrapper .index-w .idx-news-w .idx-news .news-list-w .news:nth-child(4), .wrapper .index-w .idx-news-w .idx-news .news-list-w .news:nth-child(5), .wrapper .index-w .idx-news-w .idx-news .news-list-w .news:nth-child(6), .wrapper .index-w .idx-news-w .idx-news .news-list-w .news:nth-child(7), .wrapper .index-w .idx-news-w .idx-news .news-list-w .news:nth-child(8) { display: none; } .wrapper .index-w .idx-about-b-w .info { padding: 0 20px 0 15px; } .wrapper .index-w .idx-about-b-w .info .tt { font-size: 26px; margin-bottom: 15px; } .wrapper .index-w .idx-about-b-w .info .btn-nav { font-size: 9px; } .wrapper .index-w .idx-about-b-w .info .btn-nav img { height: 6px; margin-left: 5px; } .wrapper .index-w .idx-about-b-w .btn-expand-collapse { right: 15px; bottom: 15px; width: 20px; } .wrapper .index-w .idx-about-b-w .categories-w { display: none !important; } .wrapper .common-slides { height: 392px; } .wrapper .common-slides .common-slides-w .swiper-slide .info { padding: 0 0 0 15px; } .wrapper .common-slides .common-slides-w .swiper-slide .info .tt { font-size: 26px; margin-bottom: 12px; } .wrapper .common-slides .common-slides-w .swiper-slide .info .tt-s { font-size: 24px; margin-bottom: 15px; } .wrapper .common-slides .common-slides-w .swiper-slide .info .htt { font-size: 10px; margin-bottom: 10px; } .wrapper .common-slides .common-slides-w .swiper-slide .info .btn-nav { font-size: 9px; } .wrapper .common-slides .common-slides-w .swiper-slide .info .btn-nav img { height: 6px; margin-left: 5px; } .wrapper .common-slides .common-slides-w .swiper-slide .info .hint { font-size: 11px; margin-bottom: 12px; } .wrapper .common-slides .common-slides-w .swiper-pagination-custom { padding-left: 15px; bottom: 15px; font-size: 9px; } .wrapper .prj-cats-w .prj-categories-w { margin-top: 8px; margin-bottom: 30px; } .wrapper .prj-cats-w .prj-categories-w .cats-w .item { width: 100%; padding-top: 75%; margin-bottom: 8px; } .wrapper .prj-cats-w .prj-categories-w .cats-w .item .info { padding: 20px; } .wrapper .prj-cats-w .prj-categories-w .cats-w .item .info .tt-en { font-size: 14px; } .wrapper .prj-cats-w .prj-categories-w .cats-w .item .info .tt-zh { font-size: 12px; line-height: 1.5; } .wrapper .prj-cats-w .prj-categories-w .cats-w .item .info .ar { height: 6px; right: 20px; bottom: 20px; } .wrapper .prjs-w .prjs-list-w { padding: 0 0 30px; } .wrapper .prjs-w .prjs-list-w .btt { padding: 20px 15px; } .wrapper .prjs-w .prjs-list-w .btt .tt { font-size: 16px; } .wrapper .prjs-w .prjs-list-w .btt .filters { display: none; } .wrapper .prjs-w .prjs-list-w .btt .selector-w { margin-right: -15px; display: block; } .wrapper .prjs-w .prjs-list-w .btt .selector-w .selector-row { width: 140px; padding: 0 15px; position: relative; } .wrapper .prjs-w .prjs-list-w .btt .selector-w .selector-row.open { background-color: #fff; } .wrapper .prjs-w .prjs-list-w .btt .selector-w .selector-row.open .wait-select-w { background-color: #fff; } .wrapper .prjs-w .prjs-list-w .btt .selector-w .selector-row.open .filter-crt { border-bottom-color: #000; } .wrapper .prjs-w .prjs-list-w .btt .selector-w .selector-row.open .filter-crt .ar { transform: rotate(-90deg); } .wrapper .prjs-w .prjs-list-w .btt .selector-w .selector-row .filter-crt { padding: 15px 0 10px; border-bottom: 1px rgba(0, 0, 0, 0.2) solid; position: relative; font-size: 9px; cursor: pointer; } .wrapper .prjs-w .prjs-list-w .btt .selector-w .selector-row .filter-crt .ar { position: absolute; right: 0; top: 18px; transform: rotate(90deg); height: 7px; transition: all 0.4s; } .wrapper .prjs-w .prjs-list-w .btt .selector-w .selector-row .wait-select-w { position: absolute; top: 39px; left: 0; width: 100%; padding: 0 15px; display: none; z-index: 6; } .wrapper .prjs-w .prjs-list-w .btt .selector-w .selector-row .wait-select-w .item { width: 100%; padding: 10px 0; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; display: flex; justify-content: space-between; align-items: center; font-size: 9px; transition: all 0.4s; cursor: pointer; } .wrapper .prjs-w .prjs-list-w .btt .selector-w .selector-row .wait-select-w .item .ar { height: 7px; opacity: 0; transition: all 0.4s; } .wrapper .prjs-w .prjs-list-w .btt .selector-w .selector-row .wait-select-w .item:hover, .wrapper .prjs-w .prjs-list-w .btt .selector-w .selector-row .wait-select-w .item.active { color: #b81c22; } .wrapper .prjs-w .prjs-list-w .btt .selector-w .selector-row .wait-select-w .item:hover .ar, .wrapper .prjs-w .prjs-list-w .btt .selector-w .selector-row .wait-select-w .item.active .ar { opacity: 1; } .wrapper .prjs-w .prjs-list-w .prjs-list { padding: 0 15px; } .wrapper .prjs-w .prjs-list-w .prjs-list .item { width: 100%; padding-top: 64%; margin-bottom: 8px; } .wrapper .prjs-w .prjs-list-w .prjs-list .item .tag { width: 22px; height: 22px; font-size: 5px; } .wrapper .prjs-w .prjs-list-w .prjs-list .item .info { padding: 0 20px 18px; } .wrapper .prjs-w .prjs-list-w .prjs-list .item .info .tt-en { font-size: 14px; margin-bottom: 6px; } .wrapper .prjs-w .prjs-list-w .prjs-list .item .info .tt-zh { font-size: 12px; line-height: 1.5; margin-bottom: 2px; } .wrapper .prjs-w .prjs-list-w .prjs-list .item .info .s-info { font-size: 10px; } .wrapper .prjs-w .prjs-list-w .prjs-list .item .info .s-info span { margin-right: 12px; } .wrapper .prjs-w .prjs-list-w .prjs-list .item .info .ar { height: 6px; right: 20px; bottom: 20px; } .wrapper .top-filter-opener { right: 15px; bottom: 15px; width: 26px; height: 26px; } .wrapper .top-filter-opener img { width: 11px; } .wrapper .top-filters .filter-w { width: 200px; right: -200px; padding: 25px 25px 0; } .wrapper .top-filters .filter-w .f-tt { font-size: 14px; margin-bottom: 40px; } .wrapper .top-filters .filter-w .f-tt img { height: 12px; } .wrapper .top-filters .filter-w .filter-grp { margin-bottom: 40px; } .wrapper .top-filters .filter-w .filter-grp .fg-tt { font-size: 12px; margin-bottom: 12px; } .wrapper .top-filters .filter-w .filter-grp .filter-row .filter-crt { height: 40px; border-bottom: 1px rgba(0, 0, 0, 0.2) solid; font-size: 10px; margin-bottom: 4px; } .wrapper .top-filters .filter-w .filter-grp .filter-row .filter-crt .ar { bottom: 15px; width: 4px; } .wrapper .top-filters .filter-w .filter-grp .filter-row .wait-select-w .wait-select-years .item { width: 33%; font-size: 10px; padding: 8px 0; } .wrapper .top-filters .filter-w .filter-grp .filter-row .wait-select-w .wait-select-dists .item { padding: 10px 0; font-size: 10px; } .wrapper .top-filters .filter-w .filter-grp .filter-row .wait-select-w .wait-select-dists .item .ar { bottom: 15px; width: 4px; } .wrapper .prj-detail-w .prj-cover { height: 380px; } .wrapper .prj-detail-w .prj-cover .info { padding: 20px 145px 15px 20px; } .wrapper .prj-detail-w .prj-cover .info.info-f { padding-right: 15px; } .wrapper .prj-detail-w .prj-cover .info .tt-en { font-size: 24px; margin-bottom: 10px; } .wrapper .prj-detail-w .prj-cover .info .tt-zh { font-size: 16px; } .wrapper .prj-detail-w .prj-cover .info .tt-news { font-size: 24px; line-height: 1.2; } .wrapper .prj-detail-w .prj-cover .info .s-info { font-size: 10px; margin-top: 12px; } .wrapper .prj-detail-w .prj-cover .info .s-info span { margin-right: 12px; } .wrapper .prj-detail-w .prj-cover .info .breadcrumb { right: 15px; bottom: 20px; font-size: 9px; } .wrapper .prj-detail-w .prj-cover .info .breadcrumb a { margin: 0 3px; } .wrapper .prj-detail-w .prj-info-w { padding: 10px 15px 20px; display: flex; flex-direction: column-reverse; justify-content: flex-start; align-items: flex-start; } .wrapper .prj-detail-w .prj-info-w .prj-info { flex-direction: column; } .wrapper .prj-detail-w .prj-info-w .prj-info .col { margin-right: 0; } .wrapper .prj-detail-w .prj-info-w .prj-info .col .col-w { font-size: 10px; margin-bottom: 12px; } .wrapper .prj-detail-w .prj-info-w .prj-info .col .col-w .kk { width: 50px; } .wrapper .prj-detail-w .prj-info-w .prj-info .col .col-w:last-child { margin-bottom: 8px; } .wrapper .prj-detail-w .prj-info-w .prj-navs { display: flex; justify-content: space-between; align-items: center; margin-bottom: 20px; width: 100%; } .wrapper .prj-detail-w .prj-info-w .prj-navs .nav { width: calc((100% - 10px) / 3); justify-content: center; font-size: 10px; margin-left: 0; padding: 12px 0; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; } .wrapper .prj-detail-w .prj-info-w .prj-navs .nav .ico-w { display: none; } .wrapper .prj-detail-w .prj-info-w .prj-navs .nav:hover { color: #b81c22; border-bottom-color: #b81c22; } .wrapper .prj-detail-w .content-w { padding: 40px 15px 20px; font-size: 11px; line-height: 1.68; } .wrapper .prj-detail-w .content-w .content p { font-size: 11px; line-height: 1.68; margin-bottom: 20px; } .wrapper .prj-detail-w .content-w .content h1, .wrapper .prj-detail-w .content-w .content h2, .wrapper .prj-detail-w .content-w .content h3, .wrapper .prj-detail-w .content-w .content h4, .wrapper .prj-detail-w .content-w .content h5, .wrapper .prj-detail-w .content-w .content h6 { margin-bottom: 20px; } .wrapper .prj-detail-w .content-w .content h5 { font-size: 11px !important; line-height: 1.68; } .wrapper .prj-detail-w .content-w .content h5 > * { font-size: 11px !important; } .wrapper .prj-detail-w .content-w .news-navs { margin: 30px auto 0; } .wrapper .prj-detail-w .content-w .news-navs .btn-nav { font-size: 8px; font-weight: 500; } .wrapper .prj-detail-w .content-w .news-navs .btn-nav .ar { width: 6px; } .wrapper .prj-detail-w .content-w .news-navs .btn-more { padding: 3px 20px; font-size: 8px; font-weight: 500; } .wrapper .prj-detail-w .recommend-prjs-w .btt { padding: 20px 15px; } .wrapper .prj-detail-w .recommend-prjs-w .btt .tt { font-size: 16px; } .wrapper .prj-detail-w .recommend-prjs-w .btt .btn-nav { font-size: 10px; } .wrapper .prj-detail-w .recommend-prjs-w .btt .btn-nav img { height: 8px; margin-left: 6px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list { flex-direction: column; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item { width: 100%; padding-top: 62.4%; margin-right: 0; margin-bottom: 8px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item:last-child { margin-bottom: 0; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item .info { padding: 0 20px 20px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item .info .tt-en { font-size: 14px; margin-bottom: 6px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item .info .tt-zh { font-size: 12px; line-height: 1.5; margin-bottom: 2px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item .info .s-info { font-size: 10px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item .info .s-info span { margin-right: 12px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item .info .ar { height: 6px; right: 20px; bottom: 20px; } .wrapper .prj-detail-w .recommend-prjs-w .prjs-list .item .info .tt-news { font-size: 14px; line-height: 1.28; } .wrapper .gallery-w .prj-info { left: 15px; top: 15px; } .wrapper .gallery-w .prj-info .tt-zh { font-size: 10px; } .wrapper .gallery-w .prj-info .s-info { font-size: 10px; } .wrapper .gallery-w .prj-info .s-info span { margin-right: 12px; } .wrapper .gallery-w .btn-close-slides { right: 0; top: 0; } .wrapper .gallery-w .btn-close-slides img { width: 11px; } .wrapper .gallery-w .main-slides .swiper-pagination-custom { padding-left: 15px; bottom: 15px; font-size: 9px; } .wrapper .gallery-w .main-slides .btn-expand-collapse { right: 15px; bottom: 15px; width: 20px; } .wrapper .gallery-w .main-slides.open .swiper-pagination-fraction { bottom: 130px; } .wrapper .gallery-w .main-slides.open .btn-expand-collapse { bottom: 130px; } .wrapper .gallery-w .sub-slides-w { padding: 30px 15px; } .wrapper .videos-w .prj-info { left: 15px; top: 15px; } .wrapper .videos-w .prj-info .tt-zh { font-size: 10px; } .wrapper .videos-w .prj-info .s-info { font-size: 10px; } .wrapper .videos-w .prj-info .s-info span { margin-right: 12px; } .wrapper .videos-w .btn-close-slides { right: 0; top: 0; } .wrapper .videos-w .btn-close-slides img { width: 11px; } .wrapper .videos-w .main-slides .swiper-pagination-custom { padding-left: 15px; bottom: 15px; font-size: 9px; } .wrapper .videos-w .main-slides .btn-expand-collapse { right: 15px; bottom: 15px; width: 20px; } .wrapper .videos-w .main-slides.open .swiper-pagination-fraction { bottom: 130px; } .wrapper .videos-w .main-slides.open .btn-expand-collapse { bottom: 130px; } .wrapper .videos-w .sub-slides-w { padding: 30px 15px; height: 150px; bottom: -150px; } .wrapper .news-list-w .news-list--w { padding: 0 15px 30px; } .wrapper .news-list-w .news-list--w .btt { padding: 20px 0; } .wrapper .news-list-w .news-list--w .btt .tt { font-size: 16px; } .wrapper .news-list-w .news-list--w .btt .filters { display: none; } .wrapper .news-list-w .news-list--w .btt .selector-w { margin-right: -15px; display: block; } .wrapper .news-list-w .news-list--w .btt .selector-w .selector-row { width: 140px; padding: 0 15px; position: relative; } .wrapper .news-list-w .news-list--w .btt .selector-w .selector-row.open { background-color: #fff; } .wrapper .news-list-w .news-list--w .btt .selector-w .selector-row.open .wait-select-w { background-color: #fff; } .wrapper .news-list-w .news-list--w .btt .selector-w .selector-row.open .filter-crt { border-bottom-color: #000; } .wrapper .news-list-w .news-list--w .btt .selector-w .selector-row.open .filter-crt .ar { transform: rotate(-90deg); } .wrapper .news-list-w .news-list--w .btt .selector-w .selector-row .filter-crt { padding: 15px 0 10px; border-bottom: 1px rgba(0, 0, 0, 0.2) solid; position: relative; font-size: 9px; cursor: pointer; } .wrapper .news-list-w .news-list--w .btt .selector-w .selector-row .filter-crt .ar { position: absolute; right: 0; top: 18px; transform: rotate(90deg); height: 7px; transition: all 0.4s; } .wrapper .news-list-w .news-list--w .btt .selector-w .selector-row .wait-select-w { position: absolute; top: 39px; left: 0; width: 100%; padding: 0 15px; display: none; z-index: 6; } .wrapper .news-list-w .news-list--w .btt .selector-w .selector-row .wait-select-w .item { width: 100%; padding: 10px 0; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; display: flex; justify-content: space-between; align-items: center; font-size: 9px; transition: all 0.4s; cursor: pointer; } .wrapper .news-list-w .news-list--w .btt .selector-w .selector-row .wait-select-w .item .ar { height: 7px; opacity: 0; transition: all 0.4s; } .wrapper .news-list-w .news-list--w .btt .selector-w .selector-row .wait-select-w .item:hover, .wrapper .news-list-w .news-list--w .btt .selector-w .selector-row .wait-select-w .item.active { color: #b81c22; } .wrapper .news-list-w .news-list--w .btt .selector-w .selector-row .wait-select-w .item:hover .ar, .wrapper .news-list-w .news-list--w .btt .selector-w .selector-row .wait-select-w .item.active .ar { opacity: 1; } .wrapper .news-list-w .news-list--w .news-list .grid-sizer { width: 100%; } .wrapper .news-list-w .news-list--w .news-list .news { width: 100%; padding: 0; margin-bottom: 8px; } .wrapper .news-list-w .news-list--w .news-list .news .news-w.reverse { flex-direction: column; } .wrapper .news-list-w .news-list--w .news-list .news .news-w .info { padding: 20px; height: 180px; } .wrapper .news-list-w .news-list--w .news-list .news .news-w .info .ar { right: 20px; top: 20px; height: 12px; } .wrapper .news-list-w .news-list--w .news-list .news .news-w .info .tt { font-size: 14px; line-height: 1.5; } .wrapper .news-list-w .news-list--w .news-list .news .news-w .info .info-w .desc { font-size: 11px; line-height: 1.5; max-height: 50px; overflow-y: hidden; } .wrapper .news-list-w .news-list--w .news-list .news .news-w .info .info-w .dt { margin-top: 10px; font-size: 11px; } .wrapper .main-cover .info { padding: 0 15px; } .wrapper .main-cover .info .tt { font-size: 30px; line-height: 0.9; margin-bottom: 12px; } .wrapper .main-cover .info .stt { font-size: 15px; } .wrapper .about-w { overflow: hidden; } .wrapper .about-w .about-navs { padding: 20px 15px; } .wrapper .about-w .about-navs .btt .tt { font-size: 16px; } .wrapper .about-w .about-navs .btt .filters { display: none; } .wrapper .about-w .about--w { padding: 40px 15px; } .wrapper .about-w .about--w .about-us .tt { width: 120px; font-size: 20px; } .wrapper .about-w .about--w .about-us .desc { width: calc(100% - 120px); font-size: 11px; line-height: 1.68; } .wrapper .about-w .about--w .about-us .next-nav { bottom: 3px; } .wrapper .about-w .about--w .about-us .next-nav .ico { height: 18px; margin-right: 6px; } .wrapper .about-w .about--w .about-us .next-nav a { font-size: 8px; line-height: 1.3; } .wrapper .about-w .about--w .about-concept { flex-direction: column; justify-content: flex-start; } .wrapper .about-w .about--w .about-concept .tt-w { width: 100%; } .wrapper .about-w .about--w .about-concept .tt-w .tt { font-size: 20px; margin-bottom: 30px; } .wrapper .about-w .about--w .about-concept .tt-w .tt-q { font-size: 18px; margin-bottom: 20px; } .wrapper .about-w .about--w .about-concept .tt-w .tt-v { font-size: 11px; line-height: 1.68; } .wrapper .about-w .about--w .about-concept .concept-cover { width: 100%; height: 0; padding-top: 56%; padding-left: 0; position: relative; } .wrapper .about-w .about--w .about-concept .concept-cover .cover-w { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .wrapper .about-w .about--w .about-concept .next-nav { position: relative; left: auto; bottom: auto; margin-top: 40px; margin-bottom: 20px; } .wrapper .about-w .about--w .about-concept .next-nav .ico { height: 18px; margin-right: 6px; } .wrapper .about-w .about--w .about-concept .next-nav p { font-size: 8px; line-height: 1.3; } .wrapper .about-w .about--w .about-us-cases { display: none; } .wrapper .about-w .about--w .about-us-cases-resp { width: 100%; margin-top: 20px; } .wrapper .about-w .about--w .about-us-cases-resp .swiper-wrapper { width: 100%; } .wrapper .about-w .about--w .about-us-cases-resp .swiper-wrapper .swiper-slide { width: 340px; } .wrapper .about-w .about--w .about-us-cases-resp .swiper-wrapper .swiper-slide .col { width: 100%; cursor: pointer; position: relative; } .wrapper .about-w .about--w .about-us-cases-resp .swiper-wrapper .swiper-slide .col .cover { width: 100%; } .wrapper .about-w .about--w .about-us-cases-resp .swiper-wrapper .swiper-slide .col .info { width: 100%; height: 100%; position: absolute; left: 0; top: 0; display: flex; flex-direction: column; justify-content: flex-end; align-items: flex-start; padding: 20px; color: #fff; } .wrapper .about-w .about--w .about-us-cases-resp .swiper-wrapper .swiper-slide .col .info .tt { font-size: 14px; line-height: 1; font-weight: 500; margin-bottom: 8px; } .wrapper .about-w .about--w .about-us-cases-resp .swiper-wrapper .swiper-slide .col .info .stt { font-size: 12px; line-height: 1.5; padding-right: 40px; } .wrapper .about-w .about--w .about-us-cases-resp .swiper-wrapper .swiper-slide .col .info .ar { height: 7px; position: absolute; right: 20px; bottom: 20px; } .wrapper .about-w .about--w .teams-w .team-btt { margin-bottom: 40px; } .wrapper .about-w .about--w .teams-w .team-btt .tt { font-size: 20px; } .wrapper .about-w .about--w .teams-w .team-btt .filters { display: none; } .wrapper .about-w .about--w .teams-w .team-btt .selector-w { margin-right: -15px; display: block; } .wrapper .about-w .about--w .teams-w .team-btt .selector-w .selector-row { width: 140px; padding: 0 15px; position: relative; } .wrapper .about-w .about--w .teams-w .team-btt .selector-w .selector-row.open { background-color: #fff; } .wrapper .about-w .about--w .teams-w .team-btt .selector-w .selector-row.open .wait-select-w { background-color: #fff; } .wrapper .about-w .about--w .teams-w .team-btt .selector-w .selector-row.open .filter-crt { border-bottom-color: #000; } .wrapper .about-w .about--w .teams-w .team-btt .selector-w .selector-row.open .filter-crt .ar { transform: rotate(-90deg); } .wrapper .about-w .about--w .teams-w .team-btt .selector-w .selector-row .filter-crt { padding: 15px 0 10px; border-bottom: 1px rgba(0, 0, 0, 0.2) solid; position: relative; font-size: 9px; cursor: pointer; } .wrapper .about-w .about--w .teams-w .team-btt .selector-w .selector-row .filter-crt .ar { position: absolute; right: 0; top: 18px; transform: rotate(90deg); height: 7px; transition: all 0.4s; } .wrapper .about-w .about--w .teams-w .team-btt .selector-w .selector-row .wait-select-w { position: absolute; top: 39px; left: 0; width: 100%; padding: 0 15px; display: none; z-index: 6; } .wrapper .about-w .about--w .teams-w .team-btt .selector-w .selector-row .wait-select-w .item { width: 100%; padding: 10px 0; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; display: flex; justify-content: space-between; align-items: center; font-size: 9px; transition: all 0.4s; cursor: pointer; } .wrapper .about-w .about--w .teams-w .team-btt .selector-w .selector-row .wait-select-w .item .ar { height: 7px; opacity: 0; transition: all 0.4s; } .wrapper .about-w .about--w .teams-w .team-btt .selector-w .selector-row .wait-select-w .item:hover, .wrapper .about-w .about--w .teams-w .team-btt .selector-w .selector-row .wait-select-w .item.active { color: #b81c22; } .wrapper .about-w .about--w .teams-w .team-btt .selector-w .selector-row .wait-select-w .item:hover .ar, .wrapper .about-w .about--w .teams-w .team-btt .selector-w .selector-row .wait-select-w .item.active .ar { opacity: 1; } .wrapper .about-w .about--w .teams-w .team-members .member { width: calc((100% - 16px) / 3); padding-top: 50%; position: relative; margin-right: 8px; margin-bottom: 8px; cursor: pointer; } .wrapper .about-w .about--w .teams-w .team-members .member:nth-child(3n) { margin-right: 0; } .wrapper .about-w .about--w .teams-w .team-members .member:nth-child(5n) { margin-right: 8px; } .wrapper .about-w .about--w .teams-w .team-members .member:nth-child(15n) { margin-right: 0; } .wrapper .about-w .about--w .teams-w .team-members .member .info { padding: 15px; } .wrapper .about-w .about--w .teams-w .team-members .member .info .name { font-size: 12px; margin-bottom: 4px; } .wrapper .about-w .about--w .teams-w .team-members .member .info .title { font-size: 10px; } .wrapper .about-w .about--w .teams-w .team-members .member-more { width: calc((100% - 16px) / 3); padding-top: 50%; } .wrapper .about-w .about--w .teams-w .team-members .member-more .info { padding: 15px; } .wrapper .about-w .about--w .teams-w .team-members .member-more .info .name { font-size: 12px; margin-bottom: 4px; } .wrapper .about-w .about--w .teams-w .team-members .member-more .info .title { font-size: 10px; } .wrapper .about-w .about--w .tt-desc-w { margin-bottom: 40px; } .wrapper .about-w .about--w .tt-desc-w .tt { font-size: 20px; width: 120px; } .wrapper .about-w .about--w .tt-desc-w .desc { width: calc(100% - 120px); font-size: 11px; line-height: 1.68; } .wrapper .about-w .about--w .brand-w .awards-w img { width: calc((100% - 16px) / 3); margin-right: 8px; margin-bottom: 8px; } .wrapper .about-w .about--w .brand-w .awards-w img:nth-child(3n) { margin-right: 0; } .wrapper .about-w .about--w .fields-w { width: 100%; margin-bottom: 0; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper { width: 100%; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide { width: 220px; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .col { width: 100%; height: 0; padding-top: 183%; position: relative; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .col .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 20px; color: #fff; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .col .info .field-tt { font-size: 12px; font-weight: 500; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .col .info .ar { position: absolute; right: 20px; bottom: 20px; height: 7px; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .more-w { width: 100%; height: 0; padding-top: 183%; position: relative; top: auto; left: auto; background-color: #c6c6c6; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .more-w .info { position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding: 20px; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .more-w .info .field-tt { font-size: 12px; font-weight: 500; } .wrapper .about-w .about--w .fields-w .fields-list .swiper-wrapper .swiper-slide .more-w .info .ar { position: absolute; right: 20px; bottom: 20px; height: 7px; filter: invert(1); } .wrapper .about-w .about--w .fields-w .fields-list .nav { display: none; } .wrapper .member-f-w { overflow-y: scroll; } .wrapper .member-f-w .close-bar { display: none; } .wrapper .member-f-w .btn-close-member { right: 0; top: 0; } .wrapper .member-f-w .btn-close-member img { width: 11px; filter: invert(0); } .wrapper .member-f-w .member-f--w { height: auto; flex-direction: column; } .wrapper .member-f-w .cover-w { width: 100%; height: 600px; } .wrapper .member-f-w .cover-w .info { padding: 15px; } .wrapper .member-f-w .cover-w .info .name { font-size: 20px; margin-bottom: 20px; } .wrapper .member-f-w .cover-w .info .title { font-size: 11px; line-height: 1.68; } .wrapper .member-f-w .intro-w { width: 100%; height: auto; overflow-y: unset; padding: 40px 15px; } .wrapper .member-f-w .intro-w .intro--w .row { font-size: 11px; line-height: 1.68; padding-bottom: 25px; margin-bottom: 25px; } .wrapper .member-f-w .intro-w .intro--w .row .stt { width: 80px; } .wrapper .member-f-w .intro-w .intro--w .row .svv { width: calc(100% - 80px); } .wrapper .member-f-w .intro-w .intro--w .row .svv.works .workname { margin-bottom: 10px; } .wrapper .member-f-w .intro-w .intro--w .row .svv.works .prizes { margin-bottom: 20px; } .wrapper .contact-w .about-navs { padding: 20px 15px; } .wrapper .contact-w .about-navs .btt .tt { font-size: 16px; } .wrapper .contact-w .about-navs .btt .filters { display: none; } .wrapper .contact-w .about--w { padding: 40px 15px; } .wrapper .contact-w .about--w .tt-nav-w { margin-bottom: 20px; } .wrapper .contact-w .about--w .tt-nav-w.flex-d-column-resp { flex-direction: column; } .wrapper .contact-w .about--w .tt-nav-w .tt { font-size: 20px; width: 33.33%; } .wrapper .contact-w .about--w .tt-nav-w .desc { position: relative; font-size: 11px; line-height: 1.68; width: 66.66%; left: 0; } .wrapper .contact-w .about--w .tt-nav-w .desc .btn-nav { display: flex; margin-top: 16px; } .wrapper .contact-w .about--w .tt-nav-w .btn-nav { font-size: 10px; } .wrapper .contact-w .about--w .tt-nav-w .btn-nav img { height: 8px; margin-left: 6px; } .wrapper .contact-w .about--w .tt-nav-w .btn-nav.not-show-resp { display: none; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps { margin-top: 20px; width: calc(100% + 30px); margin-left: -15px; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row { width: 50%; padding: 0 15px; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .filter-crt { padding: 15px 0 10px; border-bottom: 1px rgba(0, 0, 0, 0.2) solid; position: relative; font-size: 9px; cursor: pointer; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .filter-crt .ar { position: absolute; right: 0; top: 18px; transform: rotate(90deg); height: 7px; transition: all 0.4s; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .wait-select-w { position: absolute; top: 39px; left: 0; width: 100%; padding: 0 15px; display: none; z-index: 6; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .wait-select-w .item { width: 100%; padding: 10px 0; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; display: flex; justify-content: space-between; align-items: center; font-size: 9px; transition: all 0.4s; cursor: pointer; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .wait-select-w .item .ar { height: 7px; opacity: 0; transition: all 0.4s; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .wait-select-w .item:hover, .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .wait-select-w .item.active { color: #b81c22; } .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .wait-select-w .item:hover .ar, .wrapper .contact-w .about--w .tt-nav-w .selector-grps .selector-row .wait-select-w .item.active .ar { opacity: 1; } .wrapper .contact-w .about--w .contact-ways-w .map-w { flex-direction: column; justify-content: flex-start; padding-bottom: 20px; margin-bottom: 20px; } .wrapper .contact-w .about--w .contact-ways-w .map-w .map--w { width: 100%; margin-bottom: 20px; } .wrapper .contact-w .about--w .contact-ways-w .map-w .company-locations { width: 100%; } .wrapper .contact-w .about--w .contact-ways-w .map-w .company-locations .col-2 { width: 50%; display: flex; flex-direction: column; margin-right: 0; padding-right: 30px; } .wrapper .contact-w .about--w .contact-ways-w .map-w .company-locations .col-2 .way-w .tag { width: 18px; font-size: 10px; line-height: 1.7; } .wrapper .contact-w .about--w .contact-ways-w .map-w .company-locations .col-2 .way-w .way { font-size: 10px; line-height: 1.7; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples { flex-wrap: wrap; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples .col { width: 50%; flex-direction: column; margin-bottom: 20px; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples .col .ctt { font-size: 10px; line-height: 1.7; margin-right: 0; text-align: left; padding-left: 18px; margin-bottom: 5px; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples .col .cvv { display: flex; flex-direction: column; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples .col .cvv .way-w { display: flex; justify-content: flex-start; align-items: center; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples .col .cvv .way-w .tag { width: 18px; font-size: 10px; line-height: 1.7; } .wrapper .contact-w .about--w .contact-ways-w .contact-peoples .col .cvv .way-w .way { font-size: 10px; line-height: 1.7; } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w { flex-direction: column; justify-content: flex-start; } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w .item { width: 100%; padding-top: 68.8%; margin-bottom: 8px; } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w .item .info { padding: 20px 15px; } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w .item .info .tt { font-size: 12px; line-height: 1.3; margin-bottom: 8px; } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w .item .info .stt { display: none; } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w .item .info .dt { font-size: 9px; } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w .item:nth-child(3), .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w .item:nth-child(4) { display: none; } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w .item.col-3 { width: 100%; } .wrapper .contact-w .about--w .viewpoints-w .stories-w .stories--w .item.col-3:nth-child(3) { display: block; } .wrapper .contact-w .about--w .viewpoints-w .prj-type-switcher { margin-top: 10px; } .wrapper .contact-w .about--w .viewpoints-w .prj-type-switcher .item { width: calc((100% - 8px) / 3); padding: 10px 0; font-size: 9px; font-weight: normal; } .wrapper .contact-w .about--w .viewpoints-w .prj-type-switcher .item.active { padding-bottom: 9px; } .wrapper .contact-w .about--w .talking-w .talkings-w .talkings--w { flex-direction: column; justify-content: flex-start; } .wrapper .contact-w .about--w .talking-w .talkings-w .talkings--w .item { width: 100%; height: 0; padding-top: 75%; margin-bottom: 8px; } .wrapper .contact-w .about--w .talking-w .talkings-w .talkings--w .item .info { padding: 20px 15px; } .wrapper .contact-w .about--w .talking-w .talkings-w .talkings--w .item .info .tt { font-size: 14px; line-height: 1.3; margin-bottom: 6px; } .wrapper .contact-w .about--w .talking-w .talkings-w .talkings--w .item .info .stt { font-size: 11px; line-height: 1.5; margin-bottom: 0; } .wrapper .contact-w .about--w .jobs-w .jobs--w { width: 100%; display: flex; justify-content: flex-start; align-items: flex-start; flex-wrap: wrap; } .wrapper .contact-w .about--w .jobs-w .jobs--w .item { width: 100%; height: 280px; padding: 20px; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; position: relative; background-color: #c6c6c6; margin-bottom: 10px; } .wrapper .contact-w .about--w .jobs-w .jobs--w .item .ar { position: absolute; right: 20px; top: 20px; height: 7px; filter: invert(1); transition: all 0.4s; } .wrapper .contact-w .about--w .jobs-w .jobs--w .item .tp .location { font-size: 9px; margin-bottom: 6px; line-height: 1; } .wrapper .contact-w .about--w .jobs-w .jobs--w .item .tp .title { font-size: 14px; line-height: 1; font-weight: 500; } .wrapper .contact-w .about--w .jobs-w .jobs--w .item .bp .stt { font-size: 11px; font-weight: 500; line-height: 1.2; margin-bottom: 12px; } .wrapper .contact-w .about--w .jobs-w .jobs--w .item .bp .requirement { font-size: 11px; line-height: 1.8; max-height: 119px; overflow-y: hidden; } .wrapper .contact-w .about--w .jobs-w .jobs--w .item:hover { background-color: #b81c22; color: #fff; } .wrapper .contact-w .about--w .jobs-w .jobs--w .item:hover .ar { filter: invert(0); } .wrapper .contact-w .about--w .jobs-w .jobs--w .no-more { width: 100%; height: 280px; padding: 20px; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; position: relative; background-color: #c6c6c6; margin-bottom: 10px; } .wrapper .contact-w .about--w .jobs-w .jobs--w .no-more .ar { position: absolute; right: 20px; top: 20px; height: 7px; filter: invert(1); transition: all 0.4s; } .wrapper .contact-w .about--w .jobs-w .jobs--w .no-more .tp .location { font-size: 9px; margin-bottom: 6px; line-height: 1; } .wrapper .contact-w .about--w .jobs-w .jobs--w .no-more .tp .title { font-size: 14px; line-height: 1; font-weight: 500; } .wrapper .contact-w .about--w .jobs-w .jobs--w .no-more:hover { background-color: #b81c22; color: #fff; } .wrapper .contact-w .about--w .jobs-w .jobs--w .no-more:hover .ar { filter: invert(0); } .wrapper .job-detail-w .btn-close-job { right: 0; top: 0; } .wrapper .job-detail-w .btn-close-job img { width: 11px; } .wrapper .job-detail-w .detail--w { padding: 15px; } .wrapper .job-detail-w .detail--w .title-en { font-size: 20px; margin-bottom: 5px; } .wrapper .job-detail-w .detail--w .title-zh { font-size: 16px; margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; } .wrapper .job-detail-w .detail--w .row { margin-top: 0; padding-top: 0; border-top: none; flex-direction: column; } .wrapper .job-detail-w .detail--w .row .col { width: 100%; padding-right: 0; font-size: 11px; line-height: 1.68; padding-bottom: 25px; margin-bottom: 25px; border-bottom: 1px rgba(0, 0, 0, 0.1) solid; } .wrapper .job-detail-w .detail--w .row .col .ctt { width: 75px; } .wrapper .job-detail-w .detail--w .row .col .cvv { width: calc(100% - 75px); } .wrapper .job-detail-w .detail--w .row .col.col-f { padding-bottom: 0; margin-bottom: 0; border-bottom: none; } .wrapper .search-res-w { padding-top: 40px; } .wrapper .search-res-w .res-hint-bar { padding: 30px 15px 20px; } .wrapper .search-res-w .res-hint-bar .res-hint { font-size: 14px; } .wrapper .search-res-w .res-hint-bar .filters { font-size: 11px; } .wrapper .search-res-w .res-hint-bar .filters .item { padding: 3px 4px; } .wrapper .interview-w .interview-cover .info { padding: 20px 145px 15px 20px; } .wrapper .interview-w .interview-cover .info.info-f { padding-right: 15px; } .wrapper .interview-w .interview-cover .info .tt-en { font-size: 24px; margin-bottom: 10px; } .wrapper .interview-w .interview-cover .info .tt-zh { font-size: 16px; } .wrapper .interview-w .interview-cover .info .tt-news { font-size: 24px; line-height: 1.2; } .wrapper .interview-w .interview-cover .info .s-info { font-size: 10px; margin-top: 12px; } .wrapper .interview-w .interview-cover .info .s-info span { margin-right: 12px; } .wrapper .interview-w .interview-cover .info .breadcrumb { right: 15px; bottom: 20px; font-size: 9px; } .wrapper .interview-w .interview-cover .info .breadcrumb a { margin: 0 3px; } .wrapper .interview-w .content-w { padding: 20px 15px 40px; } .wrapper .interview-w .content-w .content .topic { font-size: 12px; padding-bottom: 20px; margin-bottom: 20px; } .wrapper .interview-w .content-w .content .row { margin-bottom: 20px; flex-direction: column; justify-content: flex-start; align-items: flex-start; font-size: 12px; line-height: 1.666; } .wrapper .interview-w .content-w .content .row .col.col-l { width: 100%; margin-bottom: 20px; } .wrapper .interview-w .content-w .content .row .col.col-l .rstt { font-size: 11px; line-height: 1.666; } .wrapper .interview-w .content-w .content .row .col.col-r { width: 100%; } .wrapper .interview-w .content-w .content .row .col .rtt { margin-bottom: 4px; } .wrapper .interview-w .content-w .content .row .col .r-cover-w { margin-top: 20px; } .wrapper .interview-w .content-w .content .row .col .r-cover-2-w { margin-top: 20px; flex-direction: column; justify-content: flex-start; } .wrapper .interview-w .content-w .content .row .col .r-cover-2-w img { width: 100%; margin-bottom: 20px; } .wrapper .interview-w .content-w .content .row .col .r-cover-2-w img:last-child { margin-bottom: 0; } .wrapper .interview-w .content-w .news-navs { margin: 30px auto 0; } .wrapper .interview-w .content-w .news-navs .btn-nav { font-size: 8px; font-weight: 500; } .wrapper .interview-w .content-w .news-navs .btn-nav .ar { width: 6px; } .wrapper .interview-w .content-w .news-navs .btn-more { padding: 3px 20px; font-size: 8px; font-weight: 500; } .wrapper .interview-w .recommend-prjs-w .btt { padding: 20px 15px; } .wrapper .interview-w .recommend-prjs-w .btt .tt { font-size: 16px; } .wrapper .interview-w .recommend-prjs-w .btt .btn-nav { font-size: 10px; } .wrapper .interview-w .recommend-prjs-w .btt .btn-nav img { height: 8px; margin-left: 6px; } .wrapper .interview-w .recommend-prjs-w .prjs-list { flex-direction: column; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item { width: 100%; padding-top: 62.4%; margin-right: 0; margin-bottom: 8px; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item:last-child { margin-bottom: 0; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item .info { padding: 0 20px 20px; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item .info .tt-en { font-size: 14px; margin-bottom: 6px; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item .info .tt-zh { font-size: 12px; line-height: 1.5; margin-bottom: 2px; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item .info .s-info { font-size: 10px; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item .info .s-info span { margin-right: 12px; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item .info .ar { height: 6px; right: 20px; bottom: 20px; } .wrapper .interview-w .recommend-prjs-w .prjs-list .item .info .tt-news { font-size: 14px; line-height: 1.28; } } /*# sourceMappingURL=jiumi.css.map */