/* ============================================================
   联系我们栏目（联系我们 / 在线留言 / 客户中心）
   内容克隆自 www.jh-esd.com 对应三个页面，
   这里放：① 内容依赖的编辑器基础样式  ② 来源页面的模块样式
   ============================================================ */

/* ---------- ① 编辑器内容基础（来源 metinfo.css / basic.css 中相关部分） ---------- */
.met-editor {
    width: 100%;
    max-width: 100%;
    font-size: 16px;
    line-height: 1.8;
}

.met-editor * {
    max-width: 100%;
}

.met-editor p {
    margin-top: 0;
    margin-bottom: 0.8em;
}

.met-editor img {
    max-width: 100% !important;
    height: auto;
    vertical-align: top;
}

.met-editor iframe {
    max-width: 100%;
}

.met-editor table {
    max-width: 100%;
    margin: 0 0 10px;
    border-collapse: collapse;
    background-color: transparent;
    color: #333;
}

.met-editor table p {
    margin-bottom: 0;
}

.met-editor table th,
.met-editor table td {
    padding: 0.572rem;
    vertical-align: middle;
    outline: none;
}

.met-editor table:not([border="0"]) th,
.met-editor table:not([border="0"]) td {
    border: 1px solid #ddd;
}

/* ---------- ② 来源模块样式：banner（show_cn.css / message_index_cn.css） ---------- */
.banner_met_95_3_2 {
    width: 100%;
    height: auto;
    display: table;
    top: 0;
}

.banner_met_95_3_2 .slick-slide {
    display: block;
    width: 100%;
    height: auto;
    position: relative;
    overflow: hidden;
}

.banner_met_95_3_2 .slick-slide img {
    display: none;
    min-height: 100px;
    width: 100%;
    height: auto;
}

.banner_met_95_3_2 .slick-slide:nth-child(1) img {
    display: block !important;
    height: auto;
}

.banner_met_95_3_2 .banner-text {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 12;
}

.banner_met_95_3_2 .banner-text h4,
.banner_met_95_3_2 .banner-text p {
    color: #fff;
}

@media (max-width: 767px) {
    .banner_met_95_3_2 {
        min-height: auto;
    }

    .banner_met_95_3_2 .slick-slide img {
        min-height: auto;
    }
}

/* ---------- ② 来源模块样式：栏目导航（subcolumn_nav_met_95_1_13 / _19） ---------- */
.subcolumn_nav_met_95_1_13,
.subcolumn_nav_met_95_1_19 {
    background: #ffffff;
    padding: 10px 0;
    border-bottom: 1px solid #eeeeee;
}

.subcolumn_nav_met_95_1_13 .container,
.subcolumn_nav_met_95_1_19 .container {
    padding-right: 15px;
    padding-left: 15px;
    margin-right: auto;
    margin-left: auto;
}

.subcolumn_nav_met_95_1_13 .card,
.subcolumn_nav_met_95_1_19 .card {
    width: 100%;
    margin: 0;
    border-radius: 5px !important;
}

.subcolumn_nav_met_95_1_13 .card .sidebar-tile,
.subcolumn_nav_met_95_1_19 .card .sidebar-tile {
    text-align: center;
}

.subcolumn_nav_met_95_1_13 .met-column-nav-ul,
.subcolumn_nav_met_95_1_19 .met-column-nav-ul {
    list-style: none;
    margin: 0;
    padding: 10px 0;
    text-align: center;
}

.subcolumn_nav_met_95_1_13 .met-column-nav-ul li,
.subcolumn_nav_met_95_1_19 .met-column-nav-ul li {
    white-space: nowrap;
    display: inline-block;
    float: none;
    height: 24px;
    padding: 0 2vw;
    border-right: 1px solid #666;
}

.subcolumn_nav_met_95_1_13 .met-column-nav-ul li:last-child,
.subcolumn_nav_met_95_1_19 .met-column-nav-ul li:last-child {
    border-right: 0;
}

.subcolumn_nav_met_95_1_13 .met-column-nav-ul li a,
.subcolumn_nav_met_95_1_19 .met-column-nav-ul li a {
    text-decoration: none;
    display: block;
    padding: 1px 10px;
    font-size: 16px;
    font-weight: 300;
    color: #666666;
}

.subcolumn_nav_met_95_1_13 .met-column-nav-ul li a:hover,
.subcolumn_nav_met_95_1_13 .met-column-nav-ul li.active > a,
.subcolumn_nav_met_95_1_19 .met-column-nav-ul li a:hover,
.subcolumn_nav_met_95_1_19 .met-column-nav-ul li.active > a {
    color: #000000;
}

/* ---------- ② 来源模块样式：show_met_28_1_44（联系我们 / 客户中心正文） ---------- */
.show_met_28_1_44 {
    padding: 30px 0;
    display: block;
}

.show_met_28_1_44 .met-editor div {
    max-width: 100%;
}

.show_met_28_1_44 .met-editor {
    background: #ffffff;
    padding: 30px;
    border: 1px solid #fafafa;
    border-radius: 5px;
    box-shadow: 0 1px 3px rgba(0, 37, 55, 0.05);
}

.show_met_28_1_44.met-show-body.bgcolor {
    background: #fafafa;
}

@media (max-width: 767px) {
    .show_met_28_1_44 .met-editor {
        padding: 10px;
    }
}

/* ---------- ② 来源模块样式：message_form_met_16_1_41（留言表单） ---------- */
.message_form_met_16_1_41 {
    display: block;
    padding: 30px;
    background-color: #ffffff;
}

.message_form_met_16_1_41 select,
.message_form_met_16_1_41 input {
    border-radius: 0;
}

.message_form_met_16_1_41 label {
    color: #2a333c;
}

.message_form_met_16_1_41 .media-body {
    width: 100%;
}

.message_form_met_16_1_41 .message-title {
    color: #666666;
}

@media (max-width: 767px) {
    .message_form_met_16_1_41 {
        padding: 0;
    }
}

/* ---------- ③ 客户中心页内联样式的等效规则（原来是写在内容里的 <style>，
               这里限定在 .met-editor 内，避免影响本地页头页脚） ---------- */
.met-editor {
    min-height: 50vh;
}

.met-editor .item {
    display: inline-block;
    width: 155px;
    height: 155px;
    margin-left: 18px;
    margin-right: 18px;
    margin-bottom: 30px;
    padding-top: 20px;
    padding-left: 10px;
    padding-right: 10px;
    border: solid 1px #707473;
    border-radius: 0px;
    text-align: center;
    vertical-align: top;
}

.met-editor .item img {
    width: 60%;
    height: 60%;
}

.met-editor .item h4 {
    font-size: 14px;
    margin-top: 10px;
    text-transform: uppercase;
    color: #707473;
}

.met-editor h3.title {
    font-weight: 1000;
    font-size: 2em;
}

.met-editor .item-box {
    width: 100%;
    text-align: center;
}

/* 悬停提示：撑满一行并居中（文字和二维码图片都居中） */
.met-editor .x_box {
    width: 100%;
    text-align: center;
}

.met-editor .x_box img {
    display: inline-block;
}

.met-editor .row {
    text-align: center;
    justify-content: center;
}

/* ---------- ④ 与本地模板衔接 ---------- */
/* 来源的 article / 内层 container 在本地 Bootstrap 的 flex .row 里会被收缩，
   这里让它撑满外层容器，内容宽度与来源站一致 */
.show_met_28_1_44 > .container > .row > article {
    width: 100%;
}

.show_met_28_1_44 article > .container {
    width: 100%;
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
}

/* 留言表单在本地的显示微调（来源用的是 MetInfo 的 UI kit） */
.message_form_met_16_1_41 .form-control {
    border-radius: 0;
}

.message_form_met_16_1_41 .btn-primary {
    background-color: #5ca997;
    border-color: #5ca997;
}

.message_form_met_16_1_41 .btn-primary:hover {
    background-color: #66aa32;
    border-color: #66aa32;
}

.message_form_met_16_1_41 .input-group-addon {
    display: flex;
    align-items: center;
    /* 来源标记里带的 p-5 在本地 Bootstrap 里是 3rem 内边距，会把验证码撑得很大 */
    padding: 0 8px !important;
    background-color: #eee;
    border: 1px solid #ced4da;
    border-left: 0;
    cursor: pointer;
}

/* 验证码：图片调小，输入框占满剩余宽度 */
.message_form_met_16_1_41 .input-group {
    width: 100%;
}

/* 本地 Bootstrap 的 flex .row 会把表单收缩成内容宽度，这里让它撑满整列 */
.message_form_met_16_1_41 .met-message-submit {
    width: 100%;
}

.message_form_met_16_1_41 .input-codeimg {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
}

.message_form_met_16_1_41 .input-group-addon img {
    display: block;
    width: auto;
    height: 24px;
}