@charset "utf-8";
/* CSS Document */
.main {position: relative; width: 100%; height: 100%;}
.main > .size {position: relative; height: 100%;}
.main .tit {position: absolute; top: 50%; left: 0; margin-top: -395px; width: 100%; text-align: center;}
.main .tit {}
.main .tit span {display: block; font-size: 18px; color: #fff;}
.main .tit span b {font-weight: 700;}
.main .cont {position: absolute; bottom: 17%; left: 0; width: 100%;}
.main .cont ul {padding: 0 10px; width: 101.5%; margin-left: -1.5%; margin-top: -2%; box-sizing: border-box;}
.main .cont ul li {position: relative; float: left; width: 23.5%; margin-left: 1.5%; margin-top: 2%; text-align: center; box-sizing: border-box;}
.main .cont ul li a {display: block; padding-top: 30px; box-sizing: border-box; border-top: 1px solid transparent; border-bottom: 1px solid transparent;}
.main .cont ul li .img_box {box-shadow: 7px 6px 8px 0px rgba(0, 0, 0, 0.25);}
.main .cont ul li .img_box img {display: block; width: 100%;}
.main .cont ul li .tit_box {height: 52px; line-height: 52px; font-size: 16px; font-weight: 700; color: #fff; letter-spacing: -.3px;}


/* sub - visual */
.sub .top_visual {position: relative; background-repeat: no-repeat; background-size: cover; background-position: center center;}
.sub .top_visual .size {position: relative;}
.sub .top_visual .tb {height: 420px;}
.sub .top_visual .main_txt {text-align: center;}
.sub .top_visual .main_txt span {font-size: 18px; font-style: italic; font-weight: 100; color: rgba(255,255,255,.5); letter-spacing: 3px; font-family: 'Montserrat', sans-serif;}
.sub .top_visual .main_txt > h2 {margin-top: 55px; margin-bottom: 0; font-size: 50px; line-height: 1; color: #fff; font-weight: 700; letter-spacing: 0;}
.sub .top_visual .main_txt .navi {margin-top: 12px; font-size: 14px; color: #7a8085;}
.sub .top_visual .main_txt .navi img {display: inline-block; margin-top: -4px;}
.sub .top_visual .main_txt .navi i {display: inline-block; margin: 0 5px;}
.mobile_nav {display: none; position: absolute; bottom: -35px; left: 0; width: 100%; padding: 0 20px; box-sizing: border-box; z-index: 10;}
.mobile_nav .depth {position: relative;}
.mobile_nav .depth > a {display: block; padding: 0 20px; height: 70px; line-height: 70px; font-size: 20px; font-weight: 500; color: #fff; box-sizing: border-box;}
.mobile_nav .depth > ul {display: none; position: absolute; top: 70px; left: 0; width: 100%; background: #fdfdfd; z-index: 5;}
.mobile_nav .depth > ul li a {display: block; padding: 0 20px; width: 100%; height: 50px; line-height: 50px; font-size: 16px; border-top: 1px solid #eee; box-sizing: border-box;}
.mobile_nav .depth > ul li:first-child a {border-top: 0;}
.mobile_nav .dep1 {float: left; width: calc(50% - 5px); margin-right: 5px; box-sizing: border-box;}
.mobile_nav .dep1 > a {background: #b7b7b7 url('/img/depth_ico.png') no-repeat 95% 50%;}
.mobile_nav .dep2 {float: right; width: calc(50% - 5px); margin-left: 5px; box-sizing: border-box;}
.mobile_nav .dep2 > a {background: #6bb6a7 url('/img/depth_ico.png') no-repeat 95% 50%;}


/* sub - visual */
.sub {padding-bottom: 100px;}
.sub .lnb {position: relative; margin-top: -27px;}
.sub .lnb ul.cate2 {width: 101%; margin-left: -1%; text-align: center;}
.sub .lnb ul.cate2 li {float: left; width: 15.66666%; margin-left: 1%; text-align: center;}
.sub .lnb ul.cate2 li a {display: block; height: 55px; line-height: 55px; font-size: 16px; font-weight: 300; color: #fff; background: #b7b7b7; text-align: center;}
.sub .lnb ul.cate2 li a.on {font-weight: 700; background: #6bb6a7;}

.sub .lnb ul.cate3 {display: block; margin-top: 20px; padding: 15px 0; border-top: 1px solid #dbdbdb; border-bottom: 1px solid #dbdbdb; background: #f9f9f9; text-align: center; box-sizing: border-box;}
.sub .lnb ul.cate3 li {display: inline-block; float:none; padding: 5px 0;}
.sub .lnb ul.cate3 li.br {display: block;}
.sub .lnb ul.cate3 li.noneline a {border-left: 0;}
.sub .lnb ul.cate3 li a.on {color: #4fb8a3; font-weight: 700;}
.sub .lnb ul.cate3 li a {display: block; border-left: 1px solid #b7b7b7; padding: 0 40px; line-height: 1.3; font-size: 16px; font-weight: 500; color: #696969; box-sizing: border-box;}
.sub .lnb ul.cate3 li:first-child a {border-left: 0;}

.sub .lnb .mbile_lnb {display: none;}
.sub .lnb .mbile_lnb {position: relative; margin-top: 75px;}
.sub .lnb .mbile_lnb > a {display: block; padding: 0 20px; width: 100%; height: 60px; line-height: 60px; font-size: 18px; font-weight: 500; color: #666; border: 1px solid #dbdbdb; background: #fff url('/img/depth_ico02.png') no-repeat 98% 50%; box-sizing: border-box;}
.sub .lnb .mbile_lnb > ul {display: none; position: absolute; top: 60px; left: 0; width: 100%; background: #fdfdfd; z-index: 5;}
.sub .lnb .mbile_lnb > ul > li > a {display: block; padding: 0 20px; height: 55px; line-height: 55px; border-top: 1px solid #eee; box-sizing: border-box;}
.sub .lnb .mbile_lnb > ul > li:first-child a {border-top: 0;}

.sub .sub_tit {padding: 60px 0 40px;}
.sub .sub_tit h3 {font-size: 34px; font-weight: 700; color: #4fb8a3; line-height: 1;}

.sub .product .cont {padding-bottom: 60px;}
.sub .product .cont > ul {width: 102%; margin-left: -2%; margin-top: -3%;}
.sub .product .cont > ul li {float: left; width: 23%; margin-left: 2%; margin-top: 3%; cursor: pointer;}
.sub .product .cont > ul li.none {height: 240px; line-height: 240px; border: 1px solid #ddd; text-align: center; box-sizing: border-box;}
.sub .product .cont > ul li .img_box {border: 1px solid #d5d5d5; box-sizing: border-box;}
.sub .product .cont > ul li .txt_box {margin-top: 15px; text-align: center;}
.sub .product .cont > ul li .txt_box em {display: block; font-size: 16px; font-size: #696969;}

.sub .ceo .top {position: relative; height: 486px;}
.sub .ceo .top .bg1 {position: absolute; top: 0; left: 0; width: 100%; max-width: 600px; height: 367px; background: url('/img/company_bg_01.jpg') no-repeat center center/cover; box-shadow: 1px 1px 31px 0px rgba(0, 0, 0, 0.4); z-index: 1;}
.sub .ceo .top .bg1 p {width: 100%; max-width: 405px; margin: 0 auto; line-height: 1.4; font-size: 32px; color: #fff;}
.sub .ceo .top .bg1 p b {font-weight: 900;}
.sub .ceo .top .bg2 {position: absolute; top: 0; right: 0; width: 100%; max-width: 758px; height: 450px; background: url('/img/company_bg_02.jpg') no-repeat center center/cover;}
.sub .ceo .btm .txt {position: relative; float: right; padding-top: 15px; width: 100%; max-width: 758px; border-top: 1px solid #ddd; box-sizing: border-box;}
.sub .ceo .btm .txt:before {content: ''; position: absolute; top: 23px; left: -310px; display: block; width: 161px; height: 65px; background: url('/img/company_bg_03.jpg') no-repeat;}
.sub .ceo .btm .txt p {margin-top: 10px;font-size: 16px; color: #696969; word-break: keep-all;}
.sub .ceo .btm .txt p b {font-weight: 900;}

.sub .chart .cont {text-align: center;}
.sub .chart .cont img {display: inline-block; max-width: 100%;}
.sub .chart .cont img.mo {display: none;}

.sub .history .cont {position: relative;}
.sub .history .cont:before {content: ''; position: absolute; top: 0; left: 50%; margin-left: -.5px; width: 1px; height: 100%; background: #ddd; z-index: -1;}
.sub .history .left {float: left; width: 50%; box-sizing: border-box;}
.sub .history .right {float: right; width: 50%; box-sizing: border-box;}
.sub .history .txt .tit_box {position: relative;}
.sub .history .txt .tit_box:before {content: ''; position: absolute; top: 50%; display: block; width: 25px; height: 3px; background: #333;}
.sub .history .txt .tit_box strong {font-size: 30px; font-weight: 300; color: #333; letter-spacing: -1.5px;}
.sub .history .txt .tit_box b {font-weight: 900;}
.sub .history .txt .con_box {}
.sub .history .txt .con_box li {margin-top: 15px; font-size: 16px; color: #696969;}
.sub .history .txt .con_box li:first-child {margin-top: 0;}
.sub .history .txt .con_box li .date {float: left; width: 50px;}
.sub .history .txt .con_box li .txt {float: right; width: calc(100% - 50px); box-sizing: border-box;}
.sub .history .txt .con_box li em {font-weight: 900;}
.sub .history .txt .con_box li span {display: block; word-break: keep-all;}
.sub .history .right.txt {padding-left: 40px;}
.sub .history .right.txt .tit_box:before {left: -53px;}
.sub .history .left.txt {padding-right: 40px; text-align: right;}
.sub .history .left.txt .tit_box:before {right: -53px;}
.sub .history .left.txt li .date {float: right;}
.sub .history .left.txt li .txt {float: right;}
.sub .history .cont1 .img {position: relative;}
.sub .history .cont1 .img:before {content: ''; position: absolute; top: 0; right: -7px; display: block; width: 14px; height: 24px; background: #fff; z-index: 2;}
.sub .history .cont1 .con_box {margin-top: 60px;}
.sub .history .cont2 {padding-top: 85px;}
.sub .history .cont2 .con_box {margin-top: 20px;}
.sub .history .cont3 {padding-top: 140px; padding-bottom: 120px;}
.sub .history .cont3 .con_box {margin-top: 20px;}
.sub .history .cont3 .left img {display: block; position: relative; top: 35px; left: 12%;}

.sub .address .cont {position: relative; margin-top: -50px; z-index: 1;}
.sub .address .info1 {padding: 34px 45px; width: 100%; max-width: 872px; height: 100px; font-size: 22px; color: #fff; background: url('/img/address_bg.jpg') no-repeat center center/cover; box-sizing: border-box; box-shadow: 1px 1px 31px 0px rgba(0, 0, 0, 0.4);}
.sub .address .info1 em {float: left; display: block; width: 22%; font-weight: 900;} 
.sub .address .info1 em img {display: inline-block; margin-top: -5px; margin-right: 9px;}
.sub .address .info1 span {position: relative; float: left; display: block; padding-left: 40px; width: 78%; font-weight: 300; box-sizing: border-box; word-break: keep-all;}
.sub .address .info1 span:before {content: ''; position: absolute; top: 50%; left: 0; display: block; margin-top: -11px; width: 1px; height: 25px; background: #a9d6cd;}
.sub .address .info2 {margin-top: 30px; width: 100%; max-width: 872px;}
.sub .address .info2 li {float: left; margin-top: 10px; width: 50%; font-size: 16px;}
.sub .address .info2 li.pic {margin-top: 0;}
.sub .address .info2 li p.tit {float: left; width: 135px; height: 34px; line-height: 30px; font-weight: 900; color: #333; text-transform: uppercase;}
.sub .address .info2 li p.tit img {display: inline-block; margin-right: 10px;}
.sub .address .info2 li p.con {position: relative; float: left; padding-left: 25px; width: calc(100% - 135px); height: 34px; line-height: 30px; font-weight: 300; color: #696969; box-sizing: border-box;}
.sub .address .info2 li p.con:before {content: ''; position: absolute; top: 50%; left: 0px; display: block; margin-top: -1px; width: 10px; height: 1px; background: #c1c1c1;}

.sub .pro_view .cont {padding: 20px 40px 20px 20px; background: #f7f7f7; box-sizing: border-box;}
.sub .pro_view .left {float: left; width: 43%;}
.sub .pro_view .view_slide {border: 1px solid #d5d5d5; box-sizing: border-box;}
.sub .pro_view .view_slide .swiper-slide {background: #fff;}
.sub .pro_view .view_slide .view_next {right: 0; margin-top: -32.5px; width: 30px; height: 65px; line-height: 65px; background: rgba(0,0,0,.05) url('/img/view_next.png') no-repeat center center;}
.sub .pro_view .view_slide .view_prev {left: 0; margin-top: -32.5px; width: 30px; height: 65px; line-height: 65px; background: rgba(0,0,0,.05) url('/img/view_prev.png') no-repeat center center;}
.sub .pro_view .right {float: left; width: 57%; padding-left: 4.4%; box-sizing: border-box;}
.sub .pro_view .pro_tit {padding: 23px 0;border-bottom: 2px solid #696969;}
.sub .pro_view .pro_tit strong {display: block; font-size: 24px; font-weight: 700; color: #696969; line-height: 1.3;}
.sub .pro_view .pro_info {padding: 30px 0; font-size: 16px; color: #696969;}
.sub .pro_view .pro_info img {max-width: 100%; height: auto !important;}
.sub .pro_view .btn_box {padding: 40px 0;text-align: center;}
.sub .pro_view .btn_box a {display: inline-block; width: 160px; height: 50px; line-height: 50px; font-size: 16px; font-weight: 500; color: #fff; border-radius: 50px; background: #5a5a5a;}