*,
*:before,
*:after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0px;
}


html {
	height: 100%;
	/*
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	*/
}

body,
input,
textarea,
button {
	font-family:  Helvetica, 'Microsoft JhengHei UI','Microsoft JhengHei', 微軟正黑體, 微软正黑体, Arial, sans-serif;
}

body {
	background: #fff;
	margin: 0px;
	padding: 0px;
	height: 100%;
	text-rendering: optimizelegibility;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
	color: #6E6E6E;
}

a {
	text-decoration: none;
	cursor: pointer;
	color: inherit;
	word-wrap: break-word;
	-ms-word-break: break-all;
	word-break: break-word;
	word-break: break-all;
	
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	hyphens: auto;
	list-style: none;
	display: block;
}

ul {
	list-style: outside none none;
	padding: 0px;
}

li {
	cursor: pointer;
	text-align: center;
}

img {
	image-orientation: from-image;
}

.background{
	background: #A2E5F6;
	background: -moz-linear-gradient(top, #A2E5F6 0%, #F6F6F6 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, #A2E5F6), color-stop(100%, #F6F6F6));
	background: -webkit-linear-gradient(top, #A2E5F6 0%, #F6F6F6 100%);
	background: -o-linear-gradient(top, #A2E5F6 0%, #F6F6F6 100%);
	background: -ms-linear-gradient(top, #A2E5F6 0%, #F6F6F6 100%);
	background: linear-gradient(to bottom, #A2E5F6 0%, #F6F6F6 100%);
	width: 100%;
	height: 500px;
	position: absolute;
	z-index: 0;
	left: 0px;
}

.background_img{
	background: url("../images/heading_bk.jpg") no-repeat;
	width: 100%;
	height: 300px;
	position: absolute;
	left: 0px;
	background-size: 100% auto;
}


.mobile-only {
	display: none;
}

#main{
	width: 100%;
	max-width: 1250px;
	margin: 0px auto;
	background-color: #f6f6f6;
	position: relative;
	min-height: 100vh;
	padding: 0px 80px;
	min-width: 768px;
}

/* header */
#header {
	height: 13vw;
	min-height: 100px;
	max-height: 150px;
	padding: 15px 0px;
	position: relative;
	width: 100%;
	display: flex;
	display: -ms-flexbox;
	display: -webkit-flex;
}

#headerLogo{
	height: 100%;
	width: 40%;
	max-width: 320px;
	display: flex;
	display: -ms-flexbox;
	display: -webkit-flex;
}

#headerLogoImg {
	background: url("../images/sch_logo.png") no-repeat;
	background-size: contain;
	background-position: left bottom;
	height: 100%;
	width: 100%;
}

.header_banner_section {
	width: 70%;
	height: 100%;
}

.header_banner{
	background: url("../images/banner/header_banner.png") no-repeat;
	background-size: 100% auto;
	background-position: right bottom; 
	height: 100%;
	width: 100%;
	bottom: 0px;
	float: right;
	max-width: 620px;
}

.menu_btn {
	background: url("../images/icon_menu.svg") no-repeat;
	background-size: 100% auto;
	height: 11vw;
	width: 11vw;
	position: absolute;
	top: 29%;
	right: 4%;
	cursor: pointer;
	z-index: 300;
}


/* category */
#catBrowser {
	text-align: center;
	width: 100%;
}

.catBrowser-wrapper ul{
	white-space: nowrap;
	padding: 0px;
	margin: 0;
	background-color: #FFF;
	display: table;
	width: 100%;
}

.catBrowser-wrapper li{
	display: table-cell;
	height: 100%;
}

.catBrowser-wrapper li:first-child {
	border-left: none;
}

.catBrowser-wrapper li a {
	width: 100%;
	height: 100%;
}

.catBrowser-wrapper .catBrowser-item:hover, .catBrowser-item .subNav li:hover{
	background-color: #EDEDED;
}

.catBrowser-wrapper{
	margin-left: auto;
	margin-right: auto;
	position: relative;
}

.catBrowser-item .catBrowser-icon {
	background-repeat: no-repeat;
	background-position: center bottom;
	height: 42px;
	margin-left: auto;
	margin-right: auto;
	display: block;
}
.catBrowser-wrapper .catBrowser-item{
	border-top: 5px solid #FFF;
	padding: 10px 0px;
	padding-bottom: 6px;
	border-left: 1px solid #C2C2C2;
}

.catBrowser-item figure {
	background-size: auto auto;
}

.catBrowser-item.proTeam .catBrowser-icon {
	background-image: url("../images/logo_proTeam.svg");
}
.catBrowser-item.proTeam span,
.catBrowser-item.proTeam .subNav li:hover{
	color: #549829;
}
.catBrowser-wrapper .catBrowser-item.proTeam:hover{
	border-top: 5px solid #549829;
}

.catBrowser-item.course .catBrowser-icon {
	background-image: url("../images/logo_course.svg");
}
.catBrowser-item.course span,
.catBrowser-item.course .subNav li:hover{
	color: #FF6D00;
}
.catBrowser-wrapper .catBrowser-item.course:hover{
	border-top: 5px solid #FF6D00;
}

.catBrowser-item.campus .catBrowser-icon {
	background-image: url("../images/logo_campus.svg");
}
.catBrowser-item.campus span,
.catBrowser-item.campus .subNav li:hover{
	color: #00AFEF;
}
.catBrowser-wrapper .catBrowser-item.campus:hover{
	border-top: 5px solid #00AFEF;
}

.catBrowser-item.awards .catBrowser-icon {
	background-image: url("../images/logo_awards.svg");
}
.catBrowser-item.awards span,
.catBrowser-item.awards .subNav li:hover{
	color: #EE4039;
}
.catBrowser-wrapper .catBrowser-item.awards:hover{
	border-top: 5px solid #EE4039;
}

.catBrowser-item.campus_guide .catBrowser-icon {
	background-image: url("../images/logo_guide.svg");
}
.catBrowser-item.campus_guide span,
.catBrowser-item.campus_guide .subNav li:hover{
	color: #EFA003;
}
.catBrowser-wrapper .catBrowser-item.campus_guide:hover{
	border-top: 5px solid #EFA003;
}

.catBrowser-item.ed_exchange .catBrowser-icon {
	background-image: url("../images/logo_exchange.svg");
}
.catBrowser-item.ed_exchange span,
.catBrowser-item.ed_exchange .subNav li:hover{
	color: #C75EA3;
}
.catBrowser-wrapper .catBrowser-item.ed_exchange:hover{
	border-top: 5px solid #C75EA3;
}


.catBrowser-label{
	font-size: 16px;
	line-height: 2.3;
	margin-left: auto;
	margin-right: auto;
	white-space: normal;
	color: #333;
	font-weight: 600;
}

.catBrowser-items .subNav{
	display: none;
	position: relative;
}

.catBrowser-items .subNav li{
	display: block;
}

.catBrowser-items .btnGp{
	z-index: 300;
	position: absolute;
	background-color: #FFF;
	border: 1px solid #C2C2C2;
	box-shadow: 1px 1px 5px RGBA(42, 42, 42, 0.56);
	margin-top: 10px;
	width: 100%;
}

.upArrow {
	position: relative;
	z-index: 300;
}

.catBrowser-items .upArrow:before,
.catBrowser-items .upArrow:after {
	content: "\A";
	position: absolute;
	left: 47%;
	border-style: solid;
	border-width: 8px 8px 8px 0px;
}

.catBrowser-items .upArrow:before {
	top: -2px;
	transform: rotate(90deg) scale(1.2);
	-webkit-transform: rotate(90deg) scale(1.2);
	border-color: transparent #C2C2C2 transparent transparent;
}

.catBrowser-items .upArrow:after {
	top: -1px;
	transform: rotate(90deg);
	-webkit-transform:rotate(90deg);
	border-color: transparent #fff transparent transparent;
}

.catBrowser-items .subNav li a{
	padding: 23px 22px;
	font-weight: 600;
}

.subNav .boundary {
	height: 20px;
	width: 100%;
	position: absolute;
	top: -13px;
}

.subNav .subNavBtn{
	position: absolute;
	right: 0px;
	background-color: #FFF;
	border: 1px solid #C2C2C2;
	top: 14px;
	box-shadow: 1px 1px 5px RGBA(42, 42, 42, 0.56);
}

/* container */
#container {
	margin-top: 6px;
	width: 100%;
	position: relative;
	height: auto;
}

#container .home_page_section {
	margin: 9px 0px;
}

#container .home_page_section:nth-child(1){
	max-height: 370px;
	height: 40vw;
	min-height: 308px;
}
#container .home_page_section:nth-child(2){
	max-height: 250px;
	min-height: 222px;
	height: 29vw;
}
#container .home_page_section:nth-child(3){
	max-height: 390px;
	height: 29vw;
	min-height: 350px;
}
#container .home_page_section>div:nth-child(1){
	float: left;
	overflow: hidden;
}
#container .home_page_section>div:nth-child(2){
	float: right;
}

.section_topic {
	position: relative;
}

.section_topic:after {
	content: "+";
	position: relative;
	line-height: 20px;
	cursor: pointer;
	vertical-align: middle;
	display: table-cell;
	text-align: right;
}

/* Photo Sider 1 */
.controlBtnGtp {
	position: absolute;
	bottom: 14px;
	right: 42px;
	padding: 0px 14px;
	display: flex;
	display: -ms-flexbox;
	display: -webkit-flex;
}

.controlBtnGtp .controlBtnDot {
	border: 4px solid #FFF;
	border-radius: 6px;
	margin: 6px 4px;
	cursor: pointer;
}

#container .home_page_section #sider1 {
	float: right;
}

#sider1 .photo-container{
	background-color: #000;
}

.photo_sider{
	height: 100%;
	width: 66%;
	background-color: #FFF;
	display: block;
	padding: 9px;
	position: relative;
}

.photo-container {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}

.photo_display_area {
	height: 100%;
	display: inline-block;
	width: 100%;
	-webkit-transition: -webkit-transform 1.8s;
	transition: transform 1.8s;
	overflow: hidden;
}

.photo_disply_area img{
	width: 100%;
	height: auto;
}

.photo_sider .photo-container .photo{
	height: 100%;
	width: 100%;
	background-size: contain!important;
	background-position: center!important;
	background-repeat: no-repeat !important;
	position: absolute;
	display: none;
}

.photo_sider .photo-container .photo.curr,
.photo_sider .photo-container .photo.next,
.photo_sider .photo-container .photo.prev {
	display: block;
}

.photo_sider .photo-container .photo.next{
	left: 100%;
}
.photo_sider .photo-container .photo.prev{
	left: -100%;
}

.moveLeft .photo,
.moveRight .photo{
	-webkit-transition: -webkit-transform 0.8s;
	transition: transform 0.8s;
}

.photo_sider .photo_display_area.moveRight .photo.curr,
.photo_sider .photo_display_area.moveRight .photo.next
{
	-webkit-transform: translate3d(-100%,0,0);
	transform: translate3d(-100%,0,0);	
}

.photo_sider .photo_display_area.moveLeft .photo.curr,
.photo_sider .photo_display_area.moveLeft .photo.prev{
	-webkit-transform: translate3d(100%,0,0);
	transform: translate3d(100%,0,0);	
}


#sider1.photo_sider .controlBtnGtp {
	background-color: RGBA(41, 41, 41, 0.38);
	border-radius: 5px;
}

#sider1 .controlBtnGtp .controlBtnDot {
	border: 4px solid RGBA(219, 219, 219, 0.51);
}
#sider1 .controlBtnGtp .controlBtnDot.curr {
	border: 4px solid #FFF;
}


/* President Message */
#container .home_page_section #president_msg {
	float: left;
}

#president_msg {
	background-color: #FFF;
	width: 33%;
	height: 100%;
}

.president_msg_hd_img{
	background-position: bottom center ;
	background-size: contain;
	background-repeat: no-repeat;
	max-height: 150px;
	height: 13vw;
	min-height: 100px;
}
.president_msg_topic.section_topic:after{
	right: 16px;	
}

.president_msg_topic{
	background-color: #549829;
	color: #FFF;
	padding: 7px 32px;
	padding-right: 0px; 
	font-size: 20px;
	vertical-align: middle;
	display: table;
	width: 100%;
}

.president_msg_topic_section{
	padding: 10px;
}

.president_msg_topic_section li{
	line-height: 28px;
	text-align: left;
	margin-left: 21px;
	vertical-align: middle;
	font-size: 15px;
	display: inline-block;
}

.president_msg_topic_section li:hover{
	color: #FF6D00;
}

.president_msg_topic_section li:before{
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 3px 0 3px 5px;
	border-color: transparent transparent transparent #549829;
	margin: 0px 10px;
	font-size: 0px;
	vertical-align: middle;
	position: absolute;
	margin: 10px -13px;
}



/* News */
#container .home_page_section #news {
	float: left;
}

#news{
	background-color: #FFF;
	width: 63%;
	height: 100%;
	display: flex;
	display: -ms-flexbox;
	display: -webkit-flex;
}

#weekday_info{
	color: #FFF;
	width: 31%;
	text-align: center;
	display: block;
	position: relative;
}
#weekday_info.day1{ background-color: #F96B6B;}
#weekday_info.day2{ background-color: #6DB9F7;}
#weekday_info.day3{	background-color: #FFA044;}
#weekday_info.day4{	background-color: #EAC303;}
#weekday_info.day5{	background-color: #B9DD54;}
#weekday_info.day6{	background-color: #71DBEA;}

.day1 .weekday_icon{
	background: url("../images/day_1.png") no-repeat;
	background-size: 100%;
	background-position: center bottom;
}
.day2 .weekday_icon{
	background: url("../images/day_2.png") no-repeat;
	background-size: 100%;
	background-position: center bottom;
}
.day3 .weekday_icon{
	background: url("../images/day_3.png") no-repeat;
	background-size: 100%;
	background-position: center bottom;
}
.day4 .weekday_icon{
	background: url("../images/day_4.png") no-repeat;
	background-size: 100%;
	background-position: center bottom;
}
.day5 .weekday_icon{
	background: url("../images/day_5.png") no-repeat;
	background-size: 100%;
	background-position: center bottom;
}
.day6 .weekday_icon{
	background: url("../images/day_6.png") no-repeat;
	background-size: 100%;
	background-position: center bottom;
}

.week_day{
	margin-top: 30px;
	font-size: 30px;
}

.week_date{
	margin-top: 10px;
	font-size: 17px;
}

.weekday_icon{
	position: absolute;
	top: 0px;
	width: 100%;
	height: 100%;
}

.news_content_container{
	padding: 20px;
	width: 100%;
	overflow: hidden;
}

.news_topic:before{
	content: "";
	background: url("../images/icon_news.svg") no-repeat;
	background-position: bottom left;
	width: 40px;
	height: 27px;
	display: table-cell;
}

.news_topic {
	color: #549829;
	border-bottom: 2px solid #549829;
	padding-bottom: 10px;
	font-size: 24px;
	display: table;
	width: 100%;
}

.topic_wording {
	display: table-cell;
	vertical-align: middle;
}

.news_topic_section {
	padding: 10px 3%;
}

.news_topic_section li{
	text-align: left;
	line-height: 26px;
}

.news_topic_section li:hover{
	color: #FF6D00;
}



/* shortcut */
#container 

.home_page_section #shortcut_btn {
	float: right;
}

#shortcut_btn {
	width: 36%;
	height: 100%;
	color: #FFF;
	position: relative;
}

#shortcut_btn>div{
	position: absolute;
	width: 100%;
	height: 48%;
	display: table;
	cursor: pointer;
}


#shortcut_btn>div:first-child {
	top: 0px;
}

#shortcut_btn>div:last-child {
	bottom: 0px;
}

#shortcut_btn .btn_content{
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	padding: 0px 12px;
}


#shortcut_btn>div:first-child .btn_content{
	background-color: #50B4EC;
}

#shortcut_btn>div:last-child .btn_content{
	background-color: #F76069;
}

#shortcut_btn .topic_icon{
	width: 80px;
	height: 80px;
	margin-right: 10px;
	background-size: 100% !important;
}

#shortcut_btn .topic_header{
	font-size: 32px;
	display: inline-flex;
	display: -ms-inline-flexbox;
	display: -webkit-inline-flex;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
	margin-top: 4px;
}

/* School Photo */
#sch_photo,#sch_video {
	background-color: #FFF;
	width: 49.5%;
	height: 100%;
	position: relative;
}

.sch_photo_container,
.sch_video_container {
	padding: 14px;
	padding-bottom: 0px;
}

.sch_photo_topic:before{
	content: "";
	background: url("../images/icon_sch_photo.svg") no-repeat;
	background-position: bottom left;
	width: 40px;
	height: 27px;
	display: table-cell;
}

.sch_photo_topic {
	color: #EE4039;
	border-bottom: 2px solid #EE4039;
	padding-bottom: 10px;
	font-size: 24px;
	display: table;
	width: 100%;
}

.sch_photo_slider {
	position: relative;
	height: 80%;
}

.sch_photo_slider .photo_div {
	height: 287px;
	width: 100%;	
	margin-top: 0px;
	position: absolute;
}

.photo_sider .sch_photo_slider .photo {
	margin-top: 13px;
	height: 81%;
}

.sch_photo_slider .photo_div.prev{
	left: -370px;
}

.sch_photo_slider .photo_div.next{
	left: 395px;
}

.sch_photo_slider .photo p {
	position: absolute;
	bottom: -28px;
	text-align: center;
	width: 100%;
}

#sch_photo .controlBtnGtp,
#sch_video .controlBtnGtp {
	right: 10px;
	bottom: 8px;
	background-color: none;
}


#sch_photo .controlBtnGtp .controlBtnDot,
#sch_video .controlBtnGtp .controlBtnDot {
	border: 4px solid #A1A1A1;
}
#sch_photo .controlBtnGtp .controlBtnDot.curr,
#sch_video .controlBtnGtp .controlBtnDot.curr {
	border: 4px solid #FF6C00;
}

/* School Video */
.sch_video_topic:before{
	content: "";
	background: url("../images/icon_sch_video.svg") no-repeat;
	background-position: center left;
	width: 40px;
	height: 27px;
	display: table-cell;
	vertical-align: middle;
}

.sch_video_topic {
	color: #EE4039;
	border-bottom: 2px solid #EE4039;
	padding-bottom: 10px;
	font-size: 24px;
	display: table;
	width: 100%;
}

.sch_video_slider {
	position: relative;
	height: 78%;
}

.sch_video_slider .photo {
	margin-top: 13px;
}

#sch_video .sch_video_slider .video_div {
	text-align: center;
}

.sch_video_slider video {
	height: 80%;
	left: 0px;
	margin: 0px auto;
}

.sch_video_slider .photo p {
	position: absolute;
	bottom: 14px;
	text-align: center;
	width: 100%;
}

.arrowControl {
	width: 50px;
	height: 50px;
	position: absolute;
	top: 45%;
	cursor: pointer;
}

.arrowControl.left {
	background: url("../images/icon_leftArrow.svg") no-repeat;
	left: 0px;
}

.arrowControl.right {
	background: url("../images/icon_rightArrow.svg") no-repeat;
	right: 0px;
}


/* External Link */
.external_link .is-link {
	cursor: pointer;
	float: left;
	width: 33.3%;
	padding: 0px 2px;
}

.external_link img {
	width: 100%;
}




/* Sub page */

/* Title */
.subPage-title{
	padding: 17px 40px;
	height: auto;
	color: #FFF;
	position: relative;
}

.subPage-title h1{
	margin: auto;
	height: 100%;
	font-size: 21px;
}

.sub_title {
	position: absolute;
	right: 5%;
	bottom: 12px;
	font-size: 14px;
}

.back_menu_icon,
.sub_menu_icon{
	position: absolute;
	cursor: pointer;
}

.back_menu_icon {
	height: 6vw;
	width: 6vw;
	background: url("../images/icon_back_arrow.svg") no-repeat;
	background-size: 100% auto;
	left: 6%;
	top: 32%;
}

.sub_menu_icon {
	height: 5vw;
	width: 5vw;
	background: url("../images/icon_menu_arrow.svg") no-repeat;
	background-size: 100% auto;
	right: 7%;
	top: 37%;
	transition: ease 0.5s all;
	background-position: center;
}

.sub_menu_icon.isUp {
	-webkit-transform: rotate(180deg);
	transform: rotate(180deg);
}



.subPage_menu {
	color: #FFF;
	position: absolute;
	right: 0px;
	z-index: 200;
}
.subPage_menu ul {
	padding: 11px 0px;
	display: none;
}

.subPage_menu li {
	padding: 9px 40px;
	font-size: 4.2vw;
}

/* Sub Page Content */
.subPage-main{
	height: 100%;
	width: 100%;
	padding: 18px 0px;
	display: flex;
	display: -ms-flexbox;
	display: -webkit-flex;
	margin: 0px;
	background-color: #FFF;
}

.subPage-left-panel {
	max-width: 310px;
	width: 28%;
	border-right: 1px solid #ddd;
	min-width: 180px;
}

.subPage-right-panel {
	width: 100%;
	overflow: hidden;
}

.subPage-left-panel ul{
	text-align: center;
}
subPage-left-panel li {
	display: inline-block;
}
.subPage-left-panel li a{
	padding: 14px 0px;
}

.subPage-left-panel li.curr,
.subPage-left-panel li:hover{
	color: #FF6D00;
	position: relative;
}

.subPage-left-panel li.curr li{
	list-style-type: square;
	list-style-position: inside;
	margin-left: -14px;
}

.site_route_section {
	position: relative;
	height: 30px;
}

.site_route {
	font-size: 13px;
	position: absolute;
	right: 17px;
}

.site_route ul{
	display: flex;
	display: -ms-flexbox;
	display: -webkit-flex;
}

.site_route li{
	margin: 0px -5px;
	border-radius: 6px;
	padding: 3px 9px;
	display: flex;
	display: -ms-flexbox;
	display: -webkit-flex;
}

.site_route li:first-child {
	background-color: #276EBB;
	color: #FFF;
	margin: 0px 2px;
}

.site_route li:not(:first-child):before {
	content: ">";
	margin-right: 5px;
}

.site_route li a:hover {
	color: #FF6D00;
}

.subPage-nav {
	float: right;
	height: 98%;
	width: 26%;
	padding: 10px;
	display: block;
	position: relative;
}
.subPage-content a
{
	color:#fc5600;
	text-decoration: underline;
}
.subPage-content img,
.subPage-nav img {
	width: 100%;
	/*border: 2px solid #EDE896;*/
}

img.no-border {
	border: 0px;
}

.subPage-nav p{
	font-size: 14px;
}

.subPage-nav li{
	cursor: initial;
	margin: 10px 0px;
}

.subPage-content {
	padding: 16px;
	width: 74%;
	height: 98%;
	border-right: 1px solid #ddd;
}

.frame_1 .subPage-content {
	width: 100%;
}

.frame_3 .subPage-content {
	width: 74%;
}

.subPage-content h2{
	color: #276EBB;
	font-size: 20px;
}
.subPage-content h3 {
    color: #276EBB;
    font-size: 16px;
}
.subPage-content h4 {
    color: #E17337;
    font-size: 16px;
}
.subPage-content .content_sect {
	margin: 12px 0px;
	display: inline-block;
	width: 100%;
}
.subPage-content .content_sect>div {
	overflow:auto;
}

.subPage-content p{
	font-size: 14px;
	line-height: 24px;
	margin-bottom: 17px;
}

.subPage-content input,
.subPage-content textarea {
	border: 2px solid #e5e5e5;
	outline: none;
	width: 100%;
	padding: 8px 10px;
	font-size: 19px;
	border-radius: 0;
	color: #404040;
	margin: 8px 0px;
}

.subPage-content input{
	height: 42px;
	display: block;
}

.contact_us{
	width: 70%;
}

.subPage-content table {
	width: 100%;
}

.subPage-content table td{
	background-color: #FCF4EB;
	font-size: 12px;
	line-height: 24px;
	padding: 9px 22px;
}
.subPage-content table td,
.subPage-content table td p {
	font-size: 13px;
	vertical-align: top;
}

.subPage-content .table_style_1 td {
	vertical-align: middle;
}

.subPage-content .table_style_1 a {
	color: #276EA8;
}

.table_style_1 tr:first-child td{
	background-color: #E9F8C9;
}

.table_style_1 div{
	text-align: center;
}

table.table_style_2 td{
	background-color: transparent;
	padding: 0px;
	font-size: 13px;
}


table.table_style_2 td{
	
	vertical-align: middle;
}

table.table_style_2 td h2{
	font-size: 17px;
}


table.table_style_2 td a,
table.table_style_3 td a{
	color: #276EA8;
	display: initial;
}

table.table_style_2 table {
	margin: 20px 0px;
}

.table_style_3 tr:nth-child(2n+3) td{
	background-color: #FFFBF9;
}

table.table_style_3  tr:first-child td{
	background-color: #E9F8C9;
	font-size: 19px;
}

table.table_style_3{
	font-size: 17px;
}

table.table_style_3 td>div{
	width: 50%;
	float: left;
	padding: 10px;
}

table.table_style_3 h2{
	font-size: 17px;
}
table.table_style_3 h2:nth-child(2){
	font-size: 14px;
}

.table_style_4 td{
	text-align: center;	
	vertical-align: middle;
}

.table_style_4 td:nth-last-child(2), 
.table_style_4 td:nth-last-child(2) div{
	text-align: left;	
}

.table_style_4 tr:first-child td{
	text-align: center;	
	vertical-align: middle;
}

table.table_style_5 td {
	text-align: center;	
	vertical-align: middle;
}

.table_style_5 thead tr:nth-child(1) td {
	background-color: #E9F8C9;
}
.table_style_5 thead tr:nth-child(2) td {
	background-color: #E9F8C9;
}
.table_style_5 tbody td:first-child {
	background-color: #fdf4d5;
}

.col1_alignL tbody td:nth-child(1){
	text-align: left;
}
.col2_alignL tbody td:nth-child(2){
	text-align: left;
}
.col3_alignL tbody td:nth-child(3){
	text-align: left;
}
.col4_alignL tbody td:nth-child(4){
	text-align: left;
}
.col5_alignL tbody td:nth-child(5){
	text-align: left;
}

table.table_nobg td{
	background-color: transparent;
	padding: 0px;
}

.subPage-content ul{
	margin-left: 32px;
}

.subPage-content li{
  cursor: initial;	
  text-align: left;
  font-size: 14px;
  line-height: 23px;
}

.subPage-content ul li:before{
	content: "";
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 3px 0 3px 5px;
	border-color: transparent transparent transparent #549829;
	margin: 0px 10px;
	font-size: 0px;
	vertical-align: middle;
	position: absolute;
	margin: 8px -13px;
}

.status{
	height: 50px;
	display: block;
	font-size: 20px;
	font-weight: 700;
}

.is-success {
	color: #49CF0E;
}

.is-fail {
	color: #D40000;
}

.subPage-content .list_num li{
	list-style-type: decimal;
}
.subPage-content .list_num li:before{
	display: none;
}

.subPage-content .float_img{
	text-align: center;
	display: inline-block;
	vertical-align: top;
}
.subPage-content .float_content{
	float: left;
	text-align: center;
}

.subPage-content .width_66_100 {
	width: 65%;
	padding: 7px;
}

.subPage-content .width_50_50 {
	width: 49%;
	padding: 7px;
}

.width_33_50 img,
.width_50_50 img{
	width: 100%;
}

.width_33_50 p,
.width_50_50 p{
	font-size: 12px;
}

.subPage-content .width_25_50 {
	width: 24%;
	padding: 7px;
}

.subPage-content .width_33_33,
.subPage-content .width_33_50,
.subPage-content .width_33_100 {
	width: 32%;
	padding: 7px;
}

/* For Sub Page (Our Team)*/
.proTeam .subPage_menu {
	background-color: #549829;
}

.proTeam .subPage-title{
	background: url("../images/heading_green.png") no-repeat;
	background-color: #549829;
	background-size: cover;
}

.proTeam .principal_list .items_row {
	display: flex;
	display: -ms-flexbox;
	display: -webkit-flex;
	width: 50%;
	float: left;
}

.proTeam .principal_item {
	width: 50%;
	padding: 6px 6px;
	text-align: center;
	margin: 4px 0px;
}

.proTeam .principal_item p{
	font-size: 13px;
}

/* For course */
.course .subPage_menu {
	background-color: #FF6D00;
}

.course .subPage-title{
	background: url("../images/heading_orange.png") no-repeat;
	background-color: #FF6D00;
	background-size: 100% 100%;
}

/* For campus */
.campus .subPage_menu {
	background-color: #00AFEF;
}
.campus .subPage-title{
	background: url("../images/heading_blue.png") no-repeat;
	background-color: #00AFEF;
	background-size: 100% 100%;
}

/* For awards */
.awards .subPage_menu {
	background-color: #EE4039;
}
.awards .subPage-title{
	background: url("../images/heading_red.png") no-repeat;
	background-color: #EE4039;
	background-size: 100% 100%;
}

/* For campus_guide */
.campus_guide .subPage_menu {
	background-color: #EFA003;
}
.campus_guide .subPage-title{
	background: url("../images/heading_yellow.png") no-repeat;
	background-color: #EFA003;
	background-size: 100% 100%;
}

/* For ed_exchange */
.ed_exchange .subPage_menu {
	background-color: #C75EA3;
}
.ed_exchange .subPage-title{
	background: url("../images/heading_purple.png") no-repeat;
	background-color: #C75EA3;
	background-size: 100% 100%;
}


.subPage-nav.principal_letter> ul > li{
	font-size: 13px;
	background-color: #FCF4EB;
	padding: 0px;
	margin: 0px;
}

.subPage-nav.principal_letter {
	width: 30%;
}
.subPage-content.principal_letter {
	width: 70%;
}

.subPage-content.principal_letter table{
	table-layout: fixed;
}


.subPage-content.principal_letter>table td{
	background-color: transparent;
}

.subPage-content.principal_letter>table td,
.subPage-content.principal_letter p{
	line-height: inherit;
}

.subPage-nav.principal_letter> ul > li{
	padding: 3px 12px;
}
.subPage-nav.principal_letter li:not(:last-child)>a {
	border-bottom: 1px solid #D8D8D8;
}

.subPage-nav.principal_letter li>a{
	padding: 0px 10px;
}

.subPage-nav.principal_letter li>a:hover li:before{
	color: #276EBB;
}

.subPage-nav.principal_letter li a li{
	text-align: left;
	padding-left: 1em; 
	text-indent: -17px;
	cursor: pointer;
}

.subPage-nav.principal_letter li a li:before{
	content: "• ";
	color: #FF6D00;
	padding-right: 3px;
	font-size: 24px;
	line-height: 0px;
	vertical-align: middle;
}

.subPage-nav.principal_letter li.topicNavBtn{
	color: #FF6D00;
	font-family: Arial Narrow,Arial,sans-serif;
	font-weight: 800;
}

.subPage-nav.principal_letter li.topicNavBtn a:hover{
	color: #276EBB;
}

.subPage-nav.principal_letter li .topicNavBtnGp{
	position: relative;
	height: 23px;
}
.subPage-nav.principal_letter li .topicNavBtnGp > a{
	position: absolute;
	margin: 0px 0px;
	height: 100%;
}

.subPage-nav.principal_letter li .topicNavBtnGp > a.btnPrev{
	left: 10px;
	padding-right: 30px;
	padding-left: 10px;
	margin-left: -13px;
}
.subPage-nav.principal_letter li .topicNavBtnGp > a.btnNext{
	right: 10px;
	padding-left: 30px;
	padding-right: 10px;
	margin-right: -13px;
}

.selectSchDaySect,
.selectClassSect {
	overflow: auto;
}

.selectSchDay_Gp, .selectForm_Gp, .selectEachClass_Gp {
	position: relative;
	width: 100%;
	display: table;
}

.selectForm_Gp {
	margin-bottom: 20px;
}

.selectEachClass_Gp {
	display: none;
	overflow: auto;
}

.selectEachClass_Gp.is-selected {
  display: block;	
}

.selectSchDay_btn.Monday {
	background-color: #FA6C6B;
}

.selectSchDay_btn.Tuesday {
	background-color: #6DB9F7;
}

.selectSchDay_btn.Wednesday {
	background-color: #ffa044;
}

.selectSchDay_btn.Thursday {
	background-color: #eac302;
}

.selectSchDay_btn.Friday {
	background-color: #b9dd55;
}

.selectSchDay_btn.Monday.is-active:hover {
	background-color: #FF7A79;
}

.selectSchDay_btn.Tuesday.is-active:hover {
	background-color: #7DC2FB;
}

.selectSchDay_btn.Wednesday.is-active:hover {
	background-color: #ffb268;
}

.selectSchDay_btn.Thursday.is-active:hover {
	background-color: #edd55d;
}

.selectSchDay_btn.Friday.is-active:hover {
	background-color: #c1de70;
}

.selectSchDay_btn,
.selectForm_btn,
.selectClass_btn {
	color: #FFF;
	width: 11.4vw;
	position: relative;
	text-align: center;
	margin: 4px;
	height: 11.2vw;
	float: left;
	display: table;
	max-width: 140px;
	max-height: 130px;
}

.selectSchDay_btn.is-active,
.selectForm_btn,
.selectClass_btn
{
	cursor: pointer;
}

.selectSchDay_btn span{
	display: table-cell;
	vertical-align: middle;
}

.selectSchDay_wkDay {
	font-size: 25px;
	font-weight: 600;
	margin-bottom: 4px;
}

.selectSchDay_Day,
.selectSchDay_schDay{
	font-size: 13px;
}

.selectForm_btn,
.selectClass_btn{
	display: table;
	font-size: 30px;
	width: 9.2vw;
	height: 9vw;
	max-width: 120px;
	max-height: 120px;
}

.selectForm_btn span,
.selectClass_btn span{
	display: table-cell;
	vertical-align: middle;
}

.selectForm_btn{
	background-color: #549829;
}

.selectForm_btn.is-selected,
.selectForm_btn:hover{
	background-color: #72c13e;
}

.selectClass_btn{
	background-color: #ff9100;
}

.selectClass_btn.is-selected,
.selectClass_btn:hover{
	background-color: #ffab50;
}

.showHW_sect {
	width: 100%;
	display: table;
	margin-top: 30px;
}

.showHW_btn {
	color: #FFF;
	background-color: #ff6d00;
	cursor: pointer;
	font-size: 24px;
	text-align: center;
	display: inherit;
	margin: 0px auto;
	padding: 15px 60px;
}

.showHW_btn span{
	display: table-cell;
	vertical-align: middle;
}

.showHW_btn:hover {
	background-color: #ff9b50;
}

.folder {
	max-width: 47%;
	float: left;
	margin: 4px;
	border: 1px solid #838383;
	height: 315px;
	width: 31vw;
}

.videoGroup video {
	width: 100%;
	max-height: 78%;
}

.folder a {
	width: 100%;
	height: 100%;
	padding: 11px;
	position: relative;
	overflow: hidden;
}

.folder a:hover p{
	color: #FF6D00;
}

.folder .album_thumbnail {
	width: 90%;
	height: 80%;
	display: block;
	/*margin: 12px;*/
}

.folder .album_thumbnail:before {
	content: "+";
	position: absolute;
	display: block;
	font-size: 24px;
	right: 10px;
	color: #4f9727;
	top: 5px;
}

.folder .staff_title p,
.folder .album_title p {
	color: #4e8ac8;
	font-size: 14px;
	line-height: initial;
	margin-bottom: 4px;
}

.staff_title {
	
	float: right;
	width: 39.7%;
}

.folder .staff_title p {
	margin-bottom: 4px;
	font-size: 12px;
}

.videoGroup .folder {
	padding: 10px;
}

.photoGroup .item{
	max-width: 48%;
	float: left;
	margin: 7px;
	height: 270px;
	width: 31vw;
}

.photoGroup .item a {
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}

.photoGroup .item .album_thumbnail {
	width: 100%;
	height: 100%;
	display: block;
}


.grouping {
	position: relative;
	overflow: auto;
}
.staffDetail .loadingImg {
	border: none;
	width: 20%;
}

.staffGroup,
.videoGroup,
.photoGroup {
	overflow-y: hidden;
}

.staff_content img {
	width: auto;
	width: initial;
	border: 0px;
	border: initial;
}

.staffGroup .album_thumbnail:before {
	bottom: 10px;
	top: initial;
}

.staffGroup .album_thumbnail {
	width: 55.1%;
	height: 100%;
	margin-bottom: 12px;
	float: left;
}

.numNavGp {
	position: relative;
	height: 30px;
	margin-top: 7px;
}

.numNav {
	display: block;
	right: 10px;
	position: absolute;
}

.numNav ul {
	display: inline-flex;
	display: -ms-inline-flexbox;
	display: -webkit-inline-flex;
}

.numNav li {
	margin: 0px 6px;
	cursor: pointer;
}
.numNav li::before {
	display: none;
}
.numNav li.curr {
	color: #FF6D00;
}
.numNav li:hover {
	color: #FF6D00;
}

.tagBtnGroup {
	display: block;
	position: relative;
}

.backBtn,
.submit_btn,
.tagBtn {
	color: #FFF;
	height: 38px;
	padding: 0px 23px;
	outline: medium none;
	border: 0px none;
	line-height: 35px;
	font-size: 18px;
	text-decoration: none;
	transition: all 0.1s linear 0s;
	background-color: #FF6D00;
	cursor: pointer;
	margin: 12px 5px;
	margin-top: 0px;
	white-space: nowrap;
	display: inline-block;
}

.backBtn {
	margin-top: 20px;
}

.tagBtn:hover {
	background-color: #FFA723;
}

.albumDetail p{
	margin-bottom: 0px;
	margin-top: 5px;
}

/* Footer */
.footer {
	width: 100%;
	margin-top: 10px;
	padding: 16px;
	display: inline-block;
}

.footer .content{
	padding: 16px 1px;
}

.footer .content>div{
	display: inline-flex;
	display: -ms-inline-flexbox;
	display: -webkit-inline-flex;
	white-space: nowrap;
	padding: 2px 11px;
}

.footer .copyright {
	text-align: center;
	/*margin: 10px 0px;*/
}


.tabMenu {
	background-color: #ff3924;
	color: #FFF;
	padding: 0px 10px;
	padding-top: 10px;
	border-radius: 4px 4px 0px 0px;
	-moz-border-radius: 4px 4px 0px 0px;
	-webkit-border-radius: 4px 4px 0px 0px;
	overflow-x: auto;
	overflow-y: hidden;
	display: block;
	height: 48px;
	position: relative;
}

.tabMenuContainer {
	display: flex;
	display: -ms-inline-flexbox;
	display: -webkit-inline-flex;
	overflow-x: auto;
	overflow-y: hidden;
	padding-bottom: 30px;
}

.tabMenu .hscroll_btn{
	top: 13px;
	height: 66%;
	width: 39px;
	position: absolute;
	cursor: pointer;
	background-color: RGBA(0, 0, 0, 0);
	opacity: 0;
	margin: 0px 11px;
}
	
.tabMenu .hscroll_btn.scrollL{
	left: -6px;
	background: url("../images/arrow_left.gif") no-repeat;
	background-size: 50% 90%;
	background-position: center left;
}
.tabMenu .hscroll_btn.scrollR{
	right: -6px;
	background: url("../images/arrow_right.gif") no-repeat;
	background-size: 50% 90%;
	background-position: center right;
}
.tabMenu .hscroll_btn:hover {
	opacity: 0.5;
}

.tabBtn {
	margin: 0px 3px;
	background-color: #b22919;
	padding: 10px 17px;
	border-radius: 4px 4px 0px 0px;
	-moz-border-radius: 4px 4px 0px 0px;
	-webkit-border-radius: 4px 4px 0px 0px;
	cursor: pointer;
	white-space: nowrap;
}

.tabBtn.curr{
	color: #b22919;
	background-color: #fff;
}


.tabBtn:not(.curr):hover {
	background-color: #cf2511;
}

.tabContentContainer {
	background-color: #FFF;
	padding: 10px;
	border: 1px solid #DADADA;
	border-top: none;
}


/* Outer */
.popup {
	width:100%;
	height:100%;
	display:none;
	position:fixed;
	top:0px;
	left:0px;
	background:rgba(0,0,0,0.75);
	z-index: 600;
}

/* Inner */
.popup-inner {
	/*! max-width:700px; */
	width:auto;
	padding:9px;
	position:absolute;
	top:50%;
	left:50%;
	-webkit-transform:translate(-50%, -50%);
	transform:translate(-50%, -50%);
	box-shadow:0px 2px 6px rgba(0,0,0,1);
	border-radius:3px;
	background:#FFF;
}

.popup-loading {
	background: url("../images/loading_spinner.gif") no-repeat;
	background-size: 100% 100%;
	
	width: 80px;
	height: 80px;
}

.popup-inner img{
	border: 0px;
	display: block;
	width: auto;
	height: auto;
	max-height: 80vh;
	max-width: 80vw;
}

.popup-content p {
	margin: 10px;
}


.popup-inner.center_text p{
	font-size: 5vw;
}

.popup-inner .popupChgImgBtn {
	position: absolute;
	top: 50%;
	cursor: pointer;
	height: 7%;
	width: 5%;
	min-width: 30px;
	min-height: 27px;
}

.popup-inner .prevImgBtn {
	background: url("../images/arrow_left_w.gif") no-repeat;
	background-size: auto 100%;
	background-position: left;
	left: -4.2vw;
}

.popup-inner .nextImgBtn {
	background: url("../images/arrow_right_w.gif") no-repeat;
	background-size: auto 100%;
	background-position: right;
	right: -4.2vw;
}

.videoGroup iframe {
	width: 100%;
	height: 80%;
}

/* Close Button */
.popup-close {
	width:30px;
	height:30px;
	padding-top:4px;
	display:inline-block;
	position:absolute;
	top:0px;
	right:0px;
	transition:ease 0.25s all;
	-webkit-transform:translate(50%, -50%);
	transform:translate(50%, -50%);
	border-radius:1000px;
	background:rgb(0, 0, 0);
	font-family:Arial, Sans-Serif;
	font-size:20px;
	text-align:center;
	line-height:100%;
	color:#FFF;
}

.popup-close:hover {
	-webkit-transform:translate(50%, -50%) rotate(180deg);
	transform:translate(50%, -50%) rotate(180deg);
	background:rgb(0, 0, 0);
	text-decoration:none;
}

.is-hide {
	display: none;
}

.input {
    position: relative;
    display: block;
}

.tooltip {
	position: absolute;
	z-index: 1;
	left: -9999px;
	padding: 2px 8px 3px;
	font-size: 1.6vw;
	line-height: 17px;
	font-weight: 400;
	background: rgba(0, 0, 0, 0.9);
	color: #fff;
	opacity: 1;
	transition: margin 0.3s, opacity 0.3s;
	-o-transition: margin 0.3s, opacity 0.3s;
	-ms-transition: margin 0.3s, opacity 0.3s;
	-moz-transition: margin 0.3s, opacity 0.3s;
	-webkit-transition: margin 0.3s, opacity 0.3s;
}

.tooltip:after {
	content: '';
	position: absolute;
}

.tooltip-bottom-left {
	top: 100%;
	margin-top: 15px;
}

.tooltip-bottom-left:after {
	bottom: 100%;
	left: 16px;
	border-right: 4px solid transparent;
	border-bottom: 4px solid rgba(0, 0, 0, 0.9);
	border-left: 4px solid transparent;
}

.showtooltip {
	opacity: 1;
	left: auto;
	margin-top: 5px;
}

.input input:focus+.tooltip-bottom-left {
	right: auto;
	left: -9999px;
	margin-top: 15px;
	opacity: 0;
}

.input input:focus+.tooltip-bottom-left {
	left: 100%;
	margin-left: 5px;
}

textarea:focus,
input:focus {
    border-color: #FF6D00;
}

@media screen and (max-width: 1200px) {
	.catBrowser-items .subNav li a{
		padding: 23px 1.8vw;
	}
	.subPage-nav p {
			font-size: 1.2vw;
	}
	
	.folder {
		margin: 0.3vw;
		height: 19vw;
		width: 22vw;
		max-width: 32%;
		opacity: 1;
	}

	.folder a {
		padding: 11px;
	}

	.folder a:hover p{
		color: #FF6D00;
	}

	.folder .album_thumbnail {
		margin-bottom: 0.6vw;
	}

	.folder .album_thumbnail:before {
		font-size: 2vw;
		right: 0.9vw;
		top: 0.3vw;
	}
	
	
	.staffGroup .album_thumbnail:before {
		top: initial;
	}


	.folder .album_title p {
		font-size: 1.4vw;
		margin-bottom: 0.1vw;
	}
	
	.photoGroup .item{
		height: 13vw;
	}
	
}


@media screen and (max-width: 1000px) {
	#main {
		padding: 0px 4%;
	}
	
	.president_msg_topic_section li{
		font-size: 1.6vw;
	}
	
	.news_topic_section {
		font-size: 14px;
	}
	.catBrowser-items .subNav li a{
		padding: 23px 1.1vw;
	}
	.selectSchDay_wkDay {
		font-size: 2.5vw;
	}

	.selectSchDay_Day,
	.selectSchDay_schDay{
		font-size: 1.5vw;
	}
	
	.selectForm_btn,
	.selectClass_btn{
		font-size: 3vw;
	}
	.showHW_btn {
		font-size: 2.2vw;
	}
	

	.sch_photo_slider .photo p,
	.sch_video_slider .photo p{
		font-size: 1.7vw;
	}

}

@media screen and (max-width: 800px) {
	.president_msg_topic_section li {
			font-size: 12px;
	}
	
	.photoGroup .item{
		width: 19.2vw;
	}
}

@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	.subPage-left-panel li.curr li{
		margin-left: -30px;
	}
}