/*mainStyle.css*/
#container{overflow: hidden;}
.bannerWrap{width: 100%; height: 950px; position: relative; background: url(../img/main/banner1.png); background-size: cover; background-position: center;}
.bannerWrap > img{height: 100%; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%);}
.bannerWrap > div{ padding: 40px; width: 768px; position: absolute; left: 50%; top: 50%; -webkit-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); transform: translate(-50%,-50%);}
.bannerWrap > div img{margin: 30px auto;}
.bannerWrap > div h2, .bannerWrap > div p{text-align: center; color: #fff;}
.bannerWrap > div h2{font-size: 48px; letter-spacing: -1px; line-height: 1.2; margin-bottom: 40px;}
.bannerWrap > div p{font-size: 20px; line-height: 1.5;}
.bannerWrap > div p span{display: block;}
.bannerWrap > div > div{width: 37px; height: 192px; position: absolute; font-size: 100px; color: #fff; z-index: 10; top: 30px; background: url(../img/main/square_bracket1.png); background-size: 100% 100%;}
.bannerWrap > div > div.square_bracket1{left: 100px;}
.bannerWrap > div > div.square_bracket2{background-image: url(../img/main/square_bracket2.png); right: 100px;}
.inner.box{padding: 0 20px 120px;} 
.main_title{padding: 100px 0 30px 0;}
.main_title h2{font-size: 42px; line-height: 1.0; color: #777; text-align: center;}
.main_title h2::after{content: ""; display: block; width: 1px; height: 35px; background: #223040; margin: 30px auto;}
.main_title h2 span{color: #19618b; margin-right: 20px;}
.main_title p{width: 90%; margin: 0 auto; text-align: center; font-size: 20px; line-height: 1.5;}
.detail{width: 100%; margin: 0 auto;}
.aboutWrap{width: 100%;}
.aboutWrap .detail > ul li strong{text-align: center;}

.aboutWrap .main_title p {font-size: 18px;color: #666;}
.aboutWrap .about_con{width: 100%; margin: 0 auto;}
.aboutWrap .about_con > ul{width: 100%; height: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin: 0 auto;}
.aboutWrap .about_con > ul li{position: relative; float: left; width: 32%; padding: 13px 0;}
.aboutWrap .about_con > ul li.second{margin: 0 2%;}
.aboutWrap .about_con > ul li .ab-box {padding-left: 90px;}
.aboutWrap .about_con > ul li img{margin: 0; position: absolute; left: 10px; text-align: left; width: 70px;}
.aboutWrap .about_con > ul li p{color: #666; font-size: 22px; margin-bottom:12px;}
.aboutWrap .about_con > ul li p span{display: block;}
.aboutWrap .about_con > ul li strong{display: block; font-size: 20px; line-height: 1.5; color: #333; margin: 0 auto; text-align: left;} 
.aboutWrap .about_con > ul li strong span{font-size: 28px; color: #444; display: inline-block; font-weight: bold; margin-right: 10px;}
.aboutWrap .about_con > ul li p{text-align: left;}

.aboutWrap .detail > ul li{float: left; width: 32%; padding: 13px 0;}
.aboutWrap .detail > ul li.second{margin: 0 2%;}
.aboutWrap .detail > ul li img{display: block; margin: 30px auto 35px; width:165px; -webkit-filter: grayscale(100%); opacity: 0.7;}
.aboutWrap .detail > ul li p{color: #666; font-size: 28px; margin-bottom: 10px; border: 3px solid #ccc; padding: 5px;}
.aboutWrap .detail > ul li span{display: block; padding: 10px; font-size: 18px; color: #666; line-height: 24px;}
.aboutWrap .detail > ul li button{display: block; float: right; font-size: 20px; padding: 3px 10px; color: #fff; background: #333;} 
.aboutWrap .detail > ul li strong span{font-size: 44px; color: #223040; display: inline-block; font-weight: bold; margin-right: 10px;}
.aboutWrap .detail > ul li p{text-align: center;}
.aboutWrap .detail > ul li:hover img{-webkit-filter: grayscale(0%); opacity: 1;}


.intro-box {background: url(../img/main/consert_bg.png); }
.intro-box .inner.box { padding: 20px; }
.intro-box .detail > ul li {
    float: left;
    width: calc(20% - 20px);
	padding: 20px 0;
    margin: 10px;
	font-size: 16px;
    text-align: center;
    background: #fff;
    border-radius: 10px;
	white-space: nowrap;
}
.intro-box .detail > ul li:hover { background-color:#f9f7f7; box-shadow:3px 3px 5px rgba(0,0,0,0.2); }

.intro-box a {position: relative;     display: block; width: 100%;height: 100%;}
.intro-box a:hover .intro-hover {top: 0;}
.intro-box .intro-name { margin-top: 20px;margin-bottom: 15px; padding-bottom: 15px; color: #fff; font-size: 20px; font-weight: 700;text-transform: uppercase;}
.intro-box img {margin: 0 auto;}
.intro-box .intro-desc{ }
.intro-box .intro-desc{color: #a6d5f0;}
.intro-box .intro-view {display: table; width: 100%; height: 100%;}
.intro-box .intro-view-mid{padding: 20px; display: table-cell;vertical-align: middle;}
.intro-box1 {background-image: url(../img/main/intro_bg1.jpg); }
.intro-box2 {background-image: url(../img/main/intro_bg2.jpg); }
.intro-hover {position: absolute; top: 100%; left: 0; width: 100%; height: 100%; color: #fff; background: rgba(25, 97, 139 ,1); transition: 0.5s;}


.coreComWrap{width: 100%; background: url(../img/main/sub_visual_01.jpg); background-size:cover; background-position: 50% 100%;}
.coreComWrap .main_title h2::after{background: #fff;}
.coreComWrap .main_title h2, .coreComWrap .main_title h2 span, .coreComWrap .main_title p{color: #fff;}
.coreComWrap .main_title h2{letter-spacing: -4px; }
.coreComWrap .main_title h2 span{letter-spacing: 0;}
.coreComWrap .detail ul li strong{font-weight: bold; margin-bottom: 26px;}
.coreComWrap .detail ul li p{font-size: 22px; line-height: 1.4; margin-bottom: 0;}
.coreComWrap .detail > ul{width: 100%; margin: 0 auto;}
.coreComWrap .detail > ul li{float: left; width: calc(25% - 20px); padding: 20px 0 0; margin: 10px; font-size: 20px; text-align: center;background: #fff; border-radius: 10px; overflow: hidden; cursor: pointer;}
.coreComWrap .detail > ul li:hover { background-color:#f9f7f7; box-shadow:3px 3px 5px rgba(0,0,0,0.2); }
.coreComWrap .detail > ul li.second{margin: 0 2%;}
.coreComWrap .detail > ul li img{margin: 0px auto 8px;}
.coreComWrap .detail > ul li p{ padding: 10px 0; margin-top: 20px; color: #fff; font-size: 0.8em; text-align: center; background: #333;}
.coreComWrap .detail > ul li span{display: block; padding: 10px 30px; font-size: 18px; color: #666; line-height: 24px;}
.coreComWrap .detail > ul li button{display: block; float: right; font-size: 20px; padding: 3px 10px; color: #fff; background: #333;} 
.coreComWrap .detail > ul li strong span{font-size: 44px; color: #223040; display: inline-block; font-weight: bold; margin-right: 10px;}
.coreComWrap .detail > ul li .ti02 {display: block; height: 65px;}
.coreComWrap .detail .ti01{ color: #996846; font-size: 60px; margin: 5px; height: 63px;}
.ssbar {
    width: 100%;
    float: left;
    color: #1659a3;
    font-size: 24px;
    margin: 20px 20px 0;
}


.portfolioWrap{background: url(../img/main/port_bg.png); padding-bottom: 90px;}
.portfolioWrap .main_title h2::after{background: #fff;}
.portfolioWrap .main_title h2, .portfolioWrap .main_title h2 span, .portfolioWrap .main_title p{color: #fff;}
.port_go{width: 100%;}
.portfolioWrap .port_go a{display: block; color: #fff; text-align: center; font-size: 18px; width: 100%; border: 1px solid #fff; padding: 15px 0px; -webkit-transition-duration: 0.3s; transition-duration: 0.3s;  -webokit-transition-duration: 0.3s; -moz-transition-duration: 0.3s; -ms-transition: 0.3s; -0-transition-duration: 0.3s; margin: 10px 0;}
.portfolioWrap .port_go a:hover{background: #fff; color: #223040;}
.pic_lt .lat_title, .pic_lt .lt_more, .pic_lt li .new_icon, .pic_lt .lt_date{ }
.portfolioWrap .mainPage{display: block;}  
.portfolioWrap .latest_wr{display: none;}
.portfolioWrap .latest_wr2{display: block;}
.portfolioWrap .pic_lt .empty_li{width: 100%; height: 500px; background: #fff; line-height: 500px; text-align: center;}
.portfolioWrap .pic_lt{width: 100%; background: none; border: none; margin-bottom: 0;} 
.portfolioWrap .pic_lt ul{padding: 0;}
.portfolioWrap .pic_lt li{padding: 0;}
.portfolioWrap .pic_lt li .lt_img{margin: 0;}
.portfolioWrap .pic_lt li .lt_img img{display: block;    display: block;}
.portfolioWrap .pic_lt li .lt_img + a{display: none;}
.portfolioWrap .latest_wr2 .pic_lt .new_icon + a{display: none;}
.portfolioWrap .owl-theme .owl-dots .owl-dot{outline: 0 none;}
.portfolioWrap .owl-theme .owl-dots .owl-dot span{background: #ddd;}
.portfolioWrap .owl-theme .owl-dots .owl-dot span:hover, .portfolioWrap .owl-theme .owl-dots .owl-dot.active span{background: #19618b;}

.consertWrap{background: url(../img/main/consert_bg.png);}
.consertWrap .inner{padding-bottom: 170px;}
.consertWrap .main_title{padding-bottom: 30px;}
.consertWrap .latest_wr{width: 100%; margin: 0 auto;}
.consertWrap .latest_wr > div{float: left; width: 45%;}
.consertWrap .latest_wr > div.ing_projects{ margin-bottom: 5%;}
.consertWrap .latest_wr > div.news{float: right;}
.consertWrap .lat{margin-bottom: 0; border: none; padding: 40px; min-height: 445px;}
.consertWrap .lat .lat_title{border-bottom: none; background: none; padding: 0; line-height: 1.0em; font-size: 1.0em; color:#333; border-bottom: 1px solid #ddd;}
.consertWrap .lat .lat_title a{color: #333; font-size: 30px; color: #333; font-weight: 600; line-height: 70px; height: 70px;}
.consertWrap .lat ul{padding: 0; margin-top: 30px;}
.consertWrap .lat li{padding: 5px 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.consertWrap .lat li:before{display: none;}
.consertWrap .lat li a{width: 70%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; color: #333; font-size: 18px;}
.consertWrap .lat .lt_date{color: #888; font-size: 18px;}
.consertWrap .lat .lat_title_area{position: relative;}
.consertWrap .lat .lt_more{top: 50%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); right: 0;  font-weight: normal; color: #7a838c; font-size: 45px;}
.consertWrap .lat .lt_more .fa{display: none;}
.consertWrap .lat li .new_icon{display: none;}
.consertWrap .lat .lat_title a:after{display: none;}
.consertWrap .lat .empty_li{line-height: 270px; font-size: 18px;}


@media screen and (max-width:767px){
	.coreComWrap .detail > ul li p { font-size: 14px; }
	.bannerWrap{height: 700px;}
    .bannerWrap > div{width: 480px;}
    .bannerWrap > div > div.square_bracket1{left: 20px;}
    .bannerWrap > div > div.square_bracket2{right: 20px;}
	.main_title p { font-size: 14px; }
    .inner.box{padding: 0 20px 60px;} 
    .aboutWrap .detail > ul li{width: 100%;}
    .consertWrap .inner{padding-bottom: 80px;}
    .consertWrap .main_title{padding-bottom: 0;} 
    .consertWrap .latest_wr > div{float: left; width: 100%;}
    .consertWrap .latest_wr > div.ing_projects{ }
    .consertWrap .lat{padding: 40px;}
    .consertWrap .lat .lat_title a{font-size: 20px; line-height: 60px; height: 60px;}
    .consertWrap .lat li{line-height: 50px;}
    .consertWrap .lat li a, .consertWrap .lat .lt_date{font-size: 16px;}
    .consertWrap .lat .empty_li{line-height: 300px; font-size: 16px;}
    .coreComWrap .detail ul{width: 100%;}
	.coreComWrap .detail > ul li {width: calc(50% - 20px);}
	.intro-box .detail > ul li { width: calc(50% - 20px); font-size: 14px; overflow: hidden;}
}