
a {
    text-decoration: none;
}

.topmenu a {
    color: white;
}

.topmenu a:hover {
    color: white;
    /*text-decoration: underline;*/
    text-decoration-color: #E60012;
    text-decoration-style: solid;
}

.fmenu a {
    color: white;
}

.fmenu a:hover {
    color: #00A0E9;
}

body {
    font-family: Arial, "微軟正黑體", sans-serif;
    margin: 0 0 0 0;
}

.topbar {
    width: 100%;
    z-index: 999;
    top: 0;
    background-color: #EA641D;
    position: fixed;
}

.container {
    position: relative;
    width: 100%;
    margin-bottom: -1%;
}

.fmenu {
    width: 100%;
    background-color: white;
    color: white;
    text-align: center;
    font-weight: bold;
    padding: 20px 0;
}

.footer {
    width: 100%;
    background-color: #DE6224;
    color: white;
    text-align: center;
    padding: 20px 0;
    position: relative;
    bottom: 0;
}

.content {
  width: 100%;
  text-align: center;
}

.wcontent {
  width: 100%;
  text-align: center;
  margin: 10px auto -5px auto;
}

.wcontent img {
  width: 100%;
  text-align: center;
}

#wimg2 {margin: -5px auto -5px auto;}

.wcustomer {
  width: 100%;
  text-align: center;
}

.wtitle {
  width: 100%;
  text-align: center;
  margin-top: -30px;
}

.wtitle p {
  font-weight: bold;
  color: #646464;
}

#line, #line-s {
  margin: 0 auto;
  display: block;
  position: relative;
  z-index: 10;
}

.wlogo {
  width: 100%;
  text-align: center;
  margin-top: -30px;
  margin-bottom: 20px;
}

#wtitle {
  color: white;
  height: 60px;
  line-height: 60px;
  margin: 0 0 0 0;
  background-color: #3392C2;
}

/*----------about----------*/
.container-about {
    margin-top: 0px;
    position: absolute;
    width: 40%;
    right: 0;
}

#about-img {
  width: 45vmin;
  margin-top: -10px;
}

.about-title {color: #309CD0; font-weight: bold; text-align: left;}

.about-title font {font-size: 7vmin;}

.about-title span {font-size: 6vmin;}

.about-text {text-align: left; font-size: 25px}

.about-text p {text-align: justify; text-justify:inter-ideograph; line-height: 40px;/* text-indent: 2em;*/}

#about-timg {width: 100%; margin-top: 10px; margin-bottom: 10px}

#subtitle {font-size: 25px; color: #337FE5; font-weight: bold;}

.s-block2 {background-color: #EBAD32}

.s-title {color: #2F3B6B; font-weight: bold;}

.s-text {width: 90%; font-size: 4vmin; line-height: 4vmin; margin: -40px 5% auto 5%}

.s-image {width: 100%; padding: auto 2%}

.s-image img {width: 100%; max-width: 450px; margin: 3% 1%}


#txtcube-left, #txtcube-right {background-color: rgba(89,125,158,0.8); text-align: left !important; padding: 1% 2%; max-width: 80%; color: white}

#txtcube-left {border-radius: 0 12px 12px 0; position: absolute; bottom: 10%; left: 0}

#txtcube-right {border-radius: 12px 0 0 12px; position: absolute; bottom: 10%; right: 0}

.mouseIcon {cursor:pointer;}

.currentTag {color: white; background-color: #566978}

.overTag {color: #666666; background-color: white}

#case-b1, #case-b2, #case-b3 {white-space: nowrap; font-size: 5vmin; padding: 15px 80px; margin: auto 1%}

.case-sec1, .case-sec2, .case-sec3 {margin: 6% auto 3% auto}

.case-sec3 .about-title {text-align: center;}

.join-form p {display: inline-block; vertical-align: top;}

.footer a {color: white}

.footer a:hover {color: white}

.npoint #main {color: #EA641D; font-weight: bold; font-size: 3vw}
.npoint #sub {color: black; font-weight: bold; font-size: 2vw}

#examtxt {text-align: center; font-weight: bold; font-size: 3vw}

/*----------電腦----------*/
@media screen and (min-width: 1601px) {

.show-mobile {display:none;} 

.topmenu {text-align: right; font-size: 24px;}

.toplogo img {margin-left: 0px; margin-top: 0px;}

.topbar {height: 90px;}
    
#logoimg {height: 80px; margin-bottom: 0px; margin-top: 5px}

.wtitle p, .s-title p {font-size: 70px}

#line {width: 270px; height: 4px; top: -60px; border-top: 4px #646464 solid;}

#line-s {width: 270px; height: 4px; top: -60px; border-top: 4px #2F3B6B solid;}

#wlogo-s {width: 120px}

.fmenu {font-size: 22px}

.footer {font-size: 24px}

.textsec {width: 86%; text-align: center; margin: 40px 7% auto 7%;}

.block1 {width: 86%; text-align: center; margin: 3% 7% auto 7%; overflow: auto; zoom: 1}
.block2 {width: 86%; text-align: center; margin: 3% 7% 2% 7%; overflow: auto; zoom: 1}

.s-block1, .s-block2 {margin-top: -70px}

#b1-img {float: right; width: 86vmin}

#b2-img {float: left; width: 86vmin}

.b1-textsec {width: 76vmin}

.formt {font-size: 42px; font-weight: bold; color: #0070BE}
.hformL {left: 6vw; top: 10vw}
.hformR {right: 10.5vw; top: 5vw}

.toplogo {
    /*max-width: 500px;*/
    text-align: center;
    margin-left: 1%;
    float: left;
}

.topmenu {
    color: white;
    font-weight: bold;
    /*max-width: 900px;*/
    margin-top: 30px;
    margin-left: 4%;
    float: left;
}

.homelogo {position: absolute; width: 90vmin; top: 10vmin; right: 10vmin;}

#field {
    font-size: 24px;
    padding: 5px 20px;
}

.submit-btn {font-size: 24px}

article p {margin: 8px; padding: 0}

.bblock {display: inline-block; text-align: center; margin: auto 1%; position: relative;}

#price2, #price3, #price4, #price5 {position: absolute; width: 100%; left: 0; font-weight: bold}
#price2 {color: white; font-size: 46px; top: 30px}
#price3 {color: white; font-size: 24px; top: 80px}
#price4 {color: black; font-size: 24px; top: 165px}
#price5 {color: black; font-size: 28px; top: 195px}

.cblock {text-align: center; margin: 3% auto}
.cblock img {margin: 2% 1%; max-width: 90%}

#bp {margin-bottom: -3px}

#buy1, #buy2, #buy3, #buy4, #buy5, #buy6 {font-size:24px; padding: 0.6vw; color: white; border-radius: 15px; font-weight: bold; z-index: 99999; display: block; width: 60%; margin-bottom: 40px; cursor:pointer; margin-top: -30px; margin-left: 20%}
#buy1 {background-color: #e92d8b; border-color: #e92d8b}
#buy2 {background-color: #3575bd; border-color: #3575bd}
#buy3 {background-color: #0ea67d; border-color: #0ea67d}
#buy4 {background-color: #ee661c; border-color: #ee661c}
#buy5 {background-color: #5536B2; border-color: #5536B2}
#buy6 {background-color: #ED2C1C; border-color: #ED2C1C}

}
/*----------電腦----------*/

/*----------筆電----------*/
@media screen and (min-width: 1201px) and (max-width: 1600px) {

.show-mobile {display:none;} 

.topmenu {text-align: right; font-size: 19px;}

.toplogo img {margin-left: 0px; margin-top: 0px;}

.topbar {height: 90px;}
    
#logoimg {height: 80px; margin-bottom: 0px; margin-top: 5px}

.wtitle p, .s-title p {font-size: 70px}

#line {width: 270px; height: 4px; top: -60px; border-top: 4px #646464 solid;}

#line-s {width: 270px; height: 4px; top: -60px; border-top: 4px #2F3B6B solid;}

#wlogo-s {width: 120px}

.fmenu {font-size: 22px}

.footer {font-size: 24px}

.textsec {width: 86%; text-align: center; margin: 40px 7% auto 7%;}

.block1 {width: 86%; text-align: center; margin: 3% 7% auto 7%; overflow: auto; zoom: 1}
.block2 {width: 86%; text-align: center; margin: 3% 7% 2% 7%; overflow: auto; zoom: 1}

.s-block1, .s-block2 {margin-top: -70px}

#b1-img {float: right; width: 86vmin}

#b2-img {float: left; width: 86vmin}

.b1-textsec {width: 76vmin}

.formt {font-size: 2vw; font-weight: bold; color: #0070BE}
.hformL {left: 7vw; top: 7vw}
.hformR {right: 9vw; top: 2.5vw}

.toplogo {
    /*max-width: 500px;*/
    text-align: center;
    margin-left: 1%;
    float: left;
}

.topmenu {
    color: white;
    font-weight: bold;
    /*max-width: 900px;*/
    margin-top: 32px;
    margin-left: 3%;
    float: left;
}

.homelogo {position: absolute; width: 90vmin; top: 10vmin; right: 10vmin;}

#field {
    font-size: 20px;
    padding: 5px 20px;
}

.submit-btn {font-size: 20px}

article p {margin: 8px; padding: 0}

.bblock {display: inline-block; text-align: center; margin: auto 0.5%; position: relative;}

#price2, #price3, #price4, #price5 {position: absolute; width: 100%; left: 0; font-weight: bold}
#price2 {color: white; font-size: 36px; top: 25px}
#price3 {color: white; font-size: 20px; top: 65px}
#price4 {color: black; font-size: 20px; top: 120px}
#price5 {color: black; font-size: 24px; top: 150px}

.cblock {text-align: center; margin: 3% auto}
.cblock img {margin: 2% 1%; max-width: 90%}

#bp {margin-bottom: -3px; width: 80%}

#buy1, #buy2, #buy3, #buy4, #buy5, #buy6 {font-size:22px; padding: 0.6vw; color: white; border-radius: 15px; font-weight: bold; z-index: 99999; display: block; width: 60%; margin-bottom: 40px; cursor:pointer; margin-top: -30px; margin-left: 20%}
#buy1 {background-color: #e92d8b; border-color: #e92d8b}
#buy2 {background-color: #3575bd; border-color: #3575bd}
#buy3 {background-color: #0ea67d; border-color: #0ea67d}
#buy4 {background-color: #ee661c; border-color: #ee661c}
#buy5 {background-color: #5536B2; border-color: #5536B2}
#buy6 {background-color: #ED2C1C; border-color: #ED2C1C}

}
/*----------筆電----------*/

/*----------手機----------*/
@media screen and (max-width: 1200px){

.show-pc {display:none;}

.topmenu {text-align: center; font-size: 18px;}

.toplogo img {margin-top: 40px;}

.topbar {height: auto;}
    
#logoimg {width: 150px; max-width: 100%}

.wtitle p, .s-title p {font-size: 50px}

#line {width: 190px; height: 3.2px; top: -50px; border-top: 3.2px #646464 solid;}

#line-s {width: 190px; height: 3.2px; top: -50px; border-top: 3.2px #2F3B6B solid;}

#wlogo-s {width: 30%}

.fmenu {font-size: 16px}

.footer {font-size: 18px}

.textsec {width: 92%; text-align: center; margin: auto 4%}

.block1, .block2 {width: 92%; text-align: center; margin: 2% 4% auto 4%; overflow: auto; zoom: 1}

.s-block1, .s-block2 {margin-top: -50px}

#b1-img, #b2-img, .b1-textsec {width: 100%}

.formt {font-size: 6vw; font-weight: bold; color: #0070BE}

.toplogo {
    width: 100%;
    max-width: 500px;
    text-align: center;
    display: inline-block;
    margin-top: 20px;
}

.topmenu {
    color: black;
    font-weight: bold;
    width: 100%;
    max-width: 900px;
    display: none;
    margin-top: 15px;
}

.homelogo {position: absolute; width: 50vmin; top: 5vmin; right: 5vmin;}

#field {
    font-size: 3.5vw;
    padding: 5px 20px;
}

.submit-btn {font-size: 3.5vw}

article p {margin: 1.2vw; padding: 0}

.npoint #main {color: #EA641D; font-weight: bold; font-size: 7vw}
.npoint #sub {color: black; font-weight: bold; font-size: 5vw}

#examtxt {text-align: center; font-weight: bold; font-size: 5vw}

.bblock {display: inline-block; text-align: center; margin: auto 1%; position: relative;}

#price2, #price3, #price4, #price5 {position: absolute; width: 100%; left: 0; font-weight: bold}
#price2 {color: white; font-size: 46px; top: 30px}
#price3 {color: white; font-size: 24px; top: 80px}
#price4 {color: black; font-size: 24px; top: 165px}
#price5 {color: black; font-size: 28px; top: 195px}

.cblock {text-align: center; margin: 3% auto}
.cblock img {margin: 2% 1%; max-width: 90%}

#bp {margin-bottom: -3px}

#buy1, #buy2, #buy3, #buy4, #buy5, #buy6 {font-size:24px; padding: 0.6vw; color: white; border-radius: 15px; font-weight: bold; z-index: 99999; display: block; width: 60%; margin-bottom: 40px; cursor:pointer; margin-top: -30px; margin-left: 20%}
#buy1 {background-color: #e92d8b; border-color: #e92d8b}
#buy2 {background-color: #3575bd; border-color: #3575bd}
#buy3 {background-color: #0ea67d; border-color: #0ea67d}
#buy4 {background-color: #ee661c; border-color: #ee661c}
#buy5 {background-color: #5536B2; border-color: #5536B2}
#buy6 {background-color: #ED2C1C; border-color: #ED2C1C}

}
/*----------手機----------*/

.tb input, .submit-btn {
    border-radius: 8px;
    border-color: #0A74CA;
    border-width: 3px;
}

.submit-btn {background-color: #0070BE; color: white; padding: 5px 30px}

/*youtube*/
.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

.drop-shadow {
-webkit-filter: drop-shadow(0 0 0.2rem rgba(0, 0, 0, 0.6));
filter: drop-shadow(0 0 0.2rem rgba(0, 0, 0, 0.6));
}