@import url(../../../File/CSS/event_header.css);
@import url(../../../File/icon/css/all.min.css);
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,blockquote,p,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,font,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,caption,tfoot,thead{margin:0;padding:0;border:0;outline:0;font-size:100%;line-height:1.5em}
blockquote,q{quotes:none}
blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}
:focus{outline:0}
ins{text-decoration:none}
del{text-decoration:line-through}
ul,li{list-style:none}
*{box-sizing:border-box}
/*相關連結*/
#Related{width:100%;padding:1.5% 0;background:#2B7EBF}
#Related ul.rela_out{width:90%;margin:0 auto;text-align:center}
.rela_out li a,.rela_out li{font-size:1.1em;color:#FFF}
.rela_out li{display:inline-block;margin:.8% 1.5%}
.rela_out .bon_on a{background:#663397;color:#FFF;text-decoration:none;padding:5px 8px}
.bgcolor0{background:#2A7EC0}
.row100{width:100%}
body{margin:0 auto;font-family:"Microsoft JhengHei";background-color:#FFF;background-image:url(../images/dm980115bg.gif)}
#BodyContent{margin:0 auto}
#event{width:100%}
#event a:hover{position:relative;top:1px;bottom:1px}
.masterheader{position:relative}
.masterheader h1{font-size:1.65em;line-height:1.3em;color:#000;font-weight:bold;position:absolute;top:13%;left:34%;z-index:1}
.masterBanner img{width:100%}
.Bonus_content{width:84%;padding:3% 0;margin:0 auto;text-align:left}
#event h2{background:#639;text-align:center;padding:.7% 1.5%;color:#FFF;font-size:1.3em;display:inline-block;border-radius:8px}
.time,.way{width:100%;padding:3% 0}
.timelist{width:90%;margin:2% auto 0 6%}
.timelist li,.time p,.way p{font-size:1.25em;color:#FFF;line-height:1.75em}
.timelist li{list-style:disc}
.way{padding-bottom:0}
.time p,.way p{width:92%;margin:2% auto 0 3%}
.way p strong{color:#FFFF88;font-size:1.3rem}
.way p small{font-size:.95rem;display:block;margin:1% auto 0}
#event h3{width:94%;margin:2% auto;background:#FFFDE5;text-align:center;font-size:1.8rem;line-height:1.6em;padding:4% 1%}
/*ask*/
#formlist{width:100%;margin:2% auto 3%;padding:2% 3%;background:#b0ddf2;border-radius:10px;font-size:1rem}
#formlist p{width:100%;margin:1% auto;color:#000;display:inline-block}  
#formlist .item{width:100%;margin:0 auto;display:inline-block}
#formlist small{display:block;font-size:.9rem}
#formlist input{border-radius:7px;background:#FFF;border:1px solid #CCC;padding:.5% 1%;margin:0 1% 0 .5%;font-size:1rem;font-family:"Microsoft JhengHei"}  
#formlist input[name="sName"],#formlist input[name="dBirthday"],#formlist input[name="sTelephone"],#formlist input[name="sEmail"],#formlist input[name="sRandomCode"]{width:34%;color:#585858}
#formlist input[type="radio"],#formlist input[type="checkbox"]{margin:0 0.5% 0 1.5%}
#formlist input[type="submit"],#formlist input[type="reset"]{border:#FFF;color:#FFF;background:#663399;font-size:1em;padding:.5em}
#formlist textarea{border-radius:7px;width:99%;height: 20rem;margin:0 auto;color:#C6C6C6;font-size:1rem;line-height:1.8em} 
#exam{margin:1% auto;padding:1%;border-top:1px dashed #000;border-bottom:1px dashed #000;font-size:1.05rem}
#exam strong{color:#9d39b5}
.sample{width:80%;margin:0 auto 1% 1%;background:#FFFDE5;font-size:.95rem;padding:1% 2%}
.sampleTitle,.sampleAnswer{color:#06C}
.sampleTitle strong{color:#000!important;display:block}
.sampleAnswer{font-weight:bold;margin:1.5% auto 0}
/*Footer*/
#BodyFooter_rwd{width:100%;margin:4% auto 1%;display:inline-block;text-align:center}
#BodyFooter_rwd a{color:#000}
#footer_inline ul li{display:inline;margin:auto 1%}
#footer_inline ul li img{max-width:19%;vertical-align:middle}
#footer_line{width:90%;border-top:thin solid #999;margin:2% auto}
#footer_address ul li{width:100%;line-height:2em;font-size:.9rem}
.expired {
    color: grey!important;
}

/*-----------------PC-------------------*/
@media all and (min-width: 1201px){
#BodyHeader_event_rwd,#topbutton{display:none}
#BodyContent{width:850px}
/*bodyHeader*/
#BodyHeader_event #header-share{width:100%;margin:0 auto;line-height:2em;font-size:13px}
#BodyHeader_event #header-share img{margin-bottom:5px}
#BodyHeader_event a{color:#000}
#BodyHeader_event a:hover{text-decoration:none;color:#666;position:relative;top:2px;bottom:2px}
#noie{color:#FFF;width:100%;height:60px;text-align:center;border:1px solid #069;background-color:#39C;_z-index:9999;z-index:9999;position:fixed;_top:expression(documentElement.scrollTop+"px");left:0;top:0}
#noie a{color:#FC0}
}

/*------------MB-----------------*/
@media all and (max-width: 767px){
#Related{bottom:0;position:fixed;z-index:2;opacity:.9;background:#9d39b7;display:none}
#Related ul.rela_out{width:96%}
.rela_out li a,.rela_out li{font-size:.9rem}
.rela_out li{margin:1.5% 2%}
.rela_out .bon_on{display:none}
.masterheader h1{position:relative;top:0;left:0;text-align:center;padding-top:5px}
.Bonus_content{width:96%}
#event h2{font-size:1.2em;padding:1% 2%} 
.time, .way{margin:0 auto;padding:3%}
.timelist{margin:3% auto 0 8%}
.timelist li,.way p{font-size:1.05rem;line-height:1.6em}
.timelist li{margin-bottom:3%}
.way p{width:96%;margin:2% auto}
.way p strong{font-size:1.2rem}
.way p small{font-size:.9rem;margin-top:3%}    
#event h3{font-size:1.5rem;margin:4% auto} 
#formlist{width:100%;padding:5% 3%;border-radius:0;font-size:1.05rem;margin-bottom:0}
#formlist input[name="sName"],#formlist input[name="dBirthday"],#formlist input[name="sTelephone"],#formlist input[name="sEmail"],#formlist input[name="sRandomCode"]{width:100%;margin-bottom:2%;color:#C6C6C6;padding:.5%;height:30px}
#formlist input[type="radio"]{margin:4% 1% 2% 3%}
#formlist small{margin:2% auto 0}
#formlist input[type="checkbox"]{margin:2% 1% 3% 2%}
#formlist textarea{/*height:150px*/}
#formlist p{margin:2% auto}
#exam{padding:2%}
#exam strong{display:block;font-size:1.2rem}
.sample{width:100%;margin:0 auto 3%}
/*Footer*/
#BodyFooter_rwd{margin:5% auto 1%}
#BodyFooter_rwd a{line-height:2em}
#footer_inline ul li{font-size:1rem;line-height:2em}
#footer_inline ul li img{max-width:45%;vertical-align:inherit;margin-bottom:2%}
#footer_inline ul li{display:block;margin:0}
#footer_address ul li{font-size:.8rem}
}

@media all and (min-width: 768px) and (max-width: 1200px){
.Bonus_content{width:90%}
}

@media all and (min-width: 1px) and (max-width: 1200px){
#BodyHeader_event,#noie{display:none}
#BodyContainer_event,#BodyContent,#BodyContentMain,#BodyContentMainDetail_learning{width:100%;margin:0 auto;padding:0}
#topbutton{width:50px;height:50px;color:#FFF;border-radius:50%;background-color:#000;opacity:.4;right:1%;bottom:18%;position:fixed;line-height:50px;font-size:15px;text-align:center;z-index:99}
#topbutton a{color:#FFF;text-decoration:none;line-height:50px}
}