body { 
    background: #dbdee3 ;
    margin: 0 0 0 0;
    background-size: 100%; 
    background-position: top center;

}



h1, h2, h3, h4, h5, h6 { font-weight: 600; text-align: center; clear: both;   }


ul { padding: 0 0 0 0; margin: 0 0 0 0; }
ul li { font-size: 16px; }
p { font-size: 15px; line-height: 1.6; }


/* Article 整體寬度調整*/
 article  { 
    width: 1360px;
    margin: 0 auto 0 auto; 
    padding: 0;
    clear: both;  
    box-shadow: rgba(84,72,62,0.2) 0 0 8px 0;
    background: #FFF;
    color: #000;
}

header, section { width: 100%; margin: 0; clear: both; }
section { min-height: 100px; padding: 50px 80px; clear: both; display: inline-block; }

section div.BOX { width: 48%; margin: 15px 1%; float: left; background: #FFF; padding: 0; text-align: center; overflow: hidden; border-radius: 2px; }

/* 主視覺 */

header#Visual { 
    background: -webkit-linear-gradient(top,rgba(255,255,255,0),rgba(255,255,255,0),rgba(255,255,255,1)),url('../images/150713_networkall_BG.jpg') ;
    background: -moz-linear-gradient(top,rgba(255,255,255,0),rgba(255,255,255,0),rgba(255,255,255,1)),url('../images/150713_networkall_BG.jpg') ;
    background: -ms-linear-gradient(top,rgba(255,255,255,0),rgba(255,255,255,0),rgba(255,255,255,1)),url('../images/150713_networkall_BG.jpg') ;
    background-size: 100%;
    background-position: center;
    height: 700px;
}
header#Visual > div.Content { width: 50%; margin: 150px 0 0 8%; }
header#Visual > div.Content > img { width: 100%; }
header#Visual > div.Content > p { text-align: center; font-weight: 600; }
header#Visual > div.Content > div.BTN { width: 250px; height: 50px; line-height: 50px; border-radius: 4px; margin: 20px auto; text-align: center; font-size: 1.55em; background: #28728b; }
header#Visual > div.Content > div.BTN:hover { background:#c11636; transition: 0.2s; }
header#Visual > div.Content > div.BTN a { color: #FFF; }

/* PageA 內容設定*/
section#PageA { padding-top: 10px; }
section#PageA a { color: #222; }

section#PageA > div.BOX { text-align: center; padding: 0 50px; }
section#PageA > div.BOX > h3 { background: #43accf; color: #FFF; width: 60%; margin: 10px auto 20px auto; padding: 10px 0; border-radius: 4px; }
section#PageA > div.BOX > div.HmanING { width: 250px; height: 250px; overflow: hidden; margin: auto; }
section#PageA > div.BOX > div.A01 { background: url('../images/pic01.png'); background-size: 90%; background-position: top center; }
section#PageA > div.BOX > div.A02 { background: url('../images/pic02_1.png'); background-size: cover; background-position: top center; }
section#PageA > div.BOX > img { width: 250px; }
section#PageA > div.BOX > table { width: 100%; border-collapse: separate; border-spacing: 5px;  }
section#PageA > div.BOX > table tr td { padding: 10px; font-size: 16px; border-radius: 5px; }
section#PageA > div.BOX > table tr td.ClassID { background: #43accf; color: #FFF; width: 100px; }
section#PageA > div.BOX > table tr td.ClassName { text-align: left; background: #f7e8d0; font-weight: 600; }
section#PageA > div.BOX > table tr td.ClassName:hover { background: #fbf3e6; transition: 0.2s; }

/* PageD 內容設定*/
section#PageD { padding-top: 0; }



/* CPT 內容設定*/
section#PageD { padding-top: 0px; }
section#PageD > div#CPT { width: 700px; margin: auto; }
section#PageD > div#CPT > div.BTN-CPT { 
    width: 48%; margin: 10px 1%; 
    float: left; 
    text-align: center;
    font-size: 18px;
    background: #0b5989; 
    height: 55px; line-height: 55px;
    border-radius: 5px;
}
section#PageD > div#CPT > div.BTN-CPT:hover { background: #096; transition: 0.3s; }
section#PageD > div#CPT > div.BTN-CPT a { color: #FFF; }







/* RWD Setting */

    @media (max-width: 1440px) {
        article { width: 100%;  }     
    }

    @media (max-width: 1400px) {
        article { width: 1280px;  }
     
    }
    
    @media (max-width: 1280px) {
        article { width: 100%;  }
    }

    @media (max-width: 1200px) {
        article { width: 800px;  }
        section { padding: 40px 40px;  }

        /* 主視覺 */

        header#Visual { 
            background-position: top center;
            background-repeat: no-repeat;
            height: 500px;
        }
        header#Visual > div.Content { margin: 80px 0 0 8%; }
        header#Visual > div.Content > p { font-size: 14px; }
        header#Visual > div.Content > div.BTN { width: 200px; font-size: 1.4em; }

        section div.BOX { width: 100%; margin: 15px 0; float: initial; }



    }

    @media (max-width: 800px) {
        article { width: 100%;  }

        section#PageD > div#CPT { width: 100%; margin: auto; }
        section#PageD > div#CPT > div.BTN-CPT { width: 100%; margin: 10px 0; float: initial; font-size: 16px; }

    }

    @media (max-width: 600px) {
        article { width: 395px;  }
        section { padding: 20px 15px;  }


        header#Visual { height: 700px; background-size: 160%; background-position: top right; }
        header#Visual > div.Content { margin: 370px auto 0 auto; width: 90%; float: initial; clear: both; }
        header#Visual > div.Content > p { font-size: 12px; }

        section#PageA { padding-top: 10px; }
        section#PageA > div.BOX { padding: 0 0; }
        section#PageA > div.BOX h1 { font-size: 28px; }
        section#PageA > div.BOX > h3 { width: 85%; font-size: 18px;  }
        section#PageA > div.BOX > table tr td { font-size: 12px; }
        section#PageA > div.BOX > table tr td.ClassID { width: 70px; }
        section#PageA > div.BOX p { font-size: 12px; text-align: left; padding: 10px 8px; }
    }

    /*iPhone 6 */
    @media (max-width: 395px) {
        article { width: 100%;  }
    }








div#SocialMedia { position: fixed; right: 10px; bottom: 50px; }
div#SocialMedia ul { list-style: none;  }
div#SocialMedia ul li { 
    background: rgba(0,0,0,0.75); 
    color: #FFF; 
    width: 40px; 
    height: 40px; 
    line-height: 40px; 
    font-size: 1.25em; 
    text-align: center; 
    margin: 8px 0 0 0;
    border-radius: 4px;
}
div#SocialMedia ul li a { color: #FFF; }
div#SocialMedia ul li.FB:hover { background: #39507C; transition: .20s linear;  }
div#SocialMedia ul li.Youtube:hover { background: #DB1B1B; transition: .20s linear; }
div#SocialMedia ul li.Contact:hover { background: #096; transition: .20s linear; }



/*聯絡資訊設定*/

footer div.InfoArea { background: #252930; }