@charset "UTF-8";
/*--------------------------------------------------------------
.philosophy
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	.philosophy {
		background: #fff;
		width: 100%;
		max-width: 1100px;
		margin: 0 auto 111px;
		padding: 30px 20px;
		overflow: hidden;
	}
	
	.philosophy .title {
		font-size: 23px;
		margin: 0 0 35px;
		padding: 0;
		font-weight: 500;
	}
	
	.philosophy .title span {
		display: block;
		font-size: 12px;
		color: #cc1b2a;
		margin: 0 0 15px 30px;
		padding: 0;
		position: relative;
	}
	
	.philosophy .title span::before {
		content: "";
		display: block;
		background: #cc1b2a;
		width: 18px;
		height: 1px;
		position: absolute;
		top: 50%;
		left: -28px;
		transform: translateY(-50%);
	}
	
	.philosophy p {
		display: block;
		line-height: 2.2;
		font-weight: 400;
		font-size: 14px;
	}

	.philosophy ul {
		font-weight: 500;
		font-size: 14px;
		text-align: justify;
		margin: 40px 0;
		padding: 0;
	}
	
	.philosophy ul li {
		background: #F4F4F4;
		margin: 0 0 10px;
		padding: 20px 20px 20px 45px;
		position: relative;
		line-height: 1.6;
	}
	
	.philosophy ul li span {
		display: block;
		position: absolute;
		color: #cc1b2a;
		top: 20px;
		left: 15px;
	}

}

/* Small than tablet */
@media (min-width: 768px) {
	.philosophy {
		margin: 0 auto 111px;
		padding: 60px 100px 100px;
	}
	
	.philosophy .title {
		font-size: 24px;
		margin: 0 0 50px;
		padding: 0;
	}
	
	.philosophy .title span {
		font-size: 13px;
		margin: 0 0 15px 30px;
		padding: 0;
	}

	.philosophy ul {
		margin: 40px 0;
		padding: 0;
	}
	
	.philosophy ul li {
		margin: 0 0 10px;
		padding: 23px 30px 23px 65px;
	}
	
	.philosophy ul li span {
		position: absolute;
		top: 22px;
		left: 28.5px;
	}


	
}


/* Larger than tablet */
@media (min-width: 992px) {
	.philosophy {
		margin: 0 auto 111px;
		padding: 60px 175px 100px;
	}
	
	.philosophy .title {
		font-size: 25px;
	}
	


}

/*--------------------------------------------------------------
.message
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	
	#message {
		padding-top: 80px;
		margin-top: -80px;
	}
	
	.message {
		width: 100%;
		height: auto;
		margin: 0;
		padding: 0;
		position: relative;
	}
	
	.bg_title_text {
		font-size: 55px;
		font-weight: 500;
		color: #fff;
		opacity: .3;
		font-family: 'Lato', sans-serif;
		position: absolute;
		top: -55px;
		left: 30%;
		
	}
	
	.message_wrap {
		max-width: 980px;
		height: auto;
		margin: 0 auto;
		padding: 0;
	}
	
	.represent {
		width: 100%;
		height: auto;
		overflow: hidden;
		position: relative;
		margin: 0 0 30px;
		padding: 0;
	}
	
	.represent a {
		color: inherit;
		text-decoration: none;
	}
	
	.represent img {
		width: 100%;
		height: auto;
		object-position: top left;
		line-height: 1;
		vertical-align: bottom;
	}
	
	.represent .text_box {
		position: relative;
		right: auto;
		bottom: auto;
		width: 100%;
		height: auto;
		background: linear-gradient(90deg, rgba(164, 35, 56,1) 20.378504672897193%,rgba(199, 22, 40,1) 43.69100467289719%,rgba(252, 75, 61,1) 77.9410046728972%);
		background-size: cover;
		margin: 0;
		padding: 15px 0 15px 30px; 
		color: #fff;
	}
	
	.represent .text_box dl dt {
		margin: 0 0 10px;
		padding: 0;
		font-weight: 500;
		font-size: 23px;
	}
	
	.represent .text_box dl dt span {
		display: block;
		font-size: 13px;
		margin: 0 0 5px;
		line-height: 1;
	}
	
	.represent .text_box dl dd {
		font-family: 'Lato', sans-serif;
		margin: 0;
		padding: 0;
		font-size: 11px;
		font-weight: 400;
	}
	
	.message_inner {
		margin: 0;
		padding: 0 35px 60px;
		overflow: hidden;
	}
	
	.message_inner h3 {
		color: #cc1b2a;
		font-size: 13px;
		float: none;
		margin: 0 0 30px 0;
		padding: 0;
	}
	
	.message_inner h3 span {
		display: block;
		font-size: 27px;
		font-family: 'Lato', sans-serif;
		margin: 0 0 12px;
	}
	
	.message_inner .inner_text {
		overflow: hidden;
		width: auto;
		height: auto;
		text-align: justify;
		font-size: 14px;
		line-height: 2.1;
	}
}

/* Small than tablet */
@media (min-width: 768px) {
	.message {
		width: 100%;
		height: auto;
		margin: 0;
		padding: 0;
		position: relative;
	}
	
	.bg_title_text {
		font-size: 117px;
		font-weight: 500;
		color: #fff;
		opacity: .3;
		font-family: 'Lato', sans-serif;
		position: absolute;
		top: -110px;
		left: 57%;
	}
	
	.message_wrap {
		max-width: 980px;
		height: auto;
		margin: 0 auto;
		padding: 0;
	}
	
	.represent {
		width: 100%;
		height: 460px;
		overflow: hidden;
		position: relative;
		margin: 0 0 40px;
		padding: 0;
	}
	
	.represent img {
		width: 715px;
		height: auto;
		object-position: top left;
	}
	
	.represent .add_prof {
		 margin-top:12px!important;
		font-weight: 600!important;
	}
	
	.represent .text_box {
		position: absolute;
		right: 0;
		bottom: 0;
		width: 385px;
		height: 204px;
		background: linear-gradient(90deg, rgba(164, 35, 56,1) 20.378504672897193%,rgba(199, 22, 40,1) 43.69100467289719%,rgba(252, 75, 61,1) 77.9410046728972%);
		background-size: cover;
		margin: 0;
		padding: 55px 0 0 40px; 
		color: #fff;
	}
	
	.represent .text_box dl dt {
		margin: 0 0 10px;
		padding: 0;
		font-weight: 500;
		font-size: 23px;
	}
	
	.represent .text_box dl dt span {
		display: block;
		font-size: 13px;
		margin: 0 0 5px;
		line-height: 1;
	}
	
	.represent .text_box dl dd {
		font-family: 'Lato', sans-serif;
		margin: 0;
		padding: 0;
		font-size: 11px;
		font-weight: 400;
	}
	
	.message_inner {
		margin: 0;
		padding: 0 35px 60px;
	}
	
	.message_inner h3 {
		color: #cc1b2a;
		font-size: 13px;
		float: left;
		margin: 0 60px 0 0;
		padding: 0;
	}
	
	.message_inner h3 span {
		display: block;
		font-size: 27px;
		font-family: 'Lato', sans-serif;
		margin: 0 0 12px;
	}
	
	.message_inner .inner_text {
		overflow: hidden;
		width: auto;
		height: auto;
		text-align: justify;
		font-size: 14px;
		line-height: 2.1;
	}

	
}


/* Larger than tablet */
@media (min-width: 992px) {
	


}

/*--------------------------------------------------------------
.modal
--------------------------------------------------------------*/

/* mobile */
@media (min-width: 300px) {
	.modal {
		width: 100%;
		height: 100%;
		letter-spacing: .1em;
		font-size: 13px;
		color: #000000;
	}
	
	.iziModal {
		background: none!important;
		box-shadow: none!important;
		width: 95%!important;
		height: auto!important;
		max-width: 940px!important;
		margin: 15vh auto 0!important;
		padding: 0!important;
		overflow-y: scroll!important;
	}
	
	.iziModal-navigate {
		z-index: 99999!important;
	}
	
	.close_btn {
		display: block;
		width: 34px;
		height: 34px;
		position: absolute;
		top: 10px;
		right: 10px;
		cursor: pointer;
	}
	
	.close_btn span {
		widows: 100%;
		height: 100%;
		background: none;
		position: relative;
	}

	.close_btn span::before,
	.close_btn span::after {
		display: block;
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 36px;
		height: 2px;
		margin: 0 0 0 -17px;
		background: #B4B4B4;
		transform: translateX(-50%);
	}

	.close_btn span::before {
		transform: rotate(-45deg);
	}

	.close_btn span::after {
		transform: rotate(45deg);
	}
	
	.iziModal-header {
		display: none;
	}
	
	.iziModal-navigate-prev,
	.iziModal-navigate-next {
		width: 50px!important;
		height: 50px!important;
		top: 50%!important;
		transform: translateY(-50%)!important;
		margin: 0!important;
		padding: 0!important;
	}
	
	.modal .img_box {
		margin: 0;
		width: 100%;
		padding: 0;
	}
	
	.modal .text_box {
		width: 100%;
		background: #fff;
		position: relative;
		top: 0;
		left: 0;
		margin: 0;
		padding: 20px 20px 40px;
		font-size: 12px;
	}
	
	.modal .text_box > span {
		color: #D6D6D6;
		display: block;
		font-size: 18px;
		float: right;
		margin: 0 0 10px;
		padding: 0;
		margin-right: 0;
		line-height: 1
	}
	
	.modal .text_box ul {
		clear: both;
	}
	
	.modal .text_box ul li {
		margin: 0;
		padding: 0;
		line-height: 1.6;
	}
	
	.modal .text_box ul li.name {
		margin-bottom: 30px;
	}
	
	.modal .text_box ul li.qualification {
		margin-bottom: 15px;
	}
	
	.modal .text_box ul li.academic {
		margin-bottom: 40px;
	}
	
	.name span {
		display: block;
		font-size: 20px;
		font-weight: 500;
	}
	
	.modal .text_box dl {
		margin: 0;
		padding: 0;
	}
	
	.modal .text_box dl dt {
		float: left;
	}
	
	.modal .text_box dl dd {
		margin: 0 0 0 83px;
		overflow: hidden;
	}
	
	.career span {
		margin: 0 1em 0 0;
	}

}

/* Small than tablet */
@media (min-width: 768px) {
	
	.iziModal {
		background: none!important;
		box-shadow: none!important;
		width: 80%!important;
		height: auto!important;
		max-width: 940px!important;
		margin: 15vh auto 0!important;
		padding: 0!important;
		overflow-y: scroll!important;
	}
	
	.close_btn {
		display: block;
		width: 34px;
		height: 34px;
		position: absolute;
		top: 0;
		right: 0;
		cursor: pointer;
	}
	
	.modal .img_box {
		margin: 0;
		padding: 0;
		width: 36%;
	}
	
	.modal .text_box {
		width: 65%;
		background: #fff;
		position: absolute;
		top: 35%;
		left: 34%;
		margin: 0;
		padding: 25px 40px 60px;
		font-size: 13px
	}
	
	.modal .text_box > span {
		color: #D6D6D6;
		display: block;
		font-size: 18px;
		float: right;
		margin: 0 0 10px;
		padding: 0;
		margin-right: -15px;
	}
}

/* Larger than tablet */
@media (min-width: 992px) {
	
	.iziModal {
		background: none!important;
		box-shadow: none!important;
		width: 80%!important;
		height: auto!important;
		max-width: 940px!important;
		margin: 15vh auto 0!important;
		padding: 0!important;
		overflow-y: scroll!important;
	}
	
	.close_btn {
		display: block;
		width: 34px;
		height: 34px;
		position: absolute;
		top: 0;
		right: 0;
		cursor: pointer;
	}
	
	.iziModal-navigate-next {
		margin: 0 5vw 0 0!important;
	}
	
	.iziModal-navigate-prev {
		margin: 5vw!important;
	}
	
	.modal .img_box {
		margin: 0;
		width: 340px;
	}
	
	.modal .text_box {
		width: 65%;
		max-width: 620px;
		background: #fff;
		position: absolute;
		top: 32%;
		left: 34%;
		margin: 0;
		padding: 25px 60px 60px;
		font-size: 13px
	}
	
	.modal .text_box > span {
		color: #D6D6D6;
		display: block;
		font-size: 18px;
		float: right;
		margin: 0 0 10px;
		padding: 0;
		margin-right: -35px;
	}

}