/* 置頂鈕 */

.LeftBtnMain { position: fixed; right: var(--LeftBtnRight); display: flex; justify-content: center; z-index: 900; transition: .3s; cursor: pointer; }
.LeftBtnMain button { display: flex; justify-content: center; align-items: center; margin: 0px; padding: 3px; width: 100%; height: 100%; border-radius: 8px; background-color: rgb(137 137 137 / 77%); }
.LeftBtnMain button:hover { background-color: rgba(96, 96, 96, 0.77); }
.LeftBtnMain span.material-symbols-outlined { line-height: 1; color: #FFF; font-size: 3.5rem; font-variation-settings: 'FILL' 0, 'wght' 200, 'GRAD' 0, 'opsz' 24; }

.ScrollTop { align-items: center;  bottom: -60px; width: 50px; height: 50px; }
.ScrollTop.Open { bottom: 30px; }

.GoHome { align-items: center;  bottom: -60px; width: 50px; height: 50px; }
.GoHome.Open { bottom: 100px; }

#GoVisitId { align-items: flex-start; flex-wrap: wrap; bottom: 170px; width: 50px; height: 150px; padding: 6px 6px; background-color: #ff5e00; border-radius: 8px; color: #FFFFFF; text-align: center; line-height: 22px; font-size: 20px; }
#GoVisitId.Eng { height: 200px; }
#GoVisitId.Eng .Txt { height: 24px; width: 147px; font-size: 19px; transform: rotate(90deg); }


footer { background-color: var( --DfColor ); background-repeat: no-repeat; background-position: 50px 50px; }

footer ul { margin: 0px; padding: 0px; list-style-type: none; }

footer .FooterContent { margin: 0px auto; width: var( --ArticleContentsWidth ); padding: 50px 0px 30px; color: #FFFFFF; }
footer .FooterContent .FooterTitle { padding-bottom: 10px; font-size: 4rem; border-bottom: solid 1px #FFF; }
footer .FooterContent .FooterTitle br { display: none; }
footer .FooterContent .FooterTitle .FooterTitleEn { display: inline; padding: 8px; font-size: 3rem; }
footer .FooterContent .Contents { display: flex; margin: 30px 0px 0px; }
footer .FooterContent .Contents .ContentLeft { flex: none; width: 580px; }
footer .FooterContent .Contents .ContentLeft ul.FCLIcon { display: flex; }
footer .FooterContent .Contents .ContentLeft ul.FCLIcon li { flex: none; width: 60px; padding-right: 20px; }
footer .FooterContent .Contents .ContentLeft ul.FCLIcon li a { display: flex; }
footer .FooterContent .Contents .ContentLeft ul.FCLIcon li a img { width: 100%; border-radius: 5px; line-height: 0px; }
footer .FooterContent .Contents .ContentLeft .MainContact { margin: 20px 0px; font-size: 2rem; line-height: 3rem; }
footer .FooterContent .Contents .ContentLeft .MainContact .AdmissionsPhone {  }
footer .FooterContent .Contents .ContentLeft .MainContact .InternationalPhone {  }
footer .FooterContent .Contents .ContentLeft .CollegeBoard { height: 80px; }
footer .FooterContent .Contents .ContentLeft .CollegeBoard img { height: 100%; }
footer .FooterContent .Contents .ContentLeft .Contact { margin: 20px 0px; font-size: 1.2rem; line-height: 2.3rem; }
footer .FooterContent .Contents .ContentRight { flex: 1; }
footer .FooterContent .Contents .ContentRight ul.Menu { display: flex; flex-wrap: wrap; }
footer .FooterContent .Contents .ContentRight ul.Menu > li { flex: none; margin-bottom: 20px; width: calc( 100% / 4 ); padding: 2px; }
footer .FooterContent .Contents .ContentRight ul.Menu > li > a { display: inline-block; padding: 5px 0px; font-size: 1.6rem; color: #FFFFFF; font-weight: 600; }
html[lang="zh-TW"] footer .FooterContent .Contents .ContentRight ul.Menu > li > a { font-size: 2rem; }


footer .FooterContent .Contents .ContentRight ul.Menu > li > a:hover { color: var( --LinkHoverColor ); }
footer .FooterContent .Contents .ContentRight ul.Menu li ul.SubMenu { display: flex; flex-wrap: wrap; }
footer .FooterContent .Contents .ContentRight ul.Menu li ul.SubMenu li { flex: none; width: 100%; }
footer .FooterContent .Contents .ContentRight ul.Menu li ul.SubMenu li a { display: inline-block; padding: 5px 0px; font-size: 1.2rem; color: #FFFFFF; }
html[lang="zh-TW"] footer .FooterContent .Contents .ContentRight ul.Menu li ul.SubMenu li a { font-size: 1.5rem; color: #FFFFFF; }
footer .FooterContent .Contents .ContentRight ul.Menu li ul.SubMenu li a:hover { color: var( --LinkHoverColor ); }

@media screen and (max-width: 2000px) {

	footer .FooterContent .Contents .ContentRight ul.Menu li a { font-size: 1.3rem; }

}


@media screen and (max-width: 1600px) {

	footer .FooterContent .Title { font-size: 3.5rem; }
	footer .FooterContent .Contents .ContentLeft { flex: none; width: 500px; }
	footer .FooterContent .Contents .ContentLeft .MainContact { font-size: 1.5rem; line-height: 2.5rem; }
	footer .FooterContent .Contents .ContentLeft .CollegeBoard { height: 70px; }
	footer .FooterContent .Contents .ContentLeft .Contact { font-size: 1.1rem; line-height: 2rem; }
	footer .FooterContent .Contents .ContentRight ul.Menu > li > a { font-size: 1.2rem; }
	footer .FooterContent .Contents .ContentRight ul.Menu li ul.SubMenu li a { font-size: 1.1rem; }

}


@media screen and (max-width: 1400px) {

	footer .FooterContent .Title { font-size: 2.5rem; }
	footer .FooterContent .Contents { flex-wrap: wrap; }
	footer .FooterContent .Contents .ContentLeft { order: 2; flex: none; width: 100%; }
	footer .FooterContent .Contents .ContentRight { order: 1; flex: none; margin-bottom: 30px; width: 100%; padding: 15px; border-radius: 10px; background-color: var( --DfColor ); }
	footer .FooterContent .Contents .ContentRight ul.Menu > li > a { font-size: 1.4rem; }
	footer .FooterContent .Contents .ContentRight ul.Menu li ul.SubMenu li a { font-size: 1.2rem; }

}


@media screen and (max-width: 1024px) {

	footer .FooterContent .Contents .ContentRight ul.Menu > li { width: calc( 100% / 2 ); }
	footer .FooterContent .Contents .ContentRight ul.Menu > li > a { font-size: 1.5rem; }
	footer .FooterContent .Contents .ContentRight ul.Menu li ul.SubMenu li a { font-size: 1.3rem; }	



}


@media screen and (max-width: 768px) {


}


@media screen and (max-width: 500px) {

	footer .FooterContent .Contents .ContentLeft .MainContact { font-size: 1.3rem; line-height: 2.5rem; }
    footer .FooterContent .Contents .ContentRight ul.Menu > li { width: 100%; }

}