/********
body
********/
body {
	/* background-image: url(../media/site/tex_01.jpg); */
	/* background-position: left top; */
	/* background-repeat: no-repeat; */
	/* background-attachment: fixed; */
	color: #3c3a38;
	background-color: #f0eeed;
}

.eng {
	display: none;
}

::selection {
	color: white;
	background-color: #1f9681;
}

/********
background		#f0eeed
main red		#aa1329
vis plane		#e4dada
dark red		#8d0b1e
light red		#bc253b
text			#3c3a38
dark-text		#191614
border			#7a7775
lightRed		#ff6666
Gold			#ffc107
lightBlue		#69c4f7
lightGreen		#56dc6c
darkGreen1		#149268
darkGreen2		#399a2c
darkGreen3		#149292
blueTone1		#c9e3f1
blueTone2		#cedff3
blueTone3		#d3d7f1
greenTone1		#b0f5c4
greenTone2		#a9efd7
greenTone3		#c7f1c4
statement1		#8265d0
statement2		#656fd0
statement3		#268abb
speedSocial		#ea7d8d
orange			#ff8400
***********/

/**********
home-hero
*********/
.home-hero {
	position: relative;
	width: 100%;
	height: 100vh;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
	z-index: -99;
	/* background-attachment: fixed; */

	/* background-color: gold; */
}


@media (min-width: 768px) {
	.home-hero {
		height: 80vh;
	}
}


/*********
LOGO
**********/
.header-wrap {
	position: fixed;
	width: 100%;
	left: 0;
	z-index: 9999;
	transition: 0.3s;
}

.head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 10px;
}

.head a {
	display: flex;
	align-items: center;
	transition: 0.2s;
}

.head a:hover {
	filter: drop-shadow(0 0px 4px white);
}

.logo {
	width: 5em;
	margin: 0 0.5em 0 0;
	transition: 0.3s;
}

.logo-svg,
.logo-svg-word {
	fill: white;
	transition: 0.3s;
}

.logo-word-wrap {
	display: block;
}

.logo-word-chi { width: 8em; }
.logo-word-eng { width: 9em; }

.logo-word-chi,
.logo-word-eng {
	line-height: 1;
}

.ico-menu {
	cursor: pointer;
	color: white;
	transition: 0.2s;
}

.ico-menu:hover {
	filter: drop-shadow(0 0px 4px white);
}


/**** SOCIAL ALWAYS ****/
.head-social-wrap {
	display: none;

	/* background-color: blue; */
}

.head-social-wrap li {
	display: inline-block;
	margin: 0 0.3em 0 0.3em;
}

.head-social-wrap li .ico {
	color: white;
	font-size: 1.7rem;
}

.head-social-wrap li a:hover .ico {
	color: white;
}

.head-social-wrap.in-menu {
	display: block;
}

.head-social-wrap.in-menu {
	margin-top: 2em;
}

.head-social-wrap.in-menu li .ico {
	color: #bbb;
}


/***
LOGO at HOME
******/
#home .head,
#home .head a {
	flex-flow: column;
	transition: 0.3s;

	/* background-color: blue; */
}

#home .logo {
	width: 9em;
	margin: 1em 0 0 0;
}

#home .logo-word-wrap {
	margin: 1em 0;
	display: flex;
	flex-flow: column;
	align-items: center;
}

#home .logo-word-chi { width: 12em; }
#home .logo-word-eng { width: 14em; }

#home .logo-word-chi,
#home .logo-word-eng {
	line-height: 1.5;
}

#home .menu-open {
	margin: 1em 0;
}


@media (min-width: 768px) {
	#home .head,
	#home .head a {
		flex-flow: row;
	}

	#home .logo {
		width: 5em;
		margin: 0 0.5em 0 0;
	}

	#home .logo-word-wrap {
		display: block;
		margin: 0;
	}

	#home .logo-word-chi { width: 8em; }
	#home .logo-word-eng { width: 9em; }

	#home .logo-word-chi,
	#home .logo-word-eng {
		line-height: 1;
	}

	#home .menu-open {
		margin: 0;
	}
}

/*******
STICKY
*******/
.header-wrap.sticky {
	background-color: rgba(170, 19, 41, 0.92);
	box-shadow: 0 5px 5px 0 rgba(0, 0, 0, 0.2);
}

.header-wrap.sticky .head .logo,
#home .header-wrap.sticky .head .logo {
	width: 3.5em;
	margin: 0 0.5em 0 0;
}

#home .header-wrap.sticky .head,
#home .header-wrap.sticky .head a {
	flex-flow: row;
}

#home .header-wrap.sticky .logo-word-wrap {
	display: block;
}

#home .header-wrap.sticky .logo-word-chi { width: 8em; }
#home .header-wrap.sticky .logo-word-eng { width: 9em; }

#home .header-wrap.sticky .logo-word-chi,
#home .header-wrap.sticky .logo-word-eng {
	line-height: 1;
}

#home .header-wrap.sticky .menu-open {
	margin: 0;
}

@media(min-width: 768px) {
	.header-wrap.sticky .head .head-social-wrap {
		display: inherit;
	}
}


@media (min-width: 1260px) {
	.head,
	#home .head {
		width: 1260px;
		margin: 0 auto;
	}
}


/***********
NAVIGATION
************/
.menu-wrap {
	padding: 2.1em 0.6em;
	text-align: center;
	height: 100%;

	/* background-color: midnightblue; */
}

.menu-center-wrap {
	height: 80%;
	display: flex;
	align-items: center;
	justify-content: center;

	/* background-color: green; */
}

.menu-center {
	width: 100%;
	/* background-color: skyblue; */
}

.menu-nav-btn-wrap {
	display: flex;
	color: #bbb;
	padding: 0

	/* background-color: purple; */
}

#lang {
	display: flex;
	cursor: pointer;

	/* background-color: orange; */
}

#lang span:nth-child(2) {
	margin: auto 0 auto 10px;

	/* background-color: pink; */
}

#lang:hover span,
.ico-close:hover {
	color: white;
}

.menu-close {
	flex: 1;
	text-align: right;

	/* background-color: seagreen; */
}

.ico-close {
	cursor: pointer;
}

.menu {
	font-size: 1.2rem;
	line-height: 1.4;
	display: flex;
	flex-flow: column wrap;
	align-items: center;
	justify-content: flex-start;

	/* background-color: blue; */
}

.menu li {
	text-align: left;
	display: inline-block;
}

.menu li a {
	display: inline-block;
	margin: -1px 0 0 0;
	padding: 0.3em 1em;
	color: #bbb;
	text-transform: capitalize;

	/* border: 1px solid #777; */
}

.menu li a:hover {
	color: white;
}




@media (min-width: 768px) {
	.menu {
		height: 12em;
		padding: 0 30%;
	}
}

@media (min-width: 1260px) {
	.menu-wrap {
		padding: 40px 0;
	}

	.menu-nav-btn-wrap {
		width: 1220px;
		margin: 0 auto;
	}
}


/**********
SECTION
*********/
.page-title,
.content-type1-title {
	margin-bottom: 3em;
	text-transform: capitalize;
	position: relative;
	overflow: hidden;
}

/*curve*/
/* .page-title:before {
	content: '';
	position: absolute;
	padding-right: 80%;
	height: 140%;
	top: -10em;
	left: 40%;
	mix-blend-mode: overlay;
	border-bottom-left-radius: 50%;
	border-top-left-radius: 50%;
	box-shadow: 0 0 0 80em #8c082b;
	z-index: -1;
} */

/*slanted*/
/*.page-title:after {
	content: '';
	position: absolute;
	background-color: #8c082b;
	width: 90%;
	height: 100%;
	top: 0;
	left: -50%;
	transform: skewX(25deg);
	mix-blend-mode: overlay;
	z-index: -1;
}*/


.page-title h1,
.artic-type1-title h1,
.artic-type1-title h2,
.artic-type1-title h3,
.artic-type2-title h1,
.artic-type2-title h2,
.artic-type2-title h3,
.artic-type3-title h1,
.artic-type3-title h2,
.artic-type3-title h3 {
	position: relative;
	text-align: center;
	padding-bottom: 1em;
}

.artic-type2-title h2 .sub {
	display: block;
	font-size: 1.2rem;
}

.artic-type1-title {
	flex: 1 0 100%;
}

.page-title h2 {
	text-align: center;
	margin-top: -1em;
}

.page-title.hero {
	padding: 14em 1em 3em 1em;
	width: 100%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	background-blend-mode: luminosity;
	z-index: -9;
}

.page-title.hero h1,
.page-title.hero h2 {
	color: white;
}


/********
artic-type3
*********/
.artic-type3-wrap {
	display: block;
}

.artic-type3-wrap h4 {
	padding-top: 1em;
}

.author-wrap {
	display: block;
	text-align: center;
	padding-bottom: 2em;

	/* background-color: gold; */
}

.author-img {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	border-radius: 50%;
	width: 70%;
	padding-bottom: 70%;
	margin: 0 auto;
}

.artic-single-plane { position: relative; }

.artic-single-plane:before {
	content: '';
	background-color: #c9e3f1;
	position: absolute;
	z-index: -9;
	top: 25%;
	left: 0;
	width: 75%;
	height: 65%;
}

@media (min-width: 768px) {
	.artic-type3-wrap {
		display: flex;
		justify-content: space-between;
	}

	.author-wrap {
		flex: 0 1 40%;
	}

	.artic-type3-wrap .cols {
		flex: 0 1 60%;
	}
}



/*********
QUOTE
********/
.quote {
	font-size: 1.2rem;
	background-color: #ffc107;
	padding: 1em 1em;
	margin: 1em 0;
	position: relative;
}

.quote:before,
.quote:after {
	position: absolute;
	font-size: 8rem;
	font-family: Arial;
	color: #ca9b12;
}

.quote:before {
	content: '\201C';
	top: -0.2em;
	left: 0.2em;
}
.quote:after {
	content: '\201D';
	bottom: -0.5em;
	right: 0.2em;
}

.quote p {
	padding-left: 3.5em;
	padding-right: 3.5em;
}

.quote span {
	display: block;
	text-align: center;
	font-size: 1rem;
}


/**********
ABOUT
***********/
.about-wrap {}

.about-wrap img {
	width: 100%;
	padding: 4em 0;
}

.about1,
.about2,
.about3,
.about4 {
	position: relative;
}

.about1:before,
.about3:before,
.about4:before {
	content: '';
	position: absolute;
	display: block;
	z-index: -9;
}

.about1:before {
	top: 40%;
	left: 0;
	width: 85%;
	height: 350%;
	background-color: #c9e3f1;
}

.about3:before {
	top: -8%;
	right: 0;
	width: 85%;
	height: 75%;
	background-color: #cedff3;
}

.about4:before {
	top: 45%;
	left: 0;
	width: 70%;
	height: 80%;
	background-color: #d3d7f1;
}

@media (min-width: 768px) {
	.about1 {
		margin-bottom: 2em;
	}

	.about1 p { padding: 0 40% 0 20%; }
	.about2 p { padding-right: 15%; }
	.about3 p { padding-left: 22%; }
	.about4 p { padding-right: 25%; }
	.about5 p { padding: 0 60% 0 10%; }

	.flex768 {
		display: flex;
		flex-flow: row nowrap;
		justify-content: space-between;
		align-items: center;
	}

	.flex768 > div {
		flex-shrink: 1;
	}

	.flexbasis30p { flex-basis: 30%; }
	.flexbasis40p { flex-basis: 40%; }
	.flexbasis50p { flex-basis: 50%; }
	.flexbasis70p { flex-basis: 70%; }

	.flex-order1 {
		order: 1;
	}
}



/***************
ARTICLE TYPE 1
***************/
.artic-type1-wrap {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;

	/* background-color: cadetblue; */
}

.artic-type1-content {
	/* background-color: plum; */
}

.list-big-num {
	counter-reset: count;
}

.list-big-num > li {
	margin: 8em 0;
	padding: 1em 1.8em 1em 2em;
	position: relative;
	color: white;
	background-color: #3e98dc;
}

.list-big-num > li:nth-child(4n+2) { background-color: #8265d0; }
.list-big-num > li:nth-child(4n+3) { background-color: #656fd0; }
.list-big-num > li:nth-child(4n+4) { background-color: #268abb; }

.list-big-num > li:before {
	counter-increment: count;
	content: counter(count, decimal-leading-zero);

	font-family: 'Montserrat';
	position: absolute;
	font-size: 5rem;
	font-weight: 800;
	color: #3e98dc;
	z-index: -99;
	top: -1.15em;
	left: -0.135em;
}

.list-big-num > li:nth-child(4n+2):before { color: #8265d0; }
.list-big-num > li:nth-child(4n+3):before { color: #656fd0; }
.list-big-num > li:nth-child(4n+4):before { color: #268abb; }

.artic-visual1 { position: relative; }

.artic-visual1:before {
	content: '';
	position: absolute;
	display: block;
	z-index: -9;
	top: -20%;
	right: 0;
	width: 65%;
	height: 140%;
	background-color: #c9e3f1;
}

.artic-visual2 {
	background-color: #ea7d8d;
	padding: 4em 0;
}

.purpose-text {}

.purpose-img {
	flex: 0 1 100%;
	padding-bottom: 50%;
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
}


/*768*/
@media (min-width: 768px) {
	.artic-type1-wrap {
		flex-wrap: nowrap;
		justify-content: space-between;
	}

	.artic-type1-title {
		flex-basis: 5%;
		flex-shrink: 1;
		writing-mode: vertical-lr;
	}

	.artic-type2-title {
		flex-basis: 5%;
		flex-shrink: 1;
		padding: 0 0.7em;
	}

	.artic-type1-title span.eng {
		text-orientation: upright;
		letter-spacing: -20px;
	}

	.artic-type1-title h1,
	.artic-type1-title h2,
	.artic-type2-title h1,
	.artic-type2-title h2 {
		text-align: left;
	}

	.artic-type1-content {
		padding-top: 0;
		flex-basis: 80%;
	}

	.w768-paddR50p {
		padding-right: 50%;
	}

	.list-big-num {
		display: flex;
		flex-flow: row wrap;
		justify-content: space-between;
	}

	.list-big-num > li {
		flex-basis: 40%;
		margin: 10% 0;
	}

	.purpose-text {
		padding-left: 4em !important;
	}

	.purpose-img {
		flex: 0 1 65%;
		margin: -20em 0 0 4em;
		padding-bottom: 70%;
		background-position: center center;
	}
}


/**********
SEMINARY NEWS
************/
.semnews-wrap {
	position: relative;
	padding-bottom: 8em;
}

.semnews-wrap:before {
	content: '';
	position: absolute;
	background-color: #b0f5c4;
	top: 20%;
	right: 0;
	width: 85%;
	height: 70%;
}

.semnews-card {
	position: relative;
}

.semnews-cover {
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	width: 100%;
	padding-bottom: 60%;
}

.semnews-title {
	position: absolute;
	bottom: 2em;
	left: 0;
	padding: 1.5em 3em;
	background-color: white;
}

.semnews-more {
	text-align: right;
	padding-top: 2em;
}

.semnews-card a { color: #3c3a38; }
.semnews-card a:hover { color: #aa1329; }


@media (min-width: 768px) {
	.semnews-card {
		margin-top: -5em;
	}

	.semnews-cover {
		width: 70%;
		padding-bottom: 35%;
		margin-left: 30%;
	}

	.semnews-title {
		margin-left: 25%;
	}

	.semnews-latest-head {
		width: 25%;
	}
}



/***********
FACULTIES
***********/
.fac-cat-wrap {
	padding-bottom: 60px;
	position: relative;
}

.fac-title {
	text-align: left;
}

.fac-title h2 {
	padding: 0.5em 1em;
	display: inline-block;
	background-color: white;
	/* opacity: .5; */
}

.list-fac {
	counter-reset: fac;
	padding-top: 2em;
	position: relative;
	/* background-color: gold; */
}

/* vertical */
.list-fac:before {
	content: '';
	position: absolute;
	width: 15px;
	height: 10em;
	bottom: -7em;
	left: 16px;
	background-color: white;
	z-index: -9;

	/* opacity: .5; */
}

.list-fac li {
	margin: 2em 1em 2em 3.5em;
	padding: 2.5em 0;
	position: relative;

	/* opacity: .5; */
	/* background-color: seagreen; */
}

.list-fac li a {
	color: #393a41;
}

.list-fac li:before {
	counter-increment: fac;
	content: counter(fac, decimal-leading-zero);

	position: absolute;
	font-family: 'Montserrat';
	font-size: 5rem;
	font-weight: 800;
	color: white;
	z-index: -99;
	top: -0.65em;
	left: -0.15em;
	color: #aa1329;
}

.list-fac li h3 {
	padding: 0.5em 1em;
	background-color: #aa1329;
	color: white;
	position: relative;
}

/* vertical */
.list-fac li h3:before {
	content: '';
	position: absolute;
	width: 15px;
	height: 180%;
	top: -160px;
	background-color: white;
	left: -40px;
	z-index: -99;
}

.fac-cat-wrap:nth-child(4n+1) .list-fac li h3 { background-color: #bc253b; }
.fac-cat-wrap:nth-child(4n+2) .list-fac li h3 { background-color: #ff8400; }
.fac-cat-wrap:nth-child(4n+3) .list-fac li h3 { background-color: #656fd0; }
.fac-cat-wrap:nth-child(4n+4) .list-fac li h3 { background-color: #149268; }

.fac-cat-wrap:nth-child(4n+1) .list-fac li:before { color: #bc253b; }
.fac-cat-wrap:nth-child(4n+2) .list-fac li:before { color: #ff8400; }
.fac-cat-wrap:nth-child(4n+3) .list-fac li:before { color: #656fd0; }
.fac-cat-wrap:nth-child(4n+4) .list-fac li:before { color: #149268; }


/* vertical */
.list-fac li h3:after {
	content: '';
	position: absolute;
	background-color: white;
	width: 15px;
	top: 0;
	bottom: -31px;
	left: -1.55em;
	z-index: -9;
	/* opacity: .5; */
}

.fac-objtv {
	padding: 1em 1.7em;
	background-color: white;
	position: relative;
}

/* horizontal */
.fac-objtv:before {
	content: '';
	position: absolute;
	background-color: white;
	height: 15px;
	width: 4em;
	top: 1em;
	left: -2em;
	z-index: -9;
	/* opacity: .5; */
}

/* vertical */
.fac-objtv:after {
	content: '';
	position: absolute;
	background-color: white;
	width: 15px;
	top: 1em;
	bottom: -2em;
	left: -40px;
	z-index: -9;

	/* opacity: .5; */
}

.fac-cat-wrap:last-child .list-fac:before { width: 0; }
.fac-cat-wrap:last-child .fac-objtv:after { width: 0; }

@media(min-width:768px) {
	.fac-title {
		text-align: center;
	}

	/* right column */
	.fac-cat-wrap:nth-last-of-type(even) .list-fac {
		margin-left: 50%;
	}
	.fac-cat-wrap:nth-last-of-type(even) .list-fac:before {
		left: 0;
	}
	.fac-cat-wrap:nth-last-of-type(even) .list-fac li {
		margin-left: 2.5em;
	}
	.fac-cat-wrap:nth-last-of-type(even) .list-fac li:after {
		left: -2.5em;
	}
	.fac-cat-wrap:nth-last-of-type(even) .list-fac .fac-objtv:after {
		left: -2.5em;
	}
	.fac-cat-wrap:nth-last-of-type(even) .list-fac .fac-objtv:before {
		left: -2em;
	}

	/* left column */
	.fac-cat-wrap:nth-last-of-type(odd) .list-fac {
		margin-right: 50%;
	}
	.fac-cat-wrap:nth-last-of-type(odd) .list-fac:before {
		left: 100%;
	}
	.fac-cat-wrap:nth-last-of-type(odd) .list-fac li {
		margin: 2em 1.5em 2em 1em;
	}
	/* vertical */
	.fac-cat-wrap:nth-last-of-type(odd) .list-fac li h3:before {
		left: auto;
		right: -39px;
	}
	/* vertical */
	.fac-cat-wrap:nth-last-of-type(odd) .list-fac li h3:after {
		left: auto;
		right: -39px;
	}
	/* vertical */
	.fac-cat-wrap:nth-last-of-type(odd) .list-fac .fac-objtv:after {
		right: -39px;
		left: auto;
	}
	/* horizontal */
	.fac-cat-wrap:nth-last-of-type(odd) .list-fac .fac-objtv:before {
		right: -2em;
		left: auto;
	}

	/** decorate bg photo **/
	.fac-cat-wrap:nth-of-type(odd):after,
	.fac-cat-wrap:nth-of-type(even):after {
		content: '';
		position: absolute;
		/* background-color: blue; */
		background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;
		width: 55%;
		height: 90%;
		top: 5%;
		opacity: .3;
		z-index: -999;
	}

	.fac-cat-wrap:nth-of-type(odd):after { left: 40%; }
	.fac-cat-wrap:nth-of-type(even):after { right: 40%; }
}



/***************
COMMON CONTENT
***************/
.con-wrap {
	padding: 2em 0;
}

.con-wrap ul,
.normal-num-list {
	counter-reset: fac;
}

.con-wrap li {
	position: relative;
	padding: 0.5em 0 0.5em 2.5em;

	/* background-color: seagreen; */
}

.con-wrap li:before {
	counter-increment: fac;
	content: counter(fac, decimal-leading-zero);
	position: absolute;
	left: 0;
	top: 0.25em;
	color: #666;
	font-size: 1.3rem;
	font-weight: bold;
}

.con-wrap .normal-num-list > li {
	padding: 0.5em 0 0.5em 2.2em;
}
.con-wrap .normal-num-list > li:before {
	font-size: 0.9rem;
	top: 0.6em;
	counter-increment: fac;
	content: counter(fac, decimal-leading-zero)'.';
}

.con-title { padding-bottom: 1em; }
.center { text-align: center; }

.con-list-bignum {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	padding-top: 3em;
}

.con-list-bignum > li {
	margin: 1em;
	padding: 1.3em 1.4em 1.3em 1.8em;
}

.con-list-bignum > li:before {
	font-family: 'Montserrat';
	font-weight: 800;
	font-size: 5rem;
	top: -0.85em;
	left: 0;
	color: #ccc;
	z-index: -99;
}

.con-list-bignum.red > li:before { color: #ea7d8d; }


.con-list-bignum.box {
	padding-top: 1em;

	/* background-color: blue; */
}

.con-list-bignum.box > li {
	margin: 3em 1em;
	background-color: white;
}

.con-list-bignum.box.red > li {
	background-color: #aa1329;
	color: white;
}

.con-list-bignum.grow > li {
	flex-grow: 1;
}

.con-list-bignum.box > li:before {
	top: -1.2em;
	left: -0.13em;
	color: #af2438;
}

.con-list-bignum.box.red > li:before {
	color: #aa1329;
}

/**bluetone **/
.con-list-bignum.box.bluetone > li:nth-child(3n+1) {
	background-color: #8265d0;
	color: white;
}
.con-list-bignum.box.bluetone > li:nth-child(3n+2) {
	background-color: #656fd0;
	color: white;
}
.con-list-bignum.box.bluetone > li:nth-child(3n+3) {
	background-color: #268abb;
	color: white;
}
.con-list-bignum.box.bluetone > li:nth-child(3n+1):before { color: #8265d0; }
.con-list-bignum.box.bluetone > li:nth-child(3n+2):before { color: #656fd0; }
.con-list-bignum.box.bluetone > li:nth-child(3n+3):before { color: #268abb; }

/**greentone **/
.con-list-bignum.box.greentone > li:nth-child(3n+1) {
	background-color: #149268;
	color: white;
}
.con-list-bignum.box.greentone > li:nth-child(3n+2) {
	background-color: #399a2c;
	color: white;
}
.con-list-bignum.box.greentone > li:nth-child(3n+3) {
	background-color: #149292;
	color: white;
}
.con-list-bignum.box.greentone > li:nth-child(3n+1):before { color: #149268; }
.con-list-bignum.box.greentone > li:nth-child(3n+2):before { color: #399a2c; }
.con-list-bignum.box.greentone > li:nth-child(3n+3):before { color: #149292; }



.con-list-nonum > li {
	position: relative;
	padding-left: 0;
}

.con-list-nonum > li:before {
	position: absolute;
	content: '';
}



.con-col {
	/* background-color: pink; */
}

.con-col > div {
	margin: 1em 0 2em 0;

	/* background-color: yellowgreen; */
}

.con-col.space-around { justify-content: space-around; }
.con-col.space-between { justify-content: space-between; }
.con-col.space-left { justify-content: flex-start; }

.con-col.paddRL20 > div {
	padding: 1.5em 2em;
}

.con-col.box > div {
	background-color: white;
}

.con-col.box.green > div {
	background-color: #a9efd7;
}

.con-col.nowrap > div {
	white-space: nowrap;
}

.con-col.grow > div {
	flex-grow: 1;
}

.con-col.shrink > div {
	flex-shrink: 1;
}

.con-col.width50 > div {
	flex-basis: 47%;
	/* background-color: seagreen; */
}

.con-col.inc-mobile {
	display: flex;
}

.con-btn-wrap:after {
	content: '';
	display: table;
	clear: both;
}

.con-btn-wrap > div {
	float: left;
	margin: 1em 1.5em 0 0;
}

.con-btn-wrap > div:last-child {
	margin-right: 0;
}

.list-style-cross li {
	position: relative;
	padding: 0.4em 0 0.4em 1.5em;
}

.list-style-cross li:before {
	content: '\25CF' !important;
	font-size: 0.7rem;
	position: absolute;
	top: 1em;
}

.nowrap {
	white-space: nowrap;
}

.thedate-wrap {
	font-size: 1.2rem;
	line-height: 1;
	font-weight: bold;
	margin: 0 auto;
	display: table;

	/* background-color: skyblue; */
}

.thedate-wrap > div {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	padding: 0 5px;

	/* background-color: yellowgreen; */
}

.thedate-wrap .year {
	display: block;
	padding: 5px 0;
}

.thedate-wrap .month {
	font-size: 1.5rem;
}

.thedate-wrap .date {
	position: relative;
	font-size: 3rem;
}

.thedate-wrap .date > i {
    font-size: 1.5rem;
    font-style: normal;
    position: absolute;
    top: 0.5em;
    right: -1em;
}

.remark-inline {
	display: inline;
	background-color: #b0f5c4;
	/* padding: 0.1em 0; */
	color: #3c3a38;
}

.star-yellow { color: yellow; }
.star-red { color: #aa1329; }

.bold { font-weight: bold !important; }

.star-1:after,
.star-2:after {
	position: absolute;
	color: yellow;
	font-size: 1.5rem;
	top: -0.5em;
	left: 1em;
}

.star-1:after { content: '\002a'; }
.star-2:after { content: '\002a\002a'; }

.list-in-bignum1 > li {
	margin-top: 0.7em;
	margin-bottom: 0.7em;
}

.list-in-bignum1 > li:before {
	color: #b0f5c4;
}

.li-bottom-2em > li { padding-bottom: 3em !important; }
.li-bottom-0em > li:last-child { padding-bottom: 0; }

.more-narrow > li {
	padding-top: 0.3em;
	padding-bottom: 0.3em;
}

.more-narrow > li:before {
	top: 0.8em;
	font-size: 0.6rem;
}

.list-style-2dot > li:before {
	content: '\00a8' !important;
	font-size: 2rem;
	top: 0.15em;
}

p.box {
	margin-top: 1em;
	padding: 1.5em 2em;
}
p.box.white {
	background-color: white;
}


@media(min-width:768px) {
	.nowrap-mobile {
		white-space: nowrap;
	}

	.con-col.nowrap-mobile > div {
		white-space: nowrap;
	}

	.con-list-bignum {
		flex-flow: row nowrap;
	}

	.flex-col-nowrap {
		flex-flow: column nowrap;
	}

	.con-list-nonum {
		display: flex;
		justify-content: space-between;
		gap: 3em;
	}

	.one-two > li { flex: 0 1 50%; }
	.one-third > li { flex: 0 1 30%; }

	.more-gap-6em { gap: 6em !important; }
	.more-gap-4em { gap: 4em !important; }

	.more-narrow > li:before {
		font-size: 0.7rem;
	}

	.con-col {
		display: flex;
	}

	.con-col.flexbasis32p > div { flex-basis: 32%; }
	.con-col.flexbasis23p > div { flex-basis: 23%; }

	.gap2p { gap: 2%; }

	.con-col.margin1em > div {
		margin: 1em;
	}

	.con-col.col2-768-col3-1260 {
		flex-wrap: wrap;
	}

	.con-col.col2-768 {
		justify-content: space-around;
		flex-wrap: nowrap;
		gap: 3em;
	}

	.con-col.col1-max-30 > div:first-child { max-width: 30%; }
	.con-col.col1-max-40 > div:first-child { max-width: 40%; }

	.con-col.col2-40-55 div:first-child { flex-basis: 40%; }
	.con-col.col2-40-55 div:last-child { flex-basis: 55%; }

	.con-col.col2-768-col3-1260 div {flex-basis: 48%; }

	.list-in-bignum1 > li {
		display: flex;
		justify-content: space-around;
	}

	.list-in-bignum1 > li > div:first-child { flex: 0 1 30%; }
	.list-in-bignum1 > li > div:last-child { flex: 0 1 65%; }

	.w50 { width: 50%; }
	.w70 { width: 70%; }
	.w100 { width: 100%; }

	.w70.center {
		margin-left: auto;
		margin-right: auto;
	}
}

@media(min-width: 1260px) {
	.con-col.col2-768-col3-1260 div {flex-basis: 31%; }
}



/*********
ACCORDION LIST
***********/
.accordion {
	overflow: hidden;
	width: 100%;

	/* background-color: gold; */
}

.accordion > li {
	padding: 0;
	margin-bottom: 1em;
	background-color: #aa1329;
	color: white;
}

.accordion > li:before {
	content: '';
}

.accordion > li > label {
	display: block;
	cursor: pointer;
	position: relative;
	transition: 0.1s;
	padding: 1em 2.5em 1em 1.5em;
}

.accordion > li > label:hover {
	background-color: rgba(0, 0, 0, 0.2);
}

.accordion > li > label:after {
	content: '\002B';
	font-size: 1.5rem;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 1.5em;
	/* border-top: 0.7em solid white;
	border-left: 0.7em solid transparent;
	border-right: 0.7em solid transparent; */
	transition: 0.3s;
}

.accordion-con-wrap {
	background-color: white;
	color: #3c3a38;
	max-height: 0;
	overflow: hidden;
	transition: 0.4s;
}

.accordion-con {
	padding: 1em 2em;
}

.accordion > li > input {
	display: none;
}

.accordion > li > input:checked ~ .accordion-con-wrap {
	max-height: 100%;
}

.accordion > li > input:checked ~ label:after {
	transform: translateY(-40%) rotate(0.5turn);
}

.bank-wrap-flex {
    display: flex;
    align-items: center;
}


.bank-wrap-flex img {
    object-fit: contain;
    height: 3.5em;
    padding-right: 0.7em;
}

@media (min-width: 768px) {
	.accordion {
		width: 50%;
		margin-right: 4%;
	}

	.accordion:last-child {
		margin-right: 0;
	}
}


/***********
POSTS
**********/
.posts-wrap {
	position: relative;

	/* background-color: pink; */
}

.post {
	width: 100%;
	position: relative;
	background-color: white;
	overflow: hidden;
}

.post-cover {
	display: block;
	width: 100%;
	padding-bottom: 50%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
}

.list-post .post-cover {
	padding-bottom: 0;
	height: 20em;
}

.post-info-wrap {
	background-color: white;
	border-left: 1em solid #aa1329;
}

.list-post .post-info-wrap {
	position: absolute;
	padding-top: 8em;
	border-left: 0;
	bottom: 0;
	width: 100%;
	color: white;
	background: linear-gradient(0deg, rgba(0,0,0,0.85) 40%, rgba(0,0,0,0) 90%);
}

.post-meta-wrap {
	display: table;
	padding: 20px 20px 10px 20px;
	font-size: 1rem;
	/* background-color: rgba(0, 0, 0, .6); */
}

.post-meta-wrap.single {
	padding: 0 0 30px 0;

	/* background-color: gold; */
}

.post-meta-type,
.post-meta-date {
	display: table-cell;
	white-space: nowrap;
}

.post-meta-date { font-size: 0.9em; }

.post-meta-type {
	text-transform: capitalize;
	width: 100%;

	/* background-color: seagreen; */
}

.post-title {
	padding: 10px 20px 20px 20px;
	/* background-color: gold; */
}


.list-post > li > a,
.pin-list-post > li > a {
	display: block;
	color: #3c3a38;
}

.list-post > li > a:hover,
.pin-list-post > li > a:hover {
	color: #bc253b;
}

.pin-list-post > li > a:hover .post-info-wrap {
	border-left: 1em solid #bc253b;
}

.list-post > li,
.pin-list-post > li {
	margin-bottom: 4em;
}

.list-post,
.pin-list-post {
	display: block;
}

.posts-more {
	text-align: right;
	margin-top: -1em;
	padding-bottom: 6em;
}


@media (min-width: 768px) {
	.list-post {
		display: flex;
		flex-flow: row wrap;
		justify-content: space-evenly;
	}

	.list-post > li {
		flex: 0 1 42%;
		margin-left: 2%;
		margin-right: 2%;
	}

	.pin-list-post {
		display: flex;
		flex-flow: row wrap;
		align-items: flex-start;
	}

	.pin-list-post > li {
		flex: 0 1 60%;
		margin-right: 40%;
		margin-bottom: 4em;
	}

	/* .pin-list-post li:nth-child(n+3) {
		margin-right: 0;
		margin-left: 40%;
	} */

	.post-meta-wrap.single .post-meta-type {
		width: auto;
		padding-right: 30px;
	}

	.post-meta-wrap.single .post-meta-date {
		width: 100%;
	}

	.latest-posts-head {
		padding-left: 2em;
	}
}

@media (min-width: 1100px) {
	.list-post > li {
		flex: 0 1 28%;
		margin-left: 1%;
		margin-right: 1%;
	}

	#home .list-post > li:first-child {
		flex: 0 1 60.5%;
	}
}


/*********
QNA at HOME
**********/
.qna-wrap {
	padding-top: 2em;
	padding-bottom: 6em;
}

.qna1,
.qna2,
.qna3 {
	display: block;
	padding-bottom: 5em;
}

.qna1visual,
.qna2visual,
.qna3visual {
	position: relative;
}

.qna1visual:before,
.qna2visual:before,
.qna3visual:before {
	content: '';
	position: absolute;
	z-index: -9;
}

.qna1visual:before {
	top: 40%;
	left: 0;
	height: 100%;
	width: 80%;
	background-color: #84f1cd;
}

.qna3visual:before {
	top: -35%;
	right: 0;
	height: 80%;
	width: 75%;
	background-color: #9bf995;
}

.qna-text {
	flex: 0 1 60%;
	padding: 1.5em;
}

.qna-text h4 {
	color: #bc253b;
}

.qna-img {
	flex: 0 1 40%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	padding-bottom: 50%;
}

.signup-home {
	text-align: center;
}

.call-action {
	font-size: 1.6rem;
}

@media (min-width: 768px) {
	.qna1,
	.qna2,
	.qna3 {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.qna2 .qna-text {
		order: 1;
	}

	.qna-text {
		flex-basis: 40%;
	}

	.qna-img {
		flex-basis: 50%;
		padding-bottom: 40%;
	}

	.qna2 .qna-img {
		flex-basis: 35%;
		padding-bottom: 65%;
	}

	.qna2 .qna-text {
		flex-basis: 55%;
	}
}

@media (min-width: 1260px) {
	.qna-text {
		padding-left: 15%;
	}

	.qna2 .qna-text {
		flex-basis: 70%;
		padding-right: 20%;
	}
}



/*******
VISION
*********/
.vision-wrap {

}

.vision1,
.vision2,
.vision3 {
	display: flex;
	flex-flow: column wrap;
	justify-content: space-between;
	padding-bottom: 4em;
}

.vision-text {
	flex: 0 1 60%;
	padding: 0 1em 1em 1em;

	/* background-color: gold; */
}

.vision-text h3 {
	color: #bc253b;
}

.vision-img {
	flex: 0 1 40%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	padding-bottom: 50%;
}

.vision1visual,
.vision2visual,
.vision3visual {
	position: relative;
}
.vision1visual:before,
.vision2visual:before,
.vision3visual:before {
	content: '';
	position: absolute;
	z-index: -9;
}
.vision1visual:before {
	top: 40%;
	left: 0;
	height: 100%;
	width: 80%;
	background-color: #a9efd7;
}

.vision3visual:before {
	top: -20%;
	right: 0;
	height: 80%;
	width: 75%;
	background-color: #c7f1c4;
}

ul.zeronum {
	counter-reset: fac;
}

ul.zeronum li {
	position: relative;
	padding: 0.8em 0 0.8em 2.5em;
}

ul.zeronum li:before {
	counter-increment: fac;
	content: counter(fac, decimal-leading-zero);
	position: absolute;
	left: 0;
	top: 0.45em;
	color: #666;
	font-size: 1.3rem;
	font-weight: bold;
}

@media(min-width: 768px) {
	.vision1,
	.vision2,
	.vision3 {
		flex-flow: row nowrap;
	}

	.vision-text {
		flex: 0 1 40%;
	}

	.vision-img {
		flex: 0 1 55%;
		padding-bottom: 25%;
	}

	.vision2 .vision-text {
		order: 1;
		padding-left: 0;
		padding-right: 1em;
	}

	.vision3 .vision-img {
		flex: 0 1 40%;
	}

	.vision3 .vision-text {
		flex: 0 1 57%;
	}
}

@media(min-width: 1260px) {
	.vision-text {
		padding-left: 9em;
	}

	.vision3 .vision-text {
		padding-left: 1em;
	}
}


/********
SEARCH FIELD
***********/
.search-wrap {
	padding-bottom: 4em;
}

.search-wrap .ico.ico-search {
	font-size: 1.5rem;
	line-height: 0.9;
}

.search-field,
.search-btn {
	display: table-cell;
}

.search-btn button {
	padding: 1em 1em;
}

.search-field {
	width: 100%;
	padding-right: 5px;
}

.search-field input {
	width: 100%;
}







/***********
PAGINATION
*************/
.paginate {
	text-align: center;
	padding-top: 3em;

	/* background-color: seagreen; */
}

.paginate li {
	display: inline-block;
	font-size: 0.9rem;
	border-radius: 50%;
	margin: 0 -0.15em;

	/* background-color: skyblue; */
}

.paginate a {
	padding: 0.3em 0;
	text-align: center;
	width: 2.2em;
	display: block;
	color: #222;

	/* background-color: gold; */
}

.paginate a:hover {
	background-color: #ccc;
	border-radius: 50%;
}

a.disabled {
	pointer-events: none;
	cursor: default;
	color: #999;
}

.paginate li .ico {
	padding: 0;
	margin: 0;
	font-size: 1.2rem;
}

.pg-prev,
.pg-next {

}

.pg-active a,
.pg-active a:hover {
	color: white;
	border-radius: 50%;
	pointer-events: none;
	cursor: default;
	background-color: #aa1329;
}




/*****
SINGLE POST
************/
.in-post-cover {
	height: 480px;
	width: 100%;
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center center;
	margin-bottom: 50px;
}

.in-post-cover img {
	display: none;
}

.in-post-text {
	/* padding: 50px 0; */
}

.cols {
	column-width: 300px;
	/* column-count: 2; */
	column-gap: 5%;
}

.post-flex-one-two,
.post-flex-one-third {
	display: flex;
	flex-flow: column nowrap;
	gap: 1em;
	justify-content: space-between;
}

@media (min-width: 768px) {
	.in-post-cover {
		height: auto;
	}

	.in-post-cover img {
		display: block;
	}

	.post-flex-one-two,
	.post-flex-one-third {
		flex-flow: row wrap;
	}

	.post-flex-one-two > div,
	.post-flex-one-two > a {
		flex: 0 1 47%;
	}

	.post-flex-one-third > div,
	.post-flex-one-third > a {
		flex: 0 1 31%;
	}
}



/********
TIMELINE
*******/
.timeline > li {
	position: relative;
	display: flex;
	flex-flow: row nowrap;
	justify-content: stretch;
	align-items: flex-start;
	margin-bottom: 2.5em;

	/* background-color: pink */
}

.timeline > li a {
	display: block;
	/* background-color: gold; */
}

.timeline > li h5 {
	flex-basis: 4em;
	flex-shrink: 0;
	padding: 1em 0;
	text-align: center;
	margin-right: 1em;
	background-color: white;

	/* opacity: .5; */
}

.timeline > li ul {
	/* flex-basis: auto; */
	flex-grow: 1;
	display: flex;
	flex-flow: column nowrap;
}

.timeline > li > ul li {
	word-break: break-all;
	padding: 1.5em;
	background-color: white;
	border-bottom: 1px solid #ccc;

	/* opacity: .5; */
}

.timeline > li > ul.episode li {
	padding: 0;
}
.timeline > li > ul.episode li a {
	padding: 1.5em;
	position: relative;
}

.timeline > li > ul li:last-child {
	border-bottom: 0;
}

.timeline > li > ul:before,
.timeline > li:before {
	content: '';
	position: absolute;
	z-index: -2;
	background-color: white;
}

/*small horizontal line */
.timeline > li > ul:before {
	width: 3em;
	height: 0.5em;
	top: 2em;
	left: 3.5em;
}
/*vertical line*/
.timeline > li:before {
	width: 0.5em;
	top: 3em;
	left: 2em;
	bottom: -3em;
}
.timeline > li:last-child:before {
	height: 1px;
}

.cal-holi-break {
	background: linear-gradient(90deg, rgba(255,255,255,1) 10%, rgba(207,37,46,1) 100%);
}

.cal-highlight {
	background: linear-gradient(90deg, rgba(255,255,255,1) 0%, rgba(255,227,0,1) 100%);
}

.cal-date {
	font-size: 1rem;
	display: block;
	white-space: nowrap;

	/* background-color: lightgreen; */
}
.cal-date b {
	padding-right: 0.5em;
}

.cal-item {
	line-height: 1.5;

	/* background-color: khaki; */
}

.semnews-list-cover {
	position: absolute;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	top: 0;
	bottom: 0;
	right: 0;
	width: 20%;
	display: none;
}

@media (min-width: 583px) {
	.cal-date {
		display: table-cell;
		vertical-align: middle;
		padding-bottom: 0;
		padding-right: 1.5em;
	}
	.cal-date b {
		display: block;
	}

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

	.semnews-list-cover {
		display: block;
	}
}



@media (min-width: 768px) {
	.timeline > li {
		width: 50%;
	}

	.timeline > li:nth-of-type(even) {
		margin-left: 50%;
	}

	.timeline > li:nth-of-type(even) h5 {
		margin-left: -2em;
	}

	.timeline > li:nth-of-type(odd) ul {
		order: -1;
	}

	.timeline > li:nth-of-type(odd) h5 {
		margin-left: 1em;
		margin-right: -2em;
	}

	/*horizontal line*/
	.timeline > li:nth-of-type(odd) ul:before {
		left: auto;
		right: 1em;
	}
	.timeline > li:nth-of-type(even) ul:before {
		right: auto;
		left: 1em;
	}

	/*vertical line*/
	.timeline > li:nth-of-type(odd):before {
		left: auto;
		right: -0.3em;
	}
	.timeline > li:nth-of-type(even):before {
		left: -0.2em;
		right: auto;
	}

	.timeline > li:nth-of-type(odd) .cal-holi-break {
		background: linear-gradient(90deg, rgba(207,37,46,1) 0%, rgba(255,255,255,1) 90%);
		color: white;
	}
	
	.timeline > li:nth-of-type(odd) .cal-highlight {
		background: linear-gradient(90deg, rgba(255,227,0,1) 0%, rgba(255,255,255,1) 100%);
		color: black;
	}

	.semnews-list-cover {
		display: none;
	}

	/** calendar **/
	.timeline.calendar > li:nth-of-type(odd) ul:after,
	.timeline.calendar > li:nth-of-type(even) ul:after {
		content: '\2003';
		position: absolute;
		width: 120%;
		height: 70%;
		top: 15%;
		/* background-color: #c9e3f1; */
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		z-index: -9;
		opacity: .5;
	}

	.timeline.calendar > li:nth-of-type(odd) ul:after { left: 70%; }
	.timeline.calendar > li:nth-of-type(even) ul:after { right: 70%; }
}

@media (min-width: 980px) {
	.semnews-list-cover {
		display: block;
	}
}







/********
TEAM
*********/
.team-list li {
	padding-bottom: 120px;
}

.team-list li:last-child {
	padding-bottom: 0;
}

.team-img-wrap {
	display: block;
	text-align: center;

	/* background-color: powderblue; */
}

.team-name {
	padding-top: 30px;
}

.team-name span {
	display: block;
}

.team-name .name-eng {
	font-size: 1.2rem;
}

.team-pose {
	padding: 10px 20px 20px 20px;
	color: #777;

	/* background-color: gold; */
}

.team-pose h3 {
	font-size: 1.5rem;
	line-height: 1.5;
}

.team-img {
	width: 70%;
	border-radius: 50%;
}

.team-edu {
	padding-bottom: 20px;

	/* background-color: gold; */
}

.team-edu > ul > li,
.team-bio > ul > li {
	position: relative;
	text-align: left;
	padding-left: 20px;
	padding-bottom: 0;
}

.team-edu > ul > li:before,
.team-bio > ul > li:before {
	content: '\25CF';
	position: absolute;
	left: 0;
	top: 1.7em;
	font-size: 0.7rem;
}

.team-bio {
	padding: 20px 30px;
	background-color: white;
}

.team-list li:nth-child(3n+1) .team-bio { background-color: #d3d7f1; }
.team-list li:nth-child(3n+2) .team-bio { background-color: #c9e3f1; }
.team-list li:nth-child(3n+3) .team-bio { background-color: #cedff3; }


.team-list-guest {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-evenly;
	align-content: center;
}

.team-list-guest li {
	flex: 0 1 auto;
	margin: 0.6em 1.5em;

	/* background-color: pink; */
}



@media (min-width: 768px) {
	.team-list > li {
		display: grid;
		grid-template-rows: auto auto;
		grid-auto-rows: auto;
		grid-template-columns: 40% auto auto;
		grid-template-areas:
		"img edu edu"
		"img bio bio";
	}

	.team-img-wrap { grid-area: img; }
	.team-edu { grid-area: edu; }
	.team-bio { grid-area: bio; }
}

/* @media (min-width: 1023px) {
	.team-list li {
		grid-template-columns: 30% auto auto;
		grid-template-areas:
		"img edu edu"
		"img bio bio";
	}
} */





/***********
BXSLIDER
**********/
.hero-slider {
	position: relative;
	padding: 30px 0;
}

.slider li {
	height: 540px;
}

.slider li > a {
	position: absolute;
	display: block;
	width: 100%;
	height: 85%;
	z-index: 9999;
	background: rgba(0, 50, 50, 0);
}

.slides {
	display: block;
	background-position: center center;
	background-size: cover;
	height: 100%;
}

.slider-wrapper {

}

.slider-prev,
.slider-next {
	position: absolute;
	top: 45%;
	z-index: 999;
	cursor: pointer;
	text-align: center;
	background: rgba(0, 0, 0, 0.6);
}

.slider-prev:hover,
.slider-next:hover {
	background: rgba(30, 30, 30, 0.6);
}

.slider-prev {
	left: 0;
}

.slider-next {
	right: 0;
}

.slider-prev .ico,
.slider-next .ico {
	color: #fff;
	font-size: 2rem;
}

.slider-pager {
	position: absolute;
	bottom: 50px;
	width: 100%;
	z-index: 999;
	display: block;
	text-align: center;
}

.slider-pager .bx-pager-item {
	display: inline-block;
	margin: 0 4px;
}

.slider-pager .bx-pager-item a {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	-moz-border-radius: 50%;
	-webkit-border-radius: 50%;
	text-indent: -9999px;
	display: block;
	background: none;
	border: 1px solid white;
}

.slider-pager .bx-pager-item a:hover,
.slider-pager .bx-pager-item a.active {
	background: white;
	border: 1px solid white;
}

.slides-title {
	position: absolute;
	z-index: 9;
	top: 20px;
	left: 30px;
	max-width: 55%;
	padding: 20px 30px;
	color: white;
	background: rgba(0, 0, 0, 0.6);
}

.slides-title.right {
	right: 30px;
	left: auto;
}

.slides-title.bottom-left {
	top: auto;
	right: auto;
	left: 30px;
	bottom: 40px;
}

.slides-meta-wrap {
	font-size: 0.7rem;
	padding-top: 10px;
	display: flex;
	justify-content: space-between;
}

@media(min-width:768px) {
	.slider li {
		/* height: 45vh; */
	}
}


/*********
CALLING
**********/
.calling-wrap {
	text-align: center;
	width: 90%;
	margin: 0 auto;
	border: 2px solid #f0eeed;
	background-color: maroon;
}

.calling-row {
	display: flex;
	flex-flow: column wrap;
	width: 100%;
	justify-content: space-around;
}

.recruit-year {
	text-align: center;
	/* background-color: gold; */
}

.recruit-year > div {
	display: inline-block;
	background-color: maroon;
	border-top: 2px solid white;
	border-left: 2px solid white;
	border-right: 2px solid white;
	padding: 1em 2.5em;
	color: white;
	margin-bottom: -2px;
}

.recruit-expiry {
	padding: 1em 2em;
	color: white;
}

.open-day,
.start-day {
	padding: 1em 2em;
	color: white;
	width: 90%;
	margin: 0 auto;
	text-align: center;
	border: 2px solid #f0eeed;
	color: white;
}

.start-day { background-color: teal; }
.open-day { background-color: #aa1329; }

.open-day span:first-child {
	display: block;
}

@media(min-width: 768px) {
	.calling-row {
		flex-flow: row nowrap;
		padding: 1em 0;
	}

	.open-day,
	.start-day {
		display: flex;
		justify-content: space-around;
	}
}


/*********
BANNER
**********/
.flex-banner {
	padding-top: 0;
	padding-bottom: 2em;
	display: flex;
	flex-flow: column wrap;
	justify-content: space-between;
}

.flex-banner > div {
	padding: 2em;
	margin-bottom: 2em;
	display: flex;
	flex-flow: column wrap;
	align-items: center;
	background-color: white;
}

.flex-banner > div:nth-child(1) { background-color: #ff6666; }
.flex-banner > div:nth-child(2) { background-color: #ffc107; }
.flex-banner > div:nth-child(3) { background-color: #69c4f7; }
.flex-banner > div:nth-child(4) { background-color: #56dc6c; }

.bann-title {
	display: flex;
	justify-content: space-between;
	align-items: center;

	/* background-color: skyblue; */
}

.bann-ico .ico {
	color: white;
	font-size: 5rem;
}

.bann-ico {
	padding-right: 1em;
}

.bann-text {
	display: block;
}

@media (min-width: 768px) {
	.flex-banner {
		flex-flow: row nowrap;
	}

	.flex-banner > div {
		flex-basis: 22%;
		display: block;
		text-align: center;
	}

	.bann-title {
		flex-flow: column wrap;
	}

	.bann-ico {
		padding: 0 0 1em 0;
	}
}



/******
HOME
*******/
.hilight-wrap {
	position: relative;
}

.hilight-wrap:before {
	content: '';
	position: absolute;
	background-color: #c9e3f1;
	top: -2%;
	left: 0;
	width: 85%;
	height: 17%;
	z-index: -9;
}

.dean-talk {
	padding-bottom: 8em;
}

.dean-talk a { color: #3c3a38; }
.dean-talk a:hover { color: #bc253b; }

.dean-card {
	position: relative;
	display: block;
}

.pin-card {
	display: flex;
}

.pin-card-cover {
	width: 60%;
	padding-bottom: 60%;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;

	background-color: skyblue;
}


.pin-card-info {
	width: 40%;
	padding: 1.5em 0.5em 1.5em 1.5em;
	background-color: white;
}

.pin-card-date {
	font-size: 0.9rem;
	padding-bottom: 1em;
}

.dean-talk:before {
	content: '';
	position: absolute;
	background-color: #cedff3;
	z-index: -9;
	top: 47%;
	right: 0;
	width: 35%;
	height: 40%;
}


@media(min-width: 768px) {
	.hilight-wrap {
		flex-flow: row nowrap;
		padding-bottom: 4em;
	}

	.pin-meta-date {
		float: none;
		padding-bottom: 15px;
	}

	.dean-talk {
		position: absolute;
		top: 15%;;
		right: 0;
		width: 100%;
		pointer-events: none;

		/* background-color: blue; */
	}

	.dean-talk a {
		pointer-events: auto;
	}

	.dean-talk:before {
		top: 40%;
		right: 0;
		width: 55%;
		height: 70%;
	}

	.dean-box {
		width: 30%;
		margin-left: 70%;
	}

	.pin-card {
		display: block;
	}

	.pin-card-cover {
		width: 100%;
		padding-bottom: 100%;
	}

	.pin-card-info {
		width: 100%;
	}
}

@media(min-width: 1260px) {
	.pin-meta-date {
		float: right;
		padding: 0;
	}
}


/********
NOTICE
********/
.notice-wrap > li {
	display: flex;
	border-bottom: 2px dotted #7a7775;
	padding: 0;
	flex-flow: column nowrap;
}

.notice-date {
	white-space: nowrap;
	padding-right: 1.5em;

	/* background-color: gold; */
}

.notice-date p {
	font-size: 0.9rem;
}

.notice-title {
	padding-bottom: 1.5em;
}

.notice-wrap > li a { color: #3c3a38; }
.notice-wrap > li a:hover { color: #bc253b; }

.notice-more-wrap {
	padding-top: 2em;
	text-align: right;
}

.notice-link:hover {
	color: #bc253b;
	cursor: pointer;
}

@media(min-width: 768px) {
	.notice-wrap > li {
		align-items: center;
		flex-flow: row nowrap;
	}

	.notice-title {
		padding-top: 1.5em;
	}
}

/**********
POPUP MODAL
***********/
.modal-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(0deg, rgba(7,0,50,0.8) 0%, rgba(80,0,12,0.8) 100%);
	transition: 0.3s;
	z-index: 999999;
	display: none;
	/* visibility: hidden; */
}

.modal-flex {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	/* background-color: blue; */
}

.modal-wrap {
	background-color: ivory;
	padding: 1.5em 2em;
	max-width: 720px;
	margin: 0 10% 0 10%;
	border-radius: 3px;
}

.modal-head {
	display: flex;
	gap: 2em;
	justify-content: space-between;
	padding-bottom: 2em;
}

.modal-head > h4 {
	flex-basis: 70%;
}

.modal-close .ico-close { color: #777; }
.modal-close:hover .ico-close { color: #191614; }


/****
SOCIAL
******/
.social-wrap {
	width: 100%;
	position: relative;
	margin-bottom: 5em;

	/* background-color: blue; */
}

.social-wrap:before {
	content: '';
	background-color: #d3d7f1;
	position: absolute;
	bottom: -20%;
	height: 80%;
	right: 0;
	width: 70%;
	z-index: -9;
}

.social-card {
	padding: 3em 0;
	background-color: white;
}

.social-at-home {
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-around;
	align-items: center;
	padding: 2em 0;
}

.social-wrap .ico {
	font-size: 2.8rem;
}

@media (min-width: 768px) {
	.social-wrap {
		position: absolute;
		top: 55%;
		pointer-events: none;

		/* background-color: blue; */
	}

	.social-wrap a {
		pointer-events: auto;
	}

	.social-card {
			width: 20%;
			margin: 0 0 0 70%;
			padding-left: 2em;
	}

	.social-at-home {
		flex-wrap: wrap;
		justify-content: flex-start;
	}

	.social-at-home li {
		text-align: right;
		display: block;
		flex: 0 1 55%;
		margin-right: 45%;
		padding: 1.5em 0;

		/* background-color: pink; */
	}
}


a .ico-social_facebook { color: #3b5998; }
a:hover .ico-social_facebook { color: #5779c1; }

a .ico-social_youtube { color: #c4302b; }
a:hover .ico-social_youtube { color: #e44a45; }

a .ico-social_instagram { color: #8a3ab9; }
a:hover .ico-social_instagram { color: #a853da; }

a .ico-social_whatsapp { color: #25d366; }
a:hover .ico-social_whatsapp { color: #3af17e; }

a .ico-social_messenger { color: #0084ff; }
a:hover .ico-social_messenger { color: #2f97f9; }



/*****
ALBUM
********/
.album-touch {
	display: grid;
	grid-gap: 0.7em;
	grid-template-columns: repeat(8, 1fr);
	grid-auto-flow: dense;
	/* grid-auto-rows: minmax(20em, auto); */
}

.album-item {
	padding: 2em 2em 70% 2em;
	/* min-height: 15em; */
	background-color: #8d0b1e;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	grid-column: span 4;
	grid-row: span 1;
}

@media(min-width: 768px) {
	.album-item {
		grid-column: span 2;
		padding-bottom: 12em;
	}

	.album-item-5,
	.album-item-9,
	.album-item-12,
	.album-item-20 {
		grid-column: span 4;
		grid-row: span 2;
	}

	.album-item-6,
	.album-item-7,
	.album-item-8,
	.album-item-15,
	.album-item-17,
	.album-item-19,
	.album-item-27,
	.album-item-28 {
		grid-column: span 4;
	}

	.album-item-23,
	.album-item-26,
	.album-item-29,
	.album-item-31 {
		grid-column: span 3;
	}

	.album-item-24,
	.album-item-25 {
		grid-column: span 5;
	}

	.album-item-30 {
		grid-column: span 5;
		grid-row: span 2;
	}
}

a.album-item {
	display: inline-block;
	position: relative;
	color: blue;
	font-weight: 700;
}

a.album-item:after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: black;
	opacity: 0;
	transition: .2s;
}

a.album-item:before {
	content: '\25F1';
	position: absolute;
	color: white;
	font-size: 3rem;
	top: 50%;
	left: 50%;
	margin-top: -0.9em;
	margin-left: -0.4em;
	z-index: 9;
	opacity: 0;
	transition: .2s;
}

a.album-item:hover:after {
	opacity: .5;
}

a.album-item:hover:before {
	opacity: 1;
}


/**********
RNT POST
**********/
.album-rnt-touch {
	display: flex;
	gap: 1em;
	flex-flow: column nowrap;
}

.album-rnt-item {
	padding: 2em 2em 45% 2em;
	background-color: #8d0b1e;
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	flex: 1 0 auto;
}

.enquiries-box {
	display: inline-block;
}

.enquiries-box > div {
	margin-bottom: 2em;
}

.enquiries-box .box {
	background-color: white;
	padding: 1em 2em;
	display: inline-block;
}

@media(min-width: 768px) {
	.album-rnt-touch {
		flex-flow: row nowrap;
	}

	.album-rnt-item {
		padding-bottom: 25%;
	}

	.enquiries-box {
		display: flex;
		gap: 3em;
	}
}

/*********
CONTACT
***********/
.contact-form-wrap {
	display: block;
}

.contact-form {
	padding-bottom: 2em;
	/* background-color: pink; */
}

.contact-form > div {
	display: block;
	margin: 1em 0;
}

.contact-form > div input,
.contact-form > div textarea {
	width: 100%;
}

.contact-form > div input[type=text],
.contact-form > div input[type=email],
.contact-form > div textarea {
	border: 2px solid white;
}

.required {
	border: 2px dashed crimson !important;
}

.g-map iframe {
	height: 500px;
}

.sendit {
	margin-top: 30px;
	margin-bottom: 70px;
	padding: 30px 40px;
	background-color: white;
}

.phone-big-wrap {
	display: block;
	/* background-color: blue; */
}

.phone-big-wrap > div {
	width: 100%;
	margin: 0 auto;
	background-color: #aa1329;
	color: white;
	padding: 2em 3em;
	text-align: center;
}

.phone-big-title {
	font-size: 1.5rem;
}

.phone-big-num {
	font-size: 1.55rem;
	font-weight: 700;
	position: relative;
	margin: 0 auto;
	display: inline-block;
	padding-left: 1.5em;

	/* background-color: blue; */
}

.phone-big-num:before {
	font-family: 'icoset';
	content: '\e918';
	position: absolute;
	left: 0;
}

.phone-big-hour > span {
	padding: 0 0.5em;
}

.phone-big-hour > span:first-child {
	display: block;
}


@media(min-width: 768px) {
	.contact-form-wrap {
		display: flex;
		justify-content: space-between;
	}

	.contact-form-wrap > div {
		flex-basis: 35%;
	}

	.contact-form-wrap > div.g-map {
		flex-basis: 55%;
		padding-top: 3em;
	}

	.phone-big-wrap > div {
		width: 760px;
		display: flex;
		align-items: center;
		justify-content: space-around;
		flex-flow: row nowrap;
	}

	.phone-big-num {
		font-size: 2.5rem;
	}

	.phone-big-hour > span:first-child {
		display: inline-block;
	}
}

@media(min-width: 1260px) {
	.g-map iframe {
		height: 470px;
	}
}



/***********
FOOTER
***********/
.footer-wrap {
	position: relative;
	overflow: hidden;
	color: white;
	padding-top: 3em;
}

.footer-wrap a {
	color: white;
}

.footer-wrap a:hover {
	filter: drop-shadow(0 0px 4px white);
}

.footer-logo {
	width: 70%;
	position: absolute;
	z-index: -99999;
	left: 15.5%;
	bottom: 20px;

	/* background-color: gold; */
}

.footer-logo-svg-word {
	fill: white;
}

.footer-svg-logo-word-chi { width: 190px; }
.footer-svg-logo-word-eng { width: 220px; }

.footer-svg-logo-word-chi,
.footer-svg-logo-word-eng {
	line-height: 1.2;
}

.footer-content-wrap {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;

	/* background-color: steelblue; */
}

.footer-address-wrap,
.footer-contact-wrap {
	flex-basis: 100%;
	padding-bottom: 2em;

	/* background-color: wheat; */
}

.footer-address-wrap p,
.footer-contact-wrap p {
	font-size: 0.9rem;
	padding-top: 0;
}

.footer-logo-word {
	padding-bottom: 15px;
}

.footer-address,
.footer-phone,
.footer-fax,
.footer-whatsapp,
.footer-email {
	position: relative;
	padding-left: 25px;
}

.footer-address:before,
.footer-phone:before,
.footer-fax:before,
.footer-whatsapp:before,
.footer-email:before {
	position: absolute;
	left: 0;
	font-family: 'icoset';
	font-size: 1rem;
	line-height: 1.4;
}

.ico-big.ico-contact_email:before,
.ico-big.ico-contact_whatsapp:before,
.ico-big.ico-contact_phone:before {
	font-size: 2rem;
}

.footer-address:before { content: '\e907'; }
.footer-phone:before,
.ico-phone:before { content: '\e90a'; }
.footer-fax:before { content: '\e909'; }
.footer-whatsapp:before,
.ico-whatsapp:before { content: '\e918'; }
.footer-email:before,
.ico-email:before { content: '\e908'; }

.footer-address {
	padding-bottom: 1em !important;
}

.footer-roadmap-wrap {
	flex-basis: 100%;
	padding-bottom: 3em;

	/* background-color: skyblue; */
}

.footer-menu {
	font-size: 1rem;
	display: flex;
	flex-flow: column wrap;
	align-content: space-evenly;
	height: 13em;

	/* background-color: lightgreen; */
}

.footer-menu li {
	text-transform: capitalize;

	/* background-color: peru; */
}

.footer-menu li a {
	display: inline-block;
	white-space: nowrap;
	padding: 0.2em 1em;
	color: white;

	/* background-color: dodgerblue; */
}

.footer-menu li a:hover {
	filter: drop-shadow(0 0px 4px white);
}

.footer-copyright p {
	padding: 0 50px 50px 50px;
	font-size: 0.8rem;
}

.footer-copyright:before {
	font-family: 'icoset';
	content: '\e90f';
	position: absolute;
	line-height: 1;
	top: 0;
	right: -50%;
	/* transform: translateX(-50%); */
	font-size: 150vw;
	z-index: -9;
	color: #bc253b;
}

.footer-copyright:after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	z-index: -99;
	background-color: #aa1329;
}


@media (min-width: 600px) {
	.footer-copyright:before {
		right: -10%;
		font-size: 100vw;
	}

	.footer-address-wrap { flex-basis: 45%; }
	.footer-contact-wrap { flex-basis: 45%; }
	.footer-roadmap-wrap { flex-basis: 100%; }
 	.footer-menu { height: 9em; }
}

@media (min-width: 980px) {
	.footer-copyright:before {
		right: -5%;
		font-size: 60vw;
	}

	.footer-address-wrap { flex-basis: 25%; }
	.footer-contact-wrap { flex-basis: 25%; }
	.footer-roadmap-wrap { flex-basis: 45%; }
}

@media (min-width: 1260px) {
	.footer-copyright:before {
		left: 50%;
		right: auto;
		font-size: 40rem;
	}

	.footer-menu { height: 7em; }
}


/************
SCROLL TO TOP
*************/
#scroll-to-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	cursor: pointer;
	z-index: 9999;
	display: none;
}





/*********
MISC
*********/
.divider100,
.divider50,
.divider20,
.divider1em,
.divider1-5em,
.divider2em,
.divider3em,
.divider5em,
.divider7em,
.divider10em,
.divider15em {
	width: 100%;
}

.divider100 { height: 100px; }
.divider50 { height: 50px; }
.divider20 { height: 20px; }
.divider1em { height: 1em; }
.divider1-5em { height: 1.5em; }
.divider2em { height: 2em; }
.divider3em { height: 3em; }
.divider5em { height: 5em; }
.divider7em { height: 7em; }
.divider10em { height: 10em; }
.divider15em { height: 15em; }

div.btn,
a.btn,
a.btn-signup,
a.btn-more,
a.btn-download {
	position: relative;
	display: inline-block;
	margin: 0.5em 0;
	background-color: #3c3a38;
	color: white;
	line-height: 1.7;
}

div.btn,
a.btn  { padding: 0.7em 2em; }

a.btn-signup,
a.btn-more,
a.btn-download { padding: 1.2em 1.5em 1.2em 3.5em; }

div.btn:hover,
a.btn:hover,
a.btn-signup:hover,
a.btn-more:hover,
a.btn-download:hover { background-color: #191614; }

a.btn-signup:before,
a.btn-more:before,
a.btn-download:before {
	position: absolute;
	top: 0.6em;
	left: 1.1em;
	font-family: 'icoset';
	font-size: 1.5rem;
}

a.btn-signup:before { content: '\e914'; }
a.btn-more:before { content: '\e902'; }
a.btn-download:before { content: '\e90b'; }

div.btn.red,
a.btn.red,
a.btn-signup.red,
a.btn-more.red,
a.btn-download.red { background-color: #aa1329; }

div.btn.red:hover,
a.btn.red:hover,
a.btn-signup.red:hover,
a.btn-more.red:hover,
a.btn-download.red:hover { background-color: #bc253b; }

div.btn.white,
a.btn.white {
	background-color: rgba(0,0,0,0.3) !important;
	color: white;
	border-radius: 5px;
	border: 2px solid white;
	transition: 0.2s;
}

div.btn.white:hover,
a.btn.white:hover {
	background-color: rgba(0,0,0,0.5) !important;
}

.bgcolor1 {
	background-color: #cedff3;
}


/*************
SPEED CONTACT BTN
*****************/
.speed-contact-title { flex: 1 0 100%; }
.speed-contact-con { flex: 1 0 50%; }

.speed-contact-wrap > li {
	margin: 2em 0;
}

div.btn2,
a.btn2 {
	position: relative;
	background-color: white;
	color: #aa1329;
	width: 100%;
	display: inline-block;
	padding: 1.7em 0;
}

.speed-contact-whatsapp,
.speed-contact-email,
.speed-contact-messenger {
	position: relative;
	font-size: 1rem;
	padding-left: 42% !important;
}

.speed-contact-whatsapp:before,
.speed-contact-email:before,
.speed-contact-messenger:before {
	font-family: 'icoset';
	font-size: 2rem;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 30%;
}

.speed-contact-whatsapp:before { content: '\e918'; }
.speed-contact-email:before { content: '\e908'; }
.speed-contact-messenger:before { content: '\e917'; }

@media (min-width: 768px) {
	.speed-contact-wrap {
		display: flex;
		justify-content: space-around;
	}

	.speed-contact-title,
	.speed-contact-con {
		flex: 1 1 auto;
	}

	div.btn2,
	a.btn2 {
		padding: 1.7em 1.2em 1.7em 4.5em !important;
	}

	.speed-contact-whatsapp:before,
	.speed-contact-email:before,
	.speed-contact-messenger:before {
		left: 11%;
	}
}



/**********
VIDEO
**********/
.video-wrapper {
	position: relative;
	padding-bottom: 56.25%; /* 16:9 */
	padding-top: 0px;
	height: 0;
	margin-bottom: 20px;
}

.video-wrapper iframe {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.img-full-width img {
	width: 100%;
}

.padd-bottom20 { padding-bottom: 1.5em; }
.padd-bottom40 { padding-bottom: 40px; }

.padd10x20 { padding: 0.6em 1.25em; }
.padd20x30 { padding: 1.25em 2em; }
.paddtop220 { padding-top: 220px; }
.paddRL10 {
	padding-left: 0.6em !important;
	padding-right: 0.6em !important;
}
.paddRL15 {
	padding-left: 1em !important;
	padding-right: 1em !important;
}
.paddRL30 {
	padding-left: 2em !important;
	padding-right: 2em !important;
}
.paddRL50 {
	padding-left: 3em !important;
	padding-right: 3em !important;
}

.paddbox { background-color: white; }
.paddbox.red {
	background-color: #aa1329;
	color: white;
}

.align-center {
	text-align: center;
}


.paddTB2em {
	padding-top: 2em;
	padding-bottom: 2em;
}


@media(min-width:768px) {
	.img-2col-desktop img {
		width: 50%;
		float: left;
	}

	.wrap768 {
		width: 768px;
		margin: 0 auto;
	}
}

@media(min-width:1260px) {
	.nowrap1260 {
		white-space: nowrap;
	}

	.wrap1260 {
		width: 1260px;
		margin: 0 auto;
	}
}

.con-justify {
	text-align: justify;
	word-break: break-all;
}

.con-col.space-even {
        justify-content: space-around;
    }

.admission-year {
    position: relative;
    background-color: #8d0b1e;
    padding: 1em 2em;
    color: white;
    margin: 1em auto 4em auto;
    display: table;
}

.admission-year:after {
    content: '\25bc';
    position: absolute;
    color: #8d0b1e;
    left: 50%;
    bottom: -1em;
    transform: translateX(-50%);
    font-size: 4rem;
}