@import url("/css/product/swiper_A1Pro.css");


html ,body { width:100%;  }



.wrap{width:100%;position:relative; line-height:1.6; font-size:1em; }

.unitName{ background:#83bc46;  z-index:99;}


/*-------------mainNav單元文字變色---------------*/
.mainNav > ul > li:nth-child(2) > a { color:#00babc; font-weight:bold;}
@media screen and (max-width: 980px) {
	
.mainNav > ul > li:nth-child(2) > a { color:#333; }

}




.content { position: relative; z-index:1; width:100%; height: auto; top:0px; }
.content section {position: relative; width:100%;  }
.content section {position: relative; width:100%; margin-bottom:2%; }
.content section:nth-child(1),.content section:nth-child(2) {margin-bottom:0; }
.content section  [class*="content-"] {display: block; position:relative;width:100%;    }
.content section  [class*="content-"] .wrap{position: relative; display: block;width:100%; max-width:1280px;  margin:0 auto;}

/*▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃ 選單 ▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃*/


.menuDot{
        position: fixed;
        top:50%;
        right:0px;
        cursor:pointer;
		z-index:999; 
    }
	
.menuDot li{
	list-style-type: none;
	text-align:right;
	display:block;
	color:#555;
	padding:0 10px;
	margin-bottom:15px;
	font-size:13px;
	vertical-align: middle;
    }
	
.menuDot li i{
	font-family: 'FontAwesome';
	content:"\f111";
	color:#ccc;
	font-size:10px;
	vertical-align: middle;
	display:inline-block;
	margin-left:5px;
    }
	
.menuDot li .active{
	color:#ff6600;
	}
	

/*▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃ 內容設定 ▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃*/
[class*="content-"] article .titleBar {
    width: 100px;
    height: 8px;
    background: #ff7e7e;
    margin-bottom: 15px;
}

.content-btn{text-align:center; padding:2% 0 10%; xmin-height:500px;}

/*----------------通用設定----------------*/
/*-----文字設定------*/
/*[class*="content-"] article{position:absolute ;left:0;top:0;right:0;bottom:0; color:#555; z-index:9; }*/
[class*="content-"] article h2{font-family:"微軟正黑體";font-size:2em;line-height:1.5; font-weight:600; letter-spacing:2px; margin-bottom:.4em; white-space:nowrap;}


/*-----圖片設定------*/
[class*="content-intro"] { background-size:cover; height:1080px;}
[class*="content-"] [class*="image"] { position:absolute ;left:0;top:0;right:0;bottom:0; z-index:1; }
[class*="content-"] [class*="image"] img{ width:100%; height:auto;}


/*----------------軟體下載----------------*/

.content-download  {background: url(/images/product/a1Pro/bg/bg09.jpg) no-repeat center bottom ; background-size:covr; }


.content-download article {width:70% ;  margin:23vh auto auto 10%;  }
.content-download article  h2 {width:85% ; font-weight:normal; font-size:1em; float:left;vertical-align: middle  ;}
.content-download article  h2 ul {width:100% ;vertical-align: middle  ;}
.content-download article  h2 ul li{display:inline-block; letter-spacing:2px; margin-right:4%; border-right:1px solid #ccc;}
.content-download article  h2 ul li:last-child{border-right:none;}

/*-------icon 設定-------*/
.content-download article  h2 ul li:before{font-family: 'FontAwesome'; font-size:5em; position:relative; color: #909090; padding-right:8px;}

.content-download article  h2 ul li:nth-child(2):before{content:"\f044";}
.content-download article  h2 ul li:nth-child(3):before{content:"\f086";}


.content-download article  h2 ul li span { vertical-align: super; display:inline-block; padding-right:35px;}
.content-download article  h2 ul li span b { font-size:2em; }
.content-download article  h2 ul li a { display:block;font-size:1.125em;font-weight: normal; text-align:center; background:#ff797d; border-radius:50px; padding:5px; color: #fff; }
.content-download article  h2 ul li a:hover{ text-decoration:none; }
.content-download article  h2 ul li a:after { content:"\f0da"; font-family: 'FontAwesome'; font-size:1em;color: #fff; padding-left:5px;}



.content-download article  p { width:12%;float:right;vertical-align: middle  ;}
.content-download article  p:after { content:"下載行動版"; text-align:center; font-size:1em; letter-spacing:2px; display:block; position:relative; top:-3px; white-space:nowrap;}
.content-download article  p img{ width:100%; height:auto;}

.content-download .image { width:70% ;  margin:40vh auto 0 9%; text-align:center; z-index:999;letter-spacing:-4px;}
.content-download .image a { display:inline-block; width:48%; margin:0 2px; height:2.5em;line-height:2.5em;font-size:2em; font-weight:bold; text-align:center;  vertical-align:middle;letter-spacing:2px; }



.content-download .app{ z-index:9999;  display: block ;margin:62vh auto 0; position:absolute;left:0;top:0;right:0;bottom:0;width:80%;max-width:800px;  letter-spacing:-4px; }
.content-download .app a{ display:inline-block; width:30%;margin:0 .3em ; position:relative; letter-spacing:0px; vertical-align:top;}
.content-download .app img{width:100%; max-width:250px; margin:0 auto ;}



/*▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃ 報表區 ▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃*/

/*--------------------選單----------------------*/
.report{ background:url(../../images/product/a1Pro/bg/bg08.jpg) no-repeat left bottom; min-height:750px;}
.report .menuForm{ width:100%; background:#84c143; border-bottom:5px solid #4d9500; position:relative; top:24px; }
.report .menuForm ol{ width:96%; max-width:900px; margin:0 auto; font-weight:bold; font-size:1.2em; }
.report .menuForm ol li{ text-align:center; color:#fff; padding:1em .8em; display:block; cursor:pointer; line-height:1.2;}
.report .menuForm ol li.active{ background:#fff; color:#84c143; padding:.5em .8em; position:relative; top:.5em;  border-top:5px solid #4d9500;text-shadow: none; border-radius:6px 6px 0 0 ;}
.report .menuForm ol li.active:after{content:"\f0d7";font-family: 'FontAwesome'; display:block; line-height:.8;}

.report .container{width:100%; max-width:1200px; margin:0 auto; min-height:300px; padding:8em 0 0;}

.report .container .part table{min-width:320px; max-width:900px; margin:0 auto; }


@media (max-width: 1366px) {
.report{ background:none;min-height:350px;}
.report .container{width:60%; padding:2em 0 0;}

}


@media (max-width: 1030px) {
.report .container{width:80%; padding:3em 0 0;}
}

@media (max-width: 640px) {
.report .menuForm ol{ font-size:90%; }
.report .container{width:100%; max-width:1200px; margin:0 auto; min-height:300px; padding35em 0 0;}
}

/*▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃ 規格說明 ▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃▃*/


.content-spec  {background: #FFF  ; }
.content-spec  article{ width:74%;  color:#666 ;margin:5vh auto auto auto; }
.content-spec  article h2{font-size:2em; text-align:center; margin-bottom:.3em;  }

table.spec { width:100%; background:#FFF ;max-width:1000px; border:1px solid  #D9D9D9; margin:0 auto; font-size:1em; }
table.spec tr{border-bottom:1px solid  #D7D7D7;  display:block;}
table.spec tr:last-child{border-bottom: none;}
table.spec th{ width:160px;padding:.6em .5em .6em 0  ; text-align:right;font-weight:bold; background: #F7F7F7;}
table.spec td{ padding-left:1em; /*font-size:.9em;*/}
table.spec td.App div{ display:inline-block; vertical-align:top; margin:0 1% 1% 0;}
table.spec td.App div:nth-child(1){ width:55%; margin-right:1%;}
table.spec td.App div:nth-child(2){ width:20%;margin-top:10px;}
table.spec td.App div:nth-child(2) img{ width:100%; margin-top:15px;}
table.spec td.App div:nth-child(3){ width:20%;}
table.spec td.App div:nth-child(3) img{ width:80%;}


table.spec .warn{ color:#F00; font-size:1em; vertical-align:middle;}

table.spec a { color:#009caf;}



/*-------消除jquery.mobile 設定---------*/
.ui-loader{ display:none;} 
.ui-loader h1{display:none;} 






@media screen and (max-width: 1366px) {

[class*="content-intro"] { background-size:cover; height:768px;}

[class*="content-phone"] .image {width:23%;  }

/*----------------pad設定----------------*/


[class*="content-pad"] article{  }
[class*="content-pad"] .image {}


/*----------------web設定----------------*/





/*----------------軟體下載----------------*/

.content-download  {background:none ; }
.content-download article {width:70% ;  margin:30vh auto auto auto; padding-left:10px;  }
.content-download .image { width:70% ;  margin:50vh auto 0; text-align:center; z-index:999;}

/*table.spec { font-size:80%;}*/

}



@media screen and (max-width: 1030px) {

[class*="content-"] article h2{font-size:1.6em; }
[class*="content-"] article p {font-size:.9em;line-height:1.6;}

/*--------------------phone版設定------------------*/


[class*="content-phone"] .phoneMenu  ul  li { font-size:1em; }
[class*="content-phone"] .phoneMenu  ul  li img{ max-height:50px;}


/*----------------軟體下載----------------*/
.content-download  { font-size: 90%  }	
.content-download article h2 { font-size: 80%; letter-spacing:1px;  }	
.content-download article  h2 ul li{ padding-left:1% }


/*----------------規格說明----------------*/
table.spec td.App div:nth-child(1){ width:55%; }
table.spec td.App div:nth-child(2){ width:20%;margin-top:15px;}
table.spec td.App div:nth-child(2) img{ width:100%; margin-top:15px;}
table.spec td.App div:nth-child(3){ width:20%;}
table.spec td.App div:nth-child(3) img{ width:100%;}







}

@media screen and (max-width: 980px) {
	
html ,body { overflow-Y: auto; }
	
.menu { display:none; }
.content section { margin-bottom:5%; }
.content section [class*="content"]  {}
.content section [class*="content"] .wrap{}


/*----------------通用設定----------------*/
/*-----文字設定------*/
[class*="content-"] article{ font-size:95%; width:90%;margin:0 auto;position: relative ;left: auto;top:auto;right:auto;bottom:auto;  z-index:1; margin-bottom:1em;}
[class*="content-"] article h2{  white-space: normal;}
[class*="content-"] article p { }
[class*="content-intro"] article{ color:#333;}

/*-----圖片設定------*/
[class*="content-"] [class*="image"] {width:90%;margin:0 auto;position: relative ;left: auto;top:auto;right:auto;bottom:auto; z-index:1; padding:15vh 0 30px 0;}
/*[class*="content-intro"]{width:100%;background-position: 0 -50px; background-size: cover;}*/


/*----------------pad設定----------------*/
[class*="content-pad"] {background: #666 ; }


/*-------------------phone版設定-------------------*/
[class*="content-phone"] article h2{ text-align: left }



[class*="content-phone"] article{ width:40%;  color:#333333;margin:12vh 10% auto auto;position:absolute ;left:0;top:0;right:0;bottom:0; }
[class*="content-phone"] .image {width:28%; max-height:70vh; margin:5vh auto auto 14% ;position:absolute ;left:0;top:0;right:0;bottom:0; }
[class*="content-phone"] .phoneMenu {width:40%;  margin:60vh 10% auto auto  ; z-index:99;position:absolute ;left:0;top:0;right:0;bottom:0;}
[class*="content-phone"] .phoneMenu  ul  li { font-size:.9em; }




}



/* Landscape 這是拿橫的時候 */
@media screen and (orientation:landscape)  and (max-width: 1024px) {
.content-download .app{ display: block ;margin:62vh auto 0; position:absolute;left:0;top:0;right:0;bottom:0;}

}

@media screen and (max-width: 768px) {
	
.menuDot{display:none;}
.content-description {background-size: contain; min-height:0px;}
[class*="content-intro"] { background-size: contain; min-height:0px; background-position:top;}

	
/*----------------軟體下載----------------*/
	
.content-download  { font-size: 90%; background:#f9f9f9;}	

.content-download article { width:100%; margin:8vh auto auto auto; }	
.content-download article h2 { font-size: 80%  }	
.content-download article h2 ul li{ border:none;   }

.content-download .image {width:96%; margin-top:1em;}
.content-download .image a{font-size: 110%;}

.content-download article  h2 {width:100% ; }
.content-download article  p { display:none;}

.content-download .app{ display: block;}

[class*="content-"] .arr { margin: auto auto  5vh auto ;}


}




/* portrait 這是拿直的時候 */
@media screen and (orientation:portrait) and (max-width: 640px) {
	
html ,body { overflow-Y: auto; }
	
.content {  margin-top:0px; }

.content section {}

.content section [class*="content"] .wrap{max-width:100%;padding:3em 0;}

[class*="content-intro"] { background-size:cover; height:640px;}
[class*="content-"] [class*="image"] {padding:20vh 0 30px 0;}



	
/*-------------------phone版設定-------------------*/
	
[class*="content-phone"] article h2{font-size:1.2em; text-align: left }
	

[class*="content-phone"] article{ width:52%;  color:#333333;margin:13vh 1% auto auto; }
[class*="content-phone"] .image {width:44%; max-height:70vh; margin:11vh auto auto 1% ; }
[class*="content-phone"] .phoneMenu {width:80%;  margin:71vh auto auto auto  ; }






/*----------------規格說明----------------*/

.content section  .content-spec article {width:98% !important ;}

table.spec { font-size:.9em ;width:100%;}
table.spec th{ width:80px;padding:.4em 0; padding-right:.3em; }
table.spec td{  padding-left:.5em;}
table.spec td.App div:nth-child(1){ width:95%; }
table.spec td.App div:nth-child(2){ width:95%;margin-top:15px;}
table.spec td.App div:nth-child(2) img{ width:auto; margin-top:15px;}
table.spec td.App div:nth-child(3){ width:95%;}
table.spec td.App div:nth-child(3) img{ width:auto;}
	
	
	
	/*----------------軟體下載----------------*/
.content-download article {width:70% ;  margin:1vh auto auto 12%;  }	
.content-download article h2 ul li{ margin:0px auto 10px; display:block; width:80%; text-align:center;}
.content-download article  h2 ul li:before{ font-size:5em; display:block; padding:0px; margin-bottom:-10px;}
.content-download article  h2 ul li span { vertical-align: bottom; display:inline-block; padding-right:0px;}
.content-download article  h2 ul li span b { font-size:2em; padding:0px;display:inline-block;}

	
}









/* Landscape 這是拿橫的時候 */
@media screen and (orientation:landscape) and (max-width:980px) {


[class*="content-phone"] article{ margin:24vh 10% auto auto; }

[class*="content-phone"] .image { margin:20vh auto auto 14% ; }

[class*="content-phone"] .phoneMenu { margin:100vh 10% auto auto  ;  }


.content-download .app{ margin:100vh auto auto auto;}





}