﻿
/*BOM*/
.bom-container .bom-banner{ width: 100%; height: 490px; background:url(../images/BOM-banner%40Bg.jpg) center center  no-repeat;}
.bom-banner .box{ height: 490px;}
.bom-banner .box .ad-des{ display: inline-block; width: 346px; height: 222px; margin: 75px 0 0 0; background:url(../images/title%40banner.png);}
.bom-banner .box .ad-items{ width: 580px; color: #fff; font-size: 18px; margin: 32px 0 0 0;}
.bom-banner .box .ad-items p{ position: relative; display: inline-block; padding-left: 50px; line-height: 1.4; margin-right: 15px; white-space:nowrap; }
.bom-banner .box .ad-items p i{ position: absolute; left: 0; top: 0; z-index: 2; width: 44px; height: 51px; margin: 0 10px 0 0;}
.bom-banner .box .ad-items p i.icon1{background:url(../images/icon1%40banner.png);}
.bom-banner .box .ad-items p i.icon2{background:url(../images/icon2%40banner.png);}
.bom-banner .box .ad-items p i.icon3{background:url(../images/icon3%40banner.png);}
.bom-banner .bom_upload{ position: absolute; right: 34px; top: 90px; width: 393px; border: 1px dashed #8b745f; background-color: #36322f;}
.bom-banner .bom_upload .mod{ height: 175px; overflow: hidden; padding: 29px 0; text-align:center;}
.bom-banner .bom_upload .mod h3{ color: #fff;}
.bom-banner .bom_upload .mod .item{ width: 215px; margin: 0 auto 0; color: #fff;}
.bom-banner .bom_upload .mod .item .operation{ display: block;  position: relative; overflow: hidden; height: 50px; line-height: 50px; font-size: 18px; background-color: #f69732; margin-top: 15px; color: #fff;}
.bom-banner .bom_upload .mod .item .operation i{ display: inline-block; vertical-align: middle; margin: -3px 0 0 0; width: 21px; height: 23px; background: url(../images/qq%40icon.png);}
.bom-banner .bom_upload .mod .item .operation input{ opacity: 0; position: absolute; left: 0; top: 0; z-index: 2; width: 100%; height: 48px; cursor: pointer; border:0; background: none; color: #fff;}
.bom-banner .bom_upload .mod .item .operation:hover{ background-color: #f09d2d; } 
.bom-banner .bom_upload .mod .tis{ color: #eee; margin-top: 35px;}
.bom-banner .bom_upload .mod .tis .format{ color: #999;}
.bom-banner .bom_upload .mod .tis a{ color: #3e92b6; position: relative; z-index:3; }
.bom-banner .bom_upload .mod .tis a:hover{ text-decoration: underline;}
.bom-banner .bom_upload .mod .bomFile { width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2; opacity: 0; cursor: pointer;}
.bom-banner .bom_upload .mod .upload-success{ 
	margin-top: 20px;
	color: #fff;
}
.bom-banner .bom_upload .mod .upload-success .name{
	display: inline-block;
	vertical-align: middle;
}

.bom-banner .bom_upload .mod .upload-success .del{
	display: inline-block;
	vertical-align: middle;
	padding-left: 20px;
    background: url(../images/remove.png) left center no-repeat;
    cursor: pointer;
    color: #e8551e;
    margin-left: 5px;
}

.bom-banner .bom_upload .mod .uploadSuccessBtn{
	display: block;
    width: 180px;
    height: 40px;
    margin:0 auto;
    margin-top: 18px;
    margin-bottom: 40px;
    cursor: pointer;
    font-size: 16px;
    line-height: 40px;
    border: 1px solid #de4d00;
    text-align: center;
    background-color: #e8551e;
    color: #fff;
    border-radius: 100px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}


.bom-service-container{ overflow: hidden; position: relative; z-index: 3; padding: 15px 0 25px; border-bottom: 1px solid #e5e5e5; background-color: #fff; box-shadow: 0 2px 6px rgba(0,0,0,0.02);}
.bom-service-container .item{ float: left; width: 278px;}
.bom-service-container .item i{ vertical-align: middle; display: inline-block; margin-top: 5px; width:43px; height: 43px;}
.bom-service-container .item i.act-icon1{ background: url(../images/BOM-adv%40icon.png);}
.bom-service-container .item i.act-icon2{ background: url(../images/BOM-adv%40icon.png) -44px 0;}
.bom-service-container .item i.act-icon3{ background: url(../images/BOM-adv%40icon.png) -88px 0;}
.bom-service-container .item i.act-icon4{ background: url(../images/BOM-adv%40icon.png) -132px 0;}
.bom-service-container .item p{ vertical-align: middle; display: inline-block; width: 160px; margin-left: 8px; }
.bom-service-container .item.mr{ margin-right: 50px;}

.bom-advantage-container{ position: relative; padding-top: 50px; height: auto; background-color: #f2f3f5;}
.bom-advantage-container .hd{ text-align: center;}
.bom-advantage-container .hd h3{ font-size: 42px;}
.bom-advantage-container .hd i{ display: none; width: 275px; height: 14px; margin: 0 auto; background: url(../images/adv%40titile.png);}
.bom-advantage-container .hd p{ text-align: center; font-size: 16px; color: #666; margin-top: 5px;}

.bom-advantage-container .bd {
    margin-top: 40px;
    height: 500px;
    width: 1280px;
    overflow: hidden;
    position: relative;
}

.bom-advantage-container .bd .left-control,.bom-advantage-container .bd .right-control {
    position: absolute;
    z-index: 16;
    width: 60px;
    height: 60px;
    bottom: 147px;
    margin-top: -27px;
    cursor: pointer;
    opacity: 0.8;
}
.bom-advantage-container .bd .left-control:hover, .bom-advantage-container .bd .right-control:hover {
    opacity: 1;
}

.bom-advantage-container .bd .left-control {
    background: url(../images/control%40icon.png) no-repeat;
    left: 0;

}

.bom-advantage-container .bd .right-control {
    background: url(../images/control%40icon.png) -60px 0 no-repeat;
    right: 1px;
}

.bom-swiper-container {
    width: 1291px;
}

.bom-advantage-container .bd .item {
    width: 311px;
    height: 476px;
    box-sizing: border-box;
    background-color: #fff;
    overflow: hidden;
    margin-right: 20px !important;
}

.bom-advantage-container .bd .item .img {
    position: relative;
}
    .bom-advantage-container .bd .item .img img {
    width:311px;
    height:353px;
    }

    .bom-advantage-container .bd .item .des {
        padding: 15px 20px;
        font-size: 16px;
        color: #333333;
    }

.bom-advantage-container .bd .item .txt {
	position:absolute;
	top:0;
	bottom: 0;
	width: 311px; height: 353px;
	color: #fff;
	background:rgb(0,0,0,0.65);
	opacity: 0;
}
.bom-advantage-container .bd .item:hover .txt {
	opacity: 1;
	transition: visibility .3s, opacity .3s;;
}

.bom-advantage-container .bd .item .txt .inner{
	position:absolute;
	bottom: 0;
	font-size: 14px;
	padding: 60px 35px;
}
.bom-advantage-container .bd .item .txt i{
	position:absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: auto;
	width:0;
    height:0;
	border-right:10px solid transparent;
	border-left:10px solid transparent;
	border-bottom:10px solid #fff;

}

.bom-start{
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 330px;
	text-align: center;
	/*background-color: #f2f3f5;*/
	/*background: url(../images/BOM/bom-start@Bg.jpg) center;*/
}

.bom-start a{
	display:inline-block;
    width: 312px;
    height: 60px;
    margin: auto;
    border: 1px solid #3e92b6;
    line-height: 58px;
    text-align: center;
    font-size: 32px;
    color: #3e92b6;
    margin-top: 190px;
    border-radius: 3px;
    background-color: #fff;
    box-shadow: 0px 8px 10px rgba(0,0,0,0.05);
}
.bom-start a:hover{
	color: #4d8aa5;
	border: 1px solid #4d8aa5;
	box-shadow: 0px 5px 10px rgba(0,0,0,0.15);
}


