@charset "utf-8";
body {
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
    text-size-adjust: 100%;
    -moz-osx-font-smoothing: grayscale;
    -webkit-font-smoothing: antialiased;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    background-color: #fff;
    color: #212121;
    font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Droid Sans,Helvetica Neue,Helvetica,Arial,sans-serif;
    font-size: 14px;
    line-height: 1.15;
	max-width: 640px;
	margin: 0 auto;
	display: block;
}
ul {
    list-style-type: none;
}
header.on #logo{top:-10px}
header.on .language-switcher{margin-top:0}
.text-xl{position: relative;padding-left: 10px;}
/* 語言切換器樣式 */
		.language-switcher {
		    position: relative;
		    z-index: 1000;
		    /* margin-right: 20px; */
		    margin-top: 8px;
		}
		
		.language-switcher select {
		    /* background: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%); */
		    color: #2A3F54;
		    font-size: 14px;
		    font-weight: 500;
		    padding: 5px 10px;
		    border: 2px solid #e9ecef;
		    border-radius: 8px;
		    cursor: pointer;
		    transition: all 0.3s ease;
		    text-align: center;
		    text-align-last: center;
		    min-width: 100px;
		    appearance: none;
		    -webkit-appearance: none;
		    -moz-appearance: none;
		    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232A3F54' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6,9 12,15 18,9'%3e%3c/polyline%3e%3c/svg%3e");
		    background-repeat: no-repeat;
		    background-position: right 10px center;
		    background-size: 16px;
		    padding-right: 35px;
		}
		
		.language-switcher select:hover {
		    border-color: var(--accent-orange);
		    box-shadow: 0 4px 12px rgba(255,107,53,0.15);
		    transform: translateY(-1px);
		}
		
		.language-switcher select:focus {
		    outline: none;
		    border-color: var(--accent-orange);
		    box-shadow: 0 0 0 3px rgba(255,107,53,0.1);
		}
		
		.language-switcher select option {
		    text-align: center;
		    padding: 8px;
		    background: white;
		    color: #2A3F54;
		}
		
		/* 響應式設計 */
		@media (max-width: 768px) {
		    .language-switcher {
		        margin-right: 10px;
		        margin-top: 0;
		    }
		    
		    .language-switcher select {
		        font-size: 13px;
		        padding: 5px 0 5px 0;
		        min-width: 90px;
		        background-size: 14px;
		        padding-right: 25px;
		        /* color: #fff; */
		    }
		}
#page-top a {
  display: block;
  position: fixed;
	bottom: 50px;
  right: 40px;
  width: 50px;
  height: 50px;
	border-radius: 5px;
	background-color: #242636;
	background-image: url("../img/btn_pagetop_arrow.png");
	background-repeat: no-repeat;
	background-position: center;
  background-size: 20px auto;
  text-indent: -9999px;
  z-index: 9000;
}
#page-top a:hover {
  opacity: 0.8;
}
#page-top a {
  bottom: 70px;
  right: 5.128%;
  width: 30px;
  height: 30px;
  background-size: 10px auto, 100%;
}

#page-home a {
  display: block;
  position: fixed;
	bottom:110px;
  right: 40px;
  width: 50px;
  height: 50px;
	border-radius: 5px;
	background-color: #242636;
	background-image: url("../img/home.png");
	background-repeat: no-repeat;
	background-position: center;
  background-size: 20px auto;
  text-indent: -9999px;
  z-index: 9000;
}
#page-home a:hover {
  opacity: 0.8;
}
#page-home a {
  bottom:110px;
  right: 5.128%;
  width: 30px;
  height: 30px;
  background-size: 20px auto, 100%
}

.icon-required {
	display: inline-block;
	font-size: 12px; 
  font-weight: 400;
	margin-right: 5px;
	padding: 2px 8px 2px;
	background-color: #cf1126;
	color: #fff;
	vertical-align:middle;
	border-radius: 3px;
}

        .emline {
            position: absolute;
            left: 0;
            top: 50%;
            transform: translateY(-50%);
            width: 5px;
            height: 24px;
            background: #FF6B35;
            border-radius: 0 3px 3px 0;
        }
     .select-btn {
    		       display: block;
    		       width: 100%;
    		       background-color: #1E5631;
    		       color: white;
    		       text-align: center;
    		       padding: 0.2rem;
    		       font-size: 0.70rem;
    		       border-radius: 4px;
    		       text-decoration: none;
    		       transition: background-color 0.3s;
    		   }
    		   
    		 .select-btn:hover {
    		       background-color: #144223;
    		   }  
        
    
        
          .overlay {
            position: fixed;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: rgba(0, 0, 0, 0.85);
            display: flex;
            justify-content: center;
            align-items: center;
            z-index: 99999;
            opacity: 0;
            visibility: hidden;
            transition: opacity 0.3s ease;
            padding: 15px;
            overflow-y: auto;
            -webkit-overflow-scrolling: touch;
        }
        
           .overlay.active {
            opacity: 1;
            visibility: visible;
        }
        
         #overlay .modal {
            background: white;
            width: 100%;
            max-width: 500px;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 25px 50px rgba(0, 0, 0, 0.5);
            transform: translateY(20px);
            opacity: 0;
            transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
            max-height: 95vh;
            overflow-y: auto;
        }
        
       
        
        #overlay.active .modal {
            transform: translateY(0);
            opacity: 1;
        }
        #overlay  .modal-header {
            background: linear-gradient(to right, #2b5876, #4e4376);
            color: white;
            padding: 22px 20px;
            position: relative;
            text-align: center;
        }
        
         #overlay .modal-header h2 {
            font-size: 1.6rem;
            font-weight: 600;
        }
        
        #overlay .close-btn {
            position: absolute;
            top: 18px;
            right: 18px;
            background: rgba(255, 255, 255, 0.2);
            border: none;
            width: 36px;
            height: 36px;
            border-radius: 50%;
            color: white;
            font-size: 1.2rem;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.3s ease;
        }
        
         #overlay .close-btn:hover {
            background: rgba(255, 255, 255, 0.3);
            transform: rotate(90deg);
        }
        
        #overlay  .modal-body {
            padding: 25px 20px;
            color: #333;
        }
        
       #overlay   .form-group {
            margin-bottom: 22px;
            text-align: left;
        }
        
       #overlay   .form-group label {
            display: block;
            margin-bottom: 8px;
            font-weight: 600;
            color: #2c3e50;
            font-size: 0.95rem;
        }
        
       #overlay   .form-control {
            width: 100%;
            padding: 15px;
            border: 2px solid #e1e5eb;
            border-radius: 12px;
            font-size: 1rem;
            transition: all 0.3s ease;
            background: #f8f9fa;
            appearance: none;
            -webkit-appearance: none;
        }
        
        #overlay  .form-control:focus {
            border-color: #3498db;
            outline: none;
            box-shadow: 0 0 0 3px rgba(52, 152, 219, 0.2);
            background: white;
        }
        
         #overlay .select-car {
            display: flex;
            gap: 7px;
            margin-top: 8px;
            overflow-x: auto;
            padding-bottom: 5px;
            -webkit-overflow-scrolling: touch;
        }
        
         #overlay .select-car::-webkit-scrollbar {
            height: 5px;
        }
        
         #overlay .select-car::-webkit-scrollbar-thumb {
            background: #ccc;
            border-radius: 10px;
        }
        
        #overlay  .car-option {
            min-width: 120px;
            border: 2px solid #eee;
            border-radius: 12px;
            padding: 15px 12px;
            cursor: pointer;
            transition: all 0.3s ease;
            text-align: center;
            flex-shrink: 0;
        }
        
        #overlay  .car-option:hover, .car-option:active {
            border-color: #3498db;
            background: #f0f8ff;
        }
        
        #overlay  .car-option.active {
            border-color: #3498db;
            background: #e1f0fa;
            box-shadow: 0 5px 15px rgba(52, 152, 219, 0.2);
        }
        
        #overlay  .car-icon {
            font-size: 2.3rem;
            margin-bottom: 5px;
            color: #3498db;
        }
        
       #overlay   .car-name {
            font-weight: 600;
            margin-bottom: 4px;
            font-size: 0.95rem;
        }
        
         #overlay .car-detail {
            font-size: 0.85rem;
            color: #777;
        }
        
          #overlay .datetime-container {
            display: flex;
            gap: 15px;
        }
        
        #overlay  .datetime-container .form-group {
            flex: 1;
        }
        
        #overlay  .modal-footer {
            padding: 20px;
            background: #f8f9fa;
            display: flex;
            justify-content: space-between;
            gap: 12px;
            border-top: 1px solid #eee;
        }
        
        #overlay  .btn {
            padding: 15px 25px;
            border-radius: 12px;
            font-size: 1.05rem;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.3s ease;
            border: none;
            flex: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
        }
        
        #overlay  .btn-cancel {
            background: #f1f3f5;
            color: #495057;
            border: 1px solid #dee2e6;
        }
        
       #overlay   .btn-cancel:hover, .btn-cancel:active {
            background: #e9ecef;
        }
        
        #overlay  .btn-submit {
            background: linear-gradient(to right, #00b09b, #96c93d);
            color: white;
            box-shadow: 0 4px 12px rgba(150, 201, 61, 0.3);
        }
        
        #overlay  .btn-submit:hover, .btn-submit:active {
            transform: translateY(-2px);
            box-shadow: 0 6px 15px rgba(150, 201, 61, 0.4);
        }
        
         #overlay .btn-submit:disabled {
            background: #ced4da;
            cursor: not-allowed;
            transform: none;
            box-shadow: none;
        }
        
         #overlay .error-message {
            color: #e74c3c;
            font-size: 0.85rem;
            margin-top: 6px;
            display: none;
        }
        
        #overlay  .form-group.invalid .error-message {
            display: block;
        }
        
         #overlay .form-group.invalid .form-control {
            border-color: #e74c3c;
            background: #fff5f5;
        }
        
          .success-message {
            position: fixed;
            top: -100px;
            left: 50%;
            transform: translateX(0) translateY(-100px);
            background: #2ecc71;
            color: white;
            padding: 18px 35px;
            border-radius: 12px;
            box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
            transition: transform 0.5s ease;
            z-index: 2000;
            font-weight: 500;
            display: flex;
            align-items: center;
            gap: 10px;
            max-width: 90%;
            text-align: center;
        }
        
       /*   .success-message.show {
            transform: translateX(-50%) translateY(0);
        } */
        
        /* 移动端优化 */
        @media (max-width: 576px) {
          
            
            #overlay  .subtitle {
                font-size: 1rem;
            }
            
            #overlay  .modal-header {
                padding: 2px 15px;
            }
            
            #overlay  .modal-header h2 {
                font-size: 1.4rem;
            }
            
            #overlay  .close-btn {
                top: 15px;
                right: 15px;
                width: 32px;
                height: 32px;
            }
            
            #overlay  .modal-body {
                padding: 8px 15px;
            }
            
            #overlay  .form-group {
                margin-bottom: 10px;
            }
            
            #overlay  .form-control {
                padding: 6px 0;
                font-size: 14px;
            }
            
            #overlay  .datetime-container {
                flex-direction: column;
                gap: 0;
            }
            
            #overlay  .car-option {
                min-width: 110px;
                padding: 6px 6px;
            }
            
            #overlay  .car-icon {
                font-size: 2rem;
            }
            
             #overlay .modal-footer {
                padding: 15px;
                flex-direction: column;
            }
            
            #overlay  .btn {
                width: 100%;
                padding: 16px;
            }
            
            #overlay .btn-open {
                padding: 16px;
                max-width: 100%;
            }
        }
        
        @media (max-width: 380px) {
             #overlay .car-option {
                min-width: 100px;
            }
        }
        
        /* 防止iOS输入框缩放 */
        @media (max-width: 480px) {
            #overlay  input,  #overlay select,   #overlay textarea {
                font-size: 14px !important;
            }
        }
        
         #overlay input[type="date"]::-webkit-calendar-picker-indicator,
         #overlay   input[type="time"]::-webkit-calendar-picker-indicator {
            cursor: pointer;
            padding: 5px;
            border-radius: 4px;
            background: #f0f4f8;
        }
        
         #overlay select {
            background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23333' viewBox='0 0 16 16'%3E%3Cpath d='M8 11L3 6h10z'/%3E%3C/svg%3E");
            background-repeat: no-repeat;
            background-position: right 15px center;
            background-size: 12px;
            padding-right: 40px;
        }

		  /* 预约模块样式 */
		        .reservation-module .collapsible-content {
		            display: none;
		            padding: 0;
		            transition: all 0.3s ease;
		        }
		        
		        .reservation-module .collapsible-content.expanded {
		            display: block;
		            padding: 15px;
		        }
		        
		        .reservation-toggle {
		            cursor: pointer;
		            display: flex;
		            align-items: center;
		            justify-content: space-between;
		            margin: 0;
		            padding-top: 10px;
		        }
		        
		        .toggle-icon {
		            transition: transform 0.3s ease;
		            font-size: 0.9rem;
		        }
		        
		        .reservation-toggle.active .toggle-icon {
		            transform: rotate(180deg);
		        }
		        
		        /* 预约表单样式 */
		        .reservation-form {
		            background: white;
		            border-radius: 10px;
		            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
		            padding: 10px;
		        }
		        
		        .reservation-form .form-group {
		            margin-bottom: 10px;
		        }
		        
		        .reservation-form label {
		            display: block;
		            margin-bottom: 0.5rem;
		            font-weight: 600;
		            color: var(--primary-blue);
		        }
		        
		        .reservation-form input,
		        .reservation-form select,
		        .reservation-form textarea {
		            width: 96%;
		            padding: 8px 5px;
		            border: 1px solid #ddd;
		            border-radius: 5px;
		            font-size: 1rem;
		            background: #f9f9f9;
		        }
		        
		        .reservation-form select {
		            appearance: none;
		            background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
		            background-repeat: no-repeat;
		            background-position: right 1rem center;
		            background-size: 1em;
		            width: 99%;
		        }
		        
		        #reserveBtn {
		            width: 93%;
		            /* padding: 1rem; */
		            background: var(--accent-orange);
		            color: white;
		            border: none;
		            border-radius: 8px;
		            /* font-size: 1.2rem; */
		            font-weight: bold;
		            cursor: pointer;
		            transition: background 0.3s;
		            margin-top: 1rem;
		            padding: 10px 0;
		            height: 40px;
		            line-height: 20px;
		            letter-spacing: 0.2rem;
		        }
		        
		        #reserveBtn:hover {
		            background: #e05a2a;
		        }
			
		.driver-selection {
		       max-width: 1200px;
		       margin: 0 auto;
		       /* margin-bottom: 2%; */
		       padding: 10px;
		   }
		   
		   .driver-selection h3 {
		       /* padding: 15px 0 20px 0; */
		   }
		   
		   .driver-selection .driver-grid {
		       display: grid;
		       grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
		       gap: 1rem;
		       max-width: 1200px;
		       margin: 0 auto;
		   }
		   
		   .driver-selection .driver-card {
		       border: 1px solid #ddd;
		       border-radius: 8px;
		       overflow: hidden;
		       transition: transform 0.3s, box-shadow 0.3s;
		       position: relative;
		   }
		   
		   .driver-selection .driver-card:hover {
		       transform: translateY(-5px);
		       box-shadow: 0 8px 20px rgba(0,0,0,0.12);
		   }
		   
		   .driver-selection .driver-avatar {
		       width: 100%;
		       height: 220px;
		       object-fit: cover;
		       transition: transform 0.5s;
		   }
		   
		   .driver-selection .driver-card:hover .driver-avatar {
		       transform: scale(1.03);
		   }
		   
		   .driver-selection .relative {
		       position: relative;
		       overflow: hidden;
		   }
		   
		   .driver-selection .absolute {
		       position: absolute;
		   }
		   
		   .driver-selection .top-3 {
		       bottom: 0;
		       width: 100%;
		       text-align: center;
		   }
		   
		   .driver-selection .left-3 {
		       left: 0;
		   }
		   
		   .driver-selection .bg-primary-green {
		       background-color: #1E5631;
		   }
		   
		   .driver-selection .text-white {
		       color: #020202;
		   }
		   
		   .driver-selection .text-xs {
		       font-size: 0.75rem;
		   }
		   
		   .driver-selection .font-medium {
		       font-weight: 500;
		   }
		   
		   .driver-selection .px-2 {
		       padding-left: 0;
		       padding-right: 0;
		   }
		   
		   .driver-selection .py-1 {
		       /* padding-top: 0.25rem; */
		       /* padding-bottom: 0.25rem; */
		   }
		   
		   .driver-selection .rounded {
		       border-radius: 0.25rem;
		   }
		   
		   /* 新增：半透明背景样式 */
		   .driver-selection .bg-overlay {
		       background-color: rgb(255 255 255 / 64%);
		       padding: 6px;
		       border-radius: 4px;
		       line-height: 20px;
		   }
		   
		   .driver-selection .driver-info {
		       padding: .5rem .8rem;
		   }
		   
		   .driver-selection h3 {
		       /* font-size: 1.125rem; */
		       margin-bottom: 0rem;
		       line-height: 1.4;
		       color: #333;
		   }
		   
		   .driver-selection .driver-name {
		       display: flex;
		       align-items: center;
		       margin: 0.1rem 0 0.2rem 0;
		   }
		   
		   .driver-selection .driver-name h3 {
		       /* margin-right: 0.5rem; */
		       /* margin-bottom: 0; */
		   }
		   
		   .driver-selection .driver-tag {
		       background-color: #FF6B35;
		       color: white;
		       font-size: 0.75rem;
		       padding: 0.15rem 0.5rem;
		       border-radius: 4px;
		   }
		   
		   .driver-selection .desc,.driver-selection .cardesc {
		       font-size: 0.75rem;
		       color: #666;
		       margin-bottom: 0.1rem;
		       line-height: 1.4;
		       /* display: -webkit-box; */
		       /* -webkit-box-orient: vertical; */
		       /* -webkit-line-clamp: 2; */ /* 控制显示的行数 */
		       /* overflow: hidden; */
		       /* text-overflow: ellipsis; */
		       /* height: 38px; */
		       white-space: normal; /* 允许文本在空格处换行 */
		       white-space: nowrap; /* 禁止文本换行 */
		       overflow: hidden; /* 隐藏超出范围的内容 */
		       text-overflow: ellipsis; /* 使用省略号 */
		       overflow-wrap: break-word; /* 允许单词内的断行 */
		   }
		   
		   .driver-selection .driver-rating {
		       margin-bottom: 0.25rem;
		   }
		   
		   .driver-selection .driver-rating .text-primary {
		       color: #FF6B35;
		       font-size: 1rem;
		   }
		   
		   .driver-selection .commit {
		       font-size: 0.875rem;
		       color: #666;
		       margin-left: 0.25rem;
		   }
		   
		   .driver-selection .driver-stats {
		       display: flex;
		       justify-content: space-between;
		       margin-bottom: 0.75rem;
		   }
		   
		   .driver-selection .stat-item {
		       text-align: center;
		   }
		   
		   .driver-selection .stat-value {
		       font-weight: bold;
		       color: #333;
		       display: block;
		   }
		   
		   .driver-selection .stat-label {
		       font-size: 0.75rem;
		       color: #666;
		   }
		   
		   .driver-selection .driver-languages {
		       display: flex;
		       flex-wrap: wrap;
		       margin-bottom: 1rem;
		   }
		   
		   .driver-selection .language-tag {
		       background-color: #f0f0f0;
		       color: #666;
		       font-size: 0.75rem;
		       padding: 0.25rem 0.5rem;
		       border-radius: 4px;
		       margin-right: 0.5rem;
		       margin-bottom: 0.5rem;
		   }
		   
		   .driver-selection .btn-select {
		       display: block;
		       width: 100%;
		       background-color: #1E5631;
		       color: white;
		       text-align: center;
		       padding: 0.75rem 0;
		       border-radius: 4px;
		       text-decoration: none;
		       transition: background-color 0.3s;
		   }
		   
		   .driver-selection .btn-select:hover {
		       background-color: #144223;
		   }
		   
		   
/*拼车*/
  /* 卡片通用样式 */
        .xc-card {
            background: var(--card-bg);
            border-radius: 12px;
            box-shadow: 0 4px 10px rgba(0,0,0,0.05);
            margin-bottom: 20px;
            overflow: hidden;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        
        .xc-card:hover {
            transform: translateY(-3px);
            box-shadow: 0 6px 15px rgba(0,0,0,0.1);
        }
        
        .card-header {
            padding: 0 10px 0 10px;
            background: #f8f9fa;
            border-bottom: 1px solid var(--border);
            display: flex;
            align-items: center;
            cursor: pointer;
        }
        
        .card-header h2 {
            font-size: 1.15rem;
            color: var(--primary);
            margin-left: 12px;
            font-weight: 600;
        }
        
        .card-body {
            padding: 5px 10px;
        }
        
        /* 路线信息 */
        .route-info {
            display: flex;
            flex-direction: column;
            margin-bottom: 20px;
        }
        
        .route-point {
            display: flex;
            align-items: flex-start;
            padding: 15px 0;
            position: relative;
        }
        
        .route-point:not(:last-child)::after {
            content: "";
            position: absolute;
            left: 18px;
            top: 51px;
            height: calc(100% - 35px);
            width: 2px;
            background: #FF6B35;
            opacity: 0.4;
        }
        
        .location-icon {
            width: 36px;
            height: 36px;
            border-radius: 50%;
            background: #ff8c5d;
            display: flex;
            align-items: center;
            justify-content: center;
            margin-right: 15px;
            flex-shrink: 0;
        }
        
        .location-icon i {
            font-size: 1.2rem;
            color: #fff;
        }
        
        .location-content {
            flex: 1;
        }
        
        .location-name {
            font-weight: 600;
            font-size: 1.05rem;
            margin-bottom: 4px;
            color: var(--text);
        }
        
        .location-time {
            font-size: 0.95rem;
            color: var(--primary);
            font-weight: 500;
            margin-bottom: 5px;
            /* background: #ff000045; */
        }
        
        .location-address {
            font-size: 0.9rem;
            color: var(--text-light);
        }
        
        /* 详情网格 */
        .details-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
            gap: 10px;
            margin: 10px 0;
        }
        
        .detail-item {
            display: flex;
            align-items: center;
            padding: 5px 10px;
            background: #f8f9fa;
            border-radius: 10px;
            border-left: 3px solid var(--primary-light);
        }
        
        .detail-icon {
            font-size: 1.4rem;
            color: var(--primary);
            margin-right: 12px;
            min-width: 30px;
            text-align: center;
        }
        
        .detail-content h4 {
            font-size: 14px;
            color: var(--text-light);
            margin-bottom: 0;
            margin-top: 5px;
        }
        
        .detail-content p {
            font-size: 14px;
            font-weight: 600;
            color: var(--text);
            padding: 0;
            margin: 5px 0;
        }
        
        /* 车主信息 */
        .driver-info {
            /* display: flex; */
            align-items: center;
            padding: 15px;
            border-bottom: 1px solid var(--border);
        }
        
        .driver-avatar {
            width: 70px;
            height: 70px;
            border-radius: 50%;
            overflow: hidden;
            /* margin-right: 15px; */
            border: 2px solid var(--primary);
            flex-shrink: 0;
        }
        
        .driver-avatar img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        
        .driver-details {
            flex: 1;
        }
        
        .driver-name {
            font-size: 1.15rem;
            font-weight: 600;
            /* margin-bottom: 5px; */
            color: var(--text);
        }
        
        .driver-rating {
            color: #ffc107;
            /* margin-bottom: 8px; */
            /* display: flex; */
            align-items: center;
            width: 100%;
            margin-top: 10px;
        }
        
        .driver-rating span {
            color: var(--text-light);
            font-size: 0.78rem;
            /* margin-left: 8px; */
        }
        
        .driver-tags {
            display: flex;
            flex-wrap: wrap;
            gap: 6px;
            margin-top: 10px;
        }
        
        .tag {
            background: #e1f0f0;
            color: var(--primary);
            padding: 4px 10px;
            border-radius: 16px;
            font-size: 0.8rem;
        }
        
        /* 乘客列表 */
        .passengers {
            display: grid;
            grid-template-columns: repeat(auto-fill, minmax(54px, 1fr));
            gap: 10px 0px;
            padding: 0 10px 2px 10px;
        }
        
        .passenger {
            text-align: center;
        }
        
        .passenger-avatar {
            width: 40px;
            height: 40px;
            border-radius: 50%;
            overflow: hidden;
            margin: 0 auto 7px;
            border: 2px solid var(--primary);
        }
        
        .passenger-avatar img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        
        .passenger-name {
            font-weight: 500;
            font-size: 0.8rem;
        }
        
        /* 预订面板 */
        .booking-panel {
            display: flex;
            flex-direction: column;
            padding: 20px;
            background: #f0f8fa;
            gap: 15px;
        }
        
        .price-container {
            display: flex;
            justify-content: space-between;
            align-items: center;
        }
        
        .price-info {
            font-size: 1.5rem;
            font-weight: 700;
            color: var(--secondary);
        }
        
        .price-info span {
            font-size: 0.9rem;
            color: var(--text-light);
            font-weight: normal;
        }
        
        .seats-info {
            font-size: 1rem;
            color: var(--text);
            background: rgba(30, 107, 138, 0.1);
            padding: 5px 12px;
            border-radius: 20px;
            font-weight: 500;
        }
        
        .btn-container {
            display: flex;
            gap: 10px;
        }
        
        .btn {
            padding: 14px 20px;
            border: none;
            border-radius: 10px;
            font-size: 1rem;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.3s ease;
            flex: 1;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
        }
        
        .btn i {
            font-size: 1.1rem;
        }
        
        .btn-primary {
            background: linear-gradient(135deg, var(--primary-light), var(--primary));
            color: white;
            box-shadow: 0 4px 10px rgba(44, 156, 156, 0.25);
        }
        
        .btn-primary:hover {
            box-shadow: 0 6px 15px rgba(44, 156, 156, 0.35);
        }
        
        .btn-outline {
            background: transparent;
            border: 1px solid var(--primary);
            color: var(--primary);
        }
        
        .btn-outline:hover {
            background: rgba(30, 107, 138, 0.05);
        }
        
        /* 折叠内容 */
        .collapsible-content {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease;
        }
        
        .collapsible-content.expanded {
            max-height: 1000px;
        }
        
        /* 底部信息 */
        .info-note {
            text-align: center;
            padding: 15px;
            color: var(--text-light);
            font-size: 0.85rem;
            margin-top: 10px;
            background: #f8f9fa;
            border-radius: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            gap: 8px;
        }
        
        /* 折叠指示器 */
        .collapse-icon {
            margin-left: auto;
            transition: transform 0.3s ease;
        }
        
        .card-header.active .collapse-icon {
            transform: rotate(180deg);
        }
        
        /* 响应式设计 */
        @media (min-width: 576px) {
            body {
                padding: 0;
                font-size: 14px;
            }
            
            .header {
                padding: 30px 20px;
            }
            
            .header h1 {
                font-size: 1.8rem;
            }
            
            .header p {
                font-size: 1.05rem;
            }
            
            .card-header {
                padding: 18px 25px;
            }
            
            .card-header h2 {
                font-size: 1.25rem;
            }
            
            .card-body {
                padding: 25px;
            }
            
            .btn {
                padding: 14px 25px;
            }
            
            .btn-container {
                gap: 15px;
            }
            
            .booking-panel {
                flex-direction: row;
                justify-content: space-between;
                align-items: center;
            }
            
            .price-container {
                flex-direction: column;
                align-items: flex-start;
                gap: 5px;
            }
            
            .passengers {
               
                display: grid;
                grid-template-columns: repeat(auto-fill, minmax(54px, 1fr));
                gap: 15px 10px;
                padding: 0 10px 15px 10px;
            }
            
            .passenger-avatar {
                width: 45px;
                height: 45px;
            }
        }
        
        @media (min-width: 768px) {
            .route-info {
                flex-direction: row;
                justify-content: space-between;
                margin-bottom: 30px;
            }
            
            .route-point {
                flex-direction: column;
                text-align: center;
                align-items: center;
                padding: 0 15px;
                flex: 1;
            }
            
            .route-point:not(:last-child)::after {
                left: 50%;
                top: 35px;
                height: 2px;
                width: calc(100% - 70px);
                transform: translateX(50%);
            }
            
            .location-icon {
                margin-right: 0;
                margin-bottom: 12px;
            }
            
            .driver-info {
                padding: 20px;
            }
            
            .details-grid {
                grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
                gap: 20px;
                margin: 25px 0;
            }
            
            .price-info {
                font-size: 1.8rem;
            }
        }
        
        /* 动画效果 */
        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(10px); }
            to { opacity: 1; transform: translateY(0); }
        }
        
        .card {
            animation: fadeIn 0.5s ease forwards;
        }
        
        .card:nth-child(2) { animation-delay: 0.1s; }
        .card:nth-child(3) { animation-delay: 0.2s; }
        .card:nth-child(4) { animation-delay: 0.3s; }
        .card:nth-child(5) { animation-delay: 0.4s; }
.mb-popular-city__title {
    font-size: 18px;
    line-height: 1.5;
    font-weight: 600;
    color: #212121;
    padding: 0 0 10px
}

.mb-popular-city__item {
    height: 187px;
    border-radius: 12px;
    background-color: #fff;
    position: relative
}

.mb-popular-city__link {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}

.mb-popular-city__image {
    width: 100%;
    height: 88px;
    border-radius: 12px 12px 0 0;
    position: relative;
    background-size: cover;
    background-position: 50%
}

.mb-popular-city__counts {
    font-size: 12px;
    line-height: 1.5;
    font-weight: 400;
    color: #fff;
    padding: 1.5px 6px;
    border-radius: 99rem;
    background-color: rgba(0,0,0,.6);
    display: inline-block;
    position: absolute;
    bottom: 10px;
    left: 10px
}

.mb-popular-city__name {
    font-size: 14px;
    line-height: 1.5;
    font-weight: 500;
    height: 30px;
    margin-top: 10px;
    padding: 0 12px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    word-break: break-word
}

.mb-popular-city__price {
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    -webkit-flex-direction: column;
    flex-direction: column;
    padding: 0 12px
}

.mb-popular-city__price em {
    font-size: 12px;
    line-height: 1.5;
    font-weight: 400;
    color: #757575;
    font-style: normal
}

.mb-popular-city__price span {
    font-size: 14px;
    line-height: 1.5;
    font-weight: 500;
    color: #212121;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden
}

.mb-popular-city .klk-card-swiper-items-wrapper {
    overflow: hidden
}

.mb-popular-city .klk-card-swiper-items {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -ms-flex-wrap: nowrap;
    -webkit-flex-wrap: nowrap;
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    padding: 0 0 10px;
    margin-bottom: -20px
}
.enterArea {
    margin: 5px 20px 25px
}

.enterBtnArea ul {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.enterBtnArea ul li {
    width: 33.3%;
    box-sizing: border-box;
    margin: 3px 0
}



.enterBtnArea ul li:nth-child(5) {
    /* margin-left: calc((100% - 75%)/ 2); */
}

.enterBtnArea ul li a {
    display: block;
    padding: 10px;
    margin: 0 2px;
    border-radius: 5px;
    text-align: center;
    box-sizing: border-box;
    font-size: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; /* 禁止文本换行 */
    overflow: hidden; /* 隐藏溢出的内容 */
    text-overflow: ellipsis; /* 显示省略符号 */
}
.enterBtn a,.enterBtnArea ul li a {
    background: #f69924;
    color: #fff;
    font-weight: 700;
    text-decoration: none
}
#about-site {
    /* margin-top: 20px; */
    margin-bottom: 20px;
    padding: 0 10px;
}

#about-site section {
    padding: 10px 0;
}

#about-site strong {
    font-weight: 700;
    color: #666
}

#about-site h3 {
    padding: 5px;
    /* background: #f7eee6; */
    /* font-weight: 400; */
    /* color: #683C12; */
}

#about-site h4 {
    margin-bottom: 5px;
    padding: 0 0 1px 1px;
    border-bottom: solid 1px #555;
    color: #555;
    line-height: 30px;
    font-size: 16px;
}

#about-site h4::first-letter {
    font-size: 1.3em
}

#about-site p {
    margin: 0 3px;
    line-height: 1.5;
    color: #555;
    font-size: 14px;
    font-weight: normal;
}

#about-site p:not(:last-child) {
    margin-bottom: 10px
}

#about-site section>section {
    padding: 5px 5px 10px
}

#about-site h5 {
    display: flex;
    -weblit-flex-flow: row nowrap;
    -webkit-flex-flow: row nowrap;
    -ms-flex-flow: row nowrap;
    flex-flow: row nowrap;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-align-content: center;
    -ms-flex-line-pack: center;
    align-content: center;
    margin-bottom: 5px
}

#about-site h5::before {
    content: "";
    display: inline-block;
    width: .4em;
    height: .4em;
    margin-right: 5px;
    border-style: solid;
    border-width: 0 2px 2px 0;
    border-color: transparent #555 #555 transparent;
    -webkit-transform: rotate(45deg) translate(-12.5%,-25%);
    -ms-transform: rotate(45deg) translate(-12.5%,-25%);
    transform: rotate(45deg) translate(-12.5%,-25%)
}

.enterBtn a {
    display: block;
    margin: 20px;
    padding: 3px;
    font-size: 20px;
    border-radius: 5px;
    box-shadow: 0 0 10px 0 rgba(0,0,0,.1)
}

.enterBtn span {
    display: block;
    padding: 20px 10px;
    border: 1px solid #f3dcdc;
    border-radius: 5px;
    text-align: center;
    line-height: 1.1
}
#translate{display: none;}
.carpool-list {
        max-width: 1200px;
        margin: 0 auto;
        /* margin-bottom: 2%; */
        padding: 10px;
    }
    
    .carpool-list h3 {
        padding: 0;
    }
    
    .carpool-list .driver-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
        gap: 1rem;
        max-width: 640px;
        margin: 0 auto;
    }
    
    .carpool-list .driver-card {
        border: 1px solid #ddd;
        border-radius: 8px;
        overflow: hidden;
        transition: transform 0.3s, box-shadow 0.3s;
        position: relative;
    }
    
    .carpool-list .driver-card:hover {
        transform: translateY(-5px);
        box-shadow: 0 8px 20px rgba(0,0,0,0.12);
    }
    
    .carpool-list .driver-img {
        width: 100%;
        height: 180px;
        object-fit: cover;
        transition: transform 0.5s;
    }
    
    .carpool-list .driver-card:hover .driver-img {
        transform: scale(1.03);
    }
    
    .carpool-list .relative {
        position: relative;
        overflow: hidden;
    }
    
    .carpool-list .absolute {
        position: absolute;
    }
    
    .carpool-list .top-3 {
        top: 0.75rem;
    }
    
    .carpool-list .left-3 {
        left: 0.75rem;
    }
    
    .carpool-list .bg-primary-green {
        background-color: #1E5631;
    }
    
    .carpool-list .text-white {
        color: #FF6B35;
    }
    
    .carpool-list .text-xs {
        font-size: 0.75rem;
    }
    
    .carpool-list .font-medium {
        font-weight: 500;
    }
    
    .carpool-list .px-2 {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    
    .carpool-list .py-1 {
        padding-top: 0.25rem;
        padding-bottom: 0.25rem;
    }
    
    .carpool-list .rounded {
        border-radius: 0.25rem;
    }
    
    .carpool-list .driver-info {
        padding: .5rem .6rem;
    }
    
    .carpool-list h3 {
        font-size: 1.125rem;
        /* margin-bottom: 0.5rem; */
        /* line-height: 1.4; */
        color: #333;
    }
    
    .carpool-list .desc {
        font-size: 0.875rem;
        color: #666;
        margin-top: .5rem;
        line-height: 1.4;
    }
    
    .carpool-list .desktop_activityCard__price_G6YKz {
        font-size: 1.125rem;
        line-height: 1.5;
        display: flex;
        align-items: center;
        /* margin-bottom: 0.5rem; */
    }
    
    .carpool-list .desktop_activityCard__price_num_l8-Yc {
        font-weight: bold;
        color: #333;
    }
    
    .carpool-list .desktop_activityCard__price_icon_2P1Wv {
        margin-left: 0.75rem;
        font-size: 0.875rem;
        color: #666;
    }
    
    .carpool-list .text-primary {
        color: #FF6B35;
    }
    
    .carpool-list .driver-rating {
        margin-bottom: 0.5rem;
    }
    
    .carpool-list .commit {
        font-size: 0.875rem;
        color: #666;
        margin-left: 0.25rem;
    }
    
    .carpool-list .desktop_activityCard__start_time_3HepX {
        font-size: 0.875rem;
        color: #757575;
        display: flex;
        align-items: center;
    }
    
    .carpool-list .bg-success-green {
        background-color: #4CAF50;
    }
    
    .carpool-list .rounded-full {
        border-radius: 9999px;
    }
    
    .carpool-list .ml-2 {
        margin-left: 0.5rem;
    }
    
		   .more-link {
		        color: #ffffff;
		        text-decoration: none;
		        font-size: 1rem;
		        /* display: flex; */
		        align-items: center;
		        transition: color 0.3s;
		        float: right;
		        /* line-height: 26px; */
		    }
		    
		    .more-link:hover {
		        color: #144223;
		    }
		    
		   .more-link i {
		        margin-left: 0.25rem;
		        font-size: 0.75rem;
		    }
		    
			
.m-footer {
    position: fixed;
    bottom: 10px;
    z-index: 1000;
    text-align: center;
    font-size: 14px;
    color: #fff;
    /* height: 35px; */
    line-height: 35px;
    width: 100%;
    background: #ffffffab;
    padding: 10px;
    max-width: 640px;
}

.m-footer .item {
    display: block;
    width: auto;
    height: auto
}

.m-footer .item-l {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    flex: 1;
    width: 33.3%;
    height: auto;
    color: #fff;
    line-height: 16px;
    padding: 10px 0;
    background-color: #0e74d8;
    float: left;
    /* border-radius: 10px; */
    border-radius: 0 10px 10px 0;
}
.foot-m{background-color: #ff5500!important;border-radius: 0 10px 10px 0;}
.foot-r{background-color: #6fb1f2;}
.m-footer .item-r {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    flex: 1;
    width: 100%;
    height: auto;
    color: #fff;
    background-color: #3b5b7b
}

.m-footer .item-r.soldout {
    background-color: #cacaca
}

.m-footer .ico-item {
    width: 54px;
    height: 48px;
    color: #00bcd4;
    padding-top: 6px;
    position: relative
}

.m-footer .ico-item::after {
    pointer-events: none;
    position: absolute;
    z-index: 999;
    top: 0;
    left: 0;
    overflow: hidden;
    content: "\0020";
    border-color: #ddd;
    border-style: solid;
    border-width: 1px 1px 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0
}
 /* 弹窗样式 */
        .popup-mask {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.5);
            display: none;
            z-index: 1000;
        }
        
        .popup-container {
            position: fixed;
            bottom: 0;
            left: 0;
            width: 100%;
            height: 83vh; /* 占据屏幕80%高度 */
            background: white;
            transform: translateY(100%);
            transition: transform 0.3s ease-out;
            z-index: 1001;
            box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.2);
        }
        
        .popup-container.active {
            transform: translateY(0);
        }
        
        .popup-iframe {
            width: 100%;
            height: calc(100% - 40px); /* 减去关闭按钮高度 */
            border: none;
        }
        
        .close-btn {
            width: 100%;
            height: 40px;
            background: #f0f0f0;
            border: none;
            border-top: 1px solid #ddd;
            font-size: 16px;
            cursor: pointer;
        }
		
		  /* 顶部介绍区域 */
		        .profile-header {
		            position: relative;
		            padding: 20px 15px 15px 20px;
		            background: linear-gradient(120deg, #1e88e5 0%, #0d47a1 100%);
		            color: white;
		            border-radius: 0 0 12% 12%;
		            overflow: hidden;
		            margin-bottom: 8px;
		        }
		        
		        .profile-header::before {
		            content: '';
		            position: absolute;
		            top: -50px;
		            right: -50px;
		            width: 150px;
		            height: 150px;
		            border-radius: 50%;
		            background: rgba(255, 255, 255, 0.1);
		        }
		        
		        .profile-header::after {
		            content: '';
		            position: absolute;
		            bottom: -80px;
		            left: -30px;
		            width: 200px;
		            height: 200px;
		            border-radius: 50%;
		            background: rgba(255, 255, 255, 0.08);
		        }
		        
		        .profile-info {
		            position: relative;
		            z-index: 2;
		            display: flex;
		            align-items: flex-start;
		        }
		        
		        .avatar-container {
		            position: relative;
		            margin-right: 20px;
		        }
		        
		        .avatar {
		            width: 100px;
		            height: 100px;
		            border-radius: 50%;
		            border: 4px solid rgba(255, 255, 255, 0.3);
		            object-fit: cover;
		            background: linear-gradient(45deg, #fdfdfd 0%, #52cde9 100%);
		            display: flex;
		            align-items: center;
		            justify-content: center;
		            color: white;
		            font-size: 36px;
		            font-weight: bold;
		        }
		        
		        .verification-badge {
		            position: absolute;
		            bottom: 5px;
		            right: 5px;
		            width: 24px;
		            height: 24px;
		            background: #4caf50;
		            border-radius: 50%;
		            display: flex;
		            align-items: center;
		            justify-content: center;
		            color: white;
		            font-size: 14px;
		            border: 2px solid white;
		        }
		        
		        .user-details {
		            flex: 1;
		        }
		        
		        .user-name {
		            display: flex;
		            align-items: center;
		            /* margin-bottom: 6px; */
		        }
		        
		        .user-name h1 {
		            font-size: 24px;
		            font-weight: 700;
		            margin-right: 10px;
		        }
		        
		        .user-level {
		            background: #ff9800;
		            color: white;
		            padding: 3px 8px;
		            border-radius: 12px;
		            font-size: 12px;
		            font-weight: 600;
		        }
		        
		        .user-tags {
		            display: flex;
		            gap: 8px;
		            margin-bottom: 15px;
		        }
		        
		        .tag {
		            background: rgb(129 165 243 / 38%);
		            padding: 4px 10px;
		            border-radius: 16px;
		            font-size: 12px;
		            font-weight: 500;
		        }
		        
		        .follow-btn {
		            background: white;
		            color: #1e88e5;
		            border: none;
		            padding: 8px 20px;
		            border-radius: 20px;
		            font-weight: 600;
		            font-size: 14px;
		            cursor: pointer;
		            transition: all 0.3s ease;
		            box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
		        }
		        
		        .follow-btn:hover {
		            background: #f5f5f5;
		            transform: translateY(-2px);
		            box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);
		        }
		        
		        .follow-btn i {
		            margin-right: 5px;
		        }
		        
		        .stats {
		            display: flex;
		            justify-content: space-around;
		            margin: 0px 0 5px;
		            padding: 3px 0;
		            border-top: 1px solid rgb(255 255 255 / 39%);
		            border-bottom: 1px solid rgb(255 255 255 / 39%);
		        }
		        
		        .stat-item {
		            text-align: center;
		        }
		        
		        .stat-value {
		            font-size: 20px;
		            font-weight: 700;
		            /* margin-bottom: 4px; */
		        }
		        
		        .stat-label {
		            font-size: 12px;
		            opacity: 0.9;
		        }
		        
		        .profile-bio {
		            padding: 0 10px 10px;
		            font-size: 14px;
		            line-height: 1.6;
		            opacity: 0.95;
		        }
				.t-name{font-size: 20px;font-weight: bold;/* margin-top: 10px; */}
				.t-desc{margin: 10px 0;}
.wrap {
	max-width: 1200px;
	width: 95%;
	margin: 0 auto;
}
.container {
    width: 100%;
    padding-right: 16px;
    padding-left: 16px;
    margin-right: auto;
    margin-left: auto
}
#search-wrapper {
 padding: 25px 0 4px 0;
 background: url(../img/bg.jpg) no-repeat;
 background-size: 100%;
 background: #2a3f54;
}
.search-box-wrapper {
    /* background-color: #fad13045; */
    /* margin-top: 10px; */
	
}
.row{max-width: 1200px;margin: 0 auto;}
.search-box-wrapper .btn-main {
    width: 100%
}

.search-box-wrapper-ab370 {
    background-color: #0a578c
}

.search-box-wrapper-ab370 .container {
    padding: 0 8px
}

.search-box-wrapper-ab370 .search-box-form {
    background-color: #fff;
    border-radius: 8px;
    padding: 16px
}

.search-box-wrapper-ab370 .place-handler.sp-254 {
    height: 64px;
    padding-top: 20px;
    padding-bottom: 8px;
    -webkit-padding-end: 36px;
    padding-inline-end:36px;-webkit-padding-start: 42px;
    padding-inline-start:42px}

.search-box-wrapper-ab370 .place-handler.sp-254:before,.search-box-wrapper-ab370 .twitter-typeahead:before {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 12px;
    width: 24px;
    height: 24px;
    z-index: 3;
    background: url(/assets/common/img/svg/icons/widget-search.svg) no-repeat 0 0
}

.search-box-wrapper-ab370 .twitter-typeahead:before {
    left: 13px
}

.search-box-wrapper-ab370 .place-handler.sp-254:before {
    top: 66%
}

.search-box-wrapper-ab370 .sb-datetime {
    box-shadow: none
}

.search-box-wrapper-ab370 .sb-group.sp-254 {
    margin-bottom: 16px
}

.search-box-wrapper-ab370 #drop-off-location,.search-box-wrapper-ab370 #pick-up-location,.search-box-wrapper-ab370 .date-field,.search-box-wrapper-ab370 .place-handler.sp-254,.search-box-wrapper-ab370 .sb-select-box.sp-254 {
    border: 1px solid #d1d5db
}

.search-box-wrapper-ab370 .sb-select-box.sp-254 {
    border-radius: 0 3px 3px 0;
    border-left: none
}

.search-box-wrapper-ab370 .drop-date-wrapper,.search-box-wrapper-ab370 .pickup-date-wrapper {
    position: relative
}

.search-box-wrapper-ab370 .drop-date-wrapper:after,.search-box-wrapper-ab370 .pickup-date-wrapper:after {
    content: "";
    display: block;
    position: absolute;
    bottom: 8px;
    left: 12px;
    width: 25px;
    height: 25px
}

.search-box-wrapper-ab370 .pickup-date-wrapper:after {
    background: url(/assets/common/img/svg/icons/widget-pickup.svg) no-repeat 0 0
}

.search-box-wrapper-ab370 .drop-date-wrapper:after {
    background: url(/assets/common/img/svg/icons/widget-dropoff.svg) no-repeat 0 0
}

.search-box-wrapper-ab370 .date-field-text,.search-box-wrapper-ab370 .location-field-text {
    position: absolute;
    top: 8px;
    left: 12px
}

.search-box-wrapper-ab370 #drop-date-ui,.search-box-wrapper-ab370 #pick-date-ui {
    position: relative;
    height: 64px;
    padding-top: 28px;
    -webkit-padding-start: 40px;
    padding-inline-start:40px}

.search-box-wrapper-ab370 #drop-time-fake,.search-box-wrapper-ab370 #pick-time-fake {
    display: flex;
    align-items: center;
    height: 62px;
    padding-top: 30px
}

.search-box-wrapper-ab370 #drop-off-location,.search-box-wrapper-ab370 #pick-up-location,.search-box-wrapper-ab370 .clear-auto-complete {
    height: 64px;
    box-shadow: none
}

.search-box-wrapper-ab370 #drop-off-location,.search-box-wrapper-ab370 #pick-up-location {
    -webkit-padding-start: 42px;
    padding-inline-start:42px}

.search-box-wrapper-ab370 .sb-drop-off-the-same {
    display: flex;
    align-items: center
}

.search-box-wrapper-ab370 .row {
    margin-left: -8px;
    margin-right: -8px
}

.search-box-wrapper-ab370 .col-12 {
    padding: 0 8px
}

.search-box-wrapper-ab370 .sb-driver-age-text,.search-box-wrapper-ab370 .sb-relative {
    font-size: 16px;
    line-height: 24px;
    font-weight: 500;
    color: #007ac2;
    text-decoration: none;
    position: relative
}

.search-box-wrapper-ab370 #sb-age,.search-box-wrapper-ab370 #sb-country {
    -webkit-padding-end: 20px;
    padding-inline-end:20px}

.search-box-wrapper-ab370 #sb-age:after,.search-box-wrapper-ab370 #sb-country:after {
    content: "";
    display: block;
    position: absolute;
    right: 3px;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-left: 6px solid;
    border-right: 6px solid;
    border-bottom: 6px solid #007ac2;
    -webkit-clip-path: polygon(0 0,100% 0,50% 100%);
    clip-path: polygon(0 0,100% 0,50% 100%)
}

.search-box-wrapper-ab370 .sb-select-box.time-select:after {
    content: "";
    display: block;
    position: absolute;
    right: 3px;
    top: 50%;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-left: 6px solid;
    border-right: 6px solid;
    border-bottom: 6px solid #000;
    -webkit-clip-path: polygon(0 0,100% 0,50% 100%);
    clip-path: polygon(0 0,100% 0,50% 100%);
    margin-top: 0;
    right: 16px
}

.search-box-wrapper-ab370 .micro-star {
    margin: 0 auto 16px;
    max-width: calc(100% - 32px);
    padding: 8px 12px 4px 12px;
    border-radius: 4px;
    background-color: rgba(15,23,42,.5)
}

.search-box-wrapper-ab370 .gradient-block {
    position: absolute;
    top: 0;
    height: 50%;
    width: 100%;
    background: linear-gradient(180deg,#0a578c 0,rgba(10,87,140,0) 100%)
}

.search-box-wrapper-ab370 .input-field.error.on-white {
    background: #fff
}

.search-box-wrapper-ab370 .clear-auto-complete:before {
    margin: 0;
    transform: translate3d(-50%,-50%,0);
    background-position: 0 -126px;
    z-index: 2
}

.search-box-wrapper-ab370 .clear-auto-complete:after {
    content: "";
    display: block;
    height: 24px;
    width: 24px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate3d(-50%,-50%,0);
    background-color: #94a3b8;
    border-radius: 100%;
    z-index: 1
}

.search-box-wrapper-ab370 .clear-auto-complete.hide {
    display: none
}

.search-box-wrapper-ab370 .hero-heading-more-car span {
    color: #fcd34d
}

.search-box-wrapper-ab370.search-box-wrapper-ab370-4 {
    font-family: Inter,Tahoma,Arial,sans-serif;
    background-color: #fff
}

.search-box-wrapper-ab370.search-box-wrapper-ab370-4 .search-box-form {
    padding: 0
}

.search-box-wrapper-ab370.search-box-wrapper-ab370-4 .place-handler.sp-254:before,.search-box-wrapper-ab370.search-box-wrapper-ab370-4 .twitter-typeahead:before {
    background: url(/assets/common/img/svg/icons/widget-search-gray.svg) no-repeat 0 0
}

.search-box-wrapper-ab370.search-box-wrapper-ab370-4 .micro-star {
    background-color: #fff;
    margin-bottom: 28px;
    transform: scale(.9);
    padding: 0
}

.search-box-wrapper-ab370.search-box-wrapper-ab370-4 .search-box-form {
    margin-top: 16px
}

.search-box-wrapper-ab370.search-box-wrapper-ab370-4 .button.submit {
    font-size: 20px;
    line-height: 24px;
    height: 64px
}

.search-box-wrapper-ab370.search-box-wrapper-ab370-4 .hero-heading-more-car span {
    color: #0ea5e9
}

.search-box-wrapper-ab370 .trustpilot-inside-image-block {
    margin-left: -8px;
    margin-right: -8px
}

.lp-title-display-block {
    display: block;
    font-weight: 700;
    font-size: 20px;
    line-height: 28px;
    text-align: start;
    margin-bottom: 20px;
    padding-top: 25px;
    /* -webkit-margin-end: 35px; */
    /* margin-inline-end:35px; */
    }

.lp-title-display-block h1 {
    font-weight: 700;
    font-size: 20px;
    line-height: 28px;
    display: inline
}
.emlines{
    width: 5px;
    display: inline-block;
    background: #FF6B35;
    height: 22px;
    line-height: 20px;
    vertical-align: sub;
    margin-right: 5px;
    }
.footer {
	/* background-color: #323436; */
	display: block;
	overflow: hidden;
	/* position: fixed; */
	width: 100%;
	bottom: 0;
	padding-bottom: 15%;
}
.footer .left .title {
	font-size: 18px;
	color: #888;
}
.footer .left .hotline {
	font-family: Arial;
	font-weight: bold;
	font-size: 42px;
	color: #fff;
	margin: 35px 0 10px;
}
.footer .left .address {
	line-height: 24px;
	font-size: 14px;
	color: #666;
	padding-left: 25px;
}
.footer .left .address a {
	color: #fff;
}
.footer .follow .title {
	margin-bottom: 30px;
}
.footer .follow .title::after {
	width: 100%;
	height: 1px;
	background-color: #404244;
	left: 0;
	top: 50%;
	position: absolute;
	z-index: 1;
	content: '';
}
.footer .follow .title span {
	font-size: 14px;
	color: #aaa;
	background-color: #323436;
	padding: 0 10px;
	z-index: 2;
}
.footer .follow .item {
	color: #8c8c8c;
}
.footer .follow .item:nth-child(2) {
	margin: 0 30px;
}
.footer .follow .item .ico {
	width: 54px;
	height: 54px;
	line-height: 54px;
	border-radius: 100%;
	margin-bottom: 10px;
}
.footer .follow .item .ico.qq {
	background-color: #12b7f5;
}
.footer .follow .item .ico.qq:hover {
	color: #12b7f5;
	background-color: #fff;
}
.footer .follow .item .ico.wechat {
	background-color: #24b727;
}
.footer .follow .item .ico.wechat:hover {
	color: #24b727;
	background-color: #fff;
}
.footer .follow .item .ico.sina {
	background-color: #ea493c;
}
.footer .follow .item .ico.sina:hover {
	color: #ea493c;
	background-color: #fff;
}
.footer .follow .item .ico i {
	font-size: 24px;
	color: #fff;
}
.footer .follow .item .ico:hover i {
	color: inherit;
}
.footer .follow .item .qrcode {
	width: 250px;
	height: 250px;
	background-color: #fff;
	padding: 25px;
	border-radius: 10px;
	box-shadow: 0 4px 6px #323436;
	margin-left: -125px;
	bottom: 180%;
	left: 50%;
	display: none;
}
.footer .follow .item .qrcode::after {
	width: 0;
	height: 0;
	border-top: 8px solid #fff;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	margin-left: -4px;
	position: absolute;
	z-index: 1;
	left: 50%;
	top: 100%;
	content: '';
}
.footer .follow .item:hover .qrcode {
	bottom: 140%;
	display: block;
}
.footer .bottom {
	line-height: 52px;
	/* background-color: #2a3f54; */
}
.footer .bottom .links {
	color: #555;
}
.footer .bottom .links a {
	color: inherit;
	margin: 0 8px;
}
.footer .bottom .links a:hover {
	color: #fff;
}
.footer .bottom .copyright {
	color: #555;
}
.footer .bottom .copyright a {
	color: inherit;
}
.footer .bottom .copyright a:hover {
	color: #fff;
}
.footer  .bottom{color: #666;text-align: center;}
a {
  text-decoration: none; /* 去除下划线 */
  color: inherit; /* 继承父元素的颜色 */
}

a:hover {
  color: inherit; /* 继承父元素的颜色 */
}
.wrap1200 {
	max-width: 1200px;
	width: 95%;
	margin: 0 auto;
}
.max-wrap {
	max-width: 1700px;
	margin: 0 auto;
}
.fl {
	float: left;
}
.fr {
	float: right;
}
.text-left {
	text-align: left;
}
.text-right {
	text-align: right;
}
.text-center {
	text-align: center;
}
.text-over {
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}
.over {
	overflow: hidden;
}
.nowrap {
	white-space: nowrap;
}
.nowrap * {
	white-space: normal;
}
.fz0 {
	font-size: 0px;
}
.relative {
	position: relative;
	z-index: 1;
}
.absolute {
	position: absolute;
	z-index: 1;
}
.fixed {
	position: fixed;
	z-index: 1;
}
.inline {
	display: inline;
}
.block {
	display: block;
}
.inline-block {
	display: inline-block;
}
.table {
	width: 100%;
	height: 100%;
	display: table;
}
.table-cell {
	display: table-cell;
}
.hide {
	display: none;
}
.max-w100 {
	max-width: 100%;
}
.max-h100 {
	max-height: 100%;
}
.middle {
	vertical-align: middle;
}
.middle-span {
	height: 100%;
	vertical-align: middle;
	display: inline-block;
	width: 100%;
	font-size: 18px;
	    font-weight: bold;
	    margin-top: 10px;
}
.border-box {
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}
.content-box {
	-moz-box-sizing: content-box;
	-webkit-box-sizing: content-box;
	box-sizing: content-box;
}
.trans {
	-webkit-transition: all 300ms ease 0s;
	-moz-transition: all 300ms ease 0s;
	-ms-transition: all 300ms ease 0s;
	-o-transition: all 300ms ease 0s;
	transition: all 300ms ease 0s;
}
.trans-1s {
	-webkit-transition: all 1s ease 0s;
	-moz-transition: all 1s ease 0s;
	-ms-transition: all 1s ease 0s;
	-o-transition: all 1s ease 0s;
	transition: all 1s ease 0s;
}
.scale:hover .scale-img {
	-ms-transform: scale(1.1, 1.1);
	-moz-transform: scale(1.1, 1.1);
	-webkit-transform: scale(1.1, 1.1);
	-o-transform: scale(1.1, 1.1);
	transform: scale(1.1, 1.1);
}
.grayscale .grayscale-img {
	-webkit-filter: grayscale(100%);
	-moz-filter: grayscale(100%);
	-ms-filter: grayscale(100%);
	-o-filter: grayscale(100%);
	filter: grayscale(100%);
	filter: gray;
	width: 100px;
	height: 100px;
}
.grayscale:hover .grayscale-img {
	-webkit-filter: grayscale(0%);
	-moz-filter: grayscale(0%);
	-ms-filter: grayscale(0%);
	-o-filter: grayscale(0%);
	filter: grayscale(0%);
	filter: none;
}
.fz0.nowrap {
	letter-spacing: -5px;
}
.fz0.nowrap * {
	letter-spacing: normal;
}
.red {
	color: #f50;
}
.bgf3 {
	background-color: #f3f3f3;
}
.show1300 {
	display: none;
}
.show992 {
	display: none;
}
.show768 {
	display: none;
}
.show480 {
	display: none;
}
.show320 {
	display: none;
}
@font-face {
	font-family: 'PingFang';
	src: url(/fonts/AvantGardeBook.otf);
}
@font-face {
	font-family: 'AvantGarde';
	src: url(/fonts/AvantGardeBook.otf);
}
html, body {
	overflow-x: hidden;
}
#body {
	position: relative;
	z-index: 1;
	left: 0;
	top: 0;
	bottom: 0;
	right: 0;/*display: none;*/
}
/*#body.on{z-index: 10;}*/
header {
	width: 100%;
	height: 80px;
	padding-top: 15px;
	padding-bottom: 15px;
	position: fixed;
	z-index: 6 !important;
	top: 0;
	background: #2a3f54;
	max-width: 640px;
	/* margin: 0 auto; */
}
header #logo {
	height: 68px;
	max-width: 60%;
	/* top: -10px; */
	color: #fff;
	line-height: 50px;
	text-shadow: 2px 2px 5px #ef8574;
}
/*header #logo > a{z-index: 2;}*/
header #logo .logo-on {
	left: 0;
	top: 0;
}
header nav {
	line-height: 50px;
	left: 50%;
	top: 0;
	margin-left: -350px;
}
header nav .bd {
	max-height: 100%;
}
header nav .nav-item {
	width: 100px;
}
header nav .nav-item > a {
	font-size: 16px;
	color: #dbdbdb;
}
header nav .nav-item > .on {
	color: #fff;
	font-weight: bold;
}
header nav .nav-item > a:hover {
	color: #0382db;
}
header .header-user {
	margin-top: 3px;
}
header .header-user .login {
	width: 86px;
	height: 44px;
	line-height: 44px;
	font-size: 16px;
	color: #333;
	border: 1px solid #e3e3e3;
	border-radius: 5px;
}
header .header-user .login i {
	width: 18px;
	height: 18px;
	background: url(../images/ico-user-0.png) no-repeat;
	margin-right: 10px;
	top: -2px;
	position: relative;
	z-index: 1;
	display: inline-block;
	vertical-align: middle;
}
header .header-user .login i::after {
	width: 100%;
	height: 100%;
	background: url(../images/ico-user-1.png) no-repeat;
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	opacity: 0;
	content: '';
	-webkit-transition: all 300ms ease 0s;
	-moz-transition: all 300ms ease 0s;
	-ms-transition: all 300ms ease 0s;
	-o-transition: all 300ms ease 0s;
	transition: all 300ms ease 0s;
}
header .header-user .login:hover {
	color: #fff;
	background-color: #0382db;
	border-color: #0382db;
}
header .header-user .login:hover i::after {
	opacity: 1;
}
header .header-user .try {
	width: 130px;
	height: 44px;
	line-height: 44px;
	font-size: 16px;
	border: 1px solid #e3e3e3;
	border-radius: 5px;
	margin-left: 5px;
}
header .header-user .try:hover {
	color: #fff;
	background-color: #0382db;
	border-color: #0382db;
}
header .header-user .member {
	width: 140px;
	height: 44px;
	line-height: 44px;
	font-size: 16px;
	color: #333;
	border: 1px solid #e3e3e3;
	border-radius: 5px;
}
header .header-user .member i {
	width: 18px;
	height: 18px;
	background: url(../images/ico-user-0.png) no-repeat;
	margin-right: 10px;
	top: -2px;
	position: relative;
	z-index: 1;
	display: inline-block;
	vertical-align: middle;
}
header .header-user .member i::after {
	width: 100%;
	height: 100%;
	background: url(../images/ico-user-1.png) no-repeat;
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	opacity: 0;
	content: '';
	-webkit-transition: all 300ms ease 0s;
	-moz-transition: all 300ms ease 0s;
	-ms-transition: all 300ms ease 0s;
	-o-transition: all 300ms ease 0s;
	transition: all 300ms ease 0s;
}
header .header-user .member:hover {
	color: #fff;
	background-color: #0382db;
	border-color: #0382db;
}
header .header-user .member:hover i::after {
	opacity: 1;
}
header .preview-button {
	width: 320px;
	line-height: 50px;
	left: 50%;
	top: 0;
	margin-left: -160px;
}
header .preview-button > a {
	margin: 0 12px;
}
header .preview-button .fa {
	font-size: 32px;
	color: #fff;
}
header .preview-button .on {
	-ms-transform: scale(1.2, 1.2);
	-moz-transform: scale(1.2, 1.2);
	-webkit-transform: scale(1.2, 1.2);
	-o-transform: scale(1.2, 1.2);
	transform: scale(1.2, 1.2);
}
header .menu-button {
	line-height: 50px;
	font-size: 32px;/*color: #fff;*/
}
header .menu-button a {
	color: inherit;
}
header .menu-button a:hover {
	color: #9fd2f5;
}
header.opaque {
	background-color: #fff;
	box-shadow: 0 1px 5px rgba(0,0,0,.3);
}
header.black {
	height: 85px;
	background-color: #222;
	padding-top: 17px;
}
/*header.black #logo > a{opacity: 0;}*/
header.black .header-user .login {
	color: #fff;
	border-color: #fff;
}
header.black .header-user .login i::after {
	opacity: 1;
}
header.black .header-user .login:hover {
	border-color: #0382db;
}
header.black .header-user .try {
	color: #fff;
	border-color: #fff;
}
header.black .header-user .try:hover {
	border-color: #0382db;
}
header.black + #header-blank {
	height: 85px;
}
header.black .menu-button {
	color: #333;
}
header.on {
	height: 60px;
	padding-top: 15px;
	padding-bottom: 15px;
	background-color: #3b5b7b;
	box-shadow: 0 1px 5px rgba(0,0,0,.3);
}
header.on #logo {
	height: 50px;
}
header.on nav {
	line-height: 30px;
}
header.on .menu-button {
	line-height: 30px;
	color: #d5d5d5;
}
header.on .header-user {
	margin-top: 0;
}
header.on .header-user .login, header.on .header-user .try {
	height: 32px;
	line-height: 32px;
}
header.on .header-user .member {
	height: 32px;
	line-height: 32px;
}
#header-blank {
	height: 100px;
}
#banner {
	z-index: 2;
}
#banner .bd {
	width: 100%;
}
#banner .bar {
	left: 0;
}
#banner .item {
	width: 100%;
}
#banner .item > a {
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}
#banner .item-0 .font {
	width: 100%;
	left: 0;
	top: 5%;
	opacity: .4;
}
#banner .item-0 .font span {
	font-family: 'PingFang';
	font-size: 60px;
	color: #0382db;
	background-image: -webkit-gradient(linear, 0 0, right 0, from(#0382db), to(#19fff7));
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	padding-left: 15px;
	letter-spacing: 15px;
}
#banner .item-0 .img {
	box-shadow: 40px 40px 30px rgba(0,0,0,.2);
}
#banner .item-0 .img-0 {
	width: 42.135416666%;
	left: 28.9583333%;
	bottom: 10%;
	opacity: .4;
}
#banner .item-0 .img-1 {
	width: 16.40625%;
	left: 10%;
	bottom: 0;
	opacity: .4;
}
#banner .item-0 .img-2 {
	width: 16.40625%;
	right: 10%;
	bottom: 0;
	opacity: .4;
}
#banner .item-0.on .font {
	top: 11.25%;
	opacity: 1;
}
#banner .item-0.on .img-0 {
	bottom: 0;
	opacity: 1;
}
#banner .item-0.on .img-1 {
	left: 0;
	opacity: 1;
}
#banner .item-0.on .img-2 {
	right: 0;
	opacity: 1;
}
#banner .item .banner-button {
	width: 178px;
	height: 47px;
	background: url(../images/banner-btn.png) no-repeat;
}
#banner .item:nth-child(1) .banner-button {
	left: 50%;
	top: 26.5%;
	margin-left: -89px;
	margin-top: -5%;
}
#banner .item:nth-child(2) .banner-button {
	left: 10.9375%;
	top: 71.25%;
}
#banner .item:nth-child(3) .banner-button {
	left: 50%;
	top: 61.875%;
	margin-left: -89px;
}
#banner .item:nth-child(1).on .banner-button {
	margin-top: 0;
}
#banner.slide .bar {
	-webkit-transition: all 1s ease 0s;
	-moz-transition: all 1s ease 0s;
	-o-transition: all 1s ease 0s;
	transition: all 1s ease 0s;
}
#banner.fold .item {
	zoom: 1;
	opacity: 0;
}
#banner.fold .item.on {
	opacity: 1;
}
#small-banner {
	z-index: 2;
}
#small-banner .bd {
	width: 100%;
}
#small-banner .bar {
	left: 0;
}
#small-banner .item {
	width: 100%;
}
#small-banner .item > a {
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
}
#small-banner.slide .bar {
	-webkit-transition: all 300ms ease 0s;
	-moz-transition: all 300ms ease 0s;
	-o-transition: all 300ms ease 0s;
	transition: all 300ms ease 0s;
}
#small-banner.fold .item {
	zoom: 1;
	opacity: 0;
}
#small-banner.fold .item.on {
	opacity: 1;
}
.index-title {
	font-size: 40px;
	color: #222;
}
.index-brief {
	font-size: 14px;
	color: #aaa;
	margin-top: 10px;
	padding-bottom: 15px;
}
#products > .category-list {
	margin: 30px auto 36px;
}
#products > .category-list .item {
	/* width: 144px; */
	height: 47px;
	line-height: 47px;
	font-size: 15px;
	color: #333;
	
	/* background-color: #f1f1f1;
	border-radius: 2px; */
	margin: 3px 0.5%;
}
#products > .category-list .item:hover, #products > .category-list .item.on {
	/* color: #fff;
	background-color: #0382db; */
	cursor: pointer;
}
#products > .category-list .item i {
	font-size: 20px;
	margin-right: 20%;
	vertical-align: middle;
}
#products .products-bg {
	background-color: #f8f8f8;
	background-image: url(../images/shadow.png);
	background-repeat: repeat-x;
	background-position: left top;
	padding: 70px 0 55px;
}
#products.index .products-bg {
	padding: 0 0 55px;
}
#products.index #products-box {
	padding-top: 70px;
	left: 0;
}
#products-box .products-list .item {
	width: 30.588%;
	margin-right: 3.823529%;
	margin-bottom: 60px;
	vertical-align: top;
}
#products-box .products-list .item.last {
	margin-right: 0;
}
#products-box .products-list .item[status='on'] {
	z-index: 2;
}
#products-box .products-list .item[status='on'] .main {
	-webkit-animation-name: zoomIn;
	animation-name: zoomIn
}
#products-box .products-list .item[status='off'] {
	opacity: 0;
}
#products-box .products-list .item[status='off'] .main {
	-webkit-animation-name: zoomOut;
	animation-name: zoomOut
}
#products-box .products-list .item .main {
	max-width: 520px;
	margin: 0 auto;
}
#products-box .products-list .item .cover {
	z-index: 2;
}
#products-box .products-list .item .cover .img {
	width: 100%;
	left: 0;
	top: 4%;
}
#products-box .products-list .item .cover .img img {
	width: 76.923%;
}
#products-box .products-list .item .cover .opt {
	width: 100%;/*max-height: 0;*/
	left: 0;/*bottom: -moz-calc(20% + 100px);bottom: -webkit-calc(20% + 100px);bottom: calc(20% + 100px);*/
	bottom: 20%;
	opacity: 0;
}
#products-box .products-list .item .cover .opt .button-bg {
	width: 76.923%;
	background-color: #fff;
	padding: 10px 40px 10px 25px;
	margin: 0 auto;/*box-shadow: 0 20px 40px rgba(0,0,0,.4)*/
}
#products-box .products-list .item .cover .opt .button {
	width: 78px;
	height: 78px;
	line-height: 76px;
	font-size: 16px;
	color: #0382db;
	border: 1px solid #0382db;
	border-radius: 100%;
	margin-right: 6%;
}
#products-box .products-list .item .cover .opt .button:hover {
	color: #fff;
	background-color: #0382db;
}
#products-box .products-list .item .cover .opt .links {
	font-size: 14px;
	color: #333;
	margin-top: 12px;
}
#products-box .products-list .item .cover .opt .links i {
	width: 31px;
	height: 31px;
	background: url(../images/ico-link-0.png) no-repeat center center;
	margin-bottom: 8px;
	position: relative;
	z-index: 1;
	display: block;
}
#products-box .products-list .item .cover .opt .links i::after {
	width: 100%;
	height: 100%;
	background: url(../images/ico-link-1.png) no-repeat center center;
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	opacity: 0;
	-webkit-transition: all 300ms ease 0s;
	-moz-transition: all 300ms ease 0s;
	-ms-transition: all 300ms ease 0s;
	-o-transition: all 300ms ease 0s;
	transition: all 300ms ease 0s;
	content: '';
}
#products-box .products-list .item .cover .opt .links:hover {
	color: #0382db;
}
#products-box .products-list .item .cover .opt .links:hover i::after {
	opacity: 1;
}
#products-box .products-list .item .cover .url {
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 3;
}
#products-box .products-list .item .cover:hover .opt {/*max-height: 100px;bottom: 20%;*/
	opacity: 1;
}
#products-box .products-list .item .info {
	width: 76.923%;
	margin: 0 auto;
}
#products-box .products-list .item .info .left {
	width: 50%;
	line-height: 24px;
}
#products-box .products-list .item .info .name {
	font-size: 16px;
	color: #222;
}
#products-box .products-list .item .info .category {
	font-size: 14px;
	color: #aaa;
}
#products-box .products-list .item .info .price {
	width: 50%;
	line-height: 48px;
	font-weight: bold;
	font-size: 18px;
	color: #222;
}
#products-box .products-list .item .info .price font {
	font-size: inherit;
}
#products-box .products-list .item .mask {
	opacity: 0;
	z-index: 2;
	position: absolute;
}
#products-box .products-list .item .opt-msg {
	width: 80%;
	max-height: 0;
	background-color: #fff;
	margin-top: -90px;
	position: absolute;
	left: 10%;
	top: 50%;
}
#products-box .products-list .item .opt-msg a {
	height: 60px;
	line-height: 60px;
	font-size: 20px;
	color: #333;
	border-bottom: 1px solid #ddd;
	display: none;
}
#products-box .products-list .item .opt-msg a:hover {
	color: #0382db;
}
#products-box .box-button .button {
	width: 50px;
	height: 50px;
	line-height: 50px;
	background-color: #fff;
	border-radius: 3px;
	margin: 0 5px;
}
#products-box .box-button .button i {
	font-size: 16px;
	color: #0078cc;
}
#products-box .box-button .button:hover {
	background-color: #0078cc;
}
#products-box .box-button .button:hover i {
	color: #fff;
}
#products-box .box-button .more-list {
	width: 92px;
	height: 50px;
	line-height: 50px;
	background-color: #0382db;/*background-color: #fff;*/
	border-radius: 3px;
	margin: 0 5px;
}
#products-box .box-button .more-list i {
	width: 10px;
	height: 10px;
	background: url(../images/list-more-0.png) no-repeat center center;
	display: inline-block;
}
#products-box .box-button .more-list i::after {
	width: 100%;
	height: 100%;
	background: url(../images/list-more-1.png) no-repeat center center;
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	opacity: 1;
	-webkit-transition: all 300ms ease 0s;
	-moz-transition: all 300ms ease 0s;
	-o-transition: all 300ms ease 0s;
	transition: all 300ms ease 0s;
	content: '';
}
/*#products-box .box-button .more-list:hover{background-color: #0382db;}*/
/*#products-box .box-button .more-list:hover i::after{opacity: 1;}*/


.index-cooperation .cooperation-box {
	margin-bottom: 50px;
}
.index-cooperation .cooperation-box .bd {
	padding: 10px 0;
}
.index-cooperation .cooperation-box .item {
	width: 16.6%;
	height: 180px;
	border-width: 1px 1px 1px 0;
	border-style: solid;
	border-color: #ededed;
	vertical-align: middle;
}
.index-cooperation .cooperation-box .item:first-child {
	border-left-width: 1px;
}
.index-cooperation .cooperation-box .item a {
	width: 100%;
	height: 100%;
	background-color: #fff;
	padding: 20px;
}
.index-cooperation .cooperation-box .item:hover {
	box-shadow: 0 0 12px rgba(0,0,0,.1);
	border: 1px solid #ededed;
	-ms-transform: scale(1.05, 1.05);
	-moz-transform: scale(1.05, 1.05);
	-webkit-transform: scale(1.05, 1.05);
	-o-transform: scale(1.05, 1.05);
	transform: scale(1.05, 1.05);
}
.index-cooperation .cooperation-box .hd {
	margin-top: 35px;
}
.index-cooperation .cooperation-box .hd a {
	width: 12px;
	height: 12px;
	border: 1px solid #b7c5ce;
	border-radius: 100%;
	margin: 0 5px;
	display: inline-block;
	cursor: pointer;
	-webkit-transition: all 300ms ease 0s;
	-moz-transition: all 300ms ease 0s;
	-o-transition: all 300ms ease 0s;
	transition: all 300ms ease 0s;
}
.index-cooperation .cooperation-box .hd .on {
	background-color: #0382db;
	border-color: #0382db;
}
.index-cooperation .evaluation-list .bar {
	left: 0;
}
.index-cooperation .evaluation-list .hd {
	margin-top: 35px;
}
.index-cooperation .evaluation-list .hd a {
	width: 12px;
	height: 12px;
	border: 1px solid #b7c5ce;
	border-radius: 100%;
	margin: 0 5px;
	display: inline-block;
	cursor: pointer;
	-webkit-transition: all 300ms ease 0s;
	-moz-transition: all 300ms ease 0s;
	-o-transition: all 300ms ease 0s;
	transition: all 300ms ease 0s;
}
.index-cooperation .evaluation-list .hd .on {
	background-color: #0382db;
	border-color: #0382db;
}
.index-cooperation .evaluation-list .item {
	width: 30%;
	margin-left: 5%;
}
.index-cooperation .evaluation-list .item:first-child {
	margin-left: 0;
}
.index-cooperation .evaluation-list .item .img {
	width: 88px;
	height: 88px;
	padding: 5px;
	border: 1px solid #b9c7cf;
	border-radius: 100%;
}
.index-cooperation .evaluation-list .item .info {
	padding-left: 5%;
}
.index-cooperation .evaluation-list .item .info .name {
	font-size: 24px;
	color: #222;
}
.index-cooperation .evaluation-list .item .info .date {
	color: #888;
}
.index-cooperation .evaluation-list .item .arrow {
	width: 88px;
	margin-top: 10px;
}
.index-cooperation .evaluation-list .item .arrow::after {
	width: 0;
	height: 0;
	border-bottom: 15px solid #0382db;
	border-left: 12px solid transparent;
	border-right: 12px solid transparent;
	margin: 0 auto;
	display: block;
	content: '';
}
.index-cooperation .evaluation-list .item .brief {
	width: 100%;
	line-height: 32px;
	font-size: 14px;
	color: #fff;
	background-color: #0382db;
	padding: 25px 45px 25px 40px;
}
.index-tutorial .tutorial-support {
	width: 50%;
	height: 100%;
	background-color: #323436;
	right: 0;
	top: 0;
}
.index-tutorial .tutorial-support .support-search {
	margin-left: 5%;
}
.index-tutorial .tutorial-support .support-search .text {
	width: 350px;
	height: 60px;
	line-height: 60px;
	font-size: 14px;
	background: #fff url(../images/ico-search.png) no-repeat 15px center;
	padding: 0 10px 0 55px;
	border: 0;
	border-radius: 5px;
}
.index-tutorial .tutorial-support .ico {
	font-size: 16px;
	color: #fff;
}
.index-tutorial .tutorial-support .button {
	width: 35%;
}
.index-tutorial .tutorial-support .play {
	line-height: 34px;
	background: url(../images/ico-play.png) no-repeat left center;
	padding-left: 40px;
}
.index-tutorial .tutorial-support .file {
	line-height: 30px;
	background: url(../images/ico-file.png) no-repeat left center;
	padding-left: 40px;
}
.index-tutorial .tutorial-support .line {
	width: 1px;
	height: 60px;
	background-color: #383939;
	margin: 0 7%;
}
.index-tutorial .tutorial-list .item {
	width: 44.70588%;
	padding: 45px 0;
	border-top: 1px solid #e5e5e5;
}
.index-tutorial .tutorial-list .item:nth-child(1), .index-tutorial .tutorial-list .item:nth-child(2) {
	border-top: 0;
}
.index-tutorial .tutorial-list .item .date {
	width: 20%;
	max-width: 120px;
}
.index-tutorial .tutorial-list .item .date .year {
	font-size: 16px;
	color: #666;
	margin: 6px 0 15px;
}
.index-tutorial .tutorial-list .item .date .day {
	font-size: 34px;
	color: #222;
}
.index-tutorial .tutorial-list .item .info {
	width: 80%;
}
.index-tutorial .tutorial-list .item .info .name {
	font-size: 20px;
	color: #222;
}
.index-tutorial .tutorial-list .item .info .name a {
	font-size: inherit;
	color: inherit;
}
.index-tutorial .tutorial-list .item .info .name a:hover {
	color: #0382db;
}
.index-tutorial .tutorial-list .item .info .brief {
	height: 72px;
	line-height: 24px;
	font-size: 14px;
	color: #888;
	margin-top: 20px;
}
.try-button-box .button {
	width: 25%;
	min-width: 155px;
	height: 66px;
	line-height: 66px;
	font-size: 22px;
	color: #97abb8;
	background-color: #fff;
	border: 1px solid #b6c4cd;
	border-radius: 5px;
	box-shadow: 0 0 12px rgba(182,196,205,.4);
	margin: 0 1.5%;
}
.try-button-box .button:hover {
	color: #fff;
	background-color: #0382db;
	border-color: #0382db;
	box-shadow: 0 0 12px rgba(3,130,219,.4);
}
.about-title {
	margin-bottom: 40px;
}
.about-title .title-0 {
	font-family: Arial;
	font-size: 10px;
	color: #333;
	padding-left: 3px;
	letter-spacing: 3px;
}
.about-title .title-1 span {
	font-size: 40px;
	color: #0382db;
	position: relative;
	z-index: 1;
}
.about-title .title-1 span::before, .about-title .title-1 span::after {
	width: 100px;
	height: 1px;
	background-color: #e1e1e1;
	top: 15px;
	position: absolute;
	z-index: 1;
	content: '';
}
.about-title .title-1 span::before {
	right: -moz-calc(100% + 30px);
	right: -webkit-calc(100% + 30px);
	right: 110%;
}
.about-title .title-1 span::after {
	left: -moz-calc(100% + 30px);
	left: -webkit-calc(100% + 30px);
	right: 110%;
}
#about {
	margin-top: 100px;
	margin-bottom: 100px;
}
#about .title-0 {
	padding-left: 10px;
	letter-spacing: 10px;
}
#about .item {
	width: 50%;
}
#about .about-brief {
	padding: 0 4%;
}
#about .about-brief .brief {
	line-height: 34px;
	font-size: 14px;
	color: #666;
	text-align: left;
}
#about .number {
	height: 100%;
	right: 0;
	top: 0;
}
#about .number .i {
	width: 33.3333333%;
	height: 100%;
	font-size: 20px;
	color: #555;
}
#about .number .i:nth-child(1), #about .number .i:nth-child(3) {
	background-color: #f5f5f5;
}
#about .number .i .n {
	font-family: 'PingFang';
	font-size: 64px;
	color: #222;
	margin: 60% 0 56%;
	letter-spacing: -3px;
}
/*#team .team-list{margin-top: 90px;margin-bottom: 60px;}
#team .team-list .item{width: 15.470588%;margin-left: 5.35294%;margin-bottom: 20px;}
#team .team-list .item.i0{margin-left: 0;}
#team .team-list .item .title{font-size: 20px;color: #000;margin-top: 25px;margin-bottom: 5px;}
#team .team-list .item .name{font-size: 18px;color: #000;}*/

/*#products-detail .images{width: 100%;margin-bottom: 65px;}
#products-detail .images .main{width: 100%;height: 100%;left: 0;top: 0;}
#products-detail .images .wrap{height: 100%;}
#products-detail .images .computer{width: 52.88235294117647%;left: 19.1176470588235%;top: 5.448154657293497363796133567663%;z-index: 2;}
#products-detail .images .computer .img{padding: 0 11.3459399% 0;left: 0;top: 4.5738045738%;}
#products-detail .images .phone{width: 14.647058823529%;left: 64.7058823529%;top: 26.36203866432337%;z-index: 3;}
#products-detail .images .phone .img{padding: 0 33.3333333% 0 4.016064257%;left: 0;top: 15.284974093264248704663212435233%;}
#products-detail .detail{width: 67.94117647%;}
#products-detail .products-side{width: 29.4117647%;background-color: #fff;box-shadow: 0 0 8px rgba(0,0,0,.2);}
#products-detail .products-side .rows{padding-left: 8%;padding-right: 8%;}
#products-detail .products-side .product{padding-top: 25px;padding-bottom: 25px;}
#products-detail .products-side .product .left{line-height: 35px;margin-top: 8px;}
#products-detail .products-side .product .name{font-size: 20px;color: #000;}
#products-detail .products-side .product .category{font-size: 16px;color: #888;}
#products-detail .products-side .product .other-button{width: 55%;}
#products-detail .products-side .product .button{width: 86px;height: 86px;line-height: 86px;font-size: 16px;color: #0382db;border: 1px solid #0382db;border-radius: 100%;text-align: center;margin-left: 5%;}
#products-detail .products-side .product .button:first-child{margin-left: 0;}
#products-detail .products-side .product .button:hover{color: #fff;background-color: #0382db;border-color: #0382db;}
#products-detail .products-side .price-row{line-height: 34px;font-size: 16px;color: #fff;background-color: #0382db;padding-top: 30px;padding-bottom: 30px;}
#products-detail .products-side .price-row::after{width: 0;height: 0;border-top: 15px solid #fff;border-left: 10px solid transparent;border-right: 10px solid transparent;position: absolute;z-index: 1;right: 8%;top: 45%;content: '';}
#products-detail .products-side .price-row .price{font-family: Arial;font-size: 34px;}
#products-detail .products-side .brief-row{line-height: 30px;font-size: 16px;color: #666;padding-top: 25px;padding-bottom: 25px;}
#products-detail .products-side .brief-row .line{height: 0;margin: 20px -10%;border-top: 1px solid #f2f2f2;}
#products-detail .products-side .brief-row .line + br{display: none;}
#products-detail .products-side .brief-row .tips{line-height: 26px;font-size: 14px;color: #ccc;margin-top: 20px;}
#products-detail .products-side .like-row .title{font-size: 18px;color: #333;}
#products-detail .products-side .like-row .title::after{width: 100%;height: 3px;background: url(../images/side-border.jpg) repeat-x left center;left: 0;top: 50%;position: absolute;z-index: 1;content: '';}
#products-detail .products-side .like-row .title span{font-size: inherit;color: inherit;background-color: #fff;padding: 0 20px;z-index: 2;}
#products-detail .products-side .like-row .like-box{min-height: 100px;}
#products-detail .products-side .like-row .like-box .button{font-size: 24px;color: #0382db;top: 35%;}
#products-detail .products-side .like-row .like-box .button.stop{color: #dbdbdb;}
#products-detail .products-side .like-row .like-box .prev{left: 2%;}
#products-detail .products-side .like-row .like-box .next{right: 2%;}
#products-detail .products-side .like-row .like-box .bd{width: 85%;margin: 0 auto;}
#products-detail .products-side .like-row .like-box .item{width: 50%;}
#products-detail .products-side .like-row .like-box .item .cover{z-index: 2;}
#products-detail .products-side .like-row .like-box .item .cover .img{width: 100%;left: 0;top: 4%;}
#products-detail .products-side .like-row .like-box .item .cover .img img{width: 76.923%;}
#products-detail .products-side .like-row .like-box .item .name{color: #222;}
#products-detail .products-side .like-row .like-box .item .category{color: #aaa;}
#products-detail .products-side .like-row .like-box .item .price{color: #222;margin-top: 8px;}*/

#products-detail .detail-title {
	font-family: 'PingFang';
	font-size: 50px;
}
#products-detail .detail-bg {
	background-image: url(../images/detail-bg.jpg);
	background-repeat: repeat-y;
	background-position: center top;
	background-size: 100% auto;
}
#products-detail .detail-bg .title-0 {
	font-family: 'PingFang';
	font-size: 54px;
	color: #0382db;
	margin-top: 60px;
}
#products-detail .detail-bg .title-1 {
	font-size: 14px;
	color: #888;
}
#products-detail .detail-bg .price-list {
	margin: 35px 0;
}
#products-detail .detail-bg .price-list .price-item .name {
	font-size: 14px;
	color: #fff;
	padding: 4px 7px;
	border-radius: 2px;
}
#products-detail .detail-bg .price-list .price-item .price {
	font-family: 'AvantGarde';
	font-size: 46px;
	margin-top: 10px;
}
#products-detail .detail-bg .price-list .price-item.i1 .name {
	background-color: #ffc804;
}
#products-detail .detail-bg .price-list .price-item.i1 .price {
	color: #ffc804;
}
#products-detail .detail-bg .price-list .price-item.i2 .name {
	background-color: #ff4300;
}
#products-detail .detail-bg .price-list .price-item.i2 .price {
	color: #ff4300;
}
#products-detail .detail-bg .price-list .price-item.i3 .name {
	background-color: #00b3ff;
}
#products-detail .detail-bg .price-list .price-item.i3 .price {
	color: #00b3ff;
}
#products-detail .detail-bg .price-list .price-line {
	width: 1px;
	height: 100px;
	background-image: url(../images/price-line.png);
	margin: 0 5.3125%;
}
#products-detail .detail-bg .price-btn {
	margin-bottom: 30px;
}
#products-detail .detail-bg .price-btn .botton {
	width: 10%;
	height: 48px;
	line-height: 48px;
	font-size: 18px;
	color: #fff;
	border-radius: 2px;
	margin: 0 26px;
}
#products-detail .detail-bg .price-btn .btn-0 {
	background-color: #323436;
}
#products-detail .detail-bg .price-btn .btn-1 {
	background-color: #0382db;
}
#products-detail .detail-bg .product-images {
	width: 95%;
	max-width: 1054px;
	margin: 0 auto;
}
#products-detail .detail-bg .image-pc {
	width: 91.08159392789%;
}
#products-detail .detail-bg .image-pc .img {
	top: 9.0556274256%;
	right: 3.8541666666666666%;
	bottom: 30.789133247%;
	left: 3.8541666666666666%;
}
#products-detail .detail-bg .image-tablet {
	width: 31.3092979127%;
	left: 0;
	bottom: -1.0349288486%;
	z-index: 2;
}
#products-detail .detail-bg .image-tablet .img {
	top: 10.212765957%;
	right: 6.060606060606%;
	bottom: 10.212765957%;
	left: 6.060606060606%;
}
#products-detail .detail-bg .image-phone {
	width: 14.7058823529%;
	left: 23.8140417457%;
	bottom: -1.42302716688%;
	z-index: 3;
}
#products-detail .detail-bg .image-phone .img {
	top: 14.457831325%;
	right: 6.4516129%;
	bottom: 14.457831325%;
	left: 6.4516129%;
}
#products-detail .detail-bg .img img {
	top: 0;
}
#products-detail .products-process {
	background-color: #0382db;
	padding: 115px 0 140px;
}
#products-detail .products-process .detail-title {
	color: #fff;
}
#products-detail .products-process .process-list {
	margin-top: 100px;
}
#products-detail .products-process .process-list .process-item {
	width: 12%;
	margin: 0 5.294117647%;
}
#products-detail .products-process .process-list .process-item .bg {
	z-index: 2;
}
#products-detail .products-process .process-list .process-item .shadow {
	width: 100%;
	height: 100%;
	background-image: url(../images/fbe5b687893e4b2a8253fd401db008c8.gif);
	background-repeat: no-repeat;
	background-size: 100% auto;
	left: 0;
	top: 0;
}
#products-detail .products-process .process-list .process-item .main {
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 3;
}
#products-detail .products-process .process-list .process-item .main .ico {
	height: 50%;
	background-repeat: no-repeat;
	background-position: center center;
	margin-top: 13.10043668%;
}
#products-detail .products-process .process-list .process-item .main .ico.i1 {
	background-image: url(../images/process-1.png);
	background-size: 43.1372549% auto;
}
#products-detail .products-process .process-list .process-item .main .ico.i2 {
	background-image: url(../images/process-2.png);
	background-size: 37.745098% auto;
}
#products-detail .products-process .process-list .process-item .main .ico.i3 {
	background-image: url(../images/process-3.png);
	background-size: 37.25490196% auto;
}
#products-detail .products-process .process-list .process-item .main .ico.i4 {
	background-image: url(../images/process-4.png);
	background-size: 40.19607843137% auto;
}
#products-detail .products-process .process-list .process-item .main .name {
	font-size: 26px;
	color: #0382db;
	margin-top: 8.73362445%;
}
#products-detail .products-service {
	padding-top: 80px;
}
#products-detail .products-service .detail-title {
	color: #333;
}
#products-detail .products-service .service-list {
	margin-top: 100px;
	margin-bottom: 30px;
}
#products-detail .products-service .service-list .service-item {
	width: 20%;
}
#products-detail .products-service .service-list .service-item .ico {
	width: 0;
	height: 0;
	background-color: #eee;
	background-repeat: no-repeat;
	background-position: center center;
	padding: 20.588235294117647058823529411765%;
	border-radius: 100%;
	margin: 0 auto;
}
#products-detail .products-service .service-list .service-item .ico.i1 {
	background-image: url(../images/service-1.png);
	background-size: 70% auto;
}
#products-detail .products-service .service-list .service-item .ico.i2 {
	background-image: url(../images/service-2.png);
	background-size: 53.57142857% auto;
}
#products-detail .products-service .service-list .service-item .ico.i3 {
	background-image: url(../images/service-3.png);
	background-size: 50.7142857% auto;
}
#products-detail .products-service .service-list .service-item .ico.i4 {
	background-image: url(../images/service-4.png);
	background-size: 53.57142857% auto;
}
#products-detail .products-service .service-list .service-item .ico.i5 {
	background-image: url(../images/service-5.png);
	background-size: 56.42857142857% auto;
}
#products-detail .products-service .service-list .service-item .name {
	font-family: 'PingFang';
	font-size: 34px;
	color: #333;
	margin-top: 55px;
}
.editor * {
	max-width: 100%;
	line-height: inherit;
	font-family: inherit;
	font-size: inherit;
	color: inherit;
}
#viewPage {
	left: 0;
	right: 0;
	top: 85px;
	bottom: 0;
	background: #1d1d1d;
}
#viewPage .iframePage {
	height: 100%;
	background-color: #eee;
	margin: 0 auto;
}
#viewPage .iframePage iframe {
	width: 100%;
	height: 100%;
}
#instance .instance-list {
	margin-top: 70px;
}
#instance .instance-list .item {
	width: 48.5294117647%;
	background-color: #fff;
	padding: 55px 0 40px;
	margin-bottom: 70px;
}
#instance .instance-list .item.fl {
	clear: both;
}
#instance .instance-list .item .cover {
	width: 64%;
}
#instance .instance-list .item .cover .img {
	width: 100%;
	left: 0;
	top: 4%;
}
#instance .instance-list .item .cover .img img {
	width: 76.923%;
}
#instance .instance-list .item .info {
	width: 33%;
}


#instance .instance-list .item .info .title {
	width: 57%;
	margin: 15px 0 0 4%;
}
#instance .instance-list .item .info .name {
	font-size: 22px;
	color: #333;
}
#instance .instance-list .item .info .date {
	color: #888;
	margin-top: 8px;
}
#instance .instance-list .item .info .brief {
	height: 130px;
	line-height: 26px;
	font-size: 14px;
	color: #888;
	margin-top: 25px;
}
#instance .instance-list .item .info .view {
	width: 130px;
	height: 44px;
	line-height: 44px;
	font-size: 16px;
	color: #fff;
	background-color: #0382db;
	border-radius: 3px;
	margin: 10px auto 0;
}
#price-table {
	border-collapse: collapse;
	margin-top: 100px;
}
#price-table .price-row .pack-title {
	width: 25%;
	line-height: 60px;
}
#price-table .price-row .pack-title {
	background-color: #fafafa;
	border-left: 1px solid #e1e1e1;
	border-top: 1px solid #e1e1e1;
}
#price-table .price-row .pack-title .title-0 {
	font-size: 36px;
	color: #000;
}
#price-table .price-row .pack-title .title-1 {
	font-size: 30px;
	color: #bbb;
}
#price-table .price-row .pack-col {
	width: 25%;
}
#price-table .price-row.r0 .pack-col {
	padding: 50px 0;
}
#price-table .price-row.r0 .pack-col.i0 {
	background-color: #ffc804;
	border-top: 1px solid #ffc804;
}
#price-table .price-row.r0 .pack-col.i1 {
	background-color: #ff4300;
	border-top: 1px solid #ff4300;
}
#price-table .price-row.r0 .pack-col.i2 {
	background-color: #00b3ff;
	border-top: 1px solid #00b3ff;
}
#price-table .price-row.r0 .pack-col .price-title {
	font-family: Arial, 'PingFang';
	font-size: 28px;
	color: #fff;
}
#price-table .price-row.r0 .pack-col .price-title::before, #price-table .price-row.r0 .pack-col .price-title::after {
	width: 40px;
	height: 1px;
	background-color: #fff;
	position: absolute;
	z-index: 1;
	top: 50%;
	content: '';
}
#price-table .price-row.r0 .pack-col .price-title::before {
	right: 110%;
}
#price-table .price-row.r0 .pack-col .price-title::after {
	left: 110%;
}
#price-table .price-row.r0 .pack-col .pack-price {
	font-family: Arial, 'PingFang';
	font-size: 48px;
	color: #fff;
}
#price-table .price-row.r0 .pack-col .pack-price::before {
	font-size:28px;
	position: absolute;
	z-index: 1;
	top: 18px;
	right: 100%;
	content: '円';
}
#price-table .price-row.r0 .pack-col .o-price {
	font-size: 18px;
	color: #fff;
	opacity: .5;
}
#price-table .price-row.r0 .pack-col .o-price::before {
	width: 120%;
	height: 1px;
	background-color: #fff;
	left: -10%;
	top: 50%;
	position: absolute;
	z-index: 1;
	content: '';
}
#price-table .price-row.r1 .pack-col {
	padding: 30px 0 50px;
}
#price-table .price-row.r1 .pack-col.i0 {
	background-color: #ffd306;
}
#price-table .price-row.r1 .pack-col.i1 {
	background-color: #ff5400;
}
#price-table .price-row.r1 .pack-col.i2 {
	background-color: #00c1ff;
}
#price-table .price-row.r1 .pack-col .renewals {
	font-size: 24px;
	color: #fff;
}
#price-table .price-row.r1 .pack-col .renewals span {
	font-size: 36px;
}
#price-table .price-row.r1 .pack-col .renewals span::before {
	font-size: 24px;
	position: relative;
	z-index: 1;
	top: -8px;
	margin: 0 4px 0 8px;
	content: '¥';
}
#price-table .price-row.r1 .pack-col .o-price {
	font-size: 18px;
	color: #fff;
	opacity: .5;
}
#price-table .price-row.r1 .pack-col .o-price::before {
	width: 120%;
	height: 1px;
	background-color: #fff;
	left: -10%;
	top: 50%;
	position: absolute;
	z-index: 1;
	content: '';
}
#price-table .price-row.r1 .pack-col .tips {
	font-size: 16px;
	color: #fff;
	margin: 30px 20px 10px 20px;
}
#price-table .fun-title td {
	line-height: 60px;
	font-size: 18px;
	color: #000;
	background-color: #e1e1e1;
}
#price-table .fun-row .fun-type {
	font-weight: bold;
	font-size: 16px;
	color: #333;
	border: 1px solid #e5e5e5;
}
#price-table .fun-row .fun-title {
	height: 60px;
	line-height: 24px;
	font-size: 16px;
	color: #333;
	border: 1px solid #e5e5e5;
}
#price-table .fun-row .fun-cell {
	font-size: 16px;
	color: #666;
}
#price-table .fun-row.i0 .fun-cell.i0 {
	background-color: #f8f5e7;
}
#price-table .fun-row.i0 .fun-cell.i1 {
	background-color: #f8ece7;
}
#price-table .fun-row.i0 .fun-cell.i2 {
	background-color: #ebf5f9;
}
#price-table .fun-row.i1 .fun-cell.i0 {
	background-color: #eeecdf;
}
#price-table .fun-row.i1 .fun-cell.i1 {
	background-color: #eee3df;
}
#price-table .fun-row.i1 .fun-cell.i2 {
	background-color: #e1ecf1;
}
#tutorial .tutorial-support {
	width: 100%;
	background-color: #323436;
	padding: 24px 0;
}
#tutorial .tutorial-support .left {
	width: 70%;
}
#tutorial .tutorial-support .support-search .text {
	width: 350px;
	height: 60px;
	line-height: 60px;
	font-size: 14px;
	background: #fff url(../images/ico-search.png) no-repeat 15px center;
	padding: 0 10px 0 55px;
	border: 0;
	border-radius: 5px;
}
#tutorial .tutorial-support .ico {
	font-size: 16px;
	color: #fff;
}
#tutorial .tutorial-support .play {
	line-height: 60px;
	background: url(../images/ico-play.png) no-repeat left center;
	padding-left: 40px;
	margin-left: 4%;
}
#tutorial .tutorial-support .file {
	line-height: 60px;
	background: url(../images/ico-file.png) no-repeat left center;
	padding-left: 35px;
}
#tutorial .tutorial-support .question {
	line-height: 60px;
	background: url(../images/ico-question.png) no-repeat left center;
	padding-left: 45px;
}
#tutorial .tutorial-support .line {
	width: 1px;
	height: 60px;
	background-color: #383939;
	margin: 0 3%;
}
#tutorial .tutorial-list {
	min-height: 300px;
}
#tutorial .tutorial-list .item {
	width: 44.70588%;
	padding: 45px 0;
	border-top: 1px solid #e5e5e5;
}
#tutorial .tutorial-list .item:nth-child(1), #tutorial .tutorial-list .item:nth-child(2) {
	border-top: 0;
}
#tutorial .tutorial-list .item .date {
	width: 20%;
}
#tutorial .tutorial-list .item .date .year {
	font-size: 16px;
	color: #666;
	margin: 6px 0 15px;
}
#tutorial .tutorial-list .item .date .day {
	font-size: 34px;
	color: #222;
}
#tutorial .tutorial-list .item .info {
	width: 80%;
}
#tutorial .tutorial-list .item .info .name {
	font-size: 20px;
	color: #222;
}
#tutorial .tutorial-list .item .info .name a {
	font-size: inherit;
	color: inherit;
}
#tutorial .tutorial-list .item .info .name a:hover {
	color: #0382db;
}
#tutorial .tutorial-list .item .info .brief {
	height: 72px;
	line-height: 24px;
	font-size: 14px;
	color: #888;
	margin-top: 20px;
}
#info-detail {
	min-height: 300px;
}
#info-detail .top .info-title {
	font-size: 26px;
}
#info-detail .top span {
	font-size: 14px;
	color: #666;
	margin: 0 1%;
}
#contact .contact-info {
	border-bottom: 1px solid #e5e5e5;
	margin-bottom: 60px;
}
#contact .contact-info .item {
	width:33%;
	padding: 60px 0 20px;
}
#contact .contact-info .item .ico {
	height: 70px;
}
#contact .contact-info .item .title {
	font-size: 14px;
	color: #888;
	margin-bottom: 15px;
}
#contact .contact-info .item .info {
	height: 96px;
	line-height: 32px;
	font-family: Arial;
	font-size: 20px;
	color: #333;
}
#contact .contact-info .item .info a {
	font-size: inherit;
	color: inherit;
}
#contact .contact-info .item .button {
	width: 30.588235%;
	height: 38px;
	line-height: 38px;
	font-size: 14px;
	color: #fff;
	background-color: #0382db;
	border-radius: 3px;
	margin: 0 auto;
}
#contact .map {
	width: 50%;
}
#contact .map .img-0 {
	opacity: 0;
}
#contact .map .img-1 {
	right: 0;
	top: 0;
}
#contact .contact-area {
	width: 100%;
}
#contact .contact-area .contact-info2 {
	background-color: #f7f7f7;
	padding: 25px 55px 30px;
	text-align: center;
}
#contact .contact-area .contact-info2 .title {
	line-height: 46px;
	font-size: 26px;
	color: #222;
}
#contact .contact-area .contact-info2 .address {
	line-height: 36px;
	font-size: 16px;
	color: #333;
	margin-bottom: 25px;
}
#contact .contact-area .contact-info2 .line {
	width: 1px;
	height: 85%;
	background-color: #ececec;
	left: 50%;
	top: 6.8376%;
}
#contact .contact-area .contact-info2 .qrcode {
	width: 40%;
}
#contact .contact-area .contact-info2 .qrcode .img {
	width: 40%;
	max-width: 117px;
}
#contact .contact-area .contact-info2 .qrcode .name {
	width: 57.241379%;
	height: 100%;
	line-height: 34px;
	font-size: 16px;
	color: #888;
	margin-top: 5%;
}
#contact .contact-area .contact-info2 .qrcode .name * {
	font-size: inherit;
	color: inherit;
}
#contact .contact-area .contact-form {
	width: 93.41317%;
	margin-top: 20px;
}
#contact .contact-area .contact-form .text {
	width: 26.923%;
	height: 30px;
	line-height: 30px;
	font-size: 16px;
	color: #333;
	background-color: #fff;
	padding: 10px 0;
	border-width: 0 0 1px 0;
	border-style: solid;
	border-color: #999;
	margin-left: 9.6153846%;
	box-sizing: content-box;
}
#contact .contact-area .contact-form .text:first-child {
	margin-left: 0;
}
#contact .contact-area .contact-form .area {
	width: 100%;
	height: 100px;
	line-height: 30px;
	font-family: inherit;
	font-size: 16px;
	color: #333;
	background-color: #fff;
	padding: 10px 0;
	border-width: 0 0 1px 0;
	border-style: solid;
	border-color: #999;
	margin: 15px 0;
	resize: none;
	box-sizing: content-box;
}
#contact .contact-area .contact-form .button {
	width: 26.923%;/*width: 150px;*/
	height: 50px;
	font-size: 14px;
	color: #fff;
	background-color: #6d6d6d;
	border: 0;
	border-radius: 3px;
	cursor: pointer;
}
#contact .contact-area .contact-form .code-img {
	width: 26.923%;
	height: 50px;
	margin-left: 9.6153846%;
}
#contact .contact-area .contact-form .code-img img {
	width: 100%;
	height: 100%;
}
#inquire {
	margin-top: 100px;
}
#inquire .product-cover {
	width: 30.294117647%;
	margin-right: 2.647%;
	vertical-align: top;
}
#inquire .product-cover .img {
	width: 100%;
	left: 0;
	top: 4%;
}
#inquire .product-cover .img img {
	width: 76.923%;
}
#inquire .phone-form {
	width: 300px;
	vertical-align: top;
}
#inquire .phone-form .name {
	font-size: 16px;
	color: #555;
}
#inquire .phone-form .code-text {
	padding-right: 125px;
}
#inquire .phone-form .code-btn {
	width: 108px;
	height: 48px;
	line-height: 48px;
	font-size: 14px;
	color: #000;
	background-color: #ddd;
	border: 0;
	right: 2px;
	top: 2px;
	cursor: pointer;
}
#inquire .try-form {
	width: 100%;
	max-width: 420px;
	margin: 0 auto;
}
#login {
	margin-top: 75px;
}
#login .login-form {
	width: 100%;
	max-width: 480px;
	padding: 70px 3% 40px;
	margin: 0 auto;
	border: 1px solid #eeeff2;
	box-shadow: 0 0 3px rgba(0,0,0,.1);
}
#login .login-form .code-text {
	width: 61%;
}
.website-form-top .website-form-title {
	font-size: 44px;
	color: #333;
}
.website-form-top .website-form-title::before, .website-form-top .website-form-title::after {
	width: 115px;
	height: 1px;
	background-color: #e1e1e1;
	position: absolute;
	z-index: 1;
	top: 50%;
	content: '';
}
.website-form-top .website-form-title::before {
	right: 120%;
}
.website-form-top .website-form-title::after {
	left: 120%;
}
.website-form-top .website-form-brief {
	line-height: 24px;
	font-size: 14px;
	color: #666;
	margin-top: 10px;
}
.website-form a {
	color: #0382db;
	font-size: inherit;
}
.website-form a:hover {
	text-decoration: underline;
}
.website-form label {
	font-weight: normal;
	font-size: 14px;
	color: #aaa;
}
.website-form .text {
	height: 52px;
	line-height: 52px;
	font-size: 14px;
	color: #333;
	background-color: #fff;
	padding: 0 15px;
	border: 1px solid #dfdfdf;
}
.website-form .text.block {
	width: 100%;
}
.website-form .text.half_block {
	width: 60%;
}
.website-form .get-btn {
	display: inline-block;
	width: 39%;
	height: 52px;
	line-height: 52px;
	text-align: center;
	color: #fff;
	border: none;
	background: #0382db;
	cursor: pointer;
}
.website-form .area {
	width: 100%;
	line-height: 20px;
	font-size: 14px;
	color: #333;
	background-color: #fff;
	padding: 15px;
	border: 1px solid #dfdfdf;
	resize: none;
}
.website-form .big-avater {
	width: 200px;
	height: 200px;
	border: 5px solid #ddd;
	border-radius: 100%;
	margin: 0 auto;
}
.website-form .big-avater input[type='file'] {
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	opacity: 0;
	cursor: pointer;
}
.website-form .submit {
	width: 100%;
	height: 52px;
	line-height: 52px;
	font-size: 16px;
	color: #fff;
	background-color: #0382db;
	border: 0;
}
/*.btn-group .btn{font-size: 16px;}
.dropdown-menu > li > a{font-size: 14px;}*/

#follow {
	right: 0;
	bottom: 40%;
	position: fixed;
	z-index: 10;
}
#follow .item {
	width: 40px;
	height: 40px;
}
#follow .item .ico {
	width: 40px;
	height: 40px;
	line-height: 40px;
	color: #fff;
	background-color: rgba(30,30,30,.6);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 50% auto;
	text-align: center;
	left: 0;
	top: 0;
}
#follow .item .red {
	background-color: #ea493c;
}
#follow .item .blue {
	background-color: #3da8e5;
}
#follow .item .green {
	background-color: #24b727;
}
#follow .item .orange {
	background-color: #ffbe33;
}
#follow .totop {
	opacity: 0;
}
#follow .totop.show {
	opacity: 1;
}
#follow .item.open[row='1'] {
	height: 90px;
}
#follow .item.open[row='2'] {
	height: 126px;
}
#follow .item.open[row='3'] {
	height: 162px;
}
#follow .item.open[row='4'] {
	height: 198px;
}
#follow .item.open[row='5'] {
	height: 234px;
}
#follow .top {
	line-height: 24px;
	font-size: 14px;
	color: #fff;
	padding: 15px;
}
#follow .top a {
	line-height: inherit;
	font-size: 16px;
	color: inherit;
}
#follow .item [id] {
	width: 140px;
	background-color: #fff;
	left: 40px;
	position: relative;
	z-index: 1;
	-webkit-transition: all 300ms ease 0s;
	-moz-transition: all 300ms ease 0s;
	-ms-transition: all 300ms ease 0s;
	-o-transition: all 300ms ease 300ms;
	transition: all 300ms ease 0s;
}
#follow .qq-list .list {
	line-height: 20px;
	padding: 8px 25px;
}
#follow .qq-list .list span {
	margin-right: 10px;
}
#follow .qq-list .list:hover {
	color: #fff;
	background-color: #3da8e5;
}
#openHotline .ico {
	background: url(../images/p-phone.png) no-repeat center center;
}
#hotline .top {
	background-color: #ffbe33;
}
#online .top {
	background-color: #3da8e5;
}
#follow .item[id^='open'] .ico {
	left: 0;
	-webkit-transition: all 300ms ease 600ms;
	-moz-transition: all 300ms ease 600ms;
	-ms-transition: all 300ms ease 600ms;
	-o-transition: all 300ms ease 600ms;
	transition: all 300ms ease 600ms;
}
#follow .item[id^='open'] {
	-webkit-transition: all 300ms ease 300ms;
	-moz-transition: all 300ms ease 300ms;
	-ms-transition: all 300ms ease 300ms;
	-o-transition: all 300ms ease 300ms;
	transition: all 300ms ease 300ms;
}
#follow .item.open {
	-webkit-transition: all 300ms ease 300ms;
	-moz-transition: all 300ms ease 300ms;
	-ms-transition: all 300ms ease 300ms;
	-o-transition: all 300ms ease 300ms;
	transition: all 300ms ease 300ms;
}
#follow .item.open .ico {
	left: 100%;
	-webkit-transition: all 300ms ease 0s;
	-moz-transition: all 300ms ease 0s;
	-ms-transition: all 300ms ease 0s;
	-o-transition: all 300ms ease 0s;
	transition: all 300ms ease 0s;
}
#follow .item.open [id] {
	left: -100px;
	box-shadow: 0 5px 10px rgba(4, 0, 0, 0.2);
	-webkit-transition: all 300ms ease 600ms;
	-moz-transition: all 300ms ease 600ms;
	-ms-transition: all 300ms ease 600ms;
	-o-transition: all 300ms ease 600ms;
	transition: all 300ms ease 600ms;
}
#follow #wechat-qrcode {
	width: auto;
	max-width: 200px;
	left: auto;
	right: 100%;
	bottom: 0;
	position: absolute;
	display: none;
	-webkit-transition: all 0s ease 0s;
	-moz-transition: all 0s ease 0s;
	-ms-transition: all 0s ease 0s;
	-o-transition: all 0s ease 0s;
	transition: all 0s ease 0s;
}
#footer_alert {
	width: 100%;
	height: 58px;
	position: fixed;
	left: 0;
	bottom: -100px;
	background: #e9e9e9;
	background: rgba(233,233,233,0.9);
	z-index: 999;
}
#footer_alert .wrap {
	position: relative;
	height: 100%;
}
#footer_alert .img {
	width: 96px;
	height: 66px;
	position: absolute;
	left: 240px;
	bottom: 7px;
}
#footer_alert .txt {
	font-size: 24px;
	color: #535353;
	line-height: 58px;
	margin-left: 380px;
	float: left;
}
#footer_alert .txt span {
	font-family: "Arial";
	font-size: 32px;
	color: #3eb3a0;
	margin: 0 10px;
	vertical-align: bottom;
}
#footer_alert .btn {
	width: 166px;
	height: 38px; /*line-height:38px;*/
	font-size: 16px;
	color: #fff;
	float: right;
	margin-right: 200px;
	margin-top: 11px;
	background: #48bdaa;
	display: inline-block;
	text-decoration: none;
	text-align: center;
	-moz-border-radius: 19px;
	-ms-border-radius: 19px;
	-o-border-radius: 19px;
	-webkit-border-radius: 19px;
	border-radius: 19px;
}
#footer_alert .btn i {
	width: 27px;
	height: 22px;
	left: 15px;
	top: 7px;
	background: url(../images/icons.png) no-repeat;
	background-position: -37px -3px;
}
#footer_alert .close {
	width: 25px;
	height: 25px;
	float: right;
	cursor: pointer;
	margin-right: 10px;
	margin-top: 17px;
}
#footer_alert .close i {
	width: 25px;
	height: 25px;
	left: 0;
	top: 0;
	background: url(../images/icons.png) no-repeat;
	background-position: -456px -398px;
}
.team-list .item {
	width: 11.11111111%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 100% 100%;
}
.team-list .item.item0 {
	background-image: url(../images/team-bg-0.jpg);
}
.team-list .item.item1 {
	background-image: url(../images/team-bg-1.jpg);
}
.team-list .item:hover {
	z-index: 2;
}
 @media only screen and (max-width: 1440px) {
header nav {
	margin-left: -220px;
}
header nav .nav-item {
	width: 100px;
}
header .header-user .try {
	width: 100px;
}
#banner .item-0 .font span {
	font-size: 42px;
}
#about .about-brief .brief {
	line-height: 26px;
}
#about .number .i .n {
	font-size: 50px;
}
/*#products-detail .products-side .rows{padding-left: 4%;padding-right: 4%;}
	#products-detail .products-side .product .button{width: 75px;height: 75px;line-height: 75px;}*/

#products-detail .products-process .process-list .process-item {
	width: 14%;
	margin: 0 4.29412%;
}
#instance .instance-list .item .cover {
	width: 57%;
}
#instance .instance-list .item .info {
	width: 42%;
}
#instance .instance-list .item .info .logo {
	width: 70px;
	height: 70px;
}
#instance .instance-list .item .info .title {
	margin-top: 6px;
}
#instance .instance-list .item .info .name {
	font-size: 20px;
}
}
 @media only screen and (max-width: 1300px) {
.show1300 {
	display: block;
}
.hide1300 {
	display: none;
}
#products-box .products-list .item .cover .opt .button-bg {
	padding: 10px 15px;
}
#products-box .products-list .item .cover .opt .button {
	width: 60px;
	height: 60px;
	line-height: 60px;
	font-size: 14px;
}
#products-box .products-list .item .cover .opt .links {
	margin-top: auto;
}
.index-tutorial .tutorial-support {
	width: 100%;
	height: 150px;
	position: relative;
}
.index-tutorial .tutorial-support .support-search {
	margin-left: 2%;
	float: left;
}
.index-tutorial .tutorial-list .item .date .day {
	font-size: 28px;
}
#about .item {
	width: 100%;
	max-width: 850px;
	margin: 0 auto;
	float: none;
}
#about .about-brief {
	margin-top: 20px;
	margin-bottom: 20px;
}
#about .number {
	height: 260px;
	position: relative;
}
#about .number .i .n {
	margin: 55px 0 50px;
}
#products-detail .detail {
	width: 100%;
	float: none;
	clear: both;
}
#products-detail .products-side {
	width: 100%;
	max-width: 450px;
	margin-bottom: 20px;
}
#price-table .price-row .pack-title .title-0 {
	font-size: 22px;
}
#price-table .price-row .pack-title .title-1 {
	font-size: 16px;
}
#price-table .price-row.r0 .pack-col .price-title {
	font-size: 34px;
}
#price-table .price-row.r0 .pack-col .pack-price {
	font-size: 42px;
}
#price-table .price-row.r1 .pack-col .renewals {
	font-size: 18px;
}
#price-table .price-row.r1 .pack-col .renewals span {
	font-size: 28px;
}
#price-table .price-row.r1 .pack-col .renewals span::before {
	font-size: 20px;
}
#price-table .price-row.r0 .pack-col .o-price {
	font-size: 16px;
}
#price-table .price-row.r1 .pack-col .o-price {
	font-size: 16px;
}
#price-table .price-row.r2 .pack-col .o-price {
	font-size: 16px;
}
#price-table .price-row.r1 .pack-col .tips {
	font-size: 12px;
}
#tutorial .tutorial-list .item {
	width: 48%;
}
#tutorial .tutorial-list .item .date .day {
	font-size: 28px;
}
#contact .contact-area .contact-info2 .qrcode {
	width: 100%;
	float: none;
}
}


 @media only screen and (max-width: 1024px) {
.show992 {
	display: block;
}
.hide992 {
	display: none;
}
#body.left {
	-ms-transform: translateX(-60%);
	-moz-transform: translateX(-60%);
	-webkit-transform: translateX(-60%);
	-o-transform: translateX(-60%);
	transform: translateX(-60%);
}
header {
	height: 60px;
	background-color: #2a3f54;
	padding-top: 15px;
	padding-bottom: 15px;
	box-shadow: 0 1px 5px rgba(0,0,0,.3);
}
header.left {
	left: -60%;
}
header #logo {
	height: 50px;
	top: -10px;
}
header nav {
	width: 60%;
	height: 100%;
	line-height: 60px !important;
	background-color: #35587a;
	border-left: 1px solid #555;
	margin: 0;
	top: 0;
	right: -60%;
	left: auto;
	position: fixed !important;
	overflow: auto;
}
header nav.open {
	right: 0;
}
header nav .title {
	width: 100%;
	height: 60px;
	background-color: #2a3f5463;
}
header nav .title .btn-close {
	width: 32px;
	height: 100%;
	line-height: inherit;
	background-image: url(../img/ico-close.png);
	background-repeat: no-repeat;
	background-position: center center;
	margin-right: 8%;
}
/*header nav .title .btn-close:hover{-ms-transform: rotate(180deg);-moz-transform: rotate(180deg);-webkit-transform: rotate(180deg);-o-transform: rotate(180deg);transform: rotate(180deg);}*/
header nav .nav-item {
	width: 100%;
	border-bottom: 1px solid #eee;
	position: relative;
	z-index: 1;
	text-align: left;
	float: none;
}
header nav .nav-item a {
	padding: 0 8%;
	display: block;
}
header nav .nav-item a::after {
	line-height: inherit;
	position: absolute;
	top: 0;
	right: 8%;
	z-index: 1;
	content: "\f054";
	display: inline-block;
	font-family: FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-transition: all 300ms ease 0s;
	-moz-transition: all 300ms ease 0s;
	-ms-transition: all 300ms ease 0s;
	-o-transition: all 300ms ease 0s;
	transition: all 300ms ease 0s;
}
header nav .member {
	padding: 0 8%;
	margin-top: 10px;
}
header nav .member .member-btn {
	height: 30px;
	line-height: 30px;
	font-size: 16px;
	color: #555;
	padding: 5px 10px;
	border: 1px solid #ddd;
	border-radius: 5px;
	margin-right: 3%;
	margin-bottom: 10px;
}
header nav .member .member-btn:hover {
	color: #fff;
	background-color: #0382db;
	border-color: #0382db;
}
header nav .member .member-btn a {
	font-size: inherit;
	color: inherit;
}
header nav .member .login i {
	width: 18px;
	height: 18px;
	background: url(../images/ico-user-0.png) no-repeat;
	margin-right: 10px;
	top: -2px;
	position: relative;
	z-index: 1;
	display: inline-block;
	vertical-align: middle;
}
header nav .member .login i::after {
	width: 100%;
	height: 100%;
	background: url(../images/ico-user-1.png) no-repeat;
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	opacity: 0;
	content: '';
	-webkit-transition: all 300ms ease 0s;
	-moz-transition: all 300ms ease 0s;
	-ms-transition: all 300ms ease 0s;
	-o-transition: all 300ms ease 0s;
	transition: all 300ms ease 0s;
}
header nav .member .login:hover i::after {
	opacity: 1;
}
header .menu-button {
	line-height: 30px;
	color: #fff;
}
header .preview-button {
	width: auto;
	margin: 0;
	left: auto;
	right: 8%;
}
#header-blank {
	height: 60px;
}
.usp-card-icon {
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    color: #212121;
    height: 56px;
    width: 56px;
	margin: 10px auto;
	
}
.usp-card .usp-card-title{
    font-size: 15px;
    font-weight: 600;
    line-height: 1.5;
    margin-top: 8px
}

.usp-card .usp-card-desc{
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    margin-top: 4px
}
.theme-content{margin: 20px 0;}
.theme-card{margin: 10px 0;}
   
	      .card-list .driver-grid {
	           display: grid;
	           /* 修改为固定两列 */
	           grid-template-columns: repeat(4, 1fr);
	           gap: 2rem;
	           max-width: 1200px;
	           margin: 0 auto;
	       }
				.cta-button{display: none;}
				.form-btn{display: block;width: 100%;}
	       /* 添加响应式设计 */
	       @media (max-width: 768px) {
			   #search-wrapper{margin-top:39px;background-size:auto}
					.cta-button{display: block;}
					.driver-grid {
					     margin: 10px auto 0 auto;
					 }
					/* CTA按钮 */
					.cta-button {
					    background: var(--accent-orange);
					        color: white;
					        padding: 0.8rem 0 0.8rem 0;
					        border: none;
					        border-radius: 5px;
					        cursor: pointer;
					        max-width: 1000px;
					        width: 100%;
					        margin: 0 auto;
					        font-size: 1.1rem;
					        transition: background 0.3s;
					}
					
					.cta-button:hover {
					    background: #FF4500;
					}
	        .card-list  .drivers{padding: 10px;}
	        .card-list   .driver-img{height: 100px;}
	           /* 可选：调整司机卡片在小屏幕的显示 */
	       .card-list  .driver-grid {
	             gap: 10px;
	         }
				 .card-list .driver-info{padding: 10px;font-size: 14px;}
				 .card-list .driver-info h3{font-size:0.8rem;}
				 .card-list .driver-info .desc{display: none;}
				 .desktop_activityCard__start_time_3HepX{display: none;}
				 .card-list .driver-grid {
				      display: grid;
				      /* 修改为固定两列 */
				      grid-template-columns: repeat(2, 1fr);
				  }
	       }
		
	       /* 保持其他样式不变 */
	     .card-list  .driver-card {
	           border: 1px solid #ddd;
	           border-radius: 8px;
	           overflow: hidden;
	           transition: transform 0.3s;
	       }
		   
		           /* 司机展示 */
		           .drivers {
		               padding: 10px;
		           }
		   		.form-group {
		   		    margin-bottom: 1.5rem;
		   		}
		   	input, textarea,select {
		   		   width: 100%;
		   		       padding: 0.8rem 0 0.8rem 0;
		   		       border: 1px solid #ddd;
		   		       border-radius: 5px;
		   		       font-size: 1rem;
		   		       text-indent: 1rem;
		   		}
		           .driver-grid {
		               display: grid;
		               grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
		               gap: 2rem;
		               max-width: 1200px;
		               margin: 0 auto;
		           }
		   
		           .driver-card {
		               border: 1px solid #ddd;
		               border-radius: 8px;
		               overflow: hidden;
		               transition: transform 0.3s;
		           }
		   
		           .driver-card:hover {
		               transform: translateY(-5px);
		           }
		   
		           .driver-img {
		               width: 100%;
		               height:165px;
		               object-fit: cover;
		           }
		   
		           .driver-info {
		               padding: 0;
		           }
		   
		           .driver-rating {
		               color: var(--accent-orange);
		               font-weight: bold;
		               margin-top: 0;
		           }
		   
		           /* CTA按钮 */
		           .cta-button {
		               background: var(--accent-orange);
		               color: white;
		               padding: 1rem 2rem;
		               border: none;
		               border-radius: 5px;
		               cursor: pointer;
		               font-size: 1.1rem;
		               transition: background 0.3s;
		           }
		   
		           .cta-button:hover {
		               background: #FF4500;
		           }
		   		.desktop_activityCard__start_time_3HepX{font-size: 12px;
		       line-height: 14px;
		   	margin-top: 5px;
		       color: #757575;
		       -webkit-box-flex: 1;
		       flex-grow: 1;
		       display: -webkit-box;
		       display: flex;
		       -webkit-box-align: end;
		       align-items: flex-end;
		   }
		   
		   .desktop_activityCard__price_G6YKz {
		       font-size: 18px;
		       line-height: 20px;
		       display: -webkit-box;
		       display: flex;
		       -webkit-box-align: center;
		       align-items: center;
		       margin-top: 2px;
		       -webkit-box-flex: 0;
		       flex: none;
		   	margin-top: 10px;
		   	font-weight: bold;
		   }
		   .card-list .driver-info h3{
		       font-size: 14px;
		       line-height: 1.32;
		       font-weight: 500;
		       margin-bottom: 5px;
		       white-space: pre-wrap;
		       display: -webkit-box;
		       overflow: hidden;
		       -webkit-line-clamp: 2;
		       -webkit-box-orient: vertical;
		       }
		   .card-list .driver-info p{font-size: 12px;margin-top: 0;color: #000000;line-height: 18px;line-height: 20px;}
		   .commit{font-size: 12px;color: #666;font-weight: normal;/* margin-left: 5px; */width: 100%;}
		   /* 响应式设计 */
		   @media (max-width: 768px) {
			   .nav-links {
				   display: none;
			   }
			   .hero h1 {
				   font-size: 2rem;
			   }
		   }

    /* 响应式设计 */
    @media (max-width: 1200px) {
        .carpool-list .driver-grid {
            grid-template-columns: repeat(3, 1fr);
        }
    }
    
    @media (max-width: 992px) {
        .carpool-list .driver-grid {
            grid-template-columns: repeat(2, 1fr);
        }
    }
    
    @media (max-width: 768px) {
        .carpool-list .driver-grid {
            grid-template-columns: repeat(3, 1fr);
            gap: 1rem;
        }
        
        .carpool-list .driver-img {
            height: 100px;
        }
        
        .carpool-list .driver-info {
            padding: 0.75rem;
        }
        
        .carpool-list h3 {
            font-size: 0.8rem;
        }
        
        .carpool-list .desc {
            display: none;
        }
        
        .carpool-list .desktop_activityCard__price_G6YKz {
            font-size: 1rem;
        }
        
        .carpool-list .desktop_activityCard__start_time_3HepX {
            font-size: 0.75rem;
        }
    }
    
    @media (max-width: 576px) {
        .carpool-list .driver-grid {
            grid-template-columns: repeat(3, 1fr);
            gap: 0.75rem;
        }
        
        .carpool-list .driver-img {
            height: 80px;
        }
        
        .carpool-list .driver-info {
            padding: 0.5rem;
        }
        
        .carpool-list h3 {
            /* font-size: 0.75rem; */
            /* margin-bottom: 0.25rem; */
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2; /* 控制显示的行数 */
            overflow: hidden;
            text-overflow: ellipsis;
        }
        
        .carpool-list .desktop_activityCard__price_G6YKz {
            font-size: 0.875rem;
        }
        
        .carpool-list .driver-rating .commit {
            display: none;
        }
        
        .carpool-list .rounded-full {
           margin-left:0;text-align: left;
        }
		.desktop_activityCard__price_icon_2P1Wv{display: none;}
    }
	
	    
	    /* 响应式设计 */
	    @media (max-width: 1200px) {
	        .driver-selection .driver-grid {
	            grid-template-columns: repeat(3, 1fr);
	        }
	    }
	    
	    @media (max-width: 992px) {
	        .driver-selection .driver-grid {
	            grid-template-columns: repeat(2, 1fr);
	        }
	    }
	    
	    @media (max-width: 768px) {
	        .driver-selection .driver-grid {
	            grid-template-columns: repeat(3, 1fr);
	            gap: 1rem;
	        }
	        
	        .driver-selection .driver-avatar {
	            height: 120px;
	        }
	        
	        .driver-selection .driver-info {
	            padding: 0.75rem;
	        }
	        
	        .driver-selection h3 {
	            font-size: 0.875rem;
	        }
	        
	        .driver-selection .desc {
	            display: none;
	        }
	        
	        .driver-selection .driver-rating .text-primary {
	            font-size: 0.875rem;
	        }
	        
	        .driver-selection .commit {
	            font-size: 0.75rem;
	        }
	        
	        .driver-selection .stat-value {
	            font-size: 0.875rem;
	        }
	        
	        .driver-selection .stat-label {
	            font-size: 0.625rem;
	        }
	        
	        .driver-selection .language-tag {
	            font-size: 0.625rem;
	            padding: 0.15rem 0.35rem;
	        }
	        
	        .driver-selection .btn-select {
	            padding: 0.5rem 0;
	            font-size: 0.875rem;
	        }
	    }
	    
	    @media (max-width: 576px) {
	        .driver-selection .driver-grid {
	            grid-template-columns: repeat(3, 1fr);
	            gap: 0.75rem;
	        }
	        
	        .driver-selection .driver-avatar {
	            height: 95px;
	        }
	        
	        .driver-selection .driver-info {
	            padding: 0.1rem 0.2rem 0.5rem 0.2rem;
	        }
	        
	        .driver-selection .driver-name {
	            /* flex-direction: column; */
	            align-items: center;
	        }
			.driver-name h3{width: 70%;overflow:hidden}
	        
	        .driver-selection .driver-name h3 {
	            /* margin-bottom: 0.25rem; */
	        }
	            img{  vertical-align: top; 
            }
			   
			        .comment-section {
			            background: white;
			            border-radius: 12px;
			            box-shadow: 0 5px 20px rgba(0, 0, 0, 0.08);
			            overflow: hidden;
			            margin-bottom: 5px;
			        }
			        
			        .comment-section h3 {
			            background: linear-gradient(135deg, #4b6cb7, #182848);
			            color: white;
			            padding: 18px 20px;
			            font-size: 20px;
			            position: relative;
			            border-radius: 10px;
			        }
			        
			        .emline {
			            position: absolute;
			            left: 0;
			            top: 50%;
			            transform: translateY(-50%);
			            width: 5px;
			            height: 24px;
			            background: #FF6B35;
			            border-radius: 0 3px 3px 0;
			        }
			        
			        .image-container {
			            padding: 20px;
			            border-bottom: 1px solid #eee;
			        }
			        
			        .image-container img {
			            /* display: block; */
			            width: 100%;
			            /* border-radius: 8px; */
			            /* box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1); */
			            /* margin-bottom: 15px; */
			            /* transition: transform 0.3s ease; */
			        }
			        
			        .image-container img:hover {
			            transform: translateY(-5px);
			        }
			        
			        .folded-images {
			            max-height: 0;
			            overflow: hidden;
			            transition: max-height 0.8s ease;
			        }
			        
			        .show-all .folded-images {
			            max-height: 3000px; /* 足够大的值容纳所有图片 */
			        }
			        
			        .toggle-button {
			            display: block;
			            width: 200px;
			            margin: 15px auto;
			            padding: 12px 20px;
			            background: linear-gradient(to right, #3498db, #1abc9c);
			            color: white;
			            border: none;
			            border-radius: 30px;
			            font-size: 16px;
			            font-weight: 600;
			            cursor: pointer;
			            transition: all 0.3s ease;
			            box-shadow: 0 4px 15px rgba(52, 152, 219, 0.3);
			        }
			        
			        .toggle-button:hover {
			            transform: translateY(-3px);
			            box-shadow: 0 6px 20px rgba(52, 152, 219, 0.4);
			        }
			        
			        .toggle-button:active {
			            transform: translateY(1px);
			        }
			        
			        .toggle-button::after {
			            content: "▼";
			            display: inline-block;
			            margin-left: 8px;
			            transition: transform 0.3s ease;
			        }
			        
			        .show-all .toggle-button::after {
			            transform: rotate(180deg);
			        }
			        
			        .faq-container {
			            padding: 25px 30px;
			            /* background: #f9fbfd; */
			        }
			        
			        .klk-markdown {
			            border-left: 4px solid #3498db;
			            padding-left: 20px;
			        }
			        
			        .klk-markdown h4 {
			            color: #2c3e50;
			            margin: 18px 0 10px;
			            font-size: 18px;
			            position: relative;
			        }
			        
			        .klk-markdown h4:first-child {
			            margin-top: 0;
			        }
			        
			        .klk-markdown p {
			            color: #555;
			            margin-bottom: 15px;
			            padding-left: 10px;
			        }
			        
			        .highlight {
			            background-color: #e3f2fd;
			            padding: 3px 6px;
			            border-radius: 4px;
			            color: #1976d2;
			            line-height: 30px;
			        }
			        
			        @media (max-width: 768px) {
			           
			            .comment-section h3 {
			                padding: 10px 20px;
			                font-size: 18px;
			            }
			            
			            .image-container {
			                padding: 0;
			            }
			            
			            .faq-container {
			                padding: 20px 00;
			            }
			            
			            .klk-markdown {
			                padding-left: 15px;
			            }
			        }
	        .driver-selection .driver-tag {
	            font-size: 0.625rem;
	            padding: 0.1rem 0.2rem;
	            text-align: center;
	        }
	        
	        .driver-selection .driver-rating {
	            /* display: none; */
	        }
	        
	        .driver-selection .driver-stats {
	            margin-bottom: 0.5rem;
	        }
	        
	        .driver-selection .stat-value {
	            font-size: 0.75rem;
	        }
	        
	        .driver-selection .stat-label {
	            font-size: 0.5rem;
	        }
	        
	        .driver-selection .driver-languages {
	            display: none;
	        }
	        
	        .driver-selection .btn-select {
	            padding: 0.35rem 0;
	            font-size: 0.75rem;
	        }
	    }