@charset "utf-8";
/* CSS Document */
html { position:relative; height:100%;}
body { margin:0; margin:0; height:100%;}
p{ font-size:16px;}
hr { clear:left !important; width:95px !important; border-bottom-style:solid !important; background-color:#2a83b9 !important; border-bottom:#2a83b9 1px solid; float:right; margin-top:44px; border-top:none;}
hr.s { float:left; width:70px !important; border-bottom-style:solid !important; background-color:#2a83b9 !important; border-bottom:#2a83b9 1px solid; margin-top:0; border-top:none;}
hr.s1 { display:none; }
hr.s2 {width:100% !important; border-bottom-style:solid !important; border-bottom:#c1c1c1 1px solid; margin-top:0; border-top:none; margin:10px 0; }
hr.s3 { float:left; width:50px !important; border-bottom-style:solid !important; background-color:#2a83b9 !important; border-bottom:#2a83b9 1px solid; margin-top:0; border-top:none;}
h1 { font-size:24px; line-height:1.4em; color:rgba(0,0,0,1); font-family:"Times New Roman", Times, serif, "新細明體" !important; font-weight:600; }
h2{ clear:both; font-family:"Times New Roman", Times, serif; font-size:17px; color:#7d7d7d; padding-right:5px;}
h3{ writing-mode: tb-rl; -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -ms-writing-mode: vertical-rl; writing-mode: vertical-rl; font-size:18px; color:rgba(0,0,0,1); line-height:2.5em}
h4{ width:70px; height:490px; line-height:60px; padding-top:30px; background:url(../images/about_2-p2.png) no-repeat top center; font-size:48px; color:#2d6192; writing-mode: tb-rl; -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -ms-writing-mode: vertical-rl; writing-mode: vertical-rl; font-family:"Times New Roman", Times, serif, "新細明體" !important; font-weight:400; float:right}
h5 { font-size:20px; line-height:1.4em; color:rgba(0,0,0,1); font-weight:400; padding-bottom:20px; }
h6{ writing-mode: tb-rl; -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -ms-writing-mode: vertical-rl; writing-mode: vertical-rl; font-size:18px; color:rgba(0,0,0,1); line-height:2.0em}

/* 主架構 */
#wrap { width:100%;	height:100%;}
#wrap1 { width:100%; height:100%; background-image: inherit; background-repeat:no-repeat !important; background-size:cover !important;}
#wrap2 { width:100%; height:100%; background-image: inherit; background-repeat:no-repeat !important; background-size:cover !important; position:fixed; background-position:center}
#wrap3 { width:100%; top:12.8%;height:87.2%; overflow:hidden !important;}
#wrap4 { width:100%; height:100%; background-image: inherit; background-repeat:no-repeat !important; background-size:cover !important; background-position:center 126px !important}

/*.footer{ position:fixed; width:100%; height:156px; background:url(../images/footer.png) repeat-x center; bottom:0;}*/

/* 選單 */
.index-menu{ position:absolute; top:0; width:97%; height:78px; padding-right:3%; border-bottom:#595959 solid 1px;}
.index-menu .center{width:830px; height:78px; float:right;}
.index-menu .center li{ float: left; padding-left:27px;}
.index-menu .center li a{ font-size:17px; color:#3d3d3d; line-height:105px; font-weight:800;}
.index-menu .center li a:hover{ color:#000;}
.index-menu .center li.mobile{ display:none;}
.index-menu .center .logo{ display:block; float:left; padding-right:20px;}
.nav-button{ display:none;}

#menu{ position:fixed; top:0; left:0; width:100%; padding-top:10px; height:111px; text-align: center; border-bottom:#bababa solid 1px; background:url(../images/menu-bg.jpg) center top repeat-x;}
#menu .logo{ display:block; float:left; width:151px; height:96px; padding-left:0; margin-right:20px;}
#menu .center{ width:750px; height:110px; margin:0 auto;}
#menu .center li{ display:block; float:left; padding-left:27px;}
#menu .center li a{ font-size:17px; color:#646464; line-height:160px; font-weight:800;}
#menu .center li a:hover{ color:#000;}
#menu .center li.mobile{ display:none;}
#menu .center li a.current{ color:#000; padding-bottom:4px; border-bottom:#2d6192 solid 1px; }
.menu-mobile{ display:none;}

/* 次選單 */
.menu-s{ display:block; padding-top:10px; padding-right:5px;}
.menu-s li{ font-size:16px; line-height:1.8em; color:#000; font-weight:600;}
.menu-s li a{ color:#7c7c7c}
.menu-s li a:hover{ color:#000;}

.menu-s1{ display:none;}

.menu-s2{ display:block; padding-top:10px; padding-right:5px;}
.menu-s2 li{ font-size:16px; line-height:1.8em; color:#000; font-weight:600;}
.menu-s2 li a{ color:#7c7c7c}
.menu-s2 li a:hover{ color:#000;}


/* footer */
#footer-mobile{ display:none;}

/* 首頁 */
.index{ height:100%;}
.index .bg{height:100%; background-position:center center !important; background-size: cover !important}
.index .bg .txt{ position:absolute; width:270px; right:90px; top:15%; font-size:42px; line-height:2em; font-weight:800;  font-family:"Times New Roman", Times, serif, "新細明體" !important;}
.index .bg .txt1{ width:270px; right:90px; top:15%; font-size:26px !important; line-height:1.4em; font-weight:700; color:rgba(0,0,0,1) !important;}
.index .bg .button{ position:absolute; width:65px; right:0; top:26.5%;}
.index .bg .button li{ padding:10px 10px; float:right; background:rgba(0,0,0,0.6); margin-top:5px;}
/*.index .bg .logo{ position:absolute; width:500px; left:50%; margin-left:-250px; top:25%;}*/
.index .bg .logo{ margin:0 auto; text-align:center; width:500px; padding-top:15%;}
.index .bg .youtube{ position:absolute; width:100px; left:50%; top:50%; margin:-50px 0 0 -50px; z-index:999}
.index .bg .youtube:hover{opacity:0.5;}

/* 公司簡介 */
.about{ position:absolute; top:175px; left:15%;}
.about-left{ width:235px; height:300px; background:url(../images/about-t-bg.png) no-repeat; text-align:right; float:left;}
.about-right{ float:left; padding-top:35px; padding-left:60px; writing-mode: tb-rl; -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -ms-writing-mode: vertical-rl; writing-mode: vertical-rl; font-size:16px; line-height:1.7em; letter-spacing:2px;}
.about-top{display:none;}
.about-right1{ float:left; padding-top:35px; padding-left:25px; width:455px; /*height:202px;*/}
.about-right2{ float:left; padding-top:35px; padding-left:25px; width:725px;}
.about-right2 .all-txt{padding-left:40px; height:540px; font-size:16px; line-height:1.7em; letter-spacing:2px; color:#464646;}
.about-right-t{writing-mode: tb-rl; -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -ms-writing-mode: vertical-rl; writing-mode: vertical-rl; float:left; height:inherit;}
.about-right1 img{width: 100%;height: auto;}
.about-organize{display: flex;}
.about-organize div{width: 22%;margin-right: 4%;}
.about-organize div:last-child{margin-right: 0;}
.about-organize p{white-space: nowrap; text-overflow: ellipsis; overflow: hidden; font-size: 12px; line-height: 1.5em;}
.about-organize a{position: relative; display: block;}
.about-organize a:before{content: "";height: 2px;width: 0;position: absolute;bottom: 0;left: 50%;background: #2a83b9;-webkit-transition: all 250ms ease-in; -o-transition: all 250ms ease-in; -moz-transition: all 250ms ease-in; transition: all 250ms ease-in;}
.about-organize a:hover:before{left: 2%;width: 96%;}

/* 最新消息 */
.news{ position:absolute; top:175px; right:18.5%; }
.news-right{ width:169px; height:400px; background:url(../images/news-t-bg.png) no-repeat; text-align:right; float:right;}
.news-righ-txt{ display:block; padding-top:15px; float:right; text-align:left; writing-mode: tb-rl; -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -ms-writing-mode: vertical-rl; writing-mode: vertical-rl; font-size:16px; color:rgba(0,0,0,1); line-height:1.8em}
.news-left{ float:right; width:800px; padding-right:20px; font-size:17px; line-height:1.7em;}
.news-left-1{ float:right; width:603px; height:350px; padding-bottom:50px;}
.news-left-2{float:left; width:603px; height:350px; padding-bottom:50px;}
.news-main{ position:relative; width:160px; height:360px; padding:0 20px; border-right:#dcdcdc 1px solid; float:left}
.news-main .picp{ clear:both; position:relative; width:160px; height:225px;/* -webkit-filter:grayscale(1);*/ margin-bottom:15px;}
.news-main .day{ font-size:18px; color:#8a8a8a; line-height:1.7em; width:50px; display:block; font-family:"Times New Roman", Times, serif; text-align:center;}
.news-main .day1{ font-size:18px; color:#8a8a8a; line-height:1.2em; width:50px; display:block; font-family:"Times New Roman", Times, serif; text-align:center;}
.news-main .icon{ position:absolute; top:0; margin-left:10px; width:30px; height:42px; background:url(../images/icon-new.png);}
.news-main a{ color:#000}
.news-main a:hover{ color:#2d6192}
.news_con-left-1{ position:relative; float:right; width:580px; padding-bottom:10px;}
.news_con-left-1 img{ width:100%;}
.news_con-left-2{float:left; width:603px; padding-top:40px; padding-bottom:50px;}
.news_con-left-2 .day{ font-size:18px; color:#2a83b9; line-height:1.7em; display:block; font-family:"Times New Roman", Times, serif;}

/* 工程進度 */
.work{ position:absolute; top:175px; left:18.5%;}
.work-left{ width:169px; height:300px; background:url(../images/work-t-bg.png) no-repeat; text-align:right; float:left;}
.work-right{ float: left; padding-top:35px;padding-left: 60px; text-align:left;  font-size:18px; color:rgba(0,0,0,1); line-height:1.9em; width:330px;}
.work-right .txt{ padding-top:20px; font-size:16px;}

.work_con-left{ width:169px; height:300px; background:url(../images/work-t-bg1.png) no-repeat; text-align:right; float:left;}
.work_con-left-txt{ position:absolute; padding-top:15px;left: 103px; top: 170px; width:70px; writing-mode: tb-rl; -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -ms-writing-mode: vertical-rl; writing-mode: vertical-rl; font-size:16px; color:rgba(0,0,0,1); line-height:1.8em}
.work_con-right{ float: left; padding-left: 60px; text-align:left;  font-size:17px; color:rgba(0,0,0,1); line-height:1.7em; width:920px;}
.work_con-main{ position:relative; width:188px; float:left; padding:0 40px 30px 0;}
.work_con-main .picp{ clear:both; position:relative; border-left:3px solid; border-top:3px solid; border-right:3px solid; border-image:url(../images/border-images1.jpg) 30 round; }
.work_con-main .picp img{ width:100%}
.work_con-main .txtt{ display:block; background:#FFF; width:158px; height:91px; padding:4px 9px; border-left:6px solid; border-bottom:6px solid; border-right:6px solid; border-image:url(../images/border-images.jpg) 30 round; font-size:16px;}
.work_con-main .day{ font-size:18px; color:#2d6192; line-height:1.7em; display:block; font-family:"Times New Roman", Times, serif;}
.work_con-main .icon{ position:absolute; top:0; margin-left:10px; width:30px; height:42px; background:url(../images/icon-new.png);}
.work_con-main a{ color:#000; font-size:36px;}
.work_con-main a:hover{ color:#2d6192}

/*熱銷新案*/
.hot-pic{width:100%;height:100%; background-image: inherit; background-repeat:no-repeat !important; background-size:cover !important; background-position:center !important; overflow:hidden !important}
.hot-pic img{ width:100%;}
.hot{ position:absolute; left:10%; width:435px; top:12.8%; height:87.2%; background:rgba(242,242,242,0.9)}
.hot-left{ position:absolute; display:block; margin-left:-30px; padding-top:400px;}
.hot-left li{ display:block; background:rgba(242,242,242,0.9); width:30px; height:42px; margin-bottom:4px;}
.hot-left li a:hover{ display:block; background:#bbbbbb;}
.hot-left li img{ width:100%;}
.hot-left1{ width:169px; height:350px; background:url(../images/hot-t-bg.png) no-repeat; text-align:right; float:right; padding-right:40px; margin-top:40px;}
.hot-left2{ float: left; width:355px ; padding:40px 0 0 40px; text-align: right;  font-size:17px; color:rgba(0,0,0,1); line-height:1.7em;}
.hot-txt{ width:100%; padding:20px 0;}
.hot-txt .right{ display:block; float:right; font-size:22px; line-height:1.2em; color:#2d6192; padding:6px 10px; border:#2d6192 1px solid; margin-left:10px;}
.hot-txt .left{display:block; font-size:18px; line-height:1.8em; color:#2d6192;}
.hot-txt1{ width:100%;}
.hot-txt1 .right{ display:block; float:right; font-size:16px; margin-left:10px;}
.hot-txt1 .left{display:block; font-size:16px;}
.hot-top{ height:100%; background-size: cover !important; background-position:center !important}
.hot-top img{ width:100%; display:block; position:absolute; top:-190px;}

/*歷年經典*/
.classic-left{ width:169px; height:300px; background:url(../images/classic-t-bg.png) no-repeat; text-align:right; float:left;}
.classic-left-txt{ display:block; padding-top:15px; float:right; text-align:left; writing-mode: tb-rl; -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -ms-writing-mode: vertical-rl; writing-mode: vertical-rl; font-size:16px; color:rgba(0,0,0,1); line-height:1.8em}
.classic-right{ float: left; padding-left: 60px; text-align:left;  font-size:17px; color:rgba(0,0,0,1); line-height:1.7em; width:70%;}
.classic-main{ position:relative; width:160px; float:left; padding:0 30px 40px 0;}
.classic-main .picp{ clear:both; position:relative; border-left:3px solid; border-top:3px solid; border-right:3px solid; border-image:url(../images/border-images1.jpg) 30 round; }
.classic-main .picp img{ width:100%}
.classic-main .txtt{ display:block; background:#FFF; width:130px; height:71px; padding:4px 9px; border-left:6px solid; border-bottom:6px solid; border-right:6px solid; border-image:url(../images/border-images.jpg) 30 round; font-size:17px; line-height:2.5em;}
.classic-main .day{ font-size:18px; color:#8a8a8a; line-height:1.4em; width:70px; display:block; font-family:"Times New Roman", Times, serif; text-align:center;}
.classic-main .day1{ font-size:17px; color:#8a8a8a; line-height:1.0em; width:70px; display:block; text-align:center;}
.classic-main .icon{ position:absolute; top:0; margin-left:10px; width:30px; height:42px; background:url(../images/icon-new.png);}
.classic-main a{ color:#000; font-size:16px;}
.classic-main a:hover{ color:#2d6192}

.classic-main1{ position:relative; width:160px; float:left; padding:20px 30px 0px 0;}
.classic-main1 .picp{ clear:both; position:relative; }
.classic-main1 .picp img{ width:100%}
.classic-main1 .txtt{ display:block; background:#FFF url(../images/classic-bglogo.jpg) right bottom; width:130px; height:71px; padding:4px 9px; border-left:6px solid; border-bottom:6px solid; border-right:6px solid; border-image:url(../images/border-images.jpg) 30 round; font-size:17px; line-height:2.5em;}
.classic-main1 .day{ font-size:18px; color:#8a8a8a; line-height:1.4em; width:70px; display:block; font-family:"Times New Roman", Times, serif; text-align:center;}
.classic-main1 .day1{ font-size:17px; color:#8a8a8a; line-height:1.0em; width:70px; display:block; text-align:center;}
.classic-main1 .icon{ position:absolute; top:0; margin-left:10px; width:30px; height:42px; background:url(../images/icon-new.png);}
.classic-main1 a{ color:#000; font-size:16px;}
.classic-main1 a:hover{ color:#2d6192}
.dd{ clear:both;}

/*歷年經典內頁*/
.clsaaic-c-left{width:169px; height:300px; text-align:right; float:right; padding-right:40px; margin-top:40px;}
.clsaaic-c-left1{ position:absolute; display:block; margin-left:-30px; padding-top:490px;}
.clsaaic-c-left1 li{ display:block; background:rgba(242,242,242,0.9); width:30px; height:42px; margin-bottom:4px;}
.clsaaic-c-left1 li a:hover{ display:block; background:#bbbbbb;}
.clsaaic-c-left1 li img{ width:100%;}
.clsaaic-c-left2{ float: left; width:355px ; margin:120px 0 0 40px; text-align: right;  font-size:17px; color:rgba(0,0,0,1); line-height:1.7em;}
.clsaaic-c-txt1{ width:100%; padding-top:20px}
.clsaaic-c-txt1 .right{ display:block; float:right; font-size:16px; margin-left:10px;}
.clsaaic-c-txt1 .left{display:block; font-size:16px;}
.clsaaic-c-txt1 .left:hover{ color:#2d6192}
.clsaaic-c-txt1 a{ color:rgba(0,0,0,1);}

/*聯絡我們*/
.service{ position:absolute; top:175px; left:15%;}
.service-left{ width:235px; height:300px; background:url(../images/service-t-bg.png) no-repeat; text-align:right; float:left;}
.service-right{ float: left; padding-top:35px;padding-left: 60px; text-align:left;  font-size:18px; color:rgba(0,0,0,1); line-height:1.9em; width:430px;}
.service-right .txt{ padding-top:20px; font-size:15px; margin:0}
.s-r-txt1{ position:relative; clear:both; padding-top:20px; font-size:15px; float:right; width:450px; text-align:center; line-height:1.7; color:#5d5d5d; margin-top:20px;}
.service-btn{ display:block; padding-top:10px; width:190px;; margin:0 auto;}
.service-btn li{ display:block; float:left; width:30px; height:42px; margin-bottom:4px; padding:0px 4px;}
.service-btn li a:hover{ display:block; background:#bbbbbb;}
.service-btn li img{ width:100%;}
.moss{ display:block; font-size:13px; color:rgba(153,153,153,0.6) !important; line-height:42px; position:absolute; right:0; padding-top:10px; padding-right:40px}
.moss:hover{ color:#666;}


/* 文字樣式 */
.txt1{ font-size:14px !important; color:#b5b5b5 !important;}
.txt1:hover{ color:#7d7d7d !important;}
.txt2{ width:60px; height:520px; background:url(../images/about_2-p2.png) no-repeat top center; font-size:48px; color:#2d6192; writing-mode: tb-rl; -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -ms-writing-mode: vertical-rl; writing-mode: vertical-rl;}
.text3{ display:block; padding-top:35px; font-size:18px; color:rgba(0,0,0,1); line-height:1.9em;}
.text3:hover{ color:#2d6192}
.text4{ font-size:17px; color:#000; border:1px solid #585858; background-color:#fff; filter: alpha(opacity=80); opacity:0.8; padding:1px; margin-bottom:10px;}
.text5{ font-size:16px; writing-mode: tb-rl; -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -ms-writing-mode: vertical-rl; writing-mode: vertical-rl; display:block; padding:15px 1px; height:34px; background:#FFF; border:#CCC 1px solid;}
.text5:hover{ font-size:16px; border:#2d6192 1px solid; color:#000}
.text6 { font-size:24px; line-height:2.5em; color:rgba(0,0,0,1); font-weight:600; }
.text7 { font-size:24px; line-height:1em; color:rgba(0,0,0,1); font-weight:600; display:block; padding-top:20px; font-family:"Times New Roman", Times, serif, "新細明體" !important;}
.text8{ font-size:15px; color:#000; border:1px solid #585858; background-color:#fff; filter: alpha(opacity=80); opacity:0.8; padding:1px; width:318px;}
.text9{ font-size:15px; color:#000; border: none !important; border-bottom: 1px solid #585858 !important; background-color: inherit !important; filter: alpha(opacity=80); opacity:0.8; margin-bottom:10px; width:320px;}
.text10{ font-size:15px; color:#000; border:1px solid #585858; background-color:#fff; filter: alpha(opacity=80); opacity:0.8; padding:1px; margin-bottom:10px;  width:320px;}
.text11{ font-size:15px; color:#000; border:1px solid #585858; background-color:#fff; filter: alpha(opacity=80); opacity:0.8; padding:1px; margin-bottom:10px;  width:250px;}
.text12{ font-weight:600; padding-right:5px}
.text22{ font-size:18px; color:#000; border: none; background-color:transparent; padding:3px 8px; margin-top:25px; float:right; font-family:"微軟正黑體", Arial, Helvetica, sans-serif;}
.text23{ font-size:18px; color:#000; border: none; background-color:transparent; padding:3px 8px; margin-top:25px; float:right; font-family:"微軟正黑體", Arial, Helvetica, sans-serif;}



@media screen and (max-width:1600px) {
	.news{ right:10%; }
	.classic-main1{ padding:0 30px 40px 0;}
	.classic-main1 .picp{ clear:both; position:relative; border-left:3px solid; border-top:3px solid; border-right:3px solid; border-image:url(../images/border-images1.jpg) 30 round; }
	#wrap2 {background-position: -60px !important;}
	.work_con-right{width:700px}
	

}
@media screen and (max-width:1400px) {
	.about{left:10%;}
	.about-right2{width:500px;}
	.news{ right:5%; }
	.news-left-2{float:right; }
	.news_con-left-2{float:right; width:580px;}

	.work_con-right{ padding-left:100px; width:500px}
	#wrap2 {background-position: -120px !important;}
	#wrap4 { background-position:center 226px !important; background-color:#f2f2f2 !important}
	

}
@media screen and (max-width:1300px) {
	#wrap2 {background-position: -160px !important;}
	

}
@media screen and (max-width:1100px) {
	.about-right2{width:430px;}
	.about{left:5%;}
	.work{left:10%;}

}