@charset "utf-8";
.banner_block{font-size:0;position:relative;background-color:#f5f5f5}
.banner_block .one_banner{position:relative}
.banner_block .one_banner img{max-width:100%;width:100%}
.banner_block .banner_left{width:100px;height:100%;position:absolute;top:50%;left:0;background:url(../images/index/banner_left.png) no-repeat center;transform:translateY(-50%);opacity:.3;transition:.2s}
.banner_block .banner_right{width:100px;height:100%;position:absolute;top:50%;right:0;background:url(../images/index/banner_right.png) no-repeat center;transform:translateY(-50%);opacity:.3;transition:.2s}
.banner_block .slide_bar{position:absolute;left:0;right:0;bottom:20px;text-align:center}
.banner_block .slide_bar .ob{width:40px;height:3px;display:inline-block;background-color:rgba(255,255,255,.5);margin:0 5px}
.banner_block .slide_bar .ob.focus{background-color:rgba(255,255,255,1)}
.one_banner.b01{position:relative}
.one_banner.b01 .image{position:absolute;top:0;left:0;right:0;bottom:0}
.one_banner.b01 .i01{z-index:1}
.one_banner.b01 .i02{z-index:3}
.one_banner.b01 .i03{z-index:2}
.one_banner.b01 .i04{z-index:4}
.one_banner.b01 .i05{z-index:5}
.one_banner.b02{background:url(../images/index/banner_b02-bg.jpg) no-repeat center;background-size:cover;padding-bottom:36.2%}
.one_banner.b02 .con_block{position:absolute;top:0;left:0;right:0;bottom:0}
.one_banner.b02 img{width:auto;max-width:100%;height:auto;max-height:100%;margin:auto}
.one_banner.b02 .word{position:absolute;top:13%;bottom:66%;left:0;right:0;max-height:111px;display:block;text-align:center}
.one_banner.b02 .word img{height:100%}
.one_banner.b02 .proxy_box{position:absolute;top:40%;bottom:0;left:0;right:0;margin:auto}
.one_banner.b02 .proxy_box .proxy{width:25%;height:100%;max-height:291px;display:inline-block}
.one_banner.b02{position:relative}
.one_banner.b02 .image{position:absolute;top:0;left:0;right:0;bottom:0}
.one_banner.b02 .i01{z-index:1}
.one_banner.b02 .i02{z-index:2}
.one_banner.b02 .i03{z-index:3}
.one_banner.b02 .i04{z-index:4}
.one_banner.b02 .i05{z-index:5}
.one_banner.b02 .i06{z-index:6}
.one_banner.b03{position:relative}
.one_banner.b03 .image{position:absolute;top:0;left:0;right:0;bottom:0}
.one_banner.b03 .i01{z-index:1}
.one_banner.b03 .i02{z-index:2}
.one_banner.b03 .i03{z-index:3}
.one_banner.b03 .i04{z-index:4}
.one_banner.b04{position:relative}
.one_banner.b04 .image{position:absolute;top:0;left:0;right:0;bottom:0}
.one_banner.b04 .i01{z-index:1}
.one_banner.b04 .i02{z-index:3}
.one_banner.b04 .i03{z-index:4}
.one_banner.b04 .i04{z-index:5}
.one_banner.b04 .i05{z-index:2}
.one_banner.b04 .i06{z-index:6}
@media screen and ( max-width: 1280px){.one_banner.b02 .proxy_box{left:12%;right:12%}}
.prod_block{background:url(../images/index/bg01.jpg) bottom center no-repeat;background-size:cover;padding:0 40px 200px;background-attachment:fixed;position:relative}
.prod_block::after{content:"";display:block;width:104px;height:191px;background:url(../images/index/category_image_right.png) no-repeat center;position:absolute;top:250px;right:0}
.prod_block::before{content:"";display:block;width:75px;height:703px;background:url(../images/index/brand_image_left.png) no-repeat center;position:absolute;top:400px;left:0;z-index:1}
.prod_block .important{text-align:center;padding:40px 0 0;position:relative;z-index:2}
.prod_block .important .one_ipt{display:inline-block;padding:0 20px}
.prod_block .important .one_ipt img{max-width:100%}
.prod_block .important .one_ipt .entt{font-size:16px;color:#333}
.prod_block .important .one_ipt .zhtt{font-size:20px;color:#333;font-weight:700}
.prod_block .important{text-align:center;padding:40px 0 0;position:relative;z-index:2}
.prod_block .prod_slide_block{text-align:center;padding:40px 0 0;position:relative;overflow:hidden;z-index:2}
.prod_block .prod_slide_block .one_slide{display:inline-block}
.prod_block .prod_slide_block .one_slide img{max-width:100%}
.prod_block .category .title{font-size:50px;color:#333;margin:auto;text-align:center;padding:100px 0 50px}
.prod_block .category{position:relative;z-index:2}
.prod_block .category .cpb{width:100%;display:table}
.prod_block .category .cpb .ocb{width:25%;display:table-cell;padding:0 5px}
.prod_block .category .cpb .ocb .occon{text-align:center;vertical-align:middle;display:flex;position:relative;height:220px;background:url(../images/index/category_img_01.jpg) #ccc;background-size:cover;flex-direction:column;justify-content:center;align-items:center}
.prod_block .category .cpb .ocb .occon p{position:relative;z-index:1}
.prod_block .category .cpb .ocb .occon p img{max-width:100%;width:100%}
.prod_block .category .cpb .ocb .occon .zh{font-size:30px;font-weight:700;color:#fff}
.prod_block .category .cpb .ocb .occon .en{font-size:16px;color:#fff}
.prod_block .category .cpb .ocb .occon::after{content:"";display:block;border-style:solid;border-color:transparent #d2e252 #d2e252 transparent;border-width:0 20px 220px 40px;position:absolute;right:0;top:0}
.prod_block .category .cpb .ocb .occon::before{content:"";display:block;background-color:#d2e252;width:0;height:220px;position:absolute;right:0;top:0;transition:.3s}
.prod_block .category .cpb .ocb:nth-child(2) .occon{background-image:url(../images/index/category_img_02.jpg)}
.prod_block .category .cpb .ocb:nth-child(2) .occon::after{border-color:transparent #1561a7 #1561a7 transparent}
.prod_block .category .cpb .ocb:nth-child(2) .occon::before{background-color:#1561a7}
.prod_block .category .cpb .ocb:nth-child(3) .occon{background-image:url(../images/index/category_img_03.jpg)}
.prod_block .category .cpb .ocb:nth-child(3) .occon::after{border-color:transparent #d34141 #d34141 transparent}
.prod_block .category .cpb .ocb:nth-child(3) .occon::before{background-color:#d34141}
.prod_block .category .cpb .ocb:nth-child(4) .occon{background-image:url(../images/index/category_img_04.jpg)}
.prod_block .category .cpb .ocb:nth-child(4) .occon::after{border-color:transparent #20d8b0 #20d8b0 transparent}
.prod_block .category .cpb .ocb:nth-child(4) .occon::before{background-color:#20d8b0}
.brand_block{overflow:hidden;padding-top:100px;margin-top:-100px}
.brand_block .brand_con{position:relative;background:#153e6a url(../images/index/bg02.jpg) no-repeat center top;padding:0 0 150px;background-attachment:fixed;background-size:cover}
.brand_block .brand_con::before{content:"";display:block;position:absolute;top:0;left:0;right:0;height:300px;background:-moz-linear-gradient(top,rgba(21,62,106,1) 0%,rgba(21,62,106,0) 100%);background:-webkit-linear-gradient(top,rgba(21,62,106,1) 0%,rgba(21,62,106,0) 100%);background:linear-gradient(to bottom,rgba(21,62,106,1) 0%,rgba(21,62,106,0) 100%);z-index:1}
.brand_block .brand_con::after{content:"";display:block;border-style:solid;border-color:transparent transparent #153e6a;border-width:0 100vw 100px 0;position:absolute;left:0;right:0;top:-100px}
.brand_block .brand_con .title{font-size:50px;color:#fff;margin:auto;text-align:center;padding:100px 0 50px;position:relative;z-index:1}
.brand_block .brand_image{width:100%;max-width:100%;display:block}
.brand_block .brand_image_m{width:100%;max-width:100%;display:none}
.about_block{overflow:hidden;padding-top:100px;margin-top:-100px;position:relative}
.about_block::after{content:"";display:block;width:106px;height:396px;background:url(../images/index/about_image_right.png) no-repeat center;position:absolute;top:250px;right:0}
.about_block .about_con{position:relative;padding:100px 0 0;position:relative;z-index:2}
.about_block .about_con::after{content:"";display:block;border-style:solid;border-color:transparent transparent #fff;border-width:0 0 100px 100vw;position:absolute;left:0;right:0;top:-100px}
.about_block .about_con .con_block{width:100%;display:table;background:url(../images/index/bg03.png) no-repeat center;background-position-y:35%;background-attachment:fixed;padding:0 40px}
.about_block .about_con::before{content:"";display:block;position:absolute;top:100px;left:0;right:0;height:50px;background:-moz-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);background:-webkit-linear-gradient(top,rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);background:linear-gradient(to bottom,rgba(255,255,255,1) 0%,rgba(255,255,255,0) 100%);z-index:0}
.about_block .about_con .con_block .image{display:table-cell;vertical-align:middle}
.about_block .about_con .con_block .word{display:table-cell;vertical-align:middle;padding-left:100px}
.about_block .about_con .con_block .word .title{font-size:50px;color:#333;margin:auto;padding:0 0 20px}
.about_block .about_con .con_block .word p{line-height:2;font-size:18px;color:#333;padding-bottom:20px}
.about_block .about_con .con_block .word a{border-radius:5px;color:#fff;line-height:50px;height:50px;display:inline-block;padding:0 25px;position:relative;overflow:hidden;border:1px solid #1561a7;z-index:1;transition:.2s}
.about_block .about_con .con_block .word a:before{content:"";display:block;top:0;left:0;right:0;bottom:0;position:absolute;background-color:#1561a7;z-index:-1;transition:.2s}
.about_block .about_con .con_block .word a:after{content:"";display:block;top:0;left:0;right:0;bottom:50px;position:absolute;background-color:#eee;z-index:-1;transition:.2s}
.about_block .photo_bar{position:relative;padding:30px 0 60px;z-index:2}
.about_block .photo_bar .draggable{padding-bottom:40px}
.about_block .photo_bar .one_photo{width:450px;height:300px;background:#ccc no-repeat center;background-size:cover;position:relative;margin:0 10px;display:inline-block;vertical-align:top}
.about_block .photo_bar .one_photo p{font-size:16px;color:#333;position:absolute;top:310px;left:0;right:0;margin:auto;text-align:center;padding:0 10px}
.contact_block{position:relative;overflow:hidden;margin-top:-200px;padding:250px 0 100px}
.contact_block::after{content:"";display:block;border-style:solid;border-color:transparent transparent transparent #f5f5f5;border-width:280px 0 500px 70vw;position:absolute;left:0;right:0;top:-0;z-index:-1}
.contact_block .con_block{padding:0 40px}
.contact_block .con_block .title{font-size:50px;color:#333;margin:auto;padding:0 0 40px}
.contact_block .con_block .table{width:100%;display:table}
.contact_block .con_block .table .form{width:50%;display:table-cell;vertical-align:top;padding-right:40px}
.contact_block .con_block .table .form .of{position:relative;background-color:#fff;margin-bottom:10px}
.contact_block .con_block .table .form .of p{line-height:38px;font-size:16px;color:#333;position:absolute;top:1px;left:20px}
.contact_block .con_block .table .form .of input{width:100%;display:block;border:0;line-height:38px;height:40px;font-size:16px;padding:0 20px 0 130px;border:1px solid #333;transition:.2s}
.contact_block .con_block .table .form .of input:focus{border-color:#1561a7;transition:.2s}
.contact_block .con_block .table .form .of textarea{width:100%;display:block;border:0;line-height:30px;height:150px;font-size:16px;padding:4px 20px 4px 130px;border:1px solid #333;transition:.2s;resize:none}
.contact_block .con_block .table .form .of textarea:focus{border-color:#1561a7;transition:.2s}
.contact_block .con_block .table .form .of.code input{padding-right:80px}
.contact_block .con_block .table .form .of.code .code_btn{height:38px;position:absolute;top:1px;right:1px;display:inline-block}
.contact_block .con_block .table .form .of.code::after{content:"點擊上方圖片更換驗證碼";display:block;position:absolute;top:40px;right:0;font-size:14px;color:#777}
.contact_block .con_block .table .form .enter{line-height:50px;height:50px;border-radius:5px;background:none;display:inline-block;border:0;color:#fff;font-size:20px;padding:0 20px;margin-top:10px;cursor:pointer;position:relative;overflow:hidden}
.contact_block .con_block .table .form .enter::before{content:"";display:block;top:0;left:0;right:0;bottom:0;position:absolute;background-color:#1561a7;z-index:-1;transition:.2s}
.contact_block .con_block .table .form .enter::after{content:"";display:block;top:0;left:0;right:0;bottom:50px;position:absolute;background-color:#e44e4e;z-index:-1;transition:.2s}
.contact_block .con_block .table .form .replay{line-height:50px;height:50px;border-radius:5px;background:#eee;display:inline-block;border:0;color:#aaa;font-size:20px;padding:0 20px;margin:10px 0 0 10px;text-align:center}
.contact_block .con_block .table .map{width:50%;display:table-cell;vertical-align:top;position:relative}
.contact_block .con_block .table .map iframe{width:100%;height:100%;position:absolute;top:0;left:0;right:0;bottom:0;border:3px solid #1561a7;border-radius:5px}
@media screen and ( min-width: 1280px){.banner_block .banner_left:hover{opacity:1;transition:.2s}
.banner_block .banner_right:hover{opacity:1;transition:.2s}
.prod_block .category .cpb .ocb:hover .occon::before{width:100%;transition:.3s}
.about_block .about_con .con_block .word a:hover{color:#1561a7;transition:.2s}
.about_block .about_con .con_block .word a:hover:after{bottom:0;transition:.2s}
.contact_block .con_block .table .form .enter:hover::after{bottom:0;transition:.2s}}
@media screen and ( max-width: 1280px) and ( min-width: 768px){.prod_block .category .cpb .ocb .occon .zh{font-size:25px}
.prod_block .category .cpb .ocb .occon .en{font-size:14px}
.about_block .about_con .con_block .image img{height:406px}
.about_block .about_con .con_block .word{padding-left:50px}}
@media screen and ( max-width: 767px){.banner_block .slide_bar{bottom:5px}
.banner_block .banner_left{display:none}
.banner_block .banner_right{display:none}
.prod_block{padding:0 20px 100px;text-align:center}
.prod_block .important{text-align:left;width:auto;display:inline-block}
.prod_block .category .title{font-size:35px;padding:50px 0 10px}
.prod_block .important .one_ipt{display:block;padding:0 0 0 70px;position:relative;margin-bottom:10px}
.prod_block .important .one_ipt img{position:absolute;top:0;left:0}
.prod_block .important .one_ipt .entt{font-size:14px}
.prod_block .category .cpb{display:block}
.prod_block .category .cpb .ocb{width:100%;display:block;padding:0 0 10px}
.prod_block .category .cpb .ocb .occon{height:150px}
.prod_block .category .cpb .ocb .occon::after{border-width:0 10px 150px 20px}
.prod_block .prod_slide_block{padding:20px 0 0}
.prod_block .prod_slide_block .one_slide img{height:50px}
.brand_block .brand_con{padding:0 0 70px}
.brand_block .brand_con::after{border-width:0 100vw 30px 0;top:-30px}
.brand_block .brand_con .title{font-size:35px}
.brand_block .brand_image{display:none}
.brand_block .brand_image_m{display:block}
.about_block .about_con{padding:50px 0 0}
.about_block .about_con::before{top:50px}
.about_block .about_con::after{border-width:0 0 30px 100vw;top:-30px;padding:0 20px}
.about_block .about_con .con_block{display:block;padding:0 20px 50px}
.about_block .about_con .con_block .image{display:block}
.about_block .about_con .con_block .image img{max-width:100%;width:100%}
.about_block .about_con .con_block .word{display:block;padding:30px 0 0}
.about_block .about_con .con_block .word .title{font-size:35px;text-align:center}
.about_block .about_con .con_block .word a{width:100%;text-align:center}
.about_block .photo_bar{padding:30px 0 60px}
.about_block .photo_bar .one_photo{width:100%;height:250px}
.about_block .photo_bar .one_photo p{top:260px}
.contact_block .con_block{padding:0 20px}
.contact_block .con_block .title{font-size:35px;text-align:center}
.contact_block .con_block .table{display:block}
.contact_block .con_block .table .form{width:100%;display:block;padding:0 0 50px}
.contact_block .con_block .table .form .enter{width:100%;margin-top:25px}
.contact_block .con_block .table .form .replay{width:100%;margin:10px 0 0}
.contact_block .con_block .table .map{width:100%;display:block;padding-top:100%}}