/* css reset 歸0 */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,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%}
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}
/* css reset 歸0 end */

body{margin:0 auto;padding:0;font-family:"Microsoft JhengHei", 'Noto Sans TC', sans-serif;font-weight: ;}
#BodyContainer{margin:0 auto}
#BodyContentEvent,#event{width:100%}
#event a:hover{text-decoration:none;left:1px;top:1px;position:relative}
.bgcolor1{background: url('../images/1208082_building.png') no-repeat center / cover;}
.bgcolor2{background-color: #f9f9f9;background: url(../images/1208082_building.png) no-repeat left bottom / cover}
.bgcolor3{background-color: #EBEBEB;background: linear-gradient(0deg,#c38e3d6f, #e4c79b2f);}
.bgcolor4{background-color: #F6F6F6;background: url(../images/1208082_building.png) no-repeat right / cover;padding: 0 0 2.5rem;}
.bgcolor5{background-color: #EBEBEB;background: linear-gradient(0deg,#c38e3d6f, #e4c79b2f);}
h1,h2,h3{text-align: center;}
h1{font-size: 3rem;}
h2{font-size: 2.5rem;}
h3{font-size: 1.9rem;}
.flex {display: flex;}
a{color: var(--tiffany);font-weight: bold;}
a:hover{color: var(--red);text-decoration: none;}

:root{
  --tiffany:#0790ae;
  --orientalBlue:#315263;
  --golden:#ae741d;
  --lightGolden:#c38e3d;
  --red:#a90d30;
  --lightGrey:#e5e5e5;
  --white:#fff;
  --black:#000;

  --box_shadow: 1px 1px 10px #0000003f;
}

.blue{color: #074fae;}
.red{color:var(--red)}
.golden{color:var(--golden)}
.font-size_larger{font-size: larger;}
small{font-size: smaller;}
.text-center{text-align: center}

/*介面&課程*/
.banner{width: 100%;}
.banner img{width: 100%;}
.banner_m{display: none;}
.title{font-size: 3.1rem;line-height: 4rem;font-family: "MStiffHeiHK","Microsoft YaHei";font-weight: bold;color:var(--orientalBlue);padding: 2% 0;}

.object{display: grid;grid-template-columns: auto auto;width: 90%;margin: 0 auto;	padding: 2%;}
.object div{margin: 1%;font-size: 1.5rem;}
.object div:nth-child(1){grid-area: 1 / 1 / 4 / 2;align-items: center;justify-content: right;display: flex;}
.object div:nth-child(2){grid-area: 1 / 2 / 2 / 3;}
.object div:nth-child(3){grid-area: 2 / 2 / 3 / 3;}
.object div:nth-child(4){grid-area: 3 / 2 / 4 / 3;}

.interfacec{display: flex;flex-wrap: wrap;justify-content: center;}
.interfacec img , .study img{width: 100%;margin: auto;}
.study img {border-top: 1px var(--lightGrey) solid;border-bottom: 2px var(--lightGrey) solid;width: 100%;;margin: 1rem 0;}
.interfacec img {border-radius:0 0 1rem 1rem;padding: 0.8rem 0 0;}
.inter-item{text-align:center;margin: 1rem .5rem;border: 2px var(--white) solid;border-radius: 1rem;box-shadow: var(--box_shadow);background: #ffffff5f;}
.inter-item dt{font-weight:700;font-size: 1.6rem;color: var(--golden);padding: 0.6rem 0.2rem 0;}

.course{width: 98%;display: flex;flex-wrap: wrap;padding:0 1%;margin: auto;justify-content: center;}
.course img{width: 80%;border: 2px var(--white) solid;height: auto;margin: auto;border-radius: 1rem;box-shadow: var(--box_shadow);}
.course-title{width: 100%;font-size: 1.8rem;text-align: center;background: linear-gradient(0deg, #ae741d,#c38e3d, #d5b98f);color: var(--white);font-weight: bold;padding: .5rem 0;border-radius: 1rem 1rem 0 0;}
.course-title span {font-size: 2.6rem;line-height: 3.2rem;border-right: 2px #ffeb3b87 dotted;padding-right: 10px;color: #ffff6b;}
.course_area1,.course_area2{width: 100%;padding: 1rem 0 0 1rem;display: flex;    flex-wrap: wrap;justify-content: center;align-items: center;flex-direction: row;background: linear-gradient(2deg, #ffffff3f,#ffffffcc 10%);border-radius: 0 0 1rem 1rem;margin: 0 auto 1rem;box-shadow: var(--box_shadow);}
.course_area2{    align-items: flex-start;}
.course-item{width: calc(100%/2);margin-bottom: 1%;font-size: 1.2rem;}
.course-item figure{width: 480px;display: flex;justify-content: center;flex-direction: column;text-align: center;}
.course-item figcaption a{text-align: center;font-size: larger;line-height: 3rem;}
.course-item p {padding: 0 0 0 1.5rem;font-size: 1.5rem;color:var(--red);font-weight: bold;}
.course-item ul{padding: 0 0 1rem 3.5rem;line-height: 1.8rem;}
.course-item ul li::marker {color:var(--lightGolden);}
.course-item mark{background: none;border-bottom: 1px dashed var(--lightGolden);}

.mov_box{margin:1% 20% 5%;}/*可不加 */
.mov {position: relative;width: 100%;height: 0;padding-bottom: 178%;box-shadow: 3px 3px 6px #818181}
.video {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}


.more{font-size: 1.5rem;text-align: center;padding: 0.5rem 1.5rem;margin: 1.5rem auto ;background:var(--white);border-radius: 50rem;box-shadow: var(--box_shadow);}
.buy{display: grid;	grid-template-columns: auto auto;margin: 0 auto;padding: 1rem 0 3rem;font-size: 1.7rem;color: var(--white);font-weight: 600;text-shadow: 0 0 9px #0000009f;}
.buy div:nth-child(1){grid-area: 1 / 1 / 5 / 2;align-items: center;justify-content: right;display: flex;padding: 0 5%;}
.buy div:nth-child(2){grid-area: 1 / 2 / 2 / 3;padding: .3rem 0 .4rem;}
.buy div:nth-child(3){grid-area: 2 / 2 / 3 / 3;}
.buy div span{text-shadow: 0 0 0 #00000000;border: 2px dotted var(--red);background: #ffffffe0;line-height: 1.6rem;padding: 1.05rem 1.1rem;border-radius: 50rem;font-weight: bold;color:var(--red);font-size: 1.6rem;}
.buy a{color: #ffffaf;}
.buy a:hover{color:var(--red);text-shadow: 0 0 10px var(--white);background: var(--white);border-radius: 1rem;padding: .02rem .5rem .05rem;margin: .2rem;}

.qusetion b {font-size: 1.3rem;}

/*師資&資源*/
.teacher{margin:0 auto;display: flex;flex-wrap: wrap;padding: 0 0 2%;}
.point_box{background:var(--white);border: 2px var(--white) solid;padding:0;margin:0 auto 2%;box-shadow:  var(--box_shadow);border-radius: 1rem;}
.point_video{width:100%;text-align:center;border-top: 2px #c085243f dotted;}
.video_photo{width:100%;position:relative;margin:0 auto;padding:0}
.video_photo img{width:100%;height:auto;}
.video_photo img+img{position:absolute;top: -4px;right:3%;width:70px;height:auto}
.qusetion{padding:2%;margin-bottom:2%;text-align: justify;/*height: 10rem;*/}
.qusetion b{background-color:var(--red);color:var(--white);padding:2px;margin-bottom:1%;display:inline-block;width:100%;text-align:center;padding: .3rem 0;}
.point_video figure{margin: 0 auto;padding: 1%}
.point_video figcaption{color:var(--red);padding:1%;text-align:left;}
.point_video figcaption a{color:var(--golden)}
.point_video figcaption a:hover{color:var(--red)}
.study{display: flex;flex-wrap: wrap;padding: 0 0 2%;text-align: center;}
.study-item{border: 2px var(--white) solid;width: calc(100%/3 - 20px);background: linear-gradient(-45deg, #ae741d 0%,#bc904b 20%, #e9d6b9 100%);padding: 1.5rem 0;margin: 0.3rem auto;border-radius: 1rem;box-shadow: var(--box_shadow);}
.study-item ul{display: flex;flex-wrap: wrap;padding:0 2.5rem;font-size: 1.3rem;font-weight: bold;}
.study-item li{list-style: none;margin: auto;color: var(--white);text-shadow: 0 0 4px #0000004f;}
.studyform a{font-size: 1.6rem;padding: 0 0.8rem;color:var(--black);}
.studyform span{font-size: 1.3rem;}

/*經驗談*/
#experience{width: 100%;margin: auto;}
/* .Vuecontainer {} */
/* .Vuetabs {} */
.Vuetabs a{width: calc(100%/3);text-align: center;padding: 1% 0;font-size: 1.5rem;color: var(--white);background-color:#607d8b ;border-radius: 1rem 1rem 0 0;border-top: 1px solid var(--white);}
.Vuetabs a:hover {background-color: #eeeeee;font-size: x-large;color: var(--orientalBlue);border-bottom: 0px dotted #00000000;border-bottom: 1px dotted var(--golden);}
.Vuetabs a.active {background-color: #f5aa21;cursor: default;color: var(--white);cursor: default;font-size: 1.65rem;border-top: 1px dotted var(--golden);border-radius: 1rem 1rem 0 0;border-bottom: 0px dotted #ffffff00;}
.tabVuecontent { padding: 1.5rem;background: linear-gradient(180deg,#fffc 80%, #fff0 100%);border-radius: 0 0 1rem 1rem;}
.fade-enter-active, .fade-leave-active {transition: opacity .5s;}
.fade-enter, .fade-leave-to{opacity: 0;transition: opacity 0s;}
.student{text-align: center;font-size: 1.5rem;margin: 1% 0;line-height: 2.55rem;}
.exp_mov {position: relative;width: 100%;height: 0;padding-bottom: 55%;}
.exp_video {position: absolute;top: 0; left: 0;width: 95%;height: 95%;padding: 0 2.5%;}
.experience{margin:0 auto;display: flex;flex-wrap: wrap;    padding: 0;}
.exp-item{margin: 2% 0;}
.exp-item div:nth-child(2){padding-bottom: .5rem;}
.exp-item div:nth-child(3){font-size: 1.1rem;line-height: 1.7rem;border-top: 1px dotted #e5ceab;padding: .5rem 0 0;color: #000000cc;}
.exp-item > div:nth-child(-n+2){font-size: 1.4rem;text-align: center;}
.exp-item mark{background: none;padding: 0 0.2rem;color:var(--black);font-weight: bold;}
.exp-item a{color:var(--red);font-weight: bold;}
.exp-item a:hover{color:var(--lightGolden);}
.exp-item{background: linear-gradient(0deg, #ffffffcc 0%, #fffffffc 60%);margin: 0.5rem auto;width: calc(100%/3 - 4%);padding: 1rem .8rem 1rem 1rem;filter: drop-shadow(3px 3px 2px #0000000f);border-radius: 1rem;}
.Vuecontent .more{width: 15%;font-size: 1.25rem;}


/* event_fifth */
.other{padding: 2.5rem .5rem 2.5rem 9rem;margin: 0 auto 1rem;}

#app,#app2 {
  background: var(--white);
  border-radius: 0px;
  padding: 20px;
  transition: all 0.2s;
}

.hooper-slide {
  
}
.fas{z-index:999;font-size:1.9rem;}
/* .fa-arrow-right{position:absolute;} */
/* .fa-chevron-right{position:absolute;right:0;}
.hooper-navigation{position:relative;} */

/* 浮動 */
#FB_Fixed{position:fixed;top:36%;right:0%;z-index:5;}
.Fixed_Item{display:flex;flex-wrap:wrap;justify-content:center;width:160px;height:auto;background-image: linear-gradient(to top, #cfd9dfc2 0%, #ffffff 100%);font-weight: 900;border-radius: 0 0 0 20px}
.Fixed_Title{font-size: 1.7rem;text-align: center;margin: .2rem;color: #F44336}
.Exam_Date{border-top: #c4c4c4 dotted 2px;border-bottom: #c4c4c4 dotted 2px;margin:.5rem 0;padding: .125rem;}
.Exam_Date div{margin: .2rem;}
.Exam_Date span{background:#238bca;padding:.125rem .2rem;position:relative;color:#FFF;margin-right:.5rem;font-size:1em;font-weight:initial;}
.Fixed_Item ul{display:flex;flex-wrap:wrap;justify-content: space-between;font-size:1.1rem;text-align: justify;padding: .3rem;border-top:#FF9800 dotted 5px;}
.Fixed_Item ul li{margin: 0;padding: .3rem;font-size: 1.1rem;list-style: none}
/* .Fixed_Item ul li::marker{color: #FFF;} */
.Fixed_Item .fa-facebook-square{color: #155190;/* background-color: #FFF; */width: 18px;font-size: 1.28rem;}
.Fixed_Item .fa-line{color:#4FB245;background-color: ;}
.Fixed_Item a{text-decoration:none;color:#F44336;padding:.125rem;}
.Fixed_Item a:hover{color: #FF9800;}
.Fixed_Img {margin-bottom: 0;border-radius: 20px 0 0 0;text-align: center;padding: .5rem 1rem .5rem;background-image: linear-gradient(to top, #f44336e3 0%, #ff8a81 100%);}
.Fixed_Img a{color:#fff}
.Fixed_Img i {color: #fa685d;padding: 10px 10px 9px;background-color: #f4c880;border-radius: 50px;margin-bottom: 3px;}



/*各大相容檢視*/
@media screen and (-webkit-min-device-pixel-ratio:0) { /*Webkit*/
}
@-moz-document url-prefix(){/*Firefox*/
}

@media \0screen\,screen\9 {/*IE 6 7 8*/
}

@media screen\0 {/*IE 8 9 10 11*/
}

@media print {
}