@import "/inc/css/all.css";
@import "/inc/css/btn.css";
body {background:#bdbdbd;}

/*---- 最外層包裝 ----*/   
#wrapper{
	width:100%;
	margin:0 auto;
    background:#fff url("/wealth-ap/images/header_bg.png") repeat-x top center;
	position:relative;
}
    
#header
{ width:1000px;
  height:100px;
  margin:0 auto;
  color:#fff;
  position:relative;
}
#navbar {
    width:1000px;    
    margin:0 auto;
    color:#333;
}
.logo {
padding:10px 0 0 5px;
height:90px;
}

.text {
padding:25px 5px 0 0;
font:12px/1.5 微軟正黑體,Arial;
text-align:right;
}
#content_index
{ 
  width:100%;
  background: url("/wealth-ap/images/content_bg.png") repeat-x center top;
  margin:0 auto;
    }

#content
{ 
  width:100%;
  background: url("/wealth-ap/images/content_bg.png") no-repeat center -10px;
  margin:0 auto;

    }

.index{
  width:1100px;
  margin:0 auto;

}
.index_menu{
  width:644px;
  position:relative;
  top:-40px;
  left:50%;
  margin-left:-322px;
  background:#cc0000;
 
}

.index_menu li{
  float:left;
  margin-right:35px;
  list-style-type:none;
}
.index_Features a{ display:block;width:126px;height:125px;background:url("/wealth-ap/images/index_menu.png") no-repeat 0 0;}
.index_Features a:hover{ display:block;width:126px;height:125px;background:url("/wealth-ap/images/index_menu.png") no-repeat -126px 0;}

.index_Study a{ display:block;width:126px;height:125px;background:url("/wealth-ap/images/index_menu.png") no-repeat 0 -125px;}
.index_Study a:hover{ display:block;width:126px;height:125px;background:url("/wealth-ap/images/index_menu.png") no-repeat -126px -125px;}

.index_QA a{ display:block;width:126px;height:125px;background:url("/wealth-ap/images/index_menu.png") no-repeat 0 -250px;}
.index_QA a:hover{ display:block;width:126px;height:125px;background:url("/wealth-ap/images/index_menu.png") no-repeat -126px -250px;}

.index_Download a{ display:block;width:126px;height:125px;background:url("/wealth-ap/images/index_menu.png") no-repeat 0 -375px;}
.index_Download a:hover{ display:block;width:126px;height:125px;background:url("/wealth-ap/images/index_menu.png") no-repeat -126px -375px;}

.index img{
 padding:40px 0 60px 0;
}
/*.index img{
 padding:30px 0 80px 0;
}*/

.index2 {
  width:1000px;
  margin:0 auto;
}

.Point {
  width:900px;
  padding-bottom:20px;
  height:5px;
  margin:0 auto;
  background: url("/wealth-ap/images/point_001.png") repeat-x;
}
#Box_bg {
    width: 1000px;
    margin: 0 auto;
    padding-bottom:30px;
    background: url("/wealth-ap/images/Box_bg.png") no-repeat;
    z-index:1;
    position:relative;
}
#Box {
    width: 920px;
    margin: 0 auto;
    padding:30px 0;
     
}
#Box h1{
    font:25px/1.5 微軟正黑體,Arial;   
    background: url("/wealth-ap/images/icon_title001.png") no-repeat 5px 18px; 
    color: #333;    
    padding:10px 0 10px 40px;

}
#Box h2{
    font:20px/1.5 微軟正黑體,Arial;   
    background: url("/wealth-ap/images/icon_title002.png") no-repeat 0px 17px; 
    color: #333;    
    padding:10px 0 10px 20px;

}
.bar {
    background:#c5c5c5;
    height:1px;
    border-bottom:5px solid #e4e4e4;
    margin:0 0 20px 0;
}
#Box h3{
    font:15px/1.5 微軟正黑體,Arial;    
    color: #cc0000;  
}
#Box_all{
    width:830px;
    margin:0 auto;
    
    
   
}
#Box_left{
    width:200px;
    float:left;
   
}

#detail_left ul{
    list-style-type:none;
}

#detail_left ul li{   
    text-align:left;
    text-decoration:none;

}
#detail_left ul li a{  

    text-align:left;

    text-decoration:none;

}
.menu_on { display:block;  margin:5px; color:#ffffff;padding:5px 0 5px 10px; text-decoration:none;background: url(/images/menu_bg01.png) no-repeat;}
.menu a{ display:block;    margin:5px;  color:#333333; text-decoration:none; padding:5px 0 5px 10px; background:#fff;}
.menu a:hover{ display:block;  margin:5px; color:#333333;background:#ccc;text-decoration:none;padding:5px 0 5px 10px;background: url(/images/menu_bg02.png) no-repeat }

.menusub_on{      display:block; margin:5px 0 5px 25px; padding:5px 0 5px 20px; color:#cc0000; text-decoration:none; background: url(/images/menu_icon.png) no-repeat 0 -100px}
.menusub a{       display:block; margin:5px 0 5px 25px; padding:5px 0 5px 20px;color:#333333;  text-decoration:none;  background: url(/images/menu_icon.png) no-repeat 0 0}
.menusub a:hover{ display:block; margin:5px 0 5px 25px; padding:5px 0 5px 20px; color:#cc0000;text-decoration:none; background: url(/images/menu_icon.png) no-repeat 0 -100px}

#Box_right{
    width:700px;
    float:right;
}


/*下載專區*/

.download_btn{
 position:relative;
 z-index:0;
   
}
.download_btn ul{
 margin-bottom:30px; 
  
}
.download_btn li{
 float:left; 
  padding-left:60px;
  list-style-type:none;
}
.download_btn01 a{display:block;width:255px;height:202px;background:url("/wealth-ap/download/images/download_btn001.png") no-repeat 0 0;}
.download_btn01 a:hover{display:block;width:255px;height:202px;background:url("/wealth-ap/download/images/download_btn001.png") no-repeat -255px 0;}

.download_btn02 a{display:block;width:255px;height:202px;background:url("/wealth-ap/download/images/download_btn001.png") no-repeat 0 -202px;}
.download_btn02 a:hover{display:block;width:255px;height:202px;background: url("/wealth-ap/download/images/download_btn001.png") no-repeat -255px -202px;}


.download_attention{
    font-size:12px;
    margin:5px auto;
    text-align:center;
    position:absolute;
    top:95px;
    left:80px;
    color:#fff;
    z-index:1;
}
.download_attention span{
    font-size:20px;
    font-weight:bold;
}



.download2{
display:block;
margin: 10px 20px;
}

.download2 li{
 float:left;  
 display:block;
 list-style-type:none; 
}

.download_btn2 a{
display:block;
 width:81px; 
 height:81px; 
 margin-right:20px;
 background: url("/wealth-ap/download/images/download_btn002.png") no-repeat;
}
.download_btn2 a:hover{  
  background: url("/wealth-ap/download/images/download_btn002.png") no-repeat -81px 0;
 }
.download_title2{
color:#cc0000;
 width:555px;
 padding:5px 0;
 border-bottom:1px dotted #333;
}
.download_text2{
 width:550px;
  padding:5px 0;
}

/*操作說明，安裝說明*/

.operate {
    display:block;
    width:100%;
    padding:20px 0;   
    background:#ffddde;
    margin-bottom:20px;
    list-style-type:none;
}
.operate:hover{
    
   
}
.step {width:100%;
}

.step li{
    list-style-type:none;
}

.step_text {
   
    margin:0 20px;
    padding:10px 0;

}
.step_text_title {
    font:30px/1.5 微軟正黑體,Arial;  
    color:#cc0000;
    border-bottom:2px dotted #cc0000;
    padding-bottom:10px;
    margin-bottom:10px;
}
.step_text_title2 {
    font:12px/1.5 微軟正黑體,Arial;  
    color:#cc0000;
    padding-top:10px;
}
.step_text span{
   color:#197b30;
   padding:0 5px;
}
.step_img {

    padding:10px;
       margin:0 20px;
    background:#FFF;
     border:1px solid #bbb;
    
}
.step_img img{
 border:1px solid #5a5a5a;
 width:635px;
}
/*功能介紹*/
.intro {
    display:block;
    width:100%;
    padding:30px 0;    
   background:#ffddde;
    margin-bottom:20px;
    list-style-type:none;
}
.intro:hover {
  border:2px solid #f26d7d;
}


.intro li{
    list-style-type:none;
}

.intro_text {
    width:300px;
    margin:0 20px;
    padding:60px 0;
    float:left;
}
.intro_text_title {
    font:20px/1.5 微軟正黑體,Arial;  
    color:#cc0000;
    border-bottom:2px dotted #cc0000;
    padding-bottom:10px;
    margin-bottom:10px;
}

.intro_text span{
   color:#197b30;
   padding:0 5px;
}
.intro_img {
    float:right;
    padding:10px;
    margin-right:20px;    
    background:#FFF;
     border:1px solid #bbb;
    
}
.intro_img img{
 border:1px solid #5a5a5a;
}





#divShow {
 background:#ffddde url("/wealth-ap/images/icon_001.png") 20px 8px no-repeat;
 padding:10px 0 10px 60px;
 border: 1px solid #ffc9cb;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
}
.List_icon { display:block;
             width:50px;
}

#footer
{ width:100%;
  background:#4d4d4d;
  color:#fff;
  padding:20px 0;
  }

#company
{ width:1000px;
  margin:0 auto;  
  text-align:center;
  font:12px/1.5  Arial,微軟正黑體;
  
  }
#account, #email{
    width:350px;
}

.atable{ margin:50px 0 20px 0; position:relative;}
.atable_top {height:10px;width:700px; background:url(/images/atable_001.png) no-repeat;}
.atable_middle {width:700px; background:url(/images/atable_002.png) repeat-y;}
.atable_bottom {height:10px;width:700px; background:url(/images/atable_003.png) no-repeat;}
.atable_title {font:20px/1.5  Arial,微軟正黑體;background:url(/images/atable_title.png) no-repeat; position:absolute; width:84px; height:111px; color:#fff; left:30px;  padding-left:20px;padding-top:15px;
}

.atable_text {  
    width:80%;
    margin-left:110px;
     
}
.atable_text li{
list-style-type:none;
padding:5px 0 5px 30px;
font-weight:bold;
}

.atable_text li p{
color:#333;
font-weight:100;
font:12px/1.5  Arial,微軟正黑體;
}

.atable_text h4{
color:#9d770b;
font:20px/1.5  Arial,微軟正黑體;
border-bottom:1px dotted #333;
padding-bottom:5px;
margin-bottom:5px;
}
/*雲端智慧單區**/
.table01 {
    border-collapse: collapse;
    margin: 0 auto;
    margin-top: 5px;
    width: 100%;
}

    .table01 thead th {
        background: #CC0000;
        padding: 10px 2px;
        border: 1px #FFFFFF solid;
        color: #fff;
        text-align: center;
        font-size:1.2em;
    }
      .table01 tbody th {
        background:  #ffdbdb;
        padding: 10px 2px;
        border: 1px #FFFFFF solid;
        text-align: center;
       
    }
    .table01 tbody td {
        border: 1px #FFFFFF solid;
        padding: 10px 2px;
        color: #333;
         background:#f2f2f2;
    }
    /*.table01 tbody tr:nth-child(odd) {
        background:#e4e4e4;
    }*/
      /*.table01 tbody tr:nth-child(odd) {
        background:#e4e4e4;
    }*/
.advantage{
    color:#cc0000;
}
.disadvantages{
    color:#197b30;
}
.note{
    color:#cc0000;
    /*background:#fae8e9;*/
}

.advantage  span, .disadvantages span, .note span{
    color:#FFF;
    border-radius:1000em;
    display:inline-block;
   width:3em;
   text-align:center;
   line-height:1.5em;
   margin-right:.5em;
}
.advantage span{
    background:#cc0000;
}
.disadvantages span{
    background:#197b30;
}
.note span{
    border:#cc0000 1PX solid;
    color:#cc0000;
    /*background:#fae8e9;*/
}
/*QA*/

#qa_btn {z-index:2;position:relative;float:right;}
ul.accordionPart {
	margin: 10px 10px 50px 0;
}
ul.accordionPart li {
	border-bottom: solid 1px #e3e3e3;
	padding-bottom: 12px;
	margin-top: 12px;
    list-style-type:none;
}
.accordionPart .qa_title {
	padding-left: 28px;
    font:15px/1.5 微軟正黑體,Arial;
	color: #cc0000;
	cursor: pointer;
    background:url(/images/icon_qa.png) no-repeat 0 2px;
}

.qa_title_on {
    color: #cc0000;
	text-decoration: underline;
}
.qa_content {
    margin: 6px 0 0;
    padding-left: 28px;
  
}
ul.accordionPart li a{
	color:#333; padding:0 5px;
}
ul.accordionPart li a:hover{
	color:#cc0000;
}
.qa_content span {color:#8c6239;  }
.qa_content img{width:630px;margin:5px 0;border:1px solid #333;}
.qa_content ul div ol img{width:590px;margin:5px 0;border:1px solid #333;}
.qa_content ol li{border-bottom: 0;
                  padding-bottom:0;
                  list-style-type:decimal;
}
.qa_content ol img{width:590px;margin:5px 0;border:1px solid #333;}

#qa_btn {z-index:2;position:relative;float:right;}

/* ---------------------------------------------------------
            debug: user用手機瀏覽放大畫面時 header的右方被切斷了
            原因是 position: fixed, 且width=100%
            所以要排除這兩種
---------------------------------------------------------*/

@media screen and (max-width: 1000px) {
    #navigation {
        position: absolute;
    }

    #wrapper, #menu_div, #navigation, #content_index, #footer {
        width: 1200px;
    }
}

@media screen and (min-width: 1001px) {
    #navigation {
        position: fixed;
    }

    #wrapper, #menu_div, #navigation, #content_index, #footer {
        width: 100%;
    }
}

/*API申請區*/

.apiTitle {
    color: #cc0000;
    margin-left: 1.2em;
    font-weight: bold;
    font-size: 1.2em;
}
.linkBox {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
}
    .linkBox a {
        text-decoration: none;
    }
        .link:hover {
            background: #5a5a5a;
        }
.link {
    font-weight: bold;
    background: #cc0000;
    color: #fff;
    border-radius: 0.3em;
    padding: 0.5em 1em;
    margin: 0.8em;
    width: 33%;
    height: 3.6em;
    width: 12em;
    display: flex;
    text-align: center;
    justify-content: center;
    text-decoration: none;
    flex-direction: row;
    align-items: center;
}
.link_table {
    border-collapse: collapse;
    margin: 1em auto;
    margin-top: 2em;
    width: 100%;
}
.link_table th {
    background: #777;
    padding: 10px 5px;
    border: 1px #fff solid;
    color: #fff;
    text-align: center;
}
.link_table tr {
        background-color:  #eee;

    }
    .link_table td {
        border: 1px #fff solid;
        padding:1em;
    }
    .link_table td ul{
        margin-left:2em !important;
    }
.link_table tr:nth-of-type(even) td {
    background-color: #f9f9f9;
}

.apiUl li{
    list-style: decimal;
    margin:.6em 1.5em;
}

.api_table {
    border-collapse: collapse;
    margin: 1em auto;
    width: 100%;
}
.api_table th {
    background: #777;
    padding: 10px 5px;
    border: 1px #fff solid;
    color: #fff;
    text-align: center;
}
.api_table tr {
        background-color: #eee;

    }
    .api_table td {
        border: 1px #fff solid;
        padding:1em;
        vertical-align: top;
    }
    .api_table td ul{
        margin-left:2em !important;
    }