


body { 
    margin: 0 0 0 0;
    background: -webkit-linear-gradient(top,rgba(0,0,0,0.5),rgba(0,0,0,0.5)),url(../images/BG05.jpg) #930326 fixed;
    background: -moz-linear-gradient(top,rgba(0,0,0,0.1),rgba(0,0,0,0.1)),url(../images/BG05.jpg) #930326 fixed; 
    background: -ms-linear-gradient(top,rgba(0,0,0,0.1),rgba(0,0,0,0.1)),url(../images/BG05.jpg) #930326 fixed; 
    background-size: cover; 
    background-position: center;

}

#PageA .PageA-a{
	text-decoration:underline;
	color:#039;
}
#PageA .PageA-a:hover{
	text-decoration:none;
	color:#000;
}

h1, h2, h3, h4, h5, h6 { font-weight: 600; text-align: center; clear: both;  }
h1 { font-size: 2.1em; line-height: 1.25; }
h2 { font-size: 1.5em; line-height: 1.45;}
ul { padding: 0 0 0 0; margin: 0 0 0 0; }
ul li { font-size: 15px; }
p { font-size: 15px; line-height: 1.6; }

table { width: 100%;  }
table tr td { font-size: 14px; padding: 14px; color: #555; }

/*table tr:nth-of-type(even) { background: #F2EAE4 }
table tr:nth-of-type(odd) { background: #E2D8CF }*/
table tr:hover { background: #FFE7C5; transition: 0.5s; }
table tr.title th { text-align: center; background: #2D2527; color: #FFF; font-weight: 600; font-size: 16px; height: 60px;   }
table tr td.DateTime, td.CourseFee, td.Numb { text-align: center; }
table tr td.CourseName { font-size: 15px; font-weight: 600; }

table tr.title th.MemPay, table tr.title td.MemPay { background: #E02B2B }
table tr.Content td.MemPay { color: #E02B2B; font-weight: 600; }


article { 
    width: 1000px; 
    margin: 0px auto 0 auto; 
    padding: 0;
    clear: both;  
    box-shadow: rgba(0,0,0,0.15) 0px 0px 10px 0px;
    background: #930326;
    color: #FFF;
    overflow: hidden;

}

header, section { width: 100%; margin: 0; clear: both; }

section { width: 90%; min-height: 200px; padding: 50px 50px; color: #222; clear: both; margin: auto; border-radius: 15px; }



/* 主視覺 */

header#Visual {
	background: url('../images/20170517_govcomtr_main.jpg') #930326 no-repeat ;
    background-size: 100%;
    background-position: top center;
    min-height: 500px;
    overflow: hidden;
    text-align: center;
}


header#Visual img.TOPIC {  width: 550px; margin: 120px 0 0 0; }
header#Visual img.Star, header#Visual img.balloon { margin-top: -300px; }
header#Visual img.Star { 
    float: right; margin-right: 90px; 
    animation-name: Star; 
    animation-duration: 2s; 
    animation-iteration-count: infinite; 

}
header#Visual img.balloon { 
    float: left; margin-left: 90px; 
    animation-name: balloon; 
    animation-duration: 2s; 
    animation-iteration-count: infinite; 
}
header#Visual p.descp { padding: 8px; margin-top: 10px; font-size: 1.65em; font-weight: 600; background: rgba(0,0,0,0.35); width: 80%; margin: 10px auto 0 auto;  }


/*MOV*/
@keyframes Star {
    0%  { margin-top: -280px; }
    40% { margin-top: -300px; }
    100% { margin-top: -280px; }
}

@keyframes balloon {
    0%  { margin-top: -280px; }
    80% { margin-top: -300px; }
    100% { margin-top: -280px; }
}






/* PageA 內容設定*/

section#PageA { background: #F2EAE4 }
section#PageA h1 { color: #2D2527; padding: 0 0 10px 0; }
section#PageA ul { padding: 10px 0 25px 20px; }
section#PageA ul li { margin: 0 0 5px 0; font-weight: 600; color: #930326 }

/* PageB 內容設定*/

section#PageB { color: #FFF; }
section#PageB h1 { color: #FFF100; padding: 60px 0 0 0; }
section#PageB p.download { text-align: center;  font-size: 1.25em; }

section#PageB div.download_AREA { width: 160px; margin: 10px auto 25px auto; clear: both;  }
section#PageB div.download_AREA div.icon { 
    width: 70px; height: 70px; 
    float: left; 
    margin: 5px; 
    border: solid 2px #FFF; 
    border-radius: 8px; 
    text-align: center; 
    padding: 13px 0 0 0; 
    font-size: 16px;
    color: #FFF !important;
}
section#PageB div.download_AREA div.icon:hover { background: #FFF; color:#930326 !important; transition: 0.3s;  }

section#PageB div.Contact { clear: both; }
section#PageB div.Contact div.BOX { width: 47%; margin: 10px 1.5%; float: left; background: rgba(0,0,0,0.35); border-radius: 5px; }
section#PageB div.Contact div.BOX:hover { background: rgba(0,0,0,0.5); transition: 0.3s; }
section#PageB div.Contact div.BOX ul { list-style: none; padding: 15px; }
section#PageB div.Contact div.BOX ul li { text-align: center; margin: 4px 0; }
section#PageB div.Contact div.BOX ul li.Name { font-size: 20px; }
section#PageB div.Contact div.BOX ul li a { color: #FFF; }





/* CPT 內容設定*/

div#CPT { width: 380px; margin: auto; clear: both; padding: 50px 0 80px 0;  }
div#CPT div.BTN { 
    width: 100%; 
    margin: 0px; 
    float: left; 
    border: solid 2px #FFF;
    color: #FFF; 
    text-align: center; 
    font-size: 1.4em; 
    padding: 15px 10px; 
    border-radius: 5px;
    transition: 0.20s linear;
}
div#CPT div.BTN:hover { background: #FFF; color:#930326 !important; transition: 0.3s; font-weight: 600; }






/* RWD Setting */

    @media (max-width: 1440px) {

    }

    @media (max-width: 1400px) {

      
    }

    @media (max-width: 1280px) {

    }
    
    @media (max-width: 1200px) {
        article { width: 800px; }
        section { padding: 40px 40px; width: 100%; border-radius: 0;}
        header#Visual img.TOPIC {  width: 450px; }
        header#Visual p.descp { font-size: 1.5em; }
        header#Visual img.Star { margin-right: 50px;  }
        header#Visual img.balloon { margin-left: 50px;  }


    }

    @media (max-width: 810px) {
        article { width: 100%; }
     
    }

    @media (max-width: 690px) {
        table tr th { display: none; }
        table tr td { display: block; }
        table tr td:before { content: attr(data-th) " : "; display: inline-block;  }

        article { width: 395px; }
        header#Visual { min-height: 350px; }
        header#Visual img.TOPIC {  width: 95%; margin: 50px 0 0 0; }
        header#Visual img.Star, header#Visual img.balloon { display: none; }
        header#Visual p.descp { font-size: 1.2em; width: 95% }


        section#PageB p.download { text-align: left;  font-size: 14px; }
        section#PageB div.Contact div.BOX { width: 100%; margin: 7px 0; float: initial; }
        section#PageB div.download_AREA { width: 240px; padding-top: 50px; }
        section#PageB div.download_AREA div.icon { 
            width: 100px; height: 100px; 
            margin: 5px; 
            padding: 20px 0 0 0; 
            font-size: 20px;
        }
        div#CPT { width: 100%; margin: auto; clear: both; padding: 50px 0 80px 0;  }

    }
    /*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: #222; }

