@charset "utf-8";

/* 全局 */
* {
    margin: 0;
    padding: 0;
    border: 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

html {
    font-size: 16px;
    min-height: 100%;
    /* 字体自动调整 */
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    /* 禁用IOS点击半透明 */
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body,
button,
input,
select,
textarea {
    /* 抗锯齿、清晰度之类的 */
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-feature-settings: "liga", "kern";
    outline: none;
    background-color: #FFFFFF;
}

input{
    /* 去掉苹果的默认样式 */
    /* 这个写法会禁用CheckBox功能及样式，会禁用select的三角 */
    -webkit-appearance: none;
}

input[type="checkbox"] {
    /* 恢复被appearance: none禁用的CheckBox功能及样式 */
	-webkit-appearance: checkbox;
}
input[type="radio"] {
    /* 恢复被appearance: none禁用的radio功能及样式 */
	-webkit-appearance: radio;
}

input {
    border: 1px solid #e7e7e7;
}

body {
    line-height: 1.8;
    font-family: "微软雅黑", "Microsoft Yahei", Helvetica, Arial, sans-serif, "宋体";
    background-color: #fff;
    max-width: 1920px;
    min-width: 1200px;
    margin: 0 auto;
}

ol,
ul,
li {
    list-style: none;
}

a {
    color: #000000;
    text-decoration: none;
    -webkit-touch-callout:none;
}

img {
    /* width: 100%; */
    border: 0;
    -webkit-touch-callout:none;
}

/* 常用单项 */

.fcenter {
    /* 居中 */
    text-align: center;
}

.fright {
    /* 居右 */
    text-align: right;
}

.fleft {
    /* 居左 */
    text-align: left;
}

.lh0 {
    /*  */
    line-height: 0;
}

.lh1 {
    line-height: 1;
}

.lh2 {
    line-height: 2;
}

.lh3 {
    line-height: 3;
}

.radius5 {
    /* 圆角 */
    border-radius: 5px;
}

.ellipsis {
    /* 单行文字过长自动加点,省略多余文字 */
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}



/* box盒子 */

.ou_fixHead {
    display: block;
    width: 100%;
    max-width: 640px;
    min-width: 320px;
    position: fixed;
    top: 0;
    background-color: #fff;
    left: 50%;
    z-index: 999;
    /* -webkit-transition: all .7s ease-out;
    	transition: all .7s ease-out; */
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
}

.ou_fixFoot {
    display: block;
    width: 100%;
    max-width: 640px;
    position: fixed;
    bottom: 0;
    background-color: #fff;
    border-top: solid 1px #E1E1E1;

    left: 50%;
    z-index: 999;
    /* -webkit-transition: all .7s ease-out;
    	transition: all .7s ease-out; */
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}

.ou_fixVideo {
    display: block;
    width: 100%;
    max-width: 640px;
    min-width: 320px;
    position: fixed;
    top: 0;
    background-color: #fff;
    left: 50%;
    z-index: 999;
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
    /* box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3); */
}

.ou_white_box {
    margin: 10px;
    padding: 10px;
    background-color: white;
}

.ou_box {
    /* padding: 0; */
    margin: 0 auto;
    width: 1200px;
}

.ou_box100 {
    /* padding: 0; */
    /* margin: 0 auto; */
    width: 100%;
}

img.ou_img100{
    width: 100%;
}

/* .ou_box100 img{
    width: 100%;
} */

.ou_box:after,
.ou_box:before {
    content: " ";
    display: table;
    box-sizing: border-box;
    clear: both;
}

.ou_box1 {
    padding-top: 10px;
}

.ou_box3 {
    padding-bottom: 10px;
}

.ou_box13 {
    padding-top: 10px;
    padding-bottom: 10px;
}

.ou_box24 {
    padding-right: 10px;
    padding-left: 10px;
}

.ou_box245 {
    padding-right: 5px;
    padding-left: 5px;
}

.ou_box234 {
    padding-right: 10px;
    padding-bottom: 10px;
    padding-left: 10px;
}

.ou_bb{
    border-bottom: 8px solid #f5f5f5;
}

.ou_bb3{
    border-bottom: 3px solid #f5f5f5;
}

.ou_cell {
    /* 小房间,细胞 */
    margin-top: 10px;
}

.ou_cell3 {
    margin-bottom: 10px;
}

.ou_cell13 {
    margin: 10px 0;
}

.ou_clear {
    clear: both;
}

.ou_break {
    /* 中间横线、分割线 */
    margin: 10px 0;
    height: 1px;
    background-color: #ddd;
    line-height: 0;
    overflow: hidden;
}

.ou_pd0 {
    padding: 0 !important;
}

/* 盒子内部 */

.ou_text {
    line-height: 1.8;
    padding: 10px 0;
}

.ou_text1234 {
    line-height: 1.8;
    padding: 10px;
}

.ou_con {
    /* 只适用于view */
    /* margin-top: 10px; */
    text-indent: 2em;
}

.ou_img {
    line-height: 0;
}

.ou_title {
    width: 100%;
    box-sizing: border-box;
    /* background-color: #0c97ee; */
    margin: 10px 0;
    line-height: 0;
}

.ou_title_one {
    width: 100%;
    margin: 10px 0;
    line-height: 1;
    font-size: 18px;
}

/* .ou_title_i {
} */

.ou_title_t {
    position: relative;
    box-sizing: border-box;
    background-color: #fff;
    border-left: 5px solid #0c97ee;
    /* margin-left: 5px; */
    padding-left: 8px;
    line-height: 1;
    font-size: 16px;
    font-weight: bold;
}

.ou_title_t span {
    line-height: 1;
    font-size: 14px;
    color: #777777;
}

.ou_title_more {
    /* 需要放在ou_title_t内部 */
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    font-size: 14px;
    color: #777777;
    /* -webkit-transform: translateX(50%) translateY(-50%);
    -webkit-transform: translateX(50%) translateY(-50%);
    -moz-transform: translateX(50%) translateY(-50%);
    -ms-transform: translateX(50%) translateY(-50%); */
}

.ou_title_more a {
    color: #777777;
}

/* 居中圆框title */

.ou_title-1 {
    padding: 0;
}

.ou_title-1t {
    padding: 10px;
    border-radius: 20px;
    border: 1px solid #1487ff;
    box-sizing: border-box;
    font-size: 20px;
    color: #137deb;
    margin: 0 auto;
    text-align: center;
    line-height: 1;
}

.ou_title-1b {
    font-size: 20px;
    color: #a1a1a1;
    text-align: center;
}

/* 居中纯文字title */

.ou_title-2 {
    font-size: 40px;
    text-align: center;
}

.ou_title-14 {
    font-size: 14px;
    text-align: center;
}

.ou_title-c {
    text-align: center;
}

.ou_title-ctiao {
    display: block;
    width: 80%;
    height: 1px;
    margin: 0 auto;
    overflow: hidden;
    line-height: 0;
    padding: 0;
}

.ou_title_bb {
    width: 100%;
    box-sizing: border-box;
    border-bottom: 1px #0c97ee solid;
    /* background-color: #0c97ee; */
    margin: 10px 0;
    line-height: 1.4;
    font-size: 18px;
    font-weight: bold;
}

/* 平均格 */

.ou_grid_5 {
    box-sizing: border-box;
    display: inline-block;
    /* display: inline; */
    position: relative;
    padding: 0 5px 10px;
    vertical-align: top;
    /* vertical-align: bottom; */
    float: left;
}

.ou_grid {
    box-sizing: border-box;
    display: inline-block;
    /* display: inline; */
    position: relative;
    padding: 0 10px 10px;
    vertical-align: top;
    /* vertical-align: bottom; */
    float: left;
}

.ou_grid_p0 {
    padding: 0 !important;
}

/* 一行两列 */

.ou_grid2 {
    width: 50%;
}

.ou_grid2:nth-child(2n+1) {
    clear: left;
}

/* 一行三列 */

.ou_grid3 {
    width: 33.33333%;
}

.ou_grid3:nth-child(3n+1) {
    clear: left;
}

/* 一行四列 */

.ou_grid4 {
    width: 25%;
}

.ou_grid4 .title {
    font-size: 12px;
    text-align: center;
}

.ou_grid4:nth-child(4n+1) {
    clear: left;
}

/* 一行四列 */

.ou_grid5 {
    width: 20%;
}

.ou_grid5:nth-child(5n+1) {
    clear: left;
}

@media screen and (min-width: 360px) {
    .ou_grid4 .title {
        font-size: 16px;
        text-align: center;
    }
}

.ou_grid .image {
    position: relative;
    box-sizing: border-box;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    /* 注释以下代码，不用每次都修改高度。 */
    /* height: 0;
    padding-bottom: 62.5%; */
}

.ou_grid .image20 {
    padding: 0 20%;
}

.ou_grid .image .masktag {
    width: 100%;
    /* height: 0.48rem; */
    background-color: rgba(0, 0, 0, 0.5);
    text-align: center;
    line-height: 1.5;
    /* font-size: 0.22rem; */
    color: #fff;
    position: absolute;
    bottom: 0;
    /* left: 0; */
}

.ou_grid .image .masktag_btnbox {
    width: 100%;
    /* height: 0.48rem; */
    background-color: #000000;
    height: 40px;
    line-height: 40px;
    text-align: center;
    position: absolute;
    bottom: 0;
    /* left: 0; */
}

.ou_grid .image .masktag_btnbox .masktag_btn {
    display: inline-block;
    line-height: 1.5;
    color: #fff;
    background-color: red;
    border-radius: 5px;
    bottom: 0;
}

.ou_grid .title {
    position: relative;
    box-sizing: border-box;
    display: block;
    width: 100%;
    padding-top: 10px;
    line-height: 1.5;
}

.ou_grid .title_border234 {
    position: relative;
    box-sizing: border-box;
    display: block;
    width: 100%;
    line-height: 2;
    border-right: 1px #E7E7E7 solid;
    border-bottom: 1px #E7E7E7 solid;
    border-left: 1px #E7E7E7 solid;
    background-color: #FFFFFF;
}

.ou_grid .content {
    position: relative;
    box-sizing: border-box;
    display: block;
    width: 100%;
    height: 80px;
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
    /* padding-top: 7.25px; */
    line-height: 1.5;
    padding: 0 10px;
}

.ou_grid .explain {
    position: relative;
    box-sizing: border-box;
    display: block;
    width: 100%;
    padding-top: 5px;
    line-height: 1.5;
    text-align: center;
}

/* 插槽 */

.ou_slot {
    line-height: 1;
    margin-bottom: 10px;
}

.ou_slot_box {
    box-sizing: border-box;
    float: left;
}

.ou_slot_box:nth-child(1) {
    padding-left: 10px;
}

.ou_slot_box:nth-child(2) {
    padding: 0 10px;
}

.ou_slot_l {
    padding-left: 10px;
    box-sizing: border-box;
    float: left;
}

.ou_slot_r {
    padding: 0 10px;
    box-sizing: border-box;
    float: left;
}

.ou_slot_w20 {
    width: 20%;
}

.ou_slot_w80 {
    width: 80%;
}

.ou_slot_w25 {
    width: 25%;
}

.ou_slot_w75 {
    width: 75%;
}

.ou_slot_w30 {
    width: 30%;
}

.ou_slot_w70 {
    width: 70%;
}

.ou_slot_w35 {
    width: 35%;
}

.ou_slot_w65 {
    width: 65%;
}

.ou_slot_w40 {
    width: 40%;
}

.ou_slot_w60 {
    width: 60%;
}

.ou_slot_w45 {
    width: 45%;
}

.ou_slot_w55 {
    width: 55%;
}

.ou_slot_w50 {
    width: 50%;
}

.slot_divT {
    line-height: 1.2;
}

.slot_divB {
    line-height: 1.5;
}

.slot_break {
    /* 中间横线、分割线 */
    margin: 5px 0;
    height: 1px;
    background-color: #ddd;
    line-height: 0;
    overflow: hidden;
}

/* flex布局 */

.ou_flex {
    display: flex;
    align-items: flex-start;
}

.ou_flew_auto {
    /* flex: auto;
    overflow: hidden; */
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 0%;
}

.ou_flew_1 {
    flex: 1;
    /* 被撑大时可以试试overflow: hidden; */
    /* overflow: hidden; */
}

/* input */

.input_box {
    /* margin-top: 12.08px; */
    padding: 8px 15px;
    border-radius: 4px;
    border: 1px solid #dddddd;
}

.box_input {
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 16px;
    border: 1px solid #e7e7e7;
    text-indent: 10px;
    color: #333;
    border-radius: 5px;
}

.box_button {
    display: block;
    width: 100%;
    height: 40px;
    background-color: #0ba2e9;
    border: 0;
    text-align: center;
    color: #fff;
    cursor: pointer;
    font-size: 18px;
    line-height: 40px;
    border-radius: 5px;
}

.box_select {
    width: 100%;
    height: 40px;
    line-height: 40px;
    font-size: 16px;
    border: 1px solid #e7e7e7;
    text-indent: 10px;
    color: #333;
    border-radius: 5px;
}

/* 其他 */

.lowerRight {
    display: block;
    position: fixed;
    width: 15%;
    bottom: 10px;
    right: 10px;
    z-index: 100;
}

/* touchSlide 滑块 */

.touchSlide {
    width: 100%;
    max-width: 640px;
    max-height: 320px;
    margin: 0 auto;
    position: relative;
    overflow: hidden;
}

.touchSlide .bd {
    position: relative;
    z-index: 0;
    line-height: 0;
}

.touchSlide .bd li img {
    width: 100%;
    max-height: 320px;
}

.touchSlide .hd {
    width: 100%;
    height: 5px;
    position: absolute;
    z-index: 1;
    bottom: 0;
    text-align: center;
}

.touchSlide .hd ul {
    overflow: hidden;
    display: -moz-box;
    display: -webkit-box;
    display: box;
    height: 5px;
    background-color: rgba(51, 51, 51, 0.5);
}

.touchSlide .hd ul li {
    -moz-box-flex: 1;
    -webkit-box-flex: 1;
    box-flex: 1;
}

.touchSlide .hd ul .on {
    background: #e41422;
}

/* 视频播放 */
.videoBox {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 10% 0;
    display: none;
    z-index: 9999999;
    background: url(/apps/images/video_bg.png)
}

.v-play {
    display: block;
}

.videoBox .videoView {
    max-width: 540px;
    margin: 0 auto;
}

.videoBox .vclose {
    text-align: center;
}

.videoBox .vclose #vClose {
    display: inline-block;
    padding: 10px 15px;
    border-radius: 50px;
    background: #fff;
    color: #000;
    font-size: 3em;
    cursor: pointer;
    margin-top: 50px;
    line-height: 1;
}


/* 字体大小 */

.fs9 {
    font-size: 9px !important;
}

.fs10 {
    font-size: 10px !important;
}

.fs12 {
    font-size: 12px !important;
}

.fs13 {
    font-size: 13px !important;
}

.fs14 {
    font-size: 14px !important;
}

.fs16 {
    font-size: 16px !important;
}

.fs17 {
    font-size: 17px !important;
}

.fs18 {
    font-size: 18px !important;
}

.fs19 {
    font-size: 19px !important;
}

.fs20 {
    font-size: 20px !important;
}

.fs22 {
    font-size: 22px !important;
}

.fs24 {
    font-size: 24px !important;
}

/* 字体颜色 */

.fc_orange {
    color: orange;
}

.fc_green {
    color: #5ca712;
}

.fc_red {
    color: red;
}

.fc_red_2 {
    color: #e20014;
}

.fc_green {
    color: green;
}

.fc_blue {
    color: blue;
}

.fc_blue2 {
    color: #008bfe;
}

.fc_white {
    color: white;
}

.fc_gray_f0 {
    color: #f0f0f0;
}

.fc_gray_f8 {
    color: #f8f8f8;
}

.fc_gray_a {
    color: #aaa;
}

.fc_black_8 {
    color: #888;
}

.fc_black_2 {
    color: #222;
}

.fc_black_30 {
    color: #303030;
}

.fc_black {
    color: #000;
}

.fwb {
    font-weight: bold;
}

.mb10 {
    margin-bottom: 10px;
}


/* 灰色背景 */

.bgc_white {
    background-color: white;
}

.bgc_gray_f0 {
    background-color: #f0f0f0;
}

.bgc_gray_f8 {
    background-color: #f8f8f8;
}

.bgc_gray_fa {
    background-color: #fafafa;
}

.bgc_gray_e7 {
    background-color: #e7e7e7;
}

.bgc_blue_2 {
    background-color: #008bfe;
    /* background-color: #0c97ee; */
}

.bgc_red_2 {
    background-color: #e20014;
}

.bgc_green {
    background-color: #5ca712;
}

/* .bgc_gray_f0 {
    background-color: #f0f0f0;
}

.bgc_gray_f0 {
    background-color: #f0f0f0;
} */

/* 测试用背景 */

.bgc_Gray {
    background-color: Gray;
}

.bgc_DarkGray {
    background-color: DarkGray;
}

.bgc_LightGray {
    background-color: LightGray;
}

.bgc_Lavender {
    background-color: Lavender;
}

.bgc_AliceBlue {
    background-color: AliceBlue;
}

.bgc_WhiteSmoke {
    background-color: WhiteSmoke;
}

.bgc_GhostWhite {
    background-color: GhostWhite;
}

.bgc_aqua {
    background-color: aqua;
}

.bgc_black {
    background-color: black;
}

.bgc_blue {
    background-color: blue;
}

.bgc_fuchsia {
    background-color: fuchsia;
}

.bgc_gray {
    background-color: gray;
}

.bgc_green {
    background-color: green;
}

.bgc_lime {
    background-color: lime;
}

.bgc_maroon {
    background-color: maroon;
}

.bgc_navy {
    background-color: navy;
}

.bgc_olive {
    background-color: olive;
}

.bgc_orange {
    background-color: orange;
}

.bgc_perple {
    background-color: purple;
}

.bgc_red {
    background-color: red;
}

.bgc_silver {
    background-color: silver;
}

.bgc_teal {
    background-color: teal;
}

.bgc_yellow {
    background-color: yellow;
}
