xuchaoqing
/
fastadmin_materials_official


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304
							<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
        content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" />
    <meta name="renderer" content="webkit">
    <meta name="keywords" content="{:__lm($navCur,'keywords')}"/>
    <meta name="description" content="{:__lm($navCur,'description')}"/>
    <title>{:__lm($navCur,'seotitle')} - {$site.site_name}</title>
    <link rel="shortcut icon" href="{$site.logo|cdnurl}">
    <link rel="stylesheet" type="text/css" href="__CDN__/assets/addons/material/css/reset.css">
    <link rel="stylesheet" type="text/css" href="__CDN__/assets/addons/material/css/style.css">
    <link rel="stylesheet" type="text/css" href="__CDN__/assets/addons/material/css/swiper.min.css">
    <link rel="stylesheet" type="text/css" href="__CDN__/assets/addons/material/css/animate.min.css">
    <link rel="stylesheet" type="text/css" href="__CDN__/assets/addons/material/css/media.css">
    <script type="text/javascript" src="__CDN__/assets/addons/material/js/jquery.min.js"></script>
    <script type="text/javascript" src="__CDN__/assets/addons/material/js/swiper.min.js"></script>
    <script type="text/javascript" src="__CDN__/assets/addons/material/js/swiper.animate1.0.3.min.js"></script>
    <script type="text/javascript" src="__CDN__/assets/addons/material/js/wow.js"></script>
    <script type="text/javascript" src="__CDN__/assets/addons/material/js/jquery.counterup.min.js"></script>
    <script type="text/javascript" src="__CDN__/assets/addons/material/js/jquery.waypoints.min.js"></script>
    <script type="text/javascript" src="__CDN__/assets/addons/material/js/javascript.js"></script>
    <style>
        /* 公司简介样式 */
        .company-profile {           
          max-width: 1200px;
          margin: 80px auto 0;
      }
      
      .profile-header {
          margin-bottom: 40px;
      }
      
      .en-title {
          font-weight: 400;
          font-size: 30px;
          color: #737980;
          line-height: 44px;
          letter-spacing: 1px;
          margin-bottom: 5px;
      }
      
      .cn-title {
          font-size: 32px;
          color: #333;
          font-weight: 500;
          margin-top: 0;
      }
      
      .profile-content {
          position: relative; /* 添加这一行 */
          display: flex;
          align-items: stretch;
          margin-bottom: 80px;
      }
      
      .profile-left {
          flex: 1;
          display: flex;
          flex-direction: column;
          justify-content: flex-start;
      }        
      .profile-text {
          flex: 1;
          padding-right: 40px;
      }        
      .profile-text p {
          font-size: 16px;
          line-height: 1.8;
          color: #333;
          margin-bottom: 20px;
          text-align: justify;
      }
      .profile-image {
          position: relative;
          cursor: pointer;
      }
      
      .profile-image img {
          width: 100%;
          height: 100%;
          object-fit: cover;
          display: block;
      }
      
      .play-button {
          position: absolute;
          left: 50%;
          top: 50%;
          transform: translate(-50%, -50%);
          width: 64px;
          height: 64px;
          display: flex;
          align-items: center;
          justify-content: center;
          pointer-events: none;
      }
      
      .play-button img {
          width: 64px;
          height: 64px;
          opacity: 0.85;
      }
      
      .profile-image:hover .play-button img {
          opacity: 1;
      }
      
      /* 公司数据样式 */
      .company-data {
          width: 890px;
          height: 110px;
          background-color: #fff;
          box-shadow: 0 0 10px rgba(0,0,0,0.05);
          position: absolute;
          bottom: 40px;
      }
      
      .data-box {
          display: flex;
          justify-content: space-between;
          align-items: stretch;
          height: 100%;
      }
      
      .data-item {
          flex: 1 1 0;
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          position: relative;
          height: 110px;
      }
      
      .data-item:not(:last-child)::after {
          content: '';
          position: absolute;
          right: 0;
          top: 25%;
          height: 50%;
          width: 1px;
          background-color: #cfd2d6;
      }
      
      .data-number-unit {
          display: flex;
          align-items: flex-end;
          justify-content: center;
      }
      
      .data-item h3 {
          font-weight: 500;
          font-size: 40px;
          color: #DF0100;
          margin: 0;
          line-height: 1;
      }
      
      .data-unit {
          font-weight: 400;
          font-size: 12px;
          color: #8A9199;
          margin-left: 4px;
          margin-bottom: 2px;
      }
      
      .data-title {
          font-weight: 400;
          font-size: 12px;
          color: #737980;
          /* margin-top: 8px; */
      }

      .company-intro-section {
          max-width: 1200px;
          margin: 60px auto 0;
          padding: 0 20px;
      }

      .intro-paragraph {
          font-size: 16px;
          color: #333;
          line-height: 2;
          text-align: justify;
          margin-bottom: 40px;
      }

      .intro-images-row {
          display: flex;
          justify-content: space-between;
          gap: 40px;
          margin-bottom: 40px;
      }

      .intro-images-row img {
          width: 48%;
          height: 260px;
          object-fit: cover;
          border-radius: 6px;
          box-shadow: 0 2px 12px rgba(0,0,0,0.06);
      }

      /* .video-modal {
          position: fixed;
          left: 0; top: 0; right: 0; bottom: 0;
          z-index: 9999;
          display: flex;
          align-items: center;
          justify-content: center;
      }
      .video-modal-mask {
          position: absolute;
          left: 0; top: 0; right: 0; bottom: 0;
          background: rgba(0,0,0,0.7);
      }
      .video-modal-content {
          position: relative;
          z-index: 2;
          background: #000;
          border-radius: 8px;
          padding: 20px;
          box-shadow: 0 8px 32px rgba(0,0,0,0.3);
      }
      .video-modal-close {
          position: absolute;
          right: 16px;
          top: 8px;
          color: #fff;
          font-size: 32px;
          cursor: pointer;
          z-index: 10;
      }
      .video-modal video {
          display: block;
          background: #000;
          border-radius: 8px;
      } */
  </style>
</head>
<body>
<!--头部-->
{include file="header" /}
<!-- 栏目Banner -->
<div class="col-banner">
    <div class="section-banner">
        <img src="{$site.banner5|cdnurl}" alt="">
    </div>
</div>
<div class="container">
    <!-- 公司简介 -->
    <div class="company-profile">
       <div class="profile-content">
           <div class="profile-left">
               <div class="profile-header wow fadeInUp" data-wow-delay="0.5s">
                   <h2 class="en-title">COMPANY PROFILE</h2>
                   <h2 class="cn-title">{$site.ban5_t1}</h2>
               </div>
               <div class="profile-text wow fadeInUp" data-wow-delay="0.5s">
                {$about.about_content|default=''}       
               </div>
               
           </div>
           <div class="profile-image" data-video="file/dance.mp4">
               <img src="{$about.about_image|cdnurl}" alt="公司大楼">
               <!-- <div class="play-button">
                   <img src="images/projects/play-icon.png" alt="播放"> -->
               </div>
               {if condition="empty($about.about_video) neq true"}
               <a href="javascript:;" class="play-btn m-video ani" data-src="{$about.about_video|cdnurl}"><i></i></a>
               {/if}
           </div>         
       </div>
       <!-- 公司简介补充内容 -->
       <div class="company-intro-section wow fadeInUp" data-wow-delay="0.5s">
           {$about.about_bottom_content|default=''} 
       </div>
   </div>
</div>

<!--底部-->
{include file="footer" /}
<link rel="stylesheet" type="text/css" href="__CDN__/assets/addons/material/css/video.css">
<script type='text/javascript' src="__CDN__/assets/addons/material/js/video.js"></script>
<!-- <script type="text/javascript">
    var swiper = new Swiper('.swiper-container', {
        // autoplay: true, //自动滑动
        speed: 500,
        slidesPerView: 'auto',
        // centeredSlides: true,
        pagination: {
            el: '.swiper-pagination',
            type: 'progressbar',
        },
        navigation: {
            nextEl: '.develop-next',
            prevEl: '.develop-prev',
        },
    });
</script> -->
</body>
</html>