/*Color Value*/
/*Font Value*/
/**
 * $font-face LESS Mixin
 * use: .font-face(
 *   $font-family, // name
 *   $file-path,   // absolute/relative URL to font files
 *   $font-weight, // light/normal/bold/inherit | 300/400/700
 *   $font-style   // italic/normal/inherit
 * )
 */
/**
 * font LESS Mixin
 * use: .font(
 *   $font-family, // name
 *   $file-size,   // any unit/inherit
 *   $font-weight, // light/normal/bold/inherit | 300/400/700
 *   $font-style   // italic/normal/inherit
 * )
 */
/*Button Style Start*/
/*Button Style End*/
/*Input Style Start*/
/*Input Style End*/
/*Clearfix function Start*/
/*Clearfix function End*/
/*Common LESS Start*/
/*
.list-margin-fit{ 
  &:first-child{margin-left:0;}
  &:last-child{margin-right:0;}
}

.list-padding-fit{ 
  &:first-child{padding-left:0;}
  &:last-child{padding-right:0;}
}
*/
/*Common LESS End*/
/*Common CSS3 LESS Mixins Start*/
/*Common CSS3 LESS Mixins End*/
/*
@include keyframes(anim-rotate){
	0% {
		@include rotate(0deg);
	}
	100% {
		@include rotate(360deg);
	}
}
*/
/*
@function drop-shadow-converter($color: #000, $opacity: 100, $angle: 0, $distance: 0, $spread: 0, $size: 0, $is-box-shadow: false) {
	$__ang: (180-$angle) * 3.14 / 180;
  $__offset-y: round(sin($__ang) * $distance);
  $__offset-x: round(cos($__ang) * $distance);
  $__spread-rad: $size * $spread/100;
  $__blur-rad: $size - $__spread-rad;
  @if ($is-box-shadow) {
    @return $__offset-x $__offset-y $__blur-rad $__spread-rad rgba(red($color), green($color), blue($color), $opacity/100);
  } @else {
    @return $__offset-x $__offset-y $__blur-rad rgba(red($color), green($color), blue($color), $opacity/100);
  }
}
*/
/*Color Value*/
/*Font Value*/
/**
 * $font-face LESS Mixin
 * use: .font-face(
 *   $font-family, // name
 *   $file-path,   // absolute/relative URL to font files
 *   $font-weight, // light/normal/bold/inherit | 300/400/700
 *   $font-style   // italic/normal/inherit
 * )
 */
/**
 * font LESS Mixin
 * use: .font(
 *   $font-family, // name
 *   $file-size,   // any unit/inherit
 *   $font-weight, // light/normal/bold/inherit | 300/400/700
 *   $font-style   // italic/normal/inherit
 * )
 */
/*Button Style Start*/
/*Button Style End*/
/*Input Style Start*/
/*Input Style End*/
/*Clearfix function Start*/
/*Clearfix function End*/
/*Common LESS Start*/
/*
.list-margin-fit{ 
  &:first-child{margin-left:0;}
  &:last-child{margin-right:0;}
}

.list-padding-fit{ 
  &:first-child{padding-left:0;}
  &:last-child{padding-right:0;}
}
*/
/*Common LESS End*/
/*Common CSS3 LESS Mixins Start*/
/*Common CSS3 LESS Mixins End*/
/*
@include keyframes(anim-rotate){
	0% {
		@include rotate(0deg);
	}
	100% {
		@include rotate(360deg);
	}
}
*/
/*
@function drop-shadow-converter($color: #000, $opacity: 100, $angle: 0, $distance: 0, $spread: 0, $size: 0, $is-box-shadow: false) {
	$__ang: (180-$angle) * 3.14 / 180;
  $__offset-y: round(sin($__ang) * $distance);
  $__offset-x: round(cos($__ang) * $distance);
  $__spread-rad: $size * $spread/100;
  $__blur-rad: $size - $__spread-rad;
  @if ($is-box-shadow) {
    @return $__offset-x $__offset-y $__blur-rad $__spread-rad rgba(red($color), green($color), blue($color), $opacity/100);
  } @else {
    @return $__offset-x $__offset-y $__blur-rad rgba(red($color), green($color), blue($color), $opacity/100);
  }
}
*/
/*
$chinese-font: 'Noto Sans TC','Noto Sans SC','Microsoft JhengHei';
@mixin font-name($en-name, $tc-name: $chinese-font){
	font-family: $en-name, $tc-name,sans-serif;
}
*/
/*
$xs-col-padding: 5px;
$sm-col-padding:10px;
$md-col-padding:15px;
$lg-col-padding:20px;

.row-xs-col{ margin:0 -$xs-col-padding; >div{padding:0 $xs-col-padding}}
.row-sm-col{ margin:0 -$sm-col-padding; >div{padding:0 $sm-col-padding}}
.row-md-col{ margin:0 -$md-col-padding; >div{padding:0 $md-col-padding}}
.row-lg-col{ margin:0 -$lg-col-padding; >div{padding:0 $lg-col-padding}}
*/
@-webkit-keyframes anim-rotate {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
  }
}
@keyframes anim-rotate {
  0% {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
  }
}
/*
@include keyframes(anim-floating){
	0% {
		@include translateY(-20px);
	}
	50%{
		@include translateY(20px);
	}
	100% {
		@include translateY(-20px);
	}
}
*/
/*
html, body {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}

body {
  font-family: 'Fira Sans', 'Microsoft JhengHei' , sans-serif;
}


body a{transition: all .6s}
body a:hover,
body a:focus,
body a:active{text-decoration: none;}
*/
.container-vm {
  width: 100%;
  height: 100%;
  display: table;
  table-layout: fixed;
  position: relative;
}

.container-vm-box {
  display: table-cell;
  vertical-align: middle;
}

.container-vb {
  width: 100%;
  height: 100%;
  display: table;
  table-layout: fixed;
  position: relative;
}

.container-vb-box {
  display: table-cell;
  vertical-align: bottom;
}

.img-responsive-center {
  margin-left: auto;
  margin-right: auto;
}

.form-group-inline .checkbox,
.form-group-inline .radio {
  display: inline-block;
  margin-right: 15px;
}

/*
@media (max-width: 767px){}
@media (min-width: 768px){
	.text-sm-left{text-align: left;}
	.text-sm-center{text-align: center;}
	.text-sm-right{text-align: right;}
}
@media (max-width: 991px){}
@media (min-width: 992px){
	.text-md-left{text-align: left;}
	.text-md-center{text-align: center;}
	.text-md-right{text-align: right;}
}
@media (max-width: 1199px){}
@media (min-width: 1200px){
	.text-lg-left{text-align: left;}
	.text-lg-center{text-align: center;}
	.text-lg-right{text-align: right;}
}

@media (max-width: 767px){}
@media (min-width: 768px){
	.float-sm-left{float:left;}
	.float-sm-right{float:right;}
	.float-sm-none{float:none;}

}
@media (max-width: 991px){}
@media (min-width: 992px){
	.float-md-left{float:left;}
	.float-md-right{float:right;}
	.float-md-none{float:none;}

}
@media (max-width: 1199px){}
@media (min-width: 1200px){
	.float-lg-left{float:left;}
	.float-lg-right{float:right;}
	.float-lg-none{float:none;}

}
*/
/*
@media (max-width: 767px){
	.row-clear .col-xs-2:nth-child(6n+1),
	.row-clear .col-xs-3:nth-child(4n+1),
	.row-clear .col-xs-4:nth-child(3n+1),
	.row-clear .col-xs-6:nth-child(2n+1),
	.row-clear .col-sm-2:nth-child(6n+1),
	.row-clear .col-sm-3:nth-child(4n+1),
	.row-clear .col-sm-4:nth-child(3n+1),
	.row-clear .col-sm-6:nth-child(2n+1),
	.row-clear .col-md-2:nth-child(6n+1),
	.row-clear .col-md-3:nth-child(4n+1),
	.row-clear .col-md-4:nth-child(3n+1),
	.row-clear .col-md-6:nth-child(2n+1),
	.row-clear .col-lg-2:nth-child(6n+1),
	.row-clear .col-lg-3:nth-child(4n+1),
	.row-clear .col-lg-4:nth-child(3n+1),
	.row-clear .col-lg-6:nth-child(2n+1){clear:none;}

	.row-clear .col-xs-2:nth-child(6n+1),
	.row-clear .col-xs-3:nth-child(4n+1),
	.row-clear .col-xs-4:nth-child(3n+1),
	.row-clear .col-xs-6:nth-child(2n+1){clear:both;}
}
@media (min-width: 768px){
	.row-clear .col-xs-2:nth-child(6n+1),
	.row-clear .col-xs-3:nth-child(4n+1),
	.row-clear .col-xs-4:nth-child(3n+1),
	.row-clear .col-xs-6:nth-child(2n+1),
	.row-clear .col-sm-2:nth-child(6n+1),
	.row-clear .col-sm-3:nth-child(4n+1),
	.row-clear .col-sm-4:nth-child(3n+1),
	.row-clear .col-sm-6:nth-child(2n+1),
	.row-clear .col-md-2:nth-child(6n+1),
	.row-clear .col-md-3:nth-child(4n+1),
	.row-clear .col-md-4:nth-child(3n+1),
	.row-clear .col-md-6:nth-child(2n+1),
	.row-clear .col-lg-2:nth-child(6n+1),
	.row-clear .col-lg-3:nth-child(4n+1),
	.row-clear .col-lg-4:nth-child(3n+1),
	.row-clear .col-lg-6:nth-child(2n+1){clear:none;}

	.row-clear .col-sm-2:nth-child(6n+1),
	.row-clear .col-sm-3:nth-child(4n+1),
	.row-clear .col-sm-4:nth-child(3n+1),
	.row-clear .col-sm-6:nth-child(2n+1){clear:both;}
}
@media (min-width: 992px){
	.row-clear .col-xs-2:nth-child(6n+1),
	.row-clear .col-xs-3:nth-child(4n+1),
	.row-clear .col-xs-4:nth-child(3n+1),
	.row-clear .col-xs-6:nth-child(2n+1),
	.row-clear .col-sm-2:nth-child(6n+1),
	.row-clear .col-sm-3:nth-child(4n+1),
	.row-clear .col-sm-4:nth-child(3n+1),
	.row-clear .col-sm-6:nth-child(2n+1),
	.row-clear .col-md-2:nth-child(6n+1),
	.row-clear .col-md-3:nth-child(4n+1),
	.row-clear .col-md-4:nth-child(3n+1),
	.row-clear .col-md-6:nth-child(2n+1),
	.row-clear .col-lg-2:nth-child(6n+1),
	.row-clear .col-lg-3:nth-child(4n+1),
	.row-clear .col-lg-4:nth-child(3n+1),
	.row-clear .col-lg-6:nth-child(2n+1){clear:none;}

	.row-clear .col-md-2:nth-child(6n+1),
	.row-clear .col-md-3:nth-child(4n+1),
	.row-clear .col-md-4:nth-child(3n+1),
	.row-clear .col-md-6:nth-child(2n+1){clear:both;}
}
@media (min-width: 1200px){
	.row-clear .col-xs-2:nth-child(6n+1),
	.row-clear .col-xs-3:nth-child(4n+1),
	.row-clear .col-xs-4:nth-child(3n+1),
	.row-clear .col-xs-6:nth-child(2n+1),
	.row-clear .col-sm-2:nth-child(6n+1),
	.row-clear .col-sm-3:nth-child(4n+1),
	.row-clear .col-sm-4:nth-child(3n+1),
	.row-clear .col-sm-6:nth-child(2n+1),
	.row-clear .col-md-2:nth-child(6n+1),
	.row-clear .col-md-3:nth-child(4n+1),
	.row-clear .col-md-4:nth-child(3n+1),
	.row-clear .col-md-6:nth-child(2n+1),
	.row-clear .col-lg-2:nth-child(6n+1),
	.row-clear .col-lg-3:nth-child(4n+1),
	.row-clear .col-lg-4:nth-child(3n+1),
	.row-clear .col-lg-6:nth-child(2n+1){clear:none;}

	.row-clear .col-lg-2:nth-child(6n+1),
	.row-clear .col-lg-3:nth-child(4n+1),
	.row-clear .col-lg-4:nth-child(3n+1),
	.row-clear .col-lg-6:nth-child(2n+1){clear:both;}
}

@media (max-width: 767px){}
@media (min-width: 768px) and (max-width: 991px) { }
@media (min-width: 992px) and (max-width: 1199px) { }
@media (min-width: 1200px){}
*/
/*For loop example start*/
/*
@mixin mixin-loop($i) when ($i > 0){
	div:nth-child(${i}):after {
		content: "${i}";
	}
	@include mixin-loop($i - 1);
}
*/
/*For loop example end*/
/*Only use font-weight 300, 400, 500, 600, 700*/
@font-face {
  font-family: "ITC Avant Garde Gothic Std";
  src: url("../../fonts/itc_avant_garde_gothic_std_medium-webfont.woff2") format("woff2"), url("../../fonts/itc_avant_garde_gothic_std_medium-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}
body {
  font-family: "ITC Avant Garde Gothic Std", "Noto Sans TC", "Noto Sans SC", "Microsoft JhengHei";
  color: #353636;
  -webkit-text-size-adjust: none;
  display: flex;
  min-height: 100vh;
  flex-direction: column;
}
body a {
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
body a:active {
  text-decoration: none;
}
body a:hover, body a:focus, body a:active {
  outline: none;
  text-decoration: none;
}
body input:focus {
  outline: none;
}

.whole-content-wrapper {
  flex: 1 0 0;
  ms-flex: 1;
  -webkit-flex: 1;
}

::-moz-selection {
  color: #ffffff;
  background: #8DD5E1;
}

::selection {
  color: #ffffff;
  background: #8DD5E1;
}

.ck-box {
  /*
  p{}

  p,
  li,
  label,
  table{}

  p{}

  h1{}
  h2{}
  h3{}
  h4{}
  h5{}
  h6{}

  ul{
  	li{}
  }
  */
}
.ck-box p,
.ck-box li,
.ck-box label,
.ck-box table,
.ck-box h1,
.ck-box h2,
.ck-box h3,
.ck-box h4,
.ck-box h5,
.ck-box h6 {
  line-height: 1.8;
}
@media (max-width: 575px) {
  .ck-box blockquote {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .ck-box blockquote {
    font-size: 14px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .ck-box blockquote {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .ck-box blockquote {
    font-size: 17px;
  }
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .ck-box blockquote {
    font-size: 18px;
  }
}
@media (min-width: 1550px) {
  .ck-box blockquote {
    font-size: 18px;
  }
}
.ck-box img {
  max-width: 100%;
  height: auto !important;
}
.ck-box a {
  color: #3CC1C8;
  text-decoration: underline;
}
.ck-box a:hover {
  color: #3CC1C8;
  text-decoration: underline;
}

@media (max-width: 575px) {
  .section-main p,
.section-main li,
.section-main label,
.section-main table {
    font-size: 10px;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .section-main p,
.section-main li,
.section-main label,
.section-main table {
    font-size: 11px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .section-main p,
.section-main li,
.section-main label,
.section-main table {
    font-size: 12px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .section-main p,
.section-main li,
.section-main label,
.section-main table {
    font-size: 13px;
  }
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .section-main p,
.section-main li,
.section-main label,
.section-main table {
    font-size: 14px;
  }
}
@media (min-width: 1550px) {
  .section-main p,
.section-main li,
.section-main label,
.section-main table {
    font-size: 14px;
  }
}
.section-main h1 {
  margin-bottom: 25px;
}
@media (max-width: 575px) {
  .section-main h1 {
    font-size: 36px;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .section-main h1 {
    font-size: 39px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .section-main h1 {
    font-size: 42px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .section-main h1 {
    font-size: 46px;
  }
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .section-main h1 {
    font-size: 50px;
  }
}
@media (min-width: 1550px) {
  .section-main h1 {
    font-size: 50px;
  }
}
@media (max-width: 575px) {
  .section-main h2 {
    font-size: 30px;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .section-main h2 {
    font-size: 33px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .section-main h2 {
    font-size: 36px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .section-main h2 {
    font-size: 39px;
  }
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .section-main h2 {
    font-size: 42px;
  }
}
@media (min-width: 1550px) {
  .section-main h2 {
    font-size: 42px;
  }
}
@media (max-width: 575px) {
  .section-main h3 {
    font-size: 23px;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .section-main h3 {
    font-size: 25px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .section-main h3 {
    font-size: 27px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .section-main h3 {
    font-size: 29px;
  }
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .section-main h3 {
    font-size: 32px;
  }
}
@media (min-width: 1550px) {
  .section-main h3 {
    font-size: 32px;
  }
}
@media (max-width: 575px) {
  .section-main h4 {
    font-size: 17px;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .section-main h4 {
    font-size: 19px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .section-main h4 {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .section-main h4 {
    font-size: 22px;
  }
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .section-main h4 {
    font-size: 24px;
  }
}
@media (min-width: 1550px) {
  .section-main h4 {
    font-size: 24px;
  }
}
@media (max-width: 575px) {
  .section-main h5 {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .section-main h5 {
    font-size: 14px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .section-main h5 {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .section-main h5 {
    font-size: 17px;
  }
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .section-main h5 {
    font-size: 18px;
  }
}
@media (min-width: 1550px) {
  .section-main h5 {
    font-size: 18px;
  }
}
@media (max-width: 575px) {
  .section-main h6 {
    font-size: 11px;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .section-main h6 {
    font-size: 12px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .section-main h6 {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .section-main h6 {
    font-size: 15px;
  }
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .section-main h6 {
    font-size: 16px;
  }
}
@media (min-width: 1550px) {
  .section-main h6 {
    font-size: 16px;
  }
}

.section-padding {
  padding: 75px 0;
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .section-padding {
    padding: 70px 0;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .section-padding {
    padding: 55px 0;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .section-padding {
    padding: 45px 0;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .section-padding {
    padding: 35px 0;
  }
}
@media (max-width: 575px) {
  .section-padding {
    padding: 30px 0;
  }
}

@media (min-width: 1550px) {
  .container-xl {
    max-width: 1365px;
  }
}

.link-buttercup {
  color: #F3A21D;
}
.link-buttercup:hover, .link-buttercup:focus, .link-buttercup:active {
  color: #F3A21D;
}

.btn-theme {
  display: inline-block;
  align-items: center;
  text-align: center;
  padding: 10px 17px;
  background-color: #3CC1C8;
  color: #ffffff;
  font-weight: 600;
  border-radius: 0px;
  position: relative;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .btn-theme {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .btn-theme {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .btn-theme {
    font-size: 14px;
  }
}
.btn-theme .arrow-left {
  float: left;
  margin-left: 5px;
  margin-right: 10px;
  margin-top: 0.5em;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  display: inline-block;
  width: 12px;
  height: 12px;
  border-top: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  -webkit-transform: rotate(225deg);
  -moz-transform: rotate(225deg);
  -ms-transform: rotate(225deg);
  -o-transform: rotate(225deg);
}
.btn-theme .arrow {
  position: absolute;
  width: 12px;
  height: 12px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23fff'/%3E%3C/svg%3E%0A");
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .btn-theme .arrow {
    width: 10px;
    height: 10px;
  }
}
.btn-theme .back-arrow {
  position: absolute;
  width: 12px;
  height: 12px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_41' data-name='Polygon 41' d='M6,0l6,11H0Z' transform='translate(0 12) rotate(-90)' fill='%23fff'/%3E%3C/svg%3E%0A");
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .btn-theme .back-arrow {
    width: 10px;
    height: 10px;
  }
}
.btn-theme:hover, .btn-theme:focus, .btn-theme:active {
  color: #ffffff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
}
.btn-theme:hover .arrow-left, .btn-theme:focus .arrow-left, .btn-theme:active .arrow-left {
  margin-left: 0;
}
.btn-theme:hover .arrow, .btn-theme:focus .arrow, .btn-theme:active .arrow {
  margin-right: 0;
}
.btn-theme.style1 {
  background-color: #E7E7E7;
  color: #7D7D7D;
}
.btn-theme.style2 {
  background-color: #0CBACF;
}

.btn-arrow {
  text-align: left;
  padding-right: 40px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .btn-arrow {
    padding-right: 40px;
  }
}

.btn-left-arrow {
  text-align: right;
  padding-left: 40px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .btn-left-arrow {
    padding-left: 40px;
  }
}

button.btn-theme {
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
button.btn-theme, button.btn-theme:hover, button.btn-theme:focus, button.btn-theme:active {
  border: 0;
  outline: 0;
}

.two-btn-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .two-btn-container .btn-theme {
    min-width: 140px;
  }
}
.two-btn-container .left-btn {
  order: 1;
}
@media (max-width: 575px) {
  .two-btn-container .left-btn {
    margin-bottom: 10px !important;
  }
}
.two-btn-container .right-btn {
  order: 2;
}
@media (max-width: 575px) {
  .two-btn-container .right-btn {
    margin-bottom: 10px !important;
  }
}

.form .custom-checkbox {
  background-color: #8DD5E1;
  padding-left: 3.5rem;
  padding-right: 2.5rem;
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
  color: white;
}
.form .custom-checkbox.blue-a a {
  color: #258DCF;
}

.form-control {
  background-color: #ffffff;
  border: 0;
  border: 1px solid #D7D7D7;
  border-radius: 0;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  height: auto;
  padding: 0.55rem 1rem;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .form-control {
    padding: 0.55rem 0.8rem;
  }
}
.form-control:-webkit-autofill, .form-control:-webkit-autofill:hover, .form-control:-webkit-autofill:focus .form-control:-webkit-autofill {
  -webkit-transition: background-color 5000s ease-in-out 0s;
  transition: background-color 5000s ease-in-out 0s;
}
.form-control:hover, .form-control:focus, .form-control:active {
  background-color: #ffffff;
  border-bottom-color: #3CC1C8;
  outline: 0;
  box-shadow: none;
}
.form-control:focus {
  border-color: #3CC1C8;
}

.form-inputbox {
  display: flex;
  align-items: center;
}

input.form-control:-moz-read-only, textarea.form-control:-moz-read-only {
  background-color: #eeeeee;
  border: 0;
  border: 1px solid #eeeeee;
}

input.form-control:read-only,
textarea.form-control:read-only {
  background-color: #eeeeee;
  border: 0;
  border: 1px solid #eeeeee;
}

input[type=file].form-control {
  padding-left: 15px;
  padding-right: 15px;
}

.form-group-title {
  color: #3CC1C8;
  line-height: 1.2em;
  font-weight: 700;
  text-transform: uppercase;
  margin-top: 2em;
  margin-bottom: 1em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .form-group-title {
    font-size: 25px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .form-group-title {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .form-group-title {
    font-size: 24px;
  }
}

.form-group .required:after {
  content: " *";
  color: #e74a3b;
}
.form-group label span {
  color: #F3A21D;
}
.form-group .col-form-label {
  padding-top: calc(0.55rem + 1px);
  padding-bottom: calc(0.55rem + 1px);
}
.form-group .btn-theme {
  margin-bottom: 0.2em;
}
.form-group .btn-theme.btn-multiple {
  margin-bottom: 0;
  width: 100%;
  height: 43.59px;
  max-width: 150px;
}
.form-group #btn-submit {
  padding-right: 40px;
}
.form-group .dropdown-btn .dropdown-menu {
  border-radius: 0;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  border: 0;
  width: 100%;
  min-width: inherit;
  max-width: 140px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  text-align: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .form-group .dropdown-btn .dropdown-menu .dropdown-item {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .form-group .dropdown-btn .dropdown-menu .dropdown-item {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .form-group .dropdown-btn .dropdown-menu .dropdown-item {
    font-size: 12px;
  }
}

.form-note {
  line-height: 1.2em;
  color: #ABABAB;
  padding: calc(0.55rem + 1px) 0;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .form-note {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .form-note {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .form-note {
    font-size: 12px;
  }
}

select.form-control {
  /*
  @include appearance(none);
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2712%27%20height%3D%2710%27%20fill%3D%27%23F3A21D%27%3E%3Cpolygon%20points%3D%270%2C0%2012%2C0%206%2C10%27%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-size: 12px;
  background-position: calc(100% - .75rem) center;
  padding-right: 2rem;
  */
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2712%27%20height%3D%2710%27%20fill%3D%27%233CC1C8%27%3E%3Cpolygon%20points%3D%270%2C0%2012%2C0%206%2C10%27%2F%3E%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-size: 12px;
  background-position: calc(100% - 0.75rem ) center;
  padding-right: calc( 12px + 1.5rem);
}
select.form-control::-ms-expand {
  display: none;
}

.head-bar-container {
  background-color: #258DCF;
  align-items: center;
  display: flex;
  padding: 45px 0px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .head-bar-container {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .head-bar-container {
    font-size: 18px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .head-bar-container {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .head-bar-container {
    padding: 40px 0;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .head-bar-container {
    padding: 25px 0;
  }
}
.head-bar-container .full-width {
  width: 100%;
}
.head-bar-container .head-bar {
  display: flex;
  flex-wrap: wrap;
}
.head-bar-container.student .item-title {
  height: 50px !important;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .head-bar-container.student .item-title {
    height: 40px !important;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .head-bar-container.student .item-title {
    height: 45px !important;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .head-bar-container.staff .sub-menu .menu-item .item-title {
    max-width: 185px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .head-bar-container.staff .sub-menu .menu-item .item-title {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .head-bar-container.staff .sub-menu .menu-item .item-title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .head-bar-container.staff .sub-menu .menu-item .item-title {
    font-size: 14px;
  }
}

.breadcrumb-and-title {
  align-self: center;
  width: 40%;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .breadcrumb-and-title {
    width: 100%;
  }
}
.breadcrumb-and-title .breadcrumb-list-wrapper {
  display: none;
  color: #8DD5E1;
  font-weight: 700;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-and-title .breadcrumb-list-wrapper {
    padding-right: 80px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .breadcrumb-and-title .breadcrumb-list-wrapper {
    padding-right: 80px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .breadcrumb-and-title .breadcrumb-list-wrapper {
    padding-right: 60px;
  }
}
.breadcrumb-and-title .breadcrumb-list-wrapper a {
  color: #8DD5E1;
  margin: 0 0.15em;
}
.breadcrumb-and-title .breadcrumb-list-wrapper a:first-child {
  margin-left: 0;
}
.banner-title {
  font-weight: 700;
  color: #ffffff;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .banner-title {
    font-size: 32px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .banner-title {
    font-size: 30px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .banner-title {
    font-size: 28px;
  }
}

.sub-menu {
  width: 60%;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .sub-menu {
    margin-top: 17px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .sub-menu {
    position: unset;
    transform: unset;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .sub-menu {
    width: 100%;
  }
}
.sub-menu .row {
  margin-left: -5px;
  margin-right: -5px;
  margin-bottom: -10px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .sub-menu .row {
    justify-content: flex-end;
  }
}
.sub-menu .sub-menu-col {
  padding-left: 5px;
  padding-right: 5px;
  margin-bottom: 10px;
}
.sub-menu .menu-item {
  display: flex;
  position: relative;
  justify-content: center;
  align-items: center;
  text-align: center;
}
.sub-menu .menu-item .item-title {
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  width: 100%;
  height: 100%;
  background-color: #F3F3F3;
  justify-content: center;
  align-items: center;
  position: relative;
  padding: 0.5em 1em;
  flex-wrap: nowrap;
  color: #666666;
  font-weight: 700;
  display: flex;
  height: 70px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .sub-menu .menu-item .item-title {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .sub-menu .menu-item .item-title {
    font-size: 15px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .sub-menu .menu-item .item-title {
    font-size: 15px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .sub-menu .menu-item .item-title {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .sub-menu .menu-item .item-title {
    padding: 0.5em 0.5em;
    height: 65px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .sub-menu .menu-item .item-title {
    padding: 0.5em 0.5em;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .sub-menu .menu-item .item-title {
    font-size: 16px;
  }
}
.sub-menu .menu-item:hover, .sub-menu .menu-item:focus, .sub-menu .menu-item:active {
  -webkit-transform: translateY(-4px);
  -moz-transform: translateY(-4px);
  -ms-transform: translateY(-4px);
  -o-transform: translateY(-4px);
}
.sub-menu .menu-item:hover .item-title, .sub-menu .menu-item:focus .item-title, .sub-menu .menu-item:active .item-title {
  color: #3CC1C8;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
}
.sub-menu .menu-item.active .item-title {
  background-color: #3CC1C8;
  color: #ffffff;
}

.menu-sub {
  position: relative;
  z-index: 1;
  margin-bottom: 15px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .menu-sub {
    min-height: 45px;
    margin-bottom: 5px;
  }
}
.menu-sub:after {
  content: "";
  clear: both;
  display: block;
}
.menu-sub .menu-left,
.menu-sub .menu-right {
  float: left;
  width: 50%;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .menu-sub .menu-left,
.menu-sub .menu-right {
    padding: 0 3px;
  }
}
.menu-sub .menu-left .menu-item,
.menu-sub .menu-right .menu-item {
  position: relative;
  width: 230px;
  display: inline-block;
  text-align: center;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .menu-sub .menu-left .menu-item,
.menu-sub .menu-right .menu-item {
    margin-bottom: 5px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .menu-sub .menu-left .menu-item,
.menu-sub .menu-right .menu-item {
    width: 200px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .menu-sub .menu-left .menu-item,
.menu-sub .menu-right .menu-item {
    width: 100%;
  }
}
.menu-sub .menu-left .menu-item .item-bg,
.menu-sub .menu-right .menu-item .item-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  background-color: #E7E7E7;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.menu-sub .menu-left .menu-item .item-title,
.menu-sub .menu-right .menu-item .item-title {
  color: #7D7D7D;
  position: relative;
  padding: 0.5em 0.5em;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .menu-sub .menu-left .menu-item .item-title,
.menu-sub .menu-right .menu-item .item-title {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .menu-sub .menu-left .menu-item .item-title,
.menu-sub .menu-right .menu-item .item-title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .menu-sub .menu-left .menu-item .item-title,
.menu-sub .menu-right .menu-item .item-title {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .menu-sub .menu-left .menu-item .item-title,
.menu-sub .menu-right .menu-item .item-title {
    padding: 0.5em 0.2em;
  }
}
.menu-sub .menu-left .menu-item:hover, .menu-sub .menu-left .menu-item:focus, .menu-sub .menu-left .menu-item:active,
.menu-sub .menu-right .menu-item:hover,
.menu-sub .menu-right .menu-item:focus,
.menu-sub .menu-right .menu-item:active {
  -webkit-transform: translateY(-4px);
  -moz-transform: translateY(-4px);
  -ms-transform: translateY(-4px);
  -o-transform: translateY(-4px);
}
.menu-sub .menu-left .menu-item:hover .item-bg, .menu-sub .menu-left .menu-item:focus .item-bg, .menu-sub .menu-left .menu-item:active .item-bg,
.menu-sub .menu-right .menu-item:hover .item-bg,
.menu-sub .menu-right .menu-item:focus .item-bg,
.menu-sub .menu-right .menu-item:active .item-bg {
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
}
.menu-sub .menu-left .menu-item:hover .item-title, .menu-sub .menu-left .menu-item:focus .item-title, .menu-sub .menu-left .menu-item:active .item-title,
.menu-sub .menu-right .menu-item:hover .item-title,
.menu-sub .menu-right .menu-item:focus .item-title,
.menu-sub .menu-right .menu-item:active .item-title {
  color: #F3A21D;
}
.menu-sub .menu-left .menu-item.active .item-bg,
.menu-sub .menu-right .menu-item.active .item-bg {
  background-color: #F3A21D;
}
.menu-sub .menu-left .menu-item.active .item-title,
.menu-sub .menu-right .menu-item.active .item-title {
  color: #ffffff;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .menu-sub .menu-left {
    text-align: right;
    padding-right: 60px;
  }
  .menu-sub .menu-left .menu-item .item-bg {
    -webkit-transform: skewX(26.8deg);
    -moz-transform: skewX(26.8deg);
    -ms-transform: skewX(26.8deg);
    -o-transform: skewX(26.8deg);
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .menu-sub .menu-left .menu-item .item-bg {
    -webkit-transform: skewX(-26.8deg);
    -moz-transform: skewX(-26.8deg);
    -ms-transform: skewX(-26.8deg);
    -o-transform: skewX(-26.8deg);
  }
}
.menu-sub .menu-right .menu-item .item-bg {
  -webkit-transform: skewX(-26.8deg);
  -moz-transform: skewX(-26.8deg);
  -ms-transform: skewX(-26.8deg);
  -o-transform: skewX(-26.8deg);
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .menu-sub .menu-right {
    padding-left: 60px;
  }
}

.home-slide {
  position: relative;
  overflow: hidden;
}
.home-slide + section {
  margin-top: -252px;
  position: relative;
  z-index: 1;
  overflow: hidden;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-slide + section {
    margin-top: -223px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-slide + section {
    margin-top: -111px;
  }
}
.home-slide .swiper-container .swiper-wrapper .swiper-slide {
  height: 810px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-slide .swiper-container .swiper-wrapper .swiper-slide {
    height: 720px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-slide .swiper-container .swiper-wrapper .swiper-slide {
    height: 360px;
  }
}
.home-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
  width: 100%;
  height: 100%;
}
.home-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-bg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
}
.home-slide .slide-cover {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  pointer-events: none;
}
.home-slide .slide-cover .cover-bg,
.home-slide .slide-cover .cover-layer1,
.home-slide .slide-cover .cover-layer2 {
  position: absolute;
  left: 0;
  top: 0;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  background-position: center bottom;
}
.home-slide .slide-cover .cover-bg {
  background-image: url("../../img/common/home/slide_cover_bg.png");
}
.home-slide .slide-cover .cover-layer1 {
  -webkit-transform: translateX(-100vw);
  -moz-transform: translateX(-100vw);
  -ms-transform: translateX(-100vw);
  -o-transform: translateX(-100vw);
  background-image: url("../../img/common/home/slide_cover_layer1.png");
}
.home-slide .slide-cover .cover-layer1.active {
  -webkit-animation: anim-cover-layer1 10000ms 0 linear;
  -moz-animation: anim-cover-layer1 10000ms 0 linear;
  -ms-animation: anim-cover-layer1 10000ms 0 linear;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  -moz-animation-direction: alternate;
  -ms-animation-direction: alternate;
  -webkit-animation-delay: 0;
  -moz-animation-delay: 0;
  -ms-animation-delay: 0;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-slide .slide-cover .cover-layer1 {
    opacity: 0;
  }
}
.home-slide .slide-cover .cover-layer2 {
  -webkit-transform: translateX(100vw);
  -moz-transform: translateX(100vw);
  -ms-transform: translateX(100vw);
  -o-transform: translateX(100vw);
  background-image: url("../../img/common/home/slide_cover_layer2.png");
}
.home-slide .slide-cover .cover-layer2.active {
  -webkit-animation: anim-cover-layer2 8000ms 0 linear;
  -moz-animation: anim-cover-layer2 8000ms 0 linear;
  -ms-animation: anim-cover-layer2 8000ms 0 linear;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  -webkit-animation-direction: alternate;
  -moz-animation-direction: alternate;
  -ms-animation-direction: alternate;
  -webkit-animation-delay: 0;
  -moz-animation-delay: 0;
  -ms-animation-delay: 0;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-slide .slide-cover .cover-layer2 {
    opacity: 0;
  }
}

@-webkit-keyframes anim-cover-layer1 {
  0% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
  }
  25% {
    -webkit-transform: translateX(-2vw);
    -moz-transform: translateX(-2vw);
    -ms-transform: translateX(-2vw);
    -o-transform: translateX(-2vw);
  }
  75% {
    -webkit-transform: translateX(2vw);
    -moz-transform: translateX(2vw);
    -ms-transform: translateX(2vw);
    -o-transform: translateX(2vw);
  }
  100% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
  }
}
@keyframes anim-cover-layer1 {
  0% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
  }
  25% {
    -webkit-transform: translateX(-2vw);
    -moz-transform: translateX(-2vw);
    -ms-transform: translateX(-2vw);
    -o-transform: translateX(-2vw);
  }
  75% {
    -webkit-transform: translateX(2vw);
    -moz-transform: translateX(2vw);
    -ms-transform: translateX(2vw);
    -o-transform: translateX(2vw);
  }
  100% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
  }
}
@-webkit-keyframes anim-cover-layer2 {
  0% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
  }
  25% {
    -webkit-transform: translateX(2vw);
    -moz-transform: translateX(2vw);
    -ms-transform: translateX(2vw);
    -o-transform: translateX(2vw);
  }
  75% {
    -webkit-transform: translateX(-2vw);
    -moz-transform: translateX(-2vw);
    -ms-transform: translateX(-2vw);
    -o-transform: translateX(-2vw);
  }
  100% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
  }
}
@keyframes anim-cover-layer2 {
  0% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
  }
  25% {
    -webkit-transform: translateX(2vw);
    -moz-transform: translateX(2vw);
    -ms-transform: translateX(2vw);
    -o-transform: translateX(2vw);
  }
  75% {
    -webkit-transform: translateX(-2vw);
    -moz-transform: translateX(-2vw);
    -ms-transform: translateX(-2vw);
    -o-transform: translateX(-2vw);
  }
  100% {
    -webkit-transform: translateX(0);
    -moz-transform: translateX(0);
    -ms-transform: translateX(0);
    -o-transform: translateX(0);
  }
}
.loading {
  text-align: center;
  position: fixed;
  width: 100%;
  height: 100%;
  overflow: hidden;
  left: 0;
  top: 0;
  z-index: 12;
}
.loading .loading-bg {
  width: 100%;
  height: 100%;
  background-color: #F3F3F3;
  position: absolute;
  left: 0;
  top: 0;
}
.loading .loading-step1 {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}
.loading .loading-step1 .loading-logo img {
  width: 450px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .loading .loading-step1 .loading-logo img {
    width: 360px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .loading .loading-step1 .loading-logo img {
    width: 240px;
  }
}
.loading .loading-step2 {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .loading .loading-step2 {
    display: none;
  }
}
.loading .loading-step2 .cover {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}
.loading .loading-step2 .cover-left {
  -webkit-transform: translateY(10vw);
  -moz-transform: translateY(10vw);
  -ms-transform: translateY(10vw);
  -o-transform: translateY(10vw);
}
.loading .loading-step2 .cover-right {
  -webkit-transform: translateY(-10vw);
  -moz-transform: translateY(-10vw);
  -ms-transform: translateY(-10vw);
  -o-transform: translateY(-10vw);
}
.loading .loading-step2 .cover1 {
  background-image: url("../../img/common/loading/cover1.png");
}
.loading .loading-step2 .cover2 {
  background-image: url("../../img/common/loading/cover2.png");
}
.loading .loading-step2 .cover3 {
  background-image: url("../../img/common/loading/cover3.png");
}

.home-mission {
  padding: 60px 0;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-mission {
    padding: 30px 0;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-mission {
    padding: 20px 0;
  }
}
.home-mission .mission-title {
  color: #000000;
  line-height: 1.2em;
  margin-bottom: 0.6em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .home-mission .mission-title {
    font-size: 27px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-mission .mission-title {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-mission .mission-title {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-mission .mission-title br {
    display: none;
  }
}
.home-mission .mission-title-sub {
  margin-bottom: 0.5em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .home-mission .mission-title-sub {
    font-size: 21px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-mission .mission-title-sub {
    font-size: 17px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-mission .mission-title-sub {
    font-size: 16px;
  }
}
.home-mission .mission-detail {
  color: #666666;
  line-height: 1.8em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .home-mission .mission-detail {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-mission .mission-detail {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-mission .mission-detail {
    font-size: 12px;
  }
}

.home-news {
  margin-bottom: 4px;
}
.home-news .news-top {
  text-align: center;
  padding: 80px 0 30px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-news .news-top {
    padding: 40px 0 15px;
  }
}
.home-news .news-top .news-title {
  display: inline-block;
  position: relative;
  color: #222222;
  text-transform: uppercase;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .home-news .news-top .news-title {
    font-size: 27px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-news .news-top .news-title {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-news .news-top .news-title {
    font-size: 20px;
  }
}
.home-news .news-top .news-title .view-all {
  display: inline-block;
  color: #F3A21D;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .home-news .news-top .news-title .view-all {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-news .news-top .news-title .view-all {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-news .news-top .news-title .view-all {
    font-size: 12px;
  }
}
.home-news .news-top .news-title .view-all .plus {
  display: inline-block;
  position: relative;
  width: 8px;
  height: 8px;
}
.home-news .news-top .news-title .view-all .plus:before, .home-news .news-top .news-title .view-all .plus:after {
  content: "";
  position: absolute;
  background-color: #F3A21D;
}
.home-news .news-top .news-title .view-all .plus:before {
  width: 100%;
  height: 2px;
  margin-top: calc( -2px / 2);
  left: 0;
  top: 50%;
}
.home-news .news-top .news-title .view-all .plus:after {
  width: 2px;
  height: 100%;
  margin-left: calc( -2px / 2);
  left: 50%;
  top: 0;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-news .news-top .news-title .view-all {
    position: absolute;
    left: 100%;
    top: 50%;
    margin-top: -0.8em;
    margin-left: 15px;
    text-align: left;
    width: 100px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-news .news-top .news-title .view-all {
    display: block;
  }
}
.home-news .news-bottom {
  background-color: #001447;
  color: #ffffff;
}
.home-news .news-bottom .news-slide {
  padding: 0 90px;
  position: relative;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-news .news-bottom .news-slide {
    padding: 0 25px;
  }
}
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
  padding: 0 15px;
}
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img {
  min-height: 490px;
  width: 100%;
  height: 100%;
  max-width: 890px;
  margin-left: auto;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img {
    min-height: 320px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img {
    min-height: 200px;
  }
}
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img .img-bg {
  opacity: 0;
  -webkit-transform: scale(0.9);
  -moz-transform: scale(0.9);
  -ms-transform: scale(0.9);
  -o-transform: scale(0.9);
  -webkit-transition: 0.3s all 0.3s;
  -moz-transition: 0.3s all 0.3s;
  -ms-transition: 0.3s all 0.3s;
  -o-transition: 0.3s all 0.3s;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
}
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper {
  padding: 95px 80px;
  max-width: 975px;
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper {
    padding: 60px 0 60px 50px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper {
    padding: 40px 0 40px 40px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper {
    padding: 30px 0;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper {
    padding: 15px 0;
  }
}
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-title,
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-hr,
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-detail,
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-btn {
  opacity: 0;
}
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-title {
  line-height: 1.2em;
  -webkit-transition: 0.3s all 0.3s;
  -moz-transition: 0.3s all 0.3s;
  -ms-transition: 0.3s all 0.3s;
  -o-transition: 0.3s all 0.3s;
  -webkit-transform: translate(0, -2vw);
  -moz-transform: translate(0, -2vw);
  -ms-transform: translate(0, -2vw);
  -o-transform: translate(0, -2vw);
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-title {
    font-size: 27px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-title {
    font-size: 23px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-title {
    font-size: 19px;
  }
}
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-hr {
  border-top: 1px solid #ffffff;
  width: 100%;
  max-width: 140px;
  margin: 30px 0;
  -webkit-transition: 0.3s all 0.4s;
  -moz-transition: 0.3s all 0.4s;
  -ms-transition: 0.3s all 0.4s;
  -o-transition: 0.3s all 0.4s;
  -webkit-transform: translate(2vw, 0);
  -moz-transform: translate(2vw, 0);
  -ms-transform: translate(2vw, 0);
  -o-transform: translate(2vw, 0);
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-hr {
    margin: 15px 0;
  }
}
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-detail {
  line-height: 2em;
  margin-bottom: 1.8em;
  -webkit-transition: 0.3s all 0.5s;
  -moz-transition: 0.3s all 0.5s;
  -ms-transition: 0.3s all 0.5s;
  -o-transition: 0.3s all 0.5s;
  -webkit-transform: translate(2vw, 0);
  -moz-transform: translate(2vw, 0);
  -ms-transform: translate(2vw, 0);
  -o-transform: translate(2vw, 0);
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-detail {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-detail {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-detail {
    font-size: 12px;
  }
}
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-btn {
  -webkit-transition: 0.3s all 0.6s;
  -moz-transition: 0.3s all 0.6s;
  -ms-transition: 0.3s all 0.6s;
  -o-transition: 0.3s all 0.6s;
  -webkit-transform: translate(0, 2vw);
  -moz-transform: translate(0, 2vw);
  -ms-transform: translate(0, 2vw);
  -o-transform: translate(0, 2vw);
}
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-btn .btn-news {
  display: inline-block;
  max-width: 140px;
  width: 100%;
  padding: 5px 17px;
  background-color: #F3A21D;
  color: #ffffff;
  font-weight: 700;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-btn .btn-news {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-btn .btn-news {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-btn .btn-news {
    font-size: 12px;
  }
}
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-btn .btn-news .arrow {
  float: right;
  margin-right: 5px;
  margin-top: 0.5em;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  display: inline-block;
  width: 8px;
  height: 8px;
  border-top: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
}
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-btn .btn-news:hover, .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-btn .btn-news:focus, .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-btn .btn-news:active {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
}
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-btn .btn-news:hover .arrow, .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-btn .btn-news:focus .arrow, .home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-btn .btn-news:active .arrow {
  margin-right: 0;
}
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide.swiper-slide-active .slide-item .item-img .img-bg {
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  opacity: 1;
}
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide.swiper-slide-active .slide-item .item-wrapper .item-title,
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide.swiper-slide-active .slide-item .item-wrapper .item-hr,
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide.swiper-slide-active .slide-item .item-wrapper .item-detail,
.home-news .news-bottom .news-slide .swiper-container .swiper-wrapper .swiper-slide.swiper-slide-active .slide-item .item-wrapper .item-btn {
  opacity: 1;
  -webkit-transform: translate(0, 0);
  -moz-transform: translate(0, 0);
  -ms-transform: translate(0, 0);
  -o-transform: translate(0, 0);
}
.home-news .news-bottom .news-slide .swiper-button-prev,
.home-news .news-bottom .news-slide .swiper-button-next {
  width: 45px;
  height: 45px;
  opacity: 0.2;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-news .news-bottom .news-slide .swiper-button-prev,
.home-news .news-bottom .news-slide .swiper-button-next {
    width: 15px;
    height: 15px;
  }
}
.home-news .news-bottom .news-slide .swiper-button-prev:hover, .home-news .news-bottom .news-slide .swiper-button-prev:focus, .home-news .news-bottom .news-slide .swiper-button-prev:active,
.home-news .news-bottom .news-slide .swiper-button-next:hover,
.home-news .news-bottom .news-slide .swiper-button-next:focus,
.home-news .news-bottom .news-slide .swiper-button-next:active {
  opacity: 1;
  outline: 0;
}
.home-news .news-bottom .news-slide .swiper-button-prev:after,
.home-news .news-bottom .news-slide .swiper-button-next:after {
  color: #ffffff;
  width: 100%;
  height: 100%;
  border-top: 2px solid #ffffff;
  border-left: 2px solid #ffffff;
  content: "";
}
.home-news .news-bottom .news-slide .swiper-button-prev {
  left: 30px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-news .news-bottom .news-slide .swiper-button-prev {
    left: 8px;
  }
}
.home-news .news-bottom .news-slide .swiper-button-prev:after {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
}
.home-news .news-bottom .news-slide .swiper-button-next {
  right: 30px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-news .news-bottom .news-slide .swiper-button-next {
    right: 8px;
  }
}
.home-news .news-bottom .news-slide .swiper-button-next:after {
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -o-transform: rotate(135deg);
}

.home-event {
  overflow: hidden;
  margin-bottom: 50px;
}
.home-event .event-slide {
  padding: 0 5vw;
  position: relative;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-event .event-slide {
    padding: 0 10vw;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-event .event-slide {
    padding: 0 25px;
  }
}
.home-event .event-slide .swiper-container {
  overflow: inherit;
}
.home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide {
  width: calc(25% - 4px);
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide {
    width: calc(50% - 4px);
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide {
    width: 100%;
  }
}
.home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
  width: 100%;
  -ms-perspective: 500;
  perspective: 500;
}
.home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img {
  display: block;
  width: 100%;
  height: 12.76vw;
  overflow: hidden;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img {
    height: 25.52vw;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img {
    height: 51vw;
  }
}
.home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img .img-bg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img:hover .img-bg, .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img:focus .img-bg, .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img:active .img-bg {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper {
  padding: 15px 15px;
  -webkit-perspective-origin: top center;
  -moz-perspective-origin: top center;
  -ms-perspective-origin: top center;
  -o-perspective-origin: top center;
  -webkit-transform-origin: top center;
  -moz-transform-origin: top center;
  -ms-transform-origin: top center;
  -o-transform-origin: top center;
  -webkit-transform: rotateX(90deg);
  -moz-transform: rotateX(90deg);
  -ms-transform: rotateX(90deg);
  -o-transform: rotateX(90deg);
  opacity: 0;
  visibility: hidden;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  background-color: rgba(0, 0, 0, 0.23);
}
.home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-date {
  color: #999999;
  font-weight: 700;
  font-size: 12px;
  letter-spacing: 0.1em;
}
.home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-title {
  color: #222222;
  margin-bottom: 0.3em;
  display: block;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-title {
    font-size: 21px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-title {
    font-size: 17px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-title {
    font-size: 15px;
  }
}
.home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-title:hover, .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-title:focus, .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-title:active {
  color: #F3A21D;
}
.home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-detail {
  color: #666666;
  line-height: 1.8em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-detail {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-detail {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-detail {
    font-size: 12px;
  }
}
.home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-detail .detail-inner {
  min-height: 5.4em;
}
.home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-detail a {
  color: #F3A21D;
}
.home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-detail a:hover, .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-detail a:focus, .home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-wrapper .item-detail a:active {
  text-decoration: underline;
}
.home-event .event-slide .swiper-container .swiper-wrapper .swiper-slide.swiper-slide-visible .slide-item .item-wrapper {
  -webkit-transform: rotateX(0deg);
  -moz-transform: rotateX(0deg);
  -ms-transform: rotateX(0deg);
  -o-transform: rotateX(0deg);
  opacity: 1;
  visibility: visible;
  background-color: transparent;
}
.home-event .event-slide .swiper-button-prev,
.home-event .event-slide .swiper-button-next {
  width: 5vw;
  height: 12.76vw;
  top: 0;
  margin-top: 0;
  background-color: rgba(255, 255, 255, 0.5);
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-event .event-slide .swiper-button-prev,
.home-event .event-slide .swiper-button-next {
    width: 10vw;
    height: 25.52vw;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-event .event-slide .swiper-button-prev,
.home-event .event-slide .swiper-button-next {
    width: 25px;
    height: 51vw;
  }
}
.home-event .event-slide .swiper-button-prev:hover, .home-event .event-slide .swiper-button-prev:focus, .home-event .event-slide .swiper-button-prev:active,
.home-event .event-slide .swiper-button-next:hover,
.home-event .event-slide .swiper-button-next:focus,
.home-event .event-slide .swiper-button-next:active {
  outline: 0;
}
.home-event .event-slide .swiper-button-prev:hover:after, .home-event .event-slide .swiper-button-prev:focus:after, .home-event .event-slide .swiper-button-prev:active:after,
.home-event .event-slide .swiper-button-next:hover:after,
.home-event .event-slide .swiper-button-next:focus:after,
.home-event .event-slide .swiper-button-next:active:after {
  border-color: #F3A21D;
}
.home-event .event-slide .swiper-button-prev:after,
.home-event .event-slide .swiper-button-next:after {
  position: absolute;
  color: #ffffff;
  width: 45px;
  height: 45px;
  margin-top: -22px;
  top: 50%;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  border-top: 2px solid #ffffff;
  border-left: 2px solid #ffffff;
  content: "";
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-event .event-slide .swiper-button-prev:after,
.home-event .event-slide .swiper-button-next:after {
    width: 15px;
    height: 15px;
    margin-top: -7px;
  }
}
.home-event .event-slide .swiper-button-prev {
  left: 0;
}
.home-event .event-slide .swiper-button-prev:after {
  left: 50%;
  margin-left: -22px;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-event .event-slide .swiper-button-prev:after {
    left: 100%;
  }
}
.home-event .event-slide .swiper-button-next {
  right: 0;
}
.home-event .event-slide .swiper-button-next:after {
  right: 50%;
  margin-right: -22px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -o-transform: rotate(135deg);
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-event .event-slide .swiper-button-next:after {
    right: 100%;
  }
}

.home-partners {
  padding: 60px 0 120px;
  position: relative;
  overflow: hidden;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-partners {
    padding: 30px 0 60px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-partners {
    padding: 15px 0 30px;
  }
}
.home-partners .section-bg {
  position: absolute;
  width: 100%;
  height: 100%;
}
.home-partners .partners-title {
  position: relative;
  color: #222222;
  text-transform: uppercase;
  text-align: center;
  margin-bottom: 50px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .home-partners .partners-title {
    font-size: 27px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .home-partners .partners-title {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-partners .partners-title {
    font-size: 20px;
  }
}
.home-partners .container {
  position: relative;
}
.home-partners .partners-slide {
  position: relative;
}
.home-partners .partners-slide .swiper-container {
  width: 1200px;
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .home-partners .partners-slide .swiper-container {
    width: 992px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .home-partners .partners-slide .swiper-container {
    width: 768px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-partners .partners-slide .swiper-container {
    width: 290px;
  }
}
.home-partners .partners-slide .swiper-container .swiper-wrapper .swiper-slide {
  padding: 5px;
}
.home-partners .partners-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
  display: block;
  margin: 0 auto;
  width: 100%;
  max-width: 265px;
  height: 150px;
  background-color: #F8F8F8;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.home-partners .partners-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img {
  width: 100%;
  height: 100%;
}
.home-partners .partners-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img .img-bg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
}
.home-partners .partners-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover, .home-partners .partners-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus, .home-partners .partners-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active {
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
  -webkit-transform: translateY(-4px);
  -moz-transform: translateY(-4px);
  -ms-transform: translateY(-4px);
  -o-transform: translateY(-4px);
}
.home-partners .partners-slide .swiper-button-prev,
.home-partners .partners-slide .swiper-button-next {
  width: 45px;
  height: 45px;
  opacity: 1;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-partners .partners-slide .swiper-button-prev,
.home-partners .partners-slide .swiper-button-next {
    margin-top: -8px;
    width: 15px;
    height: 15px;
  }
}
.home-partners .partners-slide .swiper-button-prev:hover, .home-partners .partners-slide .swiper-button-prev:focus, .home-partners .partners-slide .swiper-button-prev:active,
.home-partners .partners-slide .swiper-button-next:hover,
.home-partners .partners-slide .swiper-button-next:focus,
.home-partners .partners-slide .swiper-button-next:active {
  opacity: 1;
  outline: 0;
}
.home-partners .partners-slide .swiper-button-prev:after,
.home-partners .partners-slide .swiper-button-next:after {
  color: #ffffff;
  width: 100%;
  height: 100%;
  border-top: 2px solid #F3A21D;
  border-left: 2px solid #F3A21D;
  content: "";
}
.home-partners .partners-slide .swiper-button-prev {
  left: 30px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-partners .partners-slide .swiper-button-prev {
    left: 0px;
  }
}
.home-partners .partners-slide .swiper-button-prev:after {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
}
.home-partners .partners-slide .swiper-button-next {
  right: 30px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home-partners .partners-slide .swiper-button-next {
    right: 0px;
  }
}
.home-partners .partners-slide .swiper-button-next:after {
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -o-transform: rotate(135deg);
}

.parallax-section {
  position: relative;
}
.parallax-section .parallax-bg {
  position: absolute;
  width: 100%;
  height: 100%;
  max-height: 670px;
  left: 0;
  bottom: 0;
}
.parallax-section .container {
  position: relative;
}

.resource-main,
.project-main,
.news-main {
  padding: 40px 0;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main,
.project-main,
.news-main {
    padding: 20px 0;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-main,
.project-main,
.news-main {
    padding: 0px 0 20px;
  }
}
.resource-main .resource-menu .menu-btn,
.resource-main .project-menu .menu-btn,
.resource-main .news-menu .menu-btn,
.project-main .resource-menu .menu-btn,
.project-main .project-menu .menu-btn,
.project-main .news-menu .menu-btn,
.news-main .resource-menu .menu-btn,
.news-main .project-menu .menu-btn,
.news-main .news-menu .menu-btn {
  display: block;
  padding: 0.5em 1.2em;
  background-color: #F3A21D;
  text-align: center;
  color: #ffffff;
  font-weight: 700;
  margin-bottom: 20px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-main .resource-menu .menu-btn,
.resource-main .project-menu .menu-btn,
.resource-main .news-menu .menu-btn,
.project-main .resource-menu .menu-btn,
.project-main .project-menu .menu-btn,
.project-main .news-menu .menu-btn,
.news-main .resource-menu .menu-btn,
.news-main .project-menu .menu-btn,
.news-main .news-menu .menu-btn {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .resource-menu .menu-btn,
.resource-main .project-menu .menu-btn,
.resource-main .news-menu .menu-btn,
.project-main .resource-menu .menu-btn,
.project-main .project-menu .menu-btn,
.project-main .news-menu .menu-btn,
.news-main .resource-menu .menu-btn,
.news-main .project-menu .menu-btn,
.news-main .news-menu .menu-btn {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-main .resource-menu .menu-btn,
.resource-main .project-menu .menu-btn,
.resource-main .news-menu .menu-btn,
.project-main .resource-menu .menu-btn,
.project-main .project-menu .menu-btn,
.project-main .news-menu .menu-btn,
.news-main .resource-menu .menu-btn,
.news-main .project-menu .menu-btn,
.news-main .news-menu .menu-btn {
    font-size: 14px;
  }
}
.resource-main .resource-menu .menu-btn:hover, .resource-main .resource-menu .menu-btn:focus, .resource-main .resource-menu .menu-btn:active,
.resource-main .project-menu .menu-btn:hover,
.resource-main .project-menu .menu-btn:focus,
.resource-main .project-menu .menu-btn:active,
.resource-main .news-menu .menu-btn:hover,
.resource-main .news-menu .menu-btn:focus,
.resource-main .news-menu .menu-btn:active,
.project-main .resource-menu .menu-btn:hover,
.project-main .resource-menu .menu-btn:focus,
.project-main .resource-menu .menu-btn:active,
.project-main .project-menu .menu-btn:hover,
.project-main .project-menu .menu-btn:focus,
.project-main .project-menu .menu-btn:active,
.project-main .news-menu .menu-btn:hover,
.project-main .news-menu .menu-btn:focus,
.project-main .news-menu .menu-btn:active,
.news-main .resource-menu .menu-btn:hover,
.news-main .resource-menu .menu-btn:focus,
.news-main .resource-menu .menu-btn:active,
.news-main .project-menu .menu-btn:hover,
.news-main .project-menu .menu-btn:focus,
.news-main .project-menu .menu-btn:active,
.news-main .news-menu .menu-btn:hover,
.news-main .news-menu .menu-btn:focus,
.news-main .news-menu .menu-btn:active {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
}
.resource-main .resource-menu .menu-wrapper,
.resource-main .project-menu .menu-wrapper,
.resource-main .news-menu .menu-wrapper,
.project-main .resource-menu .menu-wrapper,
.project-main .project-menu .menu-wrapper,
.project-main .news-menu .menu-wrapper,
.news-main .resource-menu .menu-wrapper,
.news-main .project-menu .menu-wrapper,
.news-main .news-menu .menu-wrapper {
  background-color: #F8F8F8;
  padding: 15px 15px 30px 15px;
  margin-bottom: 20px;
}
.resource-main .resource-menu .menu-wrapper .wrapper-title,
.resource-main .project-menu .menu-wrapper .wrapper-title,
.resource-main .news-menu .menu-wrapper .wrapper-title,
.project-main .resource-menu .menu-wrapper .wrapper-title,
.project-main .project-menu .menu-wrapper .wrapper-title,
.project-main .news-menu .menu-wrapper .wrapper-title,
.news-main .resource-menu .menu-wrapper .wrapper-title,
.news-main .project-menu .menu-wrapper .wrapper-title,
.news-main .news-menu .menu-wrapper .wrapper-title {
  padding-bottom: 10px;
  font-weight: 700;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-main .resource-menu .menu-wrapper .wrapper-title,
.resource-main .project-menu .menu-wrapper .wrapper-title,
.resource-main .news-menu .menu-wrapper .wrapper-title,
.project-main .resource-menu .menu-wrapper .wrapper-title,
.project-main .project-menu .menu-wrapper .wrapper-title,
.project-main .news-menu .menu-wrapper .wrapper-title,
.news-main .resource-menu .menu-wrapper .wrapper-title,
.news-main .project-menu .menu-wrapper .wrapper-title,
.news-main .news-menu .menu-wrapper .wrapper-title {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .resource-menu .menu-wrapper .wrapper-title,
.resource-main .project-menu .menu-wrapper .wrapper-title,
.resource-main .news-menu .menu-wrapper .wrapper-title,
.project-main .resource-menu .menu-wrapper .wrapper-title,
.project-main .project-menu .menu-wrapper .wrapper-title,
.project-main .news-menu .menu-wrapper .wrapper-title,
.news-main .resource-menu .menu-wrapper .wrapper-title,
.news-main .project-menu .menu-wrapper .wrapper-title,
.news-main .news-menu .menu-wrapper .wrapper-title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-main .resource-menu .menu-wrapper .wrapper-title,
.resource-main .project-menu .menu-wrapper .wrapper-title,
.resource-main .news-menu .menu-wrapper .wrapper-title,
.project-main .resource-menu .menu-wrapper .wrapper-title,
.project-main .project-menu .menu-wrapper .wrapper-title,
.project-main .news-menu .menu-wrapper .wrapper-title,
.news-main .resource-menu .menu-wrapper .wrapper-title,
.news-main .project-menu .menu-wrapper .wrapper-title,
.news-main .news-menu .menu-wrapper .wrapper-title {
    font-size: 14px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .resource-menu .menu-wrapper .wrapper-title,
.resource-main .project-menu .menu-wrapper .wrapper-title,
.resource-main .news-menu .menu-wrapper .wrapper-title,
.project-main .resource-menu .menu-wrapper .wrapper-title,
.project-main .project-menu .menu-wrapper .wrapper-title,
.project-main .news-menu .menu-wrapper .wrapper-title,
.news-main .resource-menu .menu-wrapper .wrapper-title,
.news-main .project-menu .menu-wrapper .wrapper-title,
.news-main .news-menu .menu-wrapper .wrapper-title {
    padding-left: 10px;
    padding-right: 10px;
  }
}
.resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title {
  position: relative;
  padding-right: 60px;
}
.resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear {
  display: inline-block;
  position: absolute;
  top: 0.8em;
  right: 0;
  font-size: 10px;
  color: #888888;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear {
    right: 10px;
  }
}
.resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross {
  display: inline-block;
  margin-left: 0.3em;
  display: inline-block;
  position: relative;
  width: 9px;
  height: 9px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
}
.resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before, .resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after {
  content: "";
  position: absolute;
  background-color: #888888;
}
.resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before {
  width: 100%;
  height: 1px;
  margin-top: calc( -1px / 2);
  left: 0;
  top: 50%;
}
.resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after {
  width: 1px;
  height: 100%;
  margin-left: calc( -1px / 2);
  left: 50%;
  top: 0;
}
.resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before, .resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:before,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear .cross:after {
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover, .resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus, .resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active {
  color: #F3A21D;
}
.resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:before, .resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:after, .resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:before, .resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:after, .resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:before, .resource-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:after,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:before,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:after,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:before,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:after,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:before,
.resource-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:after,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:before,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:after,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:before,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:after,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:before,
.resource-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:after,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:before,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:after,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:before,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:after,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:before,
.project-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:after,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:before,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:after,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:before,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:after,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:before,
.project-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:after,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:before,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:after,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:before,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:after,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:before,
.project-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:after,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:before,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:after,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:before,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:after,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:before,
.news-main .resource-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:after,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:before,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:after,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:before,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:after,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:before,
.news-main .project-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:after,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:before,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:hover .cross:after,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:before,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:focus .cross:after,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:before,
.news-main .news-menu .menu-wrapper.menu-filter .wrapper-title .btn-clear:active .cross:after {
  background-color: #F3A21D;
}
.resource-main .resource-menu .menu-wrapper.menu-filter .filter-list,
.resource-main .project-menu .menu-wrapper.menu-filter .filter-list,
.resource-main .news-menu .menu-wrapper.menu-filter .filter-list,
.project-main .resource-menu .menu-wrapper.menu-filter .filter-list,
.project-main .project-menu .menu-wrapper.menu-filter .filter-list,
.project-main .news-menu .menu-wrapper.menu-filter .filter-list,
.news-main .resource-menu .menu-wrapper.menu-filter .filter-list,
.news-main .project-menu .menu-wrapper.menu-filter .filter-list,
.news-main .news-menu .menu-wrapper.menu-filter .filter-list {
  border-bottom: 1px solid #CDCDCD;
  margin-bottom: 20px;
}
.resource-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item,
.resource-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item,
.resource-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item,
.project-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item,
.project-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item,
.project-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item,
.news-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item,
.news-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item,
.news-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item {
  border-top: 1px solid #CDCDCD;
  padding: 5px 0;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item,
.resource-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item,
.resource-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item,
.project-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item,
.project-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item,
.project-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item,
.news-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item,
.news-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item,
.news-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item {
    padding-left: 10px;
    padding-right: 10px;
  }
}
.resource-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.resource-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.resource-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.project-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.project-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.project-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.news-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.news-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.news-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title {
  padding: 10px 0;
  cursor: pointer;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.resource-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.resource-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.project-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.project-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.project-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.news-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.news-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.news-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.resource-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.resource-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.project-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.project-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.project-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.news-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.news-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.news-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.resource-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.resource-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.project-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.project-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.project-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.news-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.news-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title,
.news-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title {
    font-size: 14px;
  }
}
.resource-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title .arrow,
.resource-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title .arrow,
.resource-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title .arrow,
.project-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title .arrow,
.project-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title .arrow,
.project-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title .arrow,
.news-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title .arrow,
.news-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title .arrow,
.news-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-title .arrow {
  float: right;
  margin-top: 0.55rem;
  display: inline-block;
  width: 8px;
  height: 8px;
  border-top: 2px solid #F3A21D;
  border-right: 2px solid #F3A21D;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.resource-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.resource-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.resource-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.project-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.project-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.project-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.news-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.news-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.news-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail {
  display: none;
  color: #666666;
  padding-bottom: 15px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.resource-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.resource-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.project-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.project-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.project-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.news-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.news-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.news-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.resource-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.resource-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.project-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.project-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.project-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.news-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.news-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.news-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.resource-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.resource-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.project-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.project-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.project-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.news-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.news-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail,
.news-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail {
    font-size: 12px;
  }
}
.resource-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail .custom-checkbox .custom-control-label,
.resource-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail .custom-checkbox .custom-control-label,
.resource-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail .custom-checkbox .custom-control-label,
.project-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail .custom-checkbox .custom-control-label,
.project-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail .custom-checkbox .custom-control-label,
.project-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail .custom-checkbox .custom-control-label,
.news-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail .custom-checkbox .custom-control-label,
.news-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail .custom-checkbox .custom-control-label,
.news-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item .item-detail .custom-checkbox .custom-control-label {
  padding-top: 0.15em;
}
.resource-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item.active .item-title .arrow,
.resource-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item.active .item-title .arrow,
.resource-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item.active .item-title .arrow,
.project-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item.active .item-title .arrow,
.project-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item.active .item-title .arrow,
.project-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item.active .item-title .arrow,
.news-main .resource-menu .menu-wrapper.menu-filter .filter-list .list-item.active .item-title .arrow,
.news-main .project-menu .menu-wrapper.menu-filter .filter-list .list-item.active .item-title .arrow,
.news-main .news-menu .menu-wrapper.menu-filter .filter-list .list-item.active .item-title .arrow {
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .resource-menu .menu-wrapper .tags-list,
.resource-main .project-menu .menu-wrapper .tags-list,
.resource-main .news-menu .menu-wrapper .tags-list,
.project-main .resource-menu .menu-wrapper .tags-list,
.project-main .project-menu .menu-wrapper .tags-list,
.project-main .news-menu .menu-wrapper .tags-list,
.news-main .resource-menu .menu-wrapper .tags-list,
.news-main .project-menu .menu-wrapper .tags-list,
.news-main .news-menu .menu-wrapper .tags-list {
    padding: 0 10px 10px 10px;
  }
}
.resource-main .resource-menu .menu-wrapper .tags-list .list-item,
.resource-main .project-menu .menu-wrapper .tags-list .list-item,
.resource-main .news-menu .menu-wrapper .tags-list .list-item,
.project-main .resource-menu .menu-wrapper .tags-list .list-item,
.project-main .project-menu .menu-wrapper .tags-list .list-item,
.project-main .news-menu .menu-wrapper .tags-list .list-item,
.news-main .resource-menu .menu-wrapper .tags-list .list-item,
.news-main .project-menu .menu-wrapper .tags-list .list-item,
.news-main .news-menu .menu-wrapper .tags-list .list-item {
  background-color: #F3A21D;
  color: #ffffff;
  padding: 0em 0.6em;
  display: inline-block;
  border-radius: 8px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  margin-right: 2px;
  margin-bottom: 4px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-main .resource-menu .menu-wrapper .tags-list .list-item,
.resource-main .project-menu .menu-wrapper .tags-list .list-item,
.resource-main .news-menu .menu-wrapper .tags-list .list-item,
.project-main .resource-menu .menu-wrapper .tags-list .list-item,
.project-main .project-menu .menu-wrapper .tags-list .list-item,
.project-main .news-menu .menu-wrapper .tags-list .list-item,
.news-main .resource-menu .menu-wrapper .tags-list .list-item,
.news-main .project-menu .menu-wrapper .tags-list .list-item,
.news-main .news-menu .menu-wrapper .tags-list .list-item {
    font-size: 12px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .resource-menu .menu-wrapper .tags-list .list-item,
.resource-main .project-menu .menu-wrapper .tags-list .list-item,
.resource-main .news-menu .menu-wrapper .tags-list .list-item,
.project-main .resource-menu .menu-wrapper .tags-list .list-item,
.project-main .project-menu .menu-wrapper .tags-list .list-item,
.project-main .news-menu .menu-wrapper .tags-list .list-item,
.news-main .resource-menu .menu-wrapper .tags-list .list-item,
.news-main .project-menu .menu-wrapper .tags-list .list-item,
.news-main .news-menu .menu-wrapper .tags-list .list-item {
    font-size: 11px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-main .resource-menu .menu-wrapper .tags-list .list-item,
.resource-main .project-menu .menu-wrapper .tags-list .list-item,
.resource-main .news-menu .menu-wrapper .tags-list .list-item,
.project-main .resource-menu .menu-wrapper .tags-list .list-item,
.project-main .project-menu .menu-wrapper .tags-list .list-item,
.project-main .news-menu .menu-wrapper .tags-list .list-item,
.news-main .resource-menu .menu-wrapper .tags-list .list-item,
.news-main .project-menu .menu-wrapper .tags-list .list-item,
.news-main .news-menu .menu-wrapper .tags-list .list-item {
    font-size: 10px;
  }
}
.resource-main .resource-menu .menu-wrapper .tags-list .list-item:last-child,
.resource-main .project-menu .menu-wrapper .tags-list .list-item:last-child,
.resource-main .news-menu .menu-wrapper .tags-list .list-item:last-child,
.project-main .resource-menu .menu-wrapper .tags-list .list-item:last-child,
.project-main .project-menu .menu-wrapper .tags-list .list-item:last-child,
.project-main .news-menu .menu-wrapper .tags-list .list-item:last-child,
.news-main .resource-menu .menu-wrapper .tags-list .list-item:last-child,
.news-main .project-menu .menu-wrapper .tags-list .list-item:last-child,
.news-main .news-menu .menu-wrapper .tags-list .list-item:last-child {
  margin-right: 0;
}
.resource-main .resource-menu .menu-wrapper .tags-list .list-item:hover, .resource-main .resource-menu .menu-wrapper .tags-list .list-item:focus, .resource-main .resource-menu .menu-wrapper .tags-list .list-item:active,
.resource-main .project-menu .menu-wrapper .tags-list .list-item:hover,
.resource-main .project-menu .menu-wrapper .tags-list .list-item:focus,
.resource-main .project-menu .menu-wrapper .tags-list .list-item:active,
.resource-main .news-menu .menu-wrapper .tags-list .list-item:hover,
.resource-main .news-menu .menu-wrapper .tags-list .list-item:focus,
.resource-main .news-menu .menu-wrapper .tags-list .list-item:active,
.project-main .resource-menu .menu-wrapper .tags-list .list-item:hover,
.project-main .resource-menu .menu-wrapper .tags-list .list-item:focus,
.project-main .resource-menu .menu-wrapper .tags-list .list-item:active,
.project-main .project-menu .menu-wrapper .tags-list .list-item:hover,
.project-main .project-menu .menu-wrapper .tags-list .list-item:focus,
.project-main .project-menu .menu-wrapper .tags-list .list-item:active,
.project-main .news-menu .menu-wrapper .tags-list .list-item:hover,
.project-main .news-menu .menu-wrapper .tags-list .list-item:focus,
.project-main .news-menu .menu-wrapper .tags-list .list-item:active,
.news-main .resource-menu .menu-wrapper .tags-list .list-item:hover,
.news-main .resource-menu .menu-wrapper .tags-list .list-item:focus,
.news-main .resource-menu .menu-wrapper .tags-list .list-item:active,
.news-main .project-menu .menu-wrapper .tags-list .list-item:hover,
.news-main .project-menu .menu-wrapper .tags-list .list-item:focus,
.news-main .project-menu .menu-wrapper .tags-list .list-item:active,
.news-main .news-menu .menu-wrapper .tags-list .list-item:hover,
.news-main .news-menu .menu-wrapper .tags-list .list-item:focus,
.news-main .news-menu .menu-wrapper .tags-list .list-item:active {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
}
.resource-main .resource-menu .menu-wrapper .tags-search,
.resource-main .project-menu .menu-wrapper .tags-search,
.resource-main .news-menu .menu-wrapper .tags-search,
.project-main .resource-menu .menu-wrapper .tags-search,
.project-main .project-menu .menu-wrapper .tags-search,
.project-main .news-menu .menu-wrapper .tags-search,
.news-main .resource-menu .menu-wrapper .tags-search,
.news-main .project-menu .menu-wrapper .tags-search,
.news-main .news-menu .menu-wrapper .tags-search {
  position: relative;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .resource-menu .menu-wrapper .tags-search,
.resource-main .project-menu .menu-wrapper .tags-search,
.resource-main .news-menu .menu-wrapper .tags-search,
.project-main .resource-menu .menu-wrapper .tags-search,
.project-main .project-menu .menu-wrapper .tags-search,
.project-main .news-menu .menu-wrapper .tags-search,
.news-main .resource-menu .menu-wrapper .tags-search,
.news-main .project-menu .menu-wrapper .tags-search,
.news-main .news-menu .menu-wrapper .tags-search {
    margin: 0 10px 10px 10px;
  }
}
.resource-main .resource-menu .menu-wrapper .tags-search:before, .resource-main .resource-menu .menu-wrapper .tags-search:after,
.resource-main .project-menu .menu-wrapper .tags-search:before,
.resource-main .project-menu .menu-wrapper .tags-search:after,
.resource-main .news-menu .menu-wrapper .tags-search:before,
.resource-main .news-menu .menu-wrapper .tags-search:after,
.project-main .resource-menu .menu-wrapper .tags-search:before,
.project-main .resource-menu .menu-wrapper .tags-search:after,
.project-main .project-menu .menu-wrapper .tags-search:before,
.project-main .project-menu .menu-wrapper .tags-search:after,
.project-main .news-menu .menu-wrapper .tags-search:before,
.project-main .news-menu .menu-wrapper .tags-search:after,
.news-main .resource-menu .menu-wrapper .tags-search:before,
.news-main .resource-menu .menu-wrapper .tags-search:after,
.news-main .project-menu .menu-wrapper .tags-search:before,
.news-main .project-menu .menu-wrapper .tags-search:after,
.news-main .news-menu .menu-wrapper .tags-search:before,
.news-main .news-menu .menu-wrapper .tags-search:after {
  content: "";
  position: absolute;
  top: 100%;
  height: 1px;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.resource-main .resource-menu .menu-wrapper .tags-search:before,
.resource-main .project-menu .menu-wrapper .tags-search:before,
.resource-main .news-menu .menu-wrapper .tags-search:before,
.project-main .resource-menu .menu-wrapper .tags-search:before,
.project-main .project-menu .menu-wrapper .tags-search:before,
.project-main .news-menu .menu-wrapper .tags-search:before,
.news-main .resource-menu .menu-wrapper .tags-search:before,
.news-main .project-menu .menu-wrapper .tags-search:before,
.news-main .news-menu .menu-wrapper .tags-search:before {
  left: 0;
  width: 100%;
  background-color: #CDCDCD;
}
.resource-main .resource-menu .menu-wrapper .tags-search:after,
.resource-main .project-menu .menu-wrapper .tags-search:after,
.resource-main .news-menu .menu-wrapper .tags-search:after,
.project-main .resource-menu .menu-wrapper .tags-search:after,
.project-main .project-menu .menu-wrapper .tags-search:after,
.project-main .news-menu .menu-wrapper .tags-search:after,
.news-main .resource-menu .menu-wrapper .tags-search:after,
.news-main .project-menu .menu-wrapper .tags-search:after,
.news-main .news-menu .menu-wrapper .tags-search:after {
  left: 50%;
  width: 0;
  background-color: #F3A21D;
}
.resource-main .resource-menu .menu-wrapper .tags-search:hover:after, .resource-main .resource-menu .menu-wrapper .tags-search:focus:after, .resource-main .resource-menu .menu-wrapper .tags-search:active:after,
.resource-main .project-menu .menu-wrapper .tags-search:hover:after,
.resource-main .project-menu .menu-wrapper .tags-search:focus:after,
.resource-main .project-menu .menu-wrapper .tags-search:active:after,
.resource-main .news-menu .menu-wrapper .tags-search:hover:after,
.resource-main .news-menu .menu-wrapper .tags-search:focus:after,
.resource-main .news-menu .menu-wrapper .tags-search:active:after,
.project-main .resource-menu .menu-wrapper .tags-search:hover:after,
.project-main .resource-menu .menu-wrapper .tags-search:focus:after,
.project-main .resource-menu .menu-wrapper .tags-search:active:after,
.project-main .project-menu .menu-wrapper .tags-search:hover:after,
.project-main .project-menu .menu-wrapper .tags-search:focus:after,
.project-main .project-menu .menu-wrapper .tags-search:active:after,
.project-main .news-menu .menu-wrapper .tags-search:hover:after,
.project-main .news-menu .menu-wrapper .tags-search:focus:after,
.project-main .news-menu .menu-wrapper .tags-search:active:after,
.news-main .resource-menu .menu-wrapper .tags-search:hover:after,
.news-main .resource-menu .menu-wrapper .tags-search:focus:after,
.news-main .resource-menu .menu-wrapper .tags-search:active:after,
.news-main .project-menu .menu-wrapper .tags-search:hover:after,
.news-main .project-menu .menu-wrapper .tags-search:focus:after,
.news-main .project-menu .menu-wrapper .tags-search:active:after,
.news-main .news-menu .menu-wrapper .tags-search:hover:after,
.news-main .news-menu .menu-wrapper .tags-search:focus:after,
.news-main .news-menu .menu-wrapper .tags-search:active:after {
  left: 0;
  width: 100%;
}
.resource-main .resource-menu .menu-wrapper .tags-search .search-input,
.resource-main .project-menu .menu-wrapper .tags-search .search-input,
.resource-main .news-menu .menu-wrapper .tags-search .search-input,
.project-main .resource-menu .menu-wrapper .tags-search .search-input,
.project-main .project-menu .menu-wrapper .tags-search .search-input,
.project-main .news-menu .menu-wrapper .tags-search .search-input,
.news-main .resource-menu .menu-wrapper .tags-search .search-input,
.news-main .project-menu .menu-wrapper .tags-search .search-input,
.news-main .news-menu .menu-wrapper .tags-search .search-input {
  display: block;
  background-color: transparent;
  border: 0;
  width: 100%;
  height: 30px;
  padding-right: 35px;
  font-family: "Open Sans", "Microsoft JhengHei", "Helvetica Neue", sans-serif;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-main .resource-menu .menu-wrapper .tags-search .search-input,
.resource-main .project-menu .menu-wrapper .tags-search .search-input,
.resource-main .news-menu .menu-wrapper .tags-search .search-input,
.project-main .resource-menu .menu-wrapper .tags-search .search-input,
.project-main .project-menu .menu-wrapper .tags-search .search-input,
.project-main .news-menu .menu-wrapper .tags-search .search-input,
.news-main .resource-menu .menu-wrapper .tags-search .search-input,
.news-main .project-menu .menu-wrapper .tags-search .search-input,
.news-main .news-menu .menu-wrapper .tags-search .search-input {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .resource-menu .menu-wrapper .tags-search .search-input,
.resource-main .project-menu .menu-wrapper .tags-search .search-input,
.resource-main .news-menu .menu-wrapper .tags-search .search-input,
.project-main .resource-menu .menu-wrapper .tags-search .search-input,
.project-main .project-menu .menu-wrapper .tags-search .search-input,
.project-main .news-menu .menu-wrapper .tags-search .search-input,
.news-main .resource-menu .menu-wrapper .tags-search .search-input,
.news-main .project-menu .menu-wrapper .tags-search .search-input,
.news-main .news-menu .menu-wrapper .tags-search .search-input {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-main .resource-menu .menu-wrapper .tags-search .search-input,
.resource-main .project-menu .menu-wrapper .tags-search .search-input,
.resource-main .news-menu .menu-wrapper .tags-search .search-input,
.project-main .resource-menu .menu-wrapper .tags-search .search-input,
.project-main .project-menu .menu-wrapper .tags-search .search-input,
.project-main .news-menu .menu-wrapper .tags-search .search-input,
.news-main .resource-menu .menu-wrapper .tags-search .search-input,
.news-main .project-menu .menu-wrapper .tags-search .search-input,
.news-main .news-menu .menu-wrapper .tags-search .search-input {
    font-size: 12px;
  }
}
.resource-main .resource-menu .menu-wrapper .tags-search .search-btn,
.resource-main .project-menu .menu-wrapper .tags-search .search-btn,
.resource-main .news-menu .menu-wrapper .tags-search .search-btn,
.project-main .resource-menu .menu-wrapper .tags-search .search-btn,
.project-main .project-menu .menu-wrapper .tags-search .search-btn,
.project-main .news-menu .menu-wrapper .tags-search .search-btn,
.news-main .resource-menu .menu-wrapper .tags-search .search-btn,
.news-main .project-menu .menu-wrapper .tags-search .search-btn,
.news-main .news-menu .menu-wrapper .tags-search .search-btn {
  width: 30px;
  height: 30px;
  position: absolute;
  top: 0;
  right: 0;
  padding: 5px;
}
.resource-main .resource-menu .menu-wrapper .tags-search .search-btn svg,
.resource-main .project-menu .menu-wrapper .tags-search .search-btn svg,
.resource-main .news-menu .menu-wrapper .tags-search .search-btn svg,
.project-main .resource-menu .menu-wrapper .tags-search .search-btn svg,
.project-main .project-menu .menu-wrapper .tags-search .search-btn svg,
.project-main .news-menu .menu-wrapper .tags-search .search-btn svg,
.news-main .resource-menu .menu-wrapper .tags-search .search-btn svg,
.news-main .project-menu .menu-wrapper .tags-search .search-btn svg,
.news-main .news-menu .menu-wrapper .tags-search .search-btn svg {
  width: 100%;
  height: 100%;
}
.resource-main .resource-menu .menu-wrapper .tags-search .search-btn svg path,
.resource-main .project-menu .menu-wrapper .tags-search .search-btn svg path,
.resource-main .news-menu .menu-wrapper .tags-search .search-btn svg path,
.project-main .resource-menu .menu-wrapper .tags-search .search-btn svg path,
.project-main .project-menu .menu-wrapper .tags-search .search-btn svg path,
.project-main .news-menu .menu-wrapper .tags-search .search-btn svg path,
.news-main .resource-menu .menu-wrapper .tags-search .search-btn svg path,
.news-main .project-menu .menu-wrapper .tags-search .search-btn svg path,
.news-main .news-menu .menu-wrapper .tags-search .search-btn svg path {
  fill: #F3A21D;
}
.resource-main .resource-list .list-item,
.project-main .resource-list .list-item,
.news-main .resource-list .list-item {
  width: 100%;
  max-width: 270px;
  margin: 0 auto 25px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-main .resource-list .list-item,
.project-main .resource-list .list-item,
.news-main .resource-list .list-item {
    max-width: inherit;
  }
}
.resource-main .resource-list .list-item .item-img,
.project-main .resource-list .list-item .item-img,
.news-main .resource-list .list-item .item-img {
  height: 144px;
  display: block;
  overflow: hidden;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-main .resource-list .list-item .item-img,
.project-main .resource-list .list-item .item-img,
.news-main .resource-list .list-item .item-img {
    height: 143px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .resource-list .list-item .item-img,
.project-main .resource-list .list-item .item-img,
.news-main .resource-list .list-item .item-img {
    height: 151px;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .resource-main .resource-list .list-item .item-img,
.project-main .resource-list .list-item .item-img,
.news-main .resource-list .list-item .item-img {
    height: 286px;
  }
}
@media (max-width: 575px) {
  .resource-main .resource-list .list-item .item-img,
.project-main .resource-list .list-item .item-img,
.news-main .resource-list .list-item .item-img {
    height: calc((100vw - 30px) * 9 / 16);
  }
}
.resource-main .resource-list .list-item .item-img .img-bg,
.project-main .resource-list .list-item .item-img .img-bg,
.news-main .resource-list .list-item .item-img .img-bg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.resource-main .resource-list .list-item .item-img:hover .img-bg, .resource-main .resource-list .list-item .item-img:focus .img-bg, .resource-main .resource-list .list-item .item-img:active .img-bg,
.project-main .resource-list .list-item .item-img:hover .img-bg,
.project-main .resource-list .list-item .item-img:focus .img-bg,
.project-main .resource-list .list-item .item-img:active .img-bg,
.news-main .resource-list .list-item .item-img:hover .img-bg,
.news-main .resource-list .list-item .item-img:focus .img-bg,
.news-main .resource-list .list-item .item-img:active .img-bg {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.resource-main .resource-list .list-item .item-main,
.project-main .resource-list .list-item .item-main,
.news-main .resource-list .list-item .item-main {
  padding: 20px;
  background-color: #F5F4F6;
}
.resource-main .resource-list .list-item .item-main .item-wrapper,
.project-main .resource-list .list-item .item-main .item-wrapper,
.news-main .resource-list .list-item .item-main .item-wrapper {
  position: relative;
}
.resource-main .resource-list .list-item .item-main .item-wrapper .item-title,
.project-main .resource-list .list-item .item-main .item-wrapper .item-title,
.news-main .resource-list .list-item .item-main .item-wrapper .item-title {
  color: #111111;
  line-height: 0.8em;
  margin-bottom: 0.8em;
  padding-right: 35px;
  min-height: 24px;
  display: block;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-main .resource-list .list-item .item-main .item-wrapper .item-title,
.project-main .resource-list .list-item .item-main .item-wrapper .item-title,
.news-main .resource-list .list-item .item-main .item-wrapper .item-title {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .resource-list .list-item .item-main .item-wrapper .item-title,
.project-main .resource-list .list-item .item-main .item-wrapper .item-title,
.news-main .resource-list .list-item .item-main .item-wrapper .item-title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-main .resource-list .list-item .item-main .item-wrapper .item-title,
.project-main .resource-list .list-item .item-main .item-wrapper .item-title,
.news-main .resource-list .list-item .item-main .item-wrapper .item-title {
    font-size: 14px;
  }
}
.resource-main .resource-list .list-item .item-main .item-wrapper .item-title:hover, .resource-main .resource-list .list-item .item-main .item-wrapper .item-title:focus, .resource-main .resource-list .list-item .item-main .item-wrapper .item-title:active,
.project-main .resource-list .list-item .item-main .item-wrapper .item-title:hover,
.project-main .resource-list .list-item .item-main .item-wrapper .item-title:focus,
.project-main .resource-list .list-item .item-main .item-wrapper .item-title:active,
.news-main .resource-list .list-item .item-main .item-wrapper .item-title:hover,
.news-main .resource-list .list-item .item-main .item-wrapper .item-title:focus,
.news-main .resource-list .list-item .item-main .item-wrapper .item-title:active {
  color: #F3A21D;
}
.resource-main .resource-list .list-item .item-main .item-wrapper .item-mark,
.project-main .resource-list .list-item .item-main .item-wrapper .item-mark,
.news-main .resource-list .list-item .item-main .item-wrapper .item-mark {
  display: inline-block;
  position: absolute;
  top: 0;
  right: 0;
  width: 24px;
  height: 24px;
  border-radius: 100%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  overflow: hidden;
  background-color: #ffffff;
  background-image: url("../../img/common/resource/icon_mark.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.resource-main .resource-list .list-item .item-main .item-wrapper .item-mark.active,
.project-main .resource-list .list-item .item-main .item-wrapper .item-mark.active,
.news-main .resource-list .list-item .item-main .item-wrapper .item-mark.active {
  background-image: url("../../img/common/resource/icon_mark_active.png");
}
.resource-main .resource-list .list-item .item-main .item-wrapper .item-mark:hover, .resource-main .resource-list .list-item .item-main .item-wrapper .item-mark:focus, .resource-main .resource-list .list-item .item-main .item-wrapper .item-mark:active,
.project-main .resource-list .list-item .item-main .item-wrapper .item-mark:hover,
.project-main .resource-list .list-item .item-main .item-wrapper .item-mark:focus,
.project-main .resource-list .list-item .item-main .item-wrapper .item-mark:active,
.news-main .resource-list .list-item .item-main .item-wrapper .item-mark:hover,
.news-main .resource-list .list-item .item-main .item-wrapper .item-mark:focus,
.news-main .resource-list .list-item .item-main .item-wrapper .item-mark:active {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}
.resource-main .resource-list .list-item .item-main .item-wrapper .item-detail,
.project-main .resource-list .list-item .item-main .item-wrapper .item-detail,
.news-main .resource-list .list-item .item-main .item-wrapper .item-detail {
  color: #5E5E5E;
  line-height: 1.6em;
  margin-bottom: 0.4em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-main .resource-list .list-item .item-main .item-wrapper .item-detail,
.project-main .resource-list .list-item .item-main .item-wrapper .item-detail,
.news-main .resource-list .list-item .item-main .item-wrapper .item-detail {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .resource-list .list-item .item-main .item-wrapper .item-detail,
.project-main .resource-list .list-item .item-main .item-wrapper .item-detail,
.news-main .resource-list .list-item .item-main .item-wrapper .item-detail {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-main .resource-list .list-item .item-main .item-wrapper .item-detail,
.project-main .resource-list .list-item .item-main .item-wrapper .item-detail,
.news-main .resource-list .list-item .item-main .item-wrapper .item-detail {
    font-size: 12px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px) {
  .resource-main .resource-list .list-item .item-main .item-wrapper .item-detail,
.project-main .resource-list .list-item .item-main .item-wrapper .item-detail,
.news-main .resource-list .list-item .item-main .item-wrapper .item-detail {
    min-height: 140px;
  }
}
.resource-main .resource-list .list-item .item-main .item-wrapper .item-detail a,
.project-main .resource-list .list-item .item-main .item-wrapper .item-detail a,
.news-main .resource-list .list-item .item-main .item-wrapper .item-detail a {
  display: inline-block;
  color: #F3A21D;
}
.resource-main .resource-list .list-item .item-main .item-wrapper .item-detail a:hover, .resource-main .resource-list .list-item .item-main .item-wrapper .item-detail a:focus, .resource-main .resource-list .list-item .item-main .item-wrapper .item-detail a:active,
.project-main .resource-list .list-item .item-main .item-wrapper .item-detail a:hover,
.project-main .resource-list .list-item .item-main .item-wrapper .item-detail a:focus,
.project-main .resource-list .list-item .item-main .item-wrapper .item-detail a:active,
.news-main .resource-list .list-item .item-main .item-wrapper .item-detail a:hover,
.news-main .resource-list .list-item .item-main .item-wrapper .item-detail a:focus,
.news-main .resource-list .list-item .item-main .item-wrapper .item-detail a:active {
  text-decoration: underline;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px) {
  .resource-main .resource-list .list-item .item-main .item-wrapper .item-tags,
.project-main .resource-list .list-item .item-main .item-wrapper .item-tags,
.news-main .resource-list .list-item .item-main .item-wrapper .item-tags {
    min-height: 110px;
  }
}
.resource-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item,
.project-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item,
.news-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item {
  background-color: #F3A21D;
  color: #ffffff;
  padding: 0em 0.6em;
  display: inline-block;
  border-radius: 8px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  margin-right: 2px;
  margin-bottom: 4px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item,
.project-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item,
.news-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item {
    font-size: 12px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item,
.project-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item,
.news-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item {
    font-size: 11px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item,
.project-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item,
.news-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item {
    font-size: 10px;
  }
}
.resource-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item:last-child,
.project-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item:last-child,
.news-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item:last-child {
  margin-right: 0;
}
.resource-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item:hover, .resource-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item:focus, .resource-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item:active,
.project-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item:hover,
.project-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item:focus,
.project-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item:active,
.news-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item:hover,
.news-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item:focus,
.news-main .resource-list .list-item .item-main .item-wrapper .item-tags .tags-item:active {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
}
.resource-main .project-list .list-item,
.project-main .project-list .list-item,
.news-main .project-list .list-item {
  display: block;
  margin-bottom: 20px;
}
.resource-main .project-list .list-item .item-img,
.project-main .project-list .list-item .item-img,
.news-main .project-list .list-item .item-img {
  width: 254px;
  height: 142px;
  border: 1px solid #E7E7E7;
  margin: 0 auto 15px;
  overflow: hidden;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
@media (min-width: 576px) and (max-width: 767px) {
  .resource-main .project-list .list-item .item-img,
.project-main .project-list .list-item .item-img,
.news-main .project-list .list-item .item-img {
    width: 510px;
    height: 286px;
  }
}
@media (max-width: 575px) {
  .resource-main .project-list .list-item .item-img,
.project-main .project-list .list-item .item-img,
.news-main .project-list .list-item .item-img {
    width: 100%;
    height: calc((100vw - 30px) * 9 / 16);
  }
}
.resource-main .project-list .list-item .item-img .img-bg,
.project-main .project-list .list-item .item-img .img-bg,
.news-main .project-list .list-item .item-img .img-bg {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.resource-main .project-list .list-item .item-title,
.project-main .project-list .list-item .item-title,
.news-main .project-list .list-item .item-title {
  text-align: center;
  color: #111111;
  line-height: 1.2em;
  min-height: 64px;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-main .project-list .list-item .item-title,
.project-main .project-list .list-item .item-title,
.news-main .project-list .list-item .item-title {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .project-list .list-item .item-title,
.project-main .project-list .list-item .item-title,
.news-main .project-list .list-item .item-title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-main .project-list .list-item .item-title,
.project-main .project-list .list-item .item-title,
.news-main .project-list .list-item .item-title {
    font-size: 14px;
  }
}
.resource-main .project-list .list-item:hover .item-img, .resource-main .project-list .list-item:focus .item-img, .resource-main .project-list .list-item:active .item-img,
.project-main .project-list .list-item:hover .item-img,
.project-main .project-list .list-item:focus .item-img,
.project-main .project-list .list-item:active .item-img,
.news-main .project-list .list-item:hover .item-img,
.news-main .project-list .list-item:focus .item-img,
.news-main .project-list .list-item:active .item-img {
  border-color: #F3A21D;
  -webkit-transform: translateY(-4px);
  -moz-transform: translateY(-4px);
  -ms-transform: translateY(-4px);
  -o-transform: translateY(-4px);
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
}
.resource-main .project-list .list-item:hover .item-img .img-bg, .resource-main .project-list .list-item:focus .item-img .img-bg, .resource-main .project-list .list-item:active .item-img .img-bg,
.project-main .project-list .list-item:hover .item-img .img-bg,
.project-main .project-list .list-item:focus .item-img .img-bg,
.project-main .project-list .list-item:active .item-img .img-bg,
.news-main .project-list .list-item:hover .item-img .img-bg,
.news-main .project-list .list-item:focus .item-img .img-bg,
.news-main .project-list .list-item:active .item-img .img-bg {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
}
.resource-main .project-list .list-item:hover .item-title, .resource-main .project-list .list-item:focus .item-title, .resource-main .project-list .list-item:active .item-title,
.project-main .project-list .list-item:hover .item-title,
.project-main .project-list .list-item:focus .item-title,
.project-main .project-list .list-item:active .item-title,
.news-main .project-list .list-item:hover .item-title,
.news-main .project-list .list-item:focus .item-title,
.news-main .project-list .list-item:active .item-title {
  color: #F3A21D;
}
.resource-main .news-cat-list,
.project-main .news-cat-list,
.news-main .news-cat-list {
  margin-bottom: 30px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .news-cat-list,
.project-main .news-cat-list,
.news-main .news-cat-list {
    padding-left: 10px;
    padding-right: 10px;
  }
}
.resource-main .news-cat-list .list-item,
.project-main .news-cat-list .list-item,
.news-main .news-cat-list .list-item {
  display: block;
  color: #7D7D7D;
  position: relative;
  margin-bottom: 0.2em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-main .news-cat-list .list-item,
.project-main .news-cat-list .list-item,
.news-main .news-cat-list .list-item {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-main .news-cat-list .list-item,
.project-main .news-cat-list .list-item,
.news-main .news-cat-list .list-item {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-main .news-cat-list .list-item,
.project-main .news-cat-list .list-item,
.news-main .news-cat-list .list-item {
    font-size: 14px;
  }
}
.resource-main .news-cat-list .list-item span,
.project-main .news-cat-list .list-item span,
.news-main .news-cat-list .list-item span {
  position: absolute;
  left: 0;
  top: 0;
}
.resource-main .news-cat-list .list-item:hover, .resource-main .news-cat-list .list-item:focus, .resource-main .news-cat-list .list-item:active,
.project-main .news-cat-list .list-item:hover,
.project-main .news-cat-list .list-item:focus,
.project-main .news-cat-list .list-item:active,
.news-main .news-cat-list .list-item:hover,
.news-main .news-cat-list .list-item:focus,
.news-main .news-cat-list .list-item:active {
  padding-left: 0.2em;
}
.resource-main .news-cat-list .list-item.active,
.project-main .news-cat-list .list-item.active,
.news-main .news-cat-list .list-item.active {
  color: #F3A21D;
}

.search-result {
  margin-bottom: 20px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .search-result {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .search-result {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .search-result {
    font-size: 12px;
  }
}
.search-result .result-btn {
  background-color: #258DCF;
  color: #ffffff;
  padding: 0.2em 0.6em;
  font-size: 15px;
  display: inline-block;
}
.search-result .result-btn .btn-close {
  vertical-align: middle;
  display: inline-block;
  margin-left: 5px;
  margin-bottom: 3px;
  width: 14px;
  height: 14px;
  display: inline-block;
  position: relative;
  width: 14px;
  height: 14px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.search-result .result-btn .btn-close:before, .search-result .result-btn .btn-close:after {
  content: "";
  position: absolute;
  background-color: #FFFFFF;
}
.search-result .result-btn .btn-close:before {
  width: 100%;
  height: 2px;
  margin-top: calc( -2px / 2);
  left: 0;
  top: 50%;
}
.search-result .result-btn .btn-close:after {
  width: 2px;
  height: 100%;
  margin-left: calc( -2px / 2);
  left: 50%;
  top: 0;
}
.search-result .result-btn .btn-close:hover, .search-result .result-btn .btn-close:focus, .search-result .result-btn .btn-close:active {
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -o-transform: rotate(135deg);
}

.zabuto_calendar .badge-today {
  background-color: #D7D7D7 !important;
  color: black !important;
  text-shadow: none;
  width: 35px;
  height: 35px;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: -6px;
  margin-bottom: -6px;
}
.zabuto_calendar .day {
  display: flex;
  justify-content: center;
  align-items: center;
}

.news-calender {
  margin-bottom: 30px;
}
.news-calender .zabuto_calendar .table tr:last-child {
  border-bottom: 0;
}
.news-calender .zabuto_calendar .table th, .news-calender .zabuto_calendar .table td {
  border-top: 0;
  background-color: transparent;
}
.news-calender .zabuto_calendar .table .calendar-month-header th {
  background-color: transparent;
  padding-top: 4px;
}
.news-calender .zabuto_calendar .table .calendar-month-header th span {
  padding: 0;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-calender .zabuto_calendar .table .calendar-month-header th span {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-calender .zabuto_calendar .table .calendar-month-header th span {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-calender .zabuto_calendar .table .calendar-month-header th span {
    font-size: 12px;
  }
}
.news-calender .zabuto_calendar .table .calendar-month-header th .calendar-month-navigation {
  padding: 0;
}
.news-calender .zabuto_calendar .table .calendar-month-header th .calendar-month-navigation .glyphicon {
  display: inline-block;
  padding: 0;
}
.news-calender .zabuto_calendar .table .calendar-month-header th .calendar-month-navigation .glyphicon-chevron-left {
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
  border-width: 5px 10px 5px 0;
  border-right-color: #111111;
  border-top-color: fade(#111111, 0);
  border-bottom-color: fade(#111111, 0);
}
.news-calender .zabuto_calendar .table .calendar-month-header th .calendar-month-navigation .glyphicon-chevron-right {
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
  border-width: 5px 0 5px 10px;
  border-left-color: #111111;
  border-top-color: fade(#111111, 0);
  border-bottom-color: fade(#111111, 0);
}
.news-calender .zabuto_calendar .table .calendar-dow-header {
  color: #7A8B9E;
}
.news-calender .zabuto_calendar .table .calendar-dow-header th {
  background-color: transparent;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-calender .zabuto_calendar .table .calendar-dow-header th {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-calender .zabuto_calendar .table .calendar-dow-header th {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-calender .zabuto_calendar .table .calendar-dow-header th {
    font-size: 12px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-calender .zabuto_calendar .table .calendar-dow td {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-calender .zabuto_calendar .table .calendar-dow td {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-calender .zabuto_calendar .table .calendar-dow td {
    font-size: 12px;
  }
}
.news-calender .zabuto_calendar .table .calendar-dow td .day {
  max-width: 2em;
  margin-left: auto;
  margin-right: auto;
  padding: 0;
  color: #B7C3D8;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  border: 2px solid transparent;
  border-radius: 100%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
}
.news-calender .zabuto_calendar .table .calendar-dow td .day:hover, .news-calender .zabuto_calendar .table .calendar-dow td .day:focus, .news-calender .zabuto_calendar .table .calendar-dow td .day:active {
  color: #F3A21D;
}
.news-calender .zabuto_calendar .table .calendar-dow td .day .badge {
  font-size: 100%;
  background-color: #F3A21D;
  border-radius: 100%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  padding: 4px 0;
  width: 100%;
  height: 100%;
  display: inline-block;
}
.news-calender .zabuto_calendar .table .calendar-dow td.event .day {
  background-color: transparent;
  border-color: #B7C3D8;
}

@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .project-tab .tab-menu {
    border-bottom: 3px solid #F3A21D;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-tab .tab-menu {
    border-left: 3px solid #F3A21D;
  }
}
.project-tab .tab-menu:after {
  content: "";
  clear: both;
  display: block;
}
.project-tab .tab-menu .menu-item {
  background-color: #EFEFEF;
  color: #5E5E5E;
  padding: 0.4em 40px;
  margin-top: 4px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .project-tab .tab-menu .menu-item {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .project-tab .tab-menu .menu-item {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-tab .tab-menu .menu-item {
    font-size: 12px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .project-tab .tab-menu .menu-item {
    float: left;
    margin-right: 4px;
  }
  .project-tab .tab-menu .menu-item:last-child {
    margin-right: 0;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .project-tab .tab-menu .menu-item {
    padding: 0.4em 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-tab .tab-menu .menu-item {
    display: block;
    padding: 0.4em 15px;
  }
}
.project-tab .tab-menu .menu-item:hover, .project-tab .tab-menu .menu-item:focus, .project-tab .tab-menu .menu-item:active {
  color: #F3A21D;
}
.project-tab .tab-menu .menu-item.active {
  background-color: #F3A21D;
  color: #ffffff;
}
.project-tab .tab-detail {
  color: #666666;
  padding: 1.6em 15px;
  font-family: "Open Sans", "Microsoft JhengHei", "Helvetica Neue", sans-serif;
  line-height: 1.8em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .project-tab .tab-detail {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .project-tab .tab-detail {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-tab .tab-detail {
    font-size: 12px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-tab .tab-detail {
    padding-left: 0;
    padding-right: 0;
  }
}
.project-tab .tab-detail .detail-item {
  display: none;
}
.project-tab .tab-detail .detail-item.active {
  display: block;
}

.resource-detail-btn,
.project-detail-btn {
  /*

  .btn-view{
  	display: inline-block;
  	max-width: 140px;
  	width: 100%;
  	padding: .5em 1.2em;
  	@include rfs(14px, 13px, 12px);
  	background-color: $Buttercup;
  	color: $White;
  	font-weight: 700;

  	.arrow{
  		float: right;
  		margin-right: 5px;
  		margin-top: .5em;
  		@include transition(.3s all);
  		@include arrow(right, 8px, 2px, $White)
  	}
  	&:hover, &:focus, &:active{
  		@include materialDesignBoxShadow(1);
  		@include translateY(-2px);
  		.arrow{
  			margin-right:0;
  		}
  	}

  }

  */
  margin-bottom: 10px;
}
.resource-detail-btn .btn-view,
.project-detail-btn .btn-view {
  max-width: 180px;
}

.resource-detail:after {
  content: "";
  content: "";
  clear: both;
  display: block;
}
.resource-detail .col-left,
.resource-detail .col-right {
  float: left;
  width: 100%;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px) {
  .resource-detail .col-left {
    padding-right: 15px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-detail .col-left {
    width: 66%;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .resource-detail .col-left {
    width: 70%;
  }
}
.resource-detail .col-left .col-left-wrapper {
  position: relative;
}
.resource-detail .col-left .col-left-wrapper .detail-title {
  color: #111111;
  line-height: 1.2em;
  margin-bottom: 0.6em;
  min-height: 24px;
  font-weight: 500;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-detail .col-left .col-left-wrapper .detail-title {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-detail .col-left .col-left-wrapper .detail-title {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-detail .col-left .col-left-wrapper .detail-title {
    font-size: 20px;
  }
}
.resource-detail .col-left .col-left-wrapper .detail-title:first-child {
  padding-right: 35px;
}
.resource-detail .col-left .col-left-wrapper .detail-mark {
  display: inline-block;
  position: absolute;
  top: 10px;
  right: 0;
  width: 24px;
  height: 24px;
  border-radius: 100%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  overflow: hidden;
  background-color: #ffffff;
  background-image: url("../../img/common/resource/icon_mark.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  border: 1px solid #F8F8F8;
}
.resource-detail .col-left .col-left-wrapper .detail-mark.active {
  background-image: url("../../img/common/resource/icon_mark_active.png");
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-detail .col-left .col-left-wrapper .detail-mark {
    top: 4px;
  }
}
.resource-detail .col-left .col-left-wrapper .detail-mark:hover, .resource-detail .col-left .col-left-wrapper .detail-mark:focus, .resource-detail .col-left .col-left-wrapper .detail-mark:active {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}
.resource-detail .col-left .col-left-wrapper .detail-info {
  margin-bottom: 20px;
}
.resource-detail .col-left .col-left-wrapper .detail-info .info-item {
  margin-bottom: 8px;
}
.resource-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-title {
  color: #111111;
  font-weight: 600;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-title {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-title {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-title {
    font-size: 12px;
  }
}
.resource-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-list .info-item {
  color: #F3A21D;
  margin-right: 8px;
  font-family: "Open Sans", "Microsoft JhengHei", "Helvetica Neue", sans-serif;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-list .info-item {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-list .info-item {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-list .info-item {
    font-size: 12px;
  }
}
.resource-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-list .info-item:last-child {
  margin-right: 0;
}
.resource-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-list .info-item:hover, .resource-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-list .info-item:focus, .resource-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-list .info-item:active {
  text-decoration: underline;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-detail {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-detail {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-detail {
    font-size: 12px;
  }
}
.resource-detail .col-left .col-left-wrapper .detail-info .info-content {
  color: #666666;
  line-height: 1.8em;
  font-family: "Open Sans", "Microsoft JhengHei", "Helvetica Neue", sans-serif;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-detail .col-left .col-left-wrapper .detail-info .info-content {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-detail .col-left .col-left-wrapper .detail-info .info-content {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-detail .col-left .col-left-wrapper .detail-info .info-content {
    font-size: 12px;
  }
}
.resource-detail .col-left .col-left-wrapper .detail-info .info-content h4 {
  color: #111111;
  font-weight: 600;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-detail .col-left .col-left-wrapper .detail-info .info-content h4 {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-detail .col-left .col-left-wrapper .detail-info .info-content h4 {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-detail .col-left .col-left-wrapper .detail-info .info-content h4 {
    font-size: 12px;
  }
}
.resource-detail .col-left .col-left-wrapper .tags-list {
  margin-bottom: 40px;
}
.resource-detail .col-left .col-left-wrapper .tags-list .list-item {
  background-color: #F3A21D;
  color: #ffffff;
  padding: 0em 0.6em;
  display: inline-block;
  border-radius: 8px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  margin-right: 2px;
  margin-bottom: 4px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-detail .col-left .col-left-wrapper .tags-list .list-item {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-detail .col-left .col-left-wrapper .tags-list .list-item {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-detail .col-left .col-left-wrapper .tags-list .list-item {
    font-size: 12px;
  }
}
.resource-detail .col-left .col-left-wrapper .tags-list .list-item:last-child {
  margin-right: 0;
}
.resource-detail .col-left .col-left-wrapper .tags-list .list-item:hover, .resource-detail .col-left .col-left-wrapper .tags-list .list-item:focus, .resource-detail .col-left .col-left-wrapper .tags-list .list-item:active {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-detail .col-right {
    width: 34%;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .resource-detail .col-right {
    width: 30%;
  }
}
.resource-detail .col-right .detail-img img {
  max-width: 100%;
  margin-bottom: 15px;
}

.project-detail:after {
  content: "";
  content: "";
  clear: both;
  display: block;
}
.project-detail .col-left,
.project-detail .col-right {
  float: left;
  width: 100%;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px) {
  .project-detail .col-left {
    padding-right: 15px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .project-detail .col-left {
    width: 63%;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .project-detail .col-left {
    width: 60%;
  }
}
.project-detail .col-left .col-left-wrapper {
  position: relative;
}
.project-detail .col-left .col-left-wrapper .detail-title {
  color: #111111;
  line-height: 1.2em;
  margin-bottom: 1.6em;
  min-height: 24px;
  font-weight: 500;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .project-detail .col-left .col-left-wrapper .detail-title {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .project-detail .col-left .col-left-wrapper .detail-title {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-detail .col-left .col-left-wrapper .detail-title {
    font-size: 20px;
  }
}
.project-detail .col-left .col-left-wrapper .detail-mark {
  display: inline-block;
  position: absolute;
  top: 10px;
  right: 0;
  width: 24px;
  height: 24px;
  border-radius: 100%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  overflow: hidden;
  background-color: #ffffff;
  background-image: url("../../img/common/resource/icon_mark.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  border: 1px solid #F8F8F8;
}
.project-detail .col-left .col-left-wrapper .detail-mark.active {
  background-image: url("../../img/common/resource/icon_mark_active.png");
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .project-detail .col-left .col-left-wrapper .detail-mark {
    top: 4px;
  }
}
.project-detail .col-left .col-left-wrapper .detail-mark:hover, .project-detail .col-left .col-left-wrapper .detail-mark:focus, .project-detail .col-left .col-left-wrapper .detail-mark:active {
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
}
.project-detail .col-left .col-left-wrapper .detail-info {
  margin-bottom: 40px;
}
.project-detail .col-left .col-left-wrapper .detail-info .info-item {
  margin-bottom: 8px;
}
.project-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-title {
  color: #111111;
  font-weight: 600;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .project-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-title {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .project-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-title {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-title {
    font-size: 12px;
  }
}
.project-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-detail {
  line-height: 1.8em;
  color: #5E5E5E;
  font-family: "Open Sans", "Microsoft JhengHei", "Helvetica Neue", sans-serif;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .project-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-detail {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .project-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-detail {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-detail .col-left .col-left-wrapper .detail-info .info-item .info-item-detail {
    font-size: 12px;
  }
}
.project-detail .col-left .col-left-wrapper .detail-info .info-content {
  color: #5E5E5E;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .project-detail .col-left .col-left-wrapper .detail-info .info-content {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .project-detail .col-left .col-left-wrapper .detail-info .info-content {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-detail .col-left .col-left-wrapper .detail-info .info-content {
    font-size: 12px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .project-detail .col-right {
    width: 37%;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .project-detail .col-right {
    width: 40%;
  }
}
.project-detail .col-right .detail-img img {
  max-width: 100%;
  margin-bottom: 15px;
}

.resource-inner-main {
  padding: 40px 0;
  text-align: center;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-inner-main {
    padding: 20px 0;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-inner-main {
    padding: 0px 0 20px;
  }
}
.resource-inner-main .inner-title {
  font-weight: 500;
  margin-bottom: 0.5em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-inner-main .inner-title {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-inner-main .inner-title {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-inner-main .inner-title {
    font-size: 20px;
  }
}
.resource-inner-main .inner-title-sub {
  color: #F3A21D;
  margin-bottom: 1em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-inner-main .inner-title-sub {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-inner-main .inner-title-sub {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-inner-main .inner-title-sub {
    font-size: 12px;
  }
}
.resource-inner-main .inner-detail {
  color: #666666;
  margin-bottom: 100px;
  line-height: 1.8em;
  font-family: "Open Sans", "Microsoft JhengHei", "Helvetica Neue", sans-serif;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .resource-inner-main .inner-detail {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-inner-main .inner-detail {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-inner-main .inner-detail {
    font-size: 12px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .resource-inner-main .inner-detail {
    margin-bottom: 40px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .resource-inner-main .inner-detail {
    margin-bottom: 20px;
  }
}

.training-main {
  padding: 40px 0;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main {
    padding: 20px 0;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main {
    padding: 0px 0 20px;
  }
}
.training-main .training-title {
  text-align: center;
  color: #222222;
  padding: 1.5em 0;
  font-weight: 500;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .training-main .training-title {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-title {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-title {
    font-size: 20px;
  }
}
.training-main .training-upcoming-list .list-item {
  position: relative;
  margin-bottom: 35px;
}
.training-main .training-upcoming-list .list-item .item-img {
  display: block;
  width: 175px;
  overflow: hidden;
  cursor: text;
  /*
  @media (min-width: 576px) and (max-width: 767px), (max-width: 575px){
  	width: 100%;
  	height: 245px;
  }*/
  cursor: context-menu;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-upcoming-list .list-item .item-img {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-upcoming-list .list-item .item-img {
    width: 122px;
    height: 178px;
  }
}
.training-main .training-upcoming-list .list-item .item-img .img-bg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  /*
  @media (min-width: 576px) and (max-width: 767px), (max-width: 575px){
  	background-size: contain;
  }
  */
}
.training-main .training-upcoming-list .list-item .item-img.active {
  cursor: pointer;
}
.training-main .training-upcoming-list .list-item .item-img.active:hover .img-bg, .training-main .training-upcoming-list .list-item .item-img.active:focus .img-bg, .training-main .training-upcoming-list .list-item .item-img.active:active .img-bg {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.training-main .training-upcoming-list .list-item .item-wrapper {
  padding: 20px;
  background-color: #EFEFEF;
  background-image: url("../../img/common/training/upcoming/item_bg.png");
  background-size: contain;
  background-position: right center;
  background-repeat: no-repeat;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-upcoming-list .list-item .item-wrapper {
    min-height: 250px;
    margin-left: 180px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-upcoming-list .list-item .item-wrapper {
    min-height: 178px;
    margin-left: 122px;
    padding: 5px;
  }
}
.training-main .training-upcoming-list .list-item .item-wrapper .item-title {
  display: block;
  font-weight: 600;
  line-height: 1.2em;
  margin-bottom: 0.4em;
  color: #222222;
  cursor: text;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .training-main .training-upcoming-list .list-item .item-wrapper .item-title {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-upcoming-list .list-item .item-wrapper .item-title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-upcoming-list .list-item .item-wrapper .item-title {
    font-size: 14px;
  }
}
.training-main .training-upcoming-list .list-item .item-wrapper .item-title.active {
  cursor: pointer;
}
.training-main .training-upcoming-list .list-item .item-wrapper .item-title.active:hover, .training-main .training-upcoming-list .list-item .item-wrapper .item-title.active:focus, .training-main .training-upcoming-list .list-item .item-wrapper .item-title.active:active {
  color: #F3A21D;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px) {
  .training-main .training-upcoming-list .list-item .item-wrapper .item-title {
    min-height: 45px;
  }
}
.training-main .training-upcoming-list .list-item .item-wrapper .item-info-list {
  margin-bottom: 1em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .training-main .training-upcoming-list .list-item .item-wrapper .item-info-list {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-upcoming-list .list-item .item-wrapper .item-info-list {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-upcoming-list .list-item .item-wrapper .item-info-list {
    font-size: 12px;
  }
}
.training-main .training-upcoming-list .list-item .item-wrapper .item-info-list .info-item {
  position: relative;
}
.training-main .training-upcoming-list .list-item .item-wrapper .item-info-list .info-item .info-title {
  position: absolute;
  left: 0;
  top: 0;
  width: 50px;
}
.training-main .training-upcoming-list .list-item .item-wrapper .item-info-list .info-item .info-detail {
  padding-left: 60px;
  color: #5E5E5E;
}
.training-main .training-upcoming-list .list-item .item-wrapper .item-btn {
  /*
  .btn-detail{
  	display: inline-block;
  	max-width: 140px;
  	width: 100%;
  	padding: 5px 17px;
  	@include rfs(14px, 13px, 12px);
  	background-color: $Buttercup;
  	color: $White;
  	font-weight: 700;


  	.arrow{
  		float: right;
  		margin-right: 5px;
  		margin-top: .5em;
  		@include transition(.3s all);
  		@include arrow(right, 8px, 2px, $White)
  	}

  	&:hover, &:focus, &:active{
  		@include materialDesignBoxShadow(1);
  		@include translateY(-2px);
  		.arrow{
  			margin-right:0;
  		}
  	}

  }
  */
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .training-main .training-upcoming-list .list-item .item-wrapper .item-btn .btn-detail {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-upcoming-list .list-item .item-wrapper .item-btn .btn-detail {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-upcoming-list .list-item .item-wrapper .item-btn .btn-detail {
    font-size: 12px;
  }
}
.training-main .training-upcoming-detail .detail-title {
  color: #3CC1C8;
  line-height: 1.2em;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 1.3em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .training-main .training-upcoming-detail .detail-title {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-upcoming-detail .detail-title {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-upcoming-detail .detail-title {
    font-size: 20px;
  }
}
.training-main .training-upcoming-detail .detail-list {
  margin-bottom: 2em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .training-main .training-upcoming-detail .detail-list {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-upcoming-detail .detail-list {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-upcoming-detail .detail-list {
    font-size: 12px;
  }
}
.training-main .training-upcoming-detail .detail-list .list-item {
  position: relative;
  margin-bottom: 1em;
}
.training-main .training-upcoming-detail .detail-list .list-item .item-title {
  position: absolute;
  left: 0;
  top: 0;
  width: 65px;
  color: #222222;
}
.training-main .training-upcoming-detail .detail-list .list-item .item-detail {
  padding-left: 75px;
  color: #666666;
  font-family: "Open Sans", "Microsoft JhengHei", "Helvetica Neue", sans-serif;
}
.training-main .training-upcoming-detail .detail-title-sub {
  line-height: 1.2em;
  margin-bottom: 0.6em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .training-main .training-upcoming-detail .detail-title-sub {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-upcoming-detail .detail-title-sub {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-upcoming-detail .detail-title-sub {
    font-size: 20px;
  }
}
.training-main .training-upcoming-detail .detail-main {
  margin-bottom: 30px;
  color: #666666;
  font-family: "Open Sans", "Microsoft JhengHei", "Helvetica Neue", sans-serif;
  line-height: 1.8em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .training-main .training-upcoming-detail .detail-main {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-upcoming-detail .detail-main {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-upcoming-detail .detail-main {
    font-size: 12px;
  }
}
.training-main .training-upcoming-detail .detail-main h4 {
  color: #222222;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .training-main .training-upcoming-detail .detail-main h4 {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-upcoming-detail .detail-main h4 {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-upcoming-detail .detail-main h4 {
    font-size: 12px;
  }
}
.training-main .training-upcoming-detail .detail-img {
  margin-bottom: 30px;
}
.training-main .training-upcoming-detail .detail-img img {
  max-width: 100%;
}
.training-main .training-form .class-list .list-item {
  background-color: #EFEFEF;
  padding: 10px 15px;
  margin-bottom: 15px;
}
.training-main .training-form .class-list .list-item.disabled {
  opacity: 0.4;
}
.training-main .training-form .class-list .list-item .form-group {
  margin-bottom: 0;
}
.training-main .training-form .class-list .list-item .item-title {
  margin-bottom: 0.4em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .training-main .training-form .class-list .list-item .item-title {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-form .class-list .list-item .item-title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-form .class-list .list-item .item-title {
    font-size: 14px;
  }
}
.training-main .training-form .class-list .list-item .item-date,
.training-main .training-form .class-list .list-item .item-time,
.training-main .training-form .class-list .list-item .item-type,
.training-main .training-form .class-list .list-item .item-venue,
.training-main .training-form .class-list .list-item .item-location,
.training-main .training-form .class-list .list-item .item-language,
.training-main .training-form .class-list .list-item .item-other {
  color: #666666;
  font-family: "Open Sans", "Microsoft JhengHei", "Helvetica Neue", sans-serif;
  line-height: 1.8em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .training-main .training-form .class-list .list-item .item-date,
.training-main .training-form .class-list .list-item .item-time,
.training-main .training-form .class-list .list-item .item-type,
.training-main .training-form .class-list .list-item .item-venue,
.training-main .training-form .class-list .list-item .item-location,
.training-main .training-form .class-list .list-item .item-language,
.training-main .training-form .class-list .list-item .item-other {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-form .class-list .list-item .item-date,
.training-main .training-form .class-list .list-item .item-time,
.training-main .training-form .class-list .list-item .item-type,
.training-main .training-form .class-list .list-item .item-venue,
.training-main .training-form .class-list .list-item .item-location,
.training-main .training-form .class-list .list-item .item-language,
.training-main .training-form .class-list .list-item .item-other {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-form .class-list .list-item .item-date,
.training-main .training-form .class-list .list-item .item-time,
.training-main .training-form .class-list .list-item .item-type,
.training-main .training-form .class-list .list-item .item-venue,
.training-main .training-form .class-list .list-item .item-location,
.training-main .training-form .class-list .list-item .item-language,
.training-main .training-form .class-list .list-item .item-other {
    font-size: 12px;
  }
}
.training-main .training-form .form-title {
  margin-bottom: 1em;
  color: #3CC1C8;
  line-height: 1.2em;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 1em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .training-main .training-form .form-title {
    font-size: 24px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-form .form-title {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-form .form-title {
    font-size: 18px;
  }
}
.training-main .detail-btn {
  margin: 15px 0 30px;
  /*
  .btn-join,
  .btn-back{
  	display: inline-block;
  	max-width: 140px;
  	width: 100%;
  	padding: 5px 17px;
  	@include rfs(14px, 13px, 12px);
  	background-color: $Buttercup;
  	color: $White;
  	font-weight: 700;


  	.arrow{
  		float: right;
  		margin-right: 5px;
  		margin-top: .5em;
  		@include transition(.3s all);
  		@include arrow(right, 8px, 2px, $White)
  	}

  	&:hover, &:focus, &:active{
  		@include materialDesignBoxShadow(1);
  		@include translateY(-2px);
  		.arrow{
  			margin-right:0;
  		}
  	}

  }
  */
}
.training-main .training-previous-list .list-item {
  width: 100%;
  max-width: 360px;
  margin: 0 auto 80px;
  border-top: 11px solid #F3A21D;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-previous-list .list-item {
    margin-bottom: 40px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-previous-list .list-item {
    margin-bottom: 40px;
  }
}
.training-main .training-previous-list .list-item .item-img {
  height: 268px;
}
.training-main .training-previous-list .list-item .item-img .img-bg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
}
.training-main .training-previous-list .list-item .item-wrapper {
  padding: 25px;
  background-color: #EFEFEF;
}
.training-main .training-previous-list .list-item .item-wrapper .item-title {
  font-weight: 600;
  line-height: 1.2em;
  margin-bottom: 0.8em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .training-main .training-previous-list .list-item .item-wrapper .item-title {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-previous-list .list-item .item-wrapper .item-title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-previous-list .list-item .item-wrapper .item-title {
    font-size: 14px;
  }
}
.training-main .training-previous-list .list-item .item-wrapper .item-info-list {
  margin-bottom: 1em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .training-main .training-previous-list .list-item .item-wrapper .item-info-list {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .training-main .training-previous-list .list-item .item-wrapper .item-info-list {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .training-main .training-previous-list .list-item .item-wrapper .item-info-list {
    font-size: 12px;
  }
}
.training-main .training-previous-list .list-item .item-wrapper .item-info-list .info-item {
  position: relative;
}
.training-main .training-previous-list .list-item .item-wrapper .item-info-list .info-item .info-title {
  position: absolute;
  left: 0;
  top: 0;
  width: 50px;
}
.training-main .training-previous-list .list-item .item-wrapper .item-info-list .info-item .info-detail {
  padding-left: 60px;
  color: #5E5E5E;
}

.news-main {
  padding: 40px 0;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-main {
    padding: 20px 0;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-main {
    padding: 20px 0;
  }
}
.news-main .news-list .list-item {
  width: 100%;
  max-width: 260px;
  margin: 0 auto 30px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-main .news-list .list-item {
    max-width: inherit;
  }
}
.news-main .news-list .list-item .item-img {
  display: block;
  overflow: hidden;
  height: 170px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-main .news-list .list-item .item-img {
    height: 173px;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .news-main .news-list .list-item .item-img {
    height: 340px;
  }
}
@media (max-width: 575px) {
  .news-main .news-list .list-item .item-img {
    height: calc((100vw - 30px) * 2 / 3);
  }
}
.news-main .news-list .list-item .item-img .img-bg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.news-main .news-list .list-item .item-img:hover .img-bg, .news-main .news-list .list-item .item-img:focus .img-bg, .news-main .news-list .list-item .item-img:active .img-bg {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.news-main .news-list .list-item .item-wrapper {
  padding: 10px 5px;
}
.news-main .news-list .list-item .item-wrapper .item-date {
  color: #5E5E5E;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-main .news-list .list-item .item-wrapper .item-date {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-main .news-list .list-item .item-wrapper .item-date {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-main .news-list .list-item .item-wrapper .item-date {
    font-size: 12px;
  }
}
.news-main .news-list .list-item .item-wrapper .item-title {
  display: block;
  color: #111111;
  font-weight: 600;
  line-height: 1.2em;
  margin: 0.2em 0 0.1em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-main .news-list .list-item .item-wrapper .item-title {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-main .news-list .list-item .item-wrapper .item-title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-main .news-list .list-item .item-wrapper .item-title {
    font-size: 14px;
  }
}
.news-main .news-list .list-item .item-wrapper .item-title:hover, .news-main .news-list .list-item .item-wrapper .item-title:focus, .news-main .news-list .list-item .item-wrapper .item-title:active {
  color: #F3A21D;
}
.news-main .news-list .list-item .item-wrapper .item-cat {
  margin-bottom: 0.2em;
}
.news-main .news-list .list-item .item-wrapper .item-cat .cat-item {
  display: inline-block;
  color: #F3A21D;
  line-height: 1.2em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-main .news-list .list-item .item-wrapper .item-cat .cat-item {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-main .news-list .list-item .item-wrapper .item-cat .cat-item {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-main .news-list .list-item .item-wrapper .item-cat .cat-item {
    font-size: 12px;
  }
}
.news-main .news-list .list-item .item-wrapper .item-cat .cat-item:hover, .news-main .news-list .list-item .item-wrapper .item-cat .cat-item:focus, .news-main .news-list .list-item .item-wrapper .item-cat .cat-item:active {
  text-decoration: underline;
}
.news-main .news-detail .detail-cat a {
  display: inline-block;
  color: #F3A21D;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-main .news-detail .detail-cat a {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-main .news-detail .detail-cat a {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-main .news-detail .detail-cat a {
    font-size: 12px;
  }
}
.news-main .news-detail .detail-addthis {
  text-align: right;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-main .news-detail .detail-addthis {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-main .news-detail .detail-addthis {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-main .news-detail .detail-addthis {
    font-size: 12px;
  }
}
.news-main .news-detail .detail-addthis .addthis_inline_share_toolbox_3qcj {
  display: inline-block;
  vertical-align: middle;
}
.news-main .news-detail .detail-addthis .addthis_inline_share_toolbox_3qcj .at-icon-wrapper {
  margin: 0;
  padding: 0 2px;
}
.news-main .news-detail .detail-title {
  color: #222222;
  line-height: 1.2em;
  margin: 0.4em 0 0.6em;
  font-weight: 500;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-main .news-detail .detail-title {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-main .news-detail .detail-title {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-main .news-detail .detail-title {
    font-size: 20px;
  }
}
.news-main .news-detail .detail-info {
  margin-bottom: 30px;
}
.news-main .news-detail .detail-info .info-item {
  position: relative;
  margin-bottom: 0.8em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-main .news-detail .detail-info .info-item {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-main .news-detail .detail-info .info-item {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-main .news-detail .detail-info .info-item {
    font-size: 12px;
  }
}
.news-main .news-detail .detail-info .info-item .info-title {
  position: absolute;
  left: 0;
  top: 0;
  width: 50px;
  color: #222222;
}
.news-main .news-detail .detail-info .info-item .info-detail {
  padding-left: 60px;
  color: #5E5E5E;
  font-family: "Open Sans", "Microsoft JhengHei", "Helvetica Neue", sans-serif;
}
.news-main .news-detail .detail-img {
  margin-bottom: 30px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-main .news-detail .detail-img {
    text-align: right;
  }
}
.news-main .news-detail .detail-img img {
  max-width: 100%;
}
.news-main .news-detail .detail-main {
  color: #666666;
  margin-bottom: 30px;
  font-family: "Open Sans", "Microsoft JhengHei", "Helvetica Neue", sans-serif;
  line-height: 1.8em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-main .news-detail .detail-main {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-main .news-detail .detail-main {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-main .news-detail .detail-main {
    font-size: 12px;
  }
}
.news-main .news-detail .detail-main h4 {
  color: #222222;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-main .news-detail .detail-main h4 {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-main .news-detail .detail-main h4 {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-main .news-detail .detail-main h4 {
    font-size: 12px;
  }
}
.news-main .news-detail .detail-title-sub {
  color: #111111;
  font-weight: 600;
  margin: 0.4em 0 0.6em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-main .news-detail .detail-title-sub {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-main .news-detail .detail-title-sub {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-main .news-detail .detail-title-sub {
    font-size: 14px;
  }
}
.news-main .news-detail .detail-tags-list {
  margin-bottom: 30px;
}
.news-main .news-detail .detail-tags-list .list-item {
  background-color: #F3A21D;
  color: #ffffff;
  padding: 0em 0.6em;
  display: inline-block;
  border-radius: 8px;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  margin-right: 2px;
  margin-bottom: 4px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-main .news-detail .detail-tags-list .list-item {
    font-size: 12px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-main .news-detail .detail-tags-list .list-item {
    font-size: 11px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-main .news-detail .detail-tags-list .list-item {
    font-size: 10px;
  }
}
.news-main .news-detail .detail-tags-list .list-item:last-child {
  margin-right: 0;
}
.news-main .news-detail .detail-tags-list .list-item:hover, .news-main .news-detail .detail-tags-list .list-item:focus, .news-main .news-detail .detail-tags-list .list-item:active {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
}
.news-main .news-detail .detail-btn {
  margin-bottom: 30px;
  /*
  .btn-back{
  	display: inline-block;
  	max-width: 140px;
  	width: 100%;
  	padding: 5px 17px;
  	@include rfs(14px, 13px, 12px);
  	background-color: $Buttercup;
  	color: $White;
  	font-weight: 700;


  	.arrow{
  		float: right;
  		margin-right: 5px;
  		margin-top: .5em;
  		@include transition(.3s all);
  		@include arrow(right, 8px, 2px, $White)
  	}

  	&:hover, &:focus, &:active{
  		@include materialDesignBoxShadow(1);
  		@include translateY(-2px);
  		.arrow{
  			margin-right:0;
  		}
  	}

  }
  */
}

.ourteam-main .ourteam-list {
  margin-top: 80px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .ourteam-main .ourteam-list {
    margin-top: 40px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .ourteam-main .ourteam-list {
    margin-top: 20px;
  }
}
.ourteam-main .ourteam-list .list-item {
  position: relative;
  min-height: 151px;
  width: 100%;
  max-width: 443px;
  margin: 0 auto 80px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .ourteam-main .ourteam-list .list-item {
    margin-bottom: 60px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .ourteam-main .ourteam-list .list-item {
    margin-bottom: 40px;
  }
}
.ourteam-main .ourteam-list .list-item .item-bg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background-size: auto 100%;
}
.ourteam-main .ourteam-list .list-item .item-bg.item-bg1 {
  background-image: url("../../img/common/ourteam/item_bg1.png");
  background-position: left center;
}
.ourteam-main .ourteam-list .list-item .item-bg.item-bg2 {
  background-image: url("../../img/common/ourteam/item_bg2.png");
  background-position: right center;
}
.ourteam-main .ourteam-list .list-item .item-wrapper {
  position: relative;
  padding: 15px 35px 10px 120px;
}
.ourteam-main .ourteam-list .list-item .item-wrapper .item-name {
  font-weight: 600;
  color: #111111;
  line-height: 1.2em;
  margin-bottom: 0.4em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .ourteam-main .ourteam-list .list-item .item-wrapper .item-name {
    font-size: 24px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .ourteam-main .ourteam-list .list-item .item-wrapper .item-name {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .ourteam-main .ourteam-list .list-item .item-wrapper .item-name {
    font-size: 18px;
  }
}
.ourteam-main .ourteam-list .list-item .item-wrapper .item-title1 {
  font-weight: 600;
  color: #222222;
  line-height: 1.2em;
  margin: 0.2em 0;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .ourteam-main .ourteam-list .list-item .item-wrapper .item-title1 {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .ourteam-main .ourteam-list .list-item .item-wrapper .item-title1 {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .ourteam-main .ourteam-list .list-item .item-wrapper .item-title1 {
    font-size: 12px;
  }
}
.ourteam-main .ourteam-list .list-item .item-wrapper .item-title2 {
  color: #5E5E5E;
  line-height: 1.2em;
  margin: 0.2em 0 0.4em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .ourteam-main .ourteam-list .list-item .item-wrapper .item-title2 {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .ourteam-main .ourteam-list .list-item .item-wrapper .item-title2 {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .ourteam-main .ourteam-list .list-item .item-wrapper .item-title2 {
    font-size: 12px;
  }
}
.ourteam-main .ourteam-list .list-item .item-wrapper .item-mail {
  color: #5E5E5E;
  line-height: 1.2em;
  margin: 0.2em 0;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .ourteam-main .ourteam-list .list-item .item-wrapper .item-mail {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .ourteam-main .ourteam-list .list-item .item-wrapper .item-mail {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .ourteam-main .ourteam-list .list-item .item-wrapper .item-mail {
    font-size: 12px;
  }
}
.ourteam-main .ourteam-list .list-item .item-wrapper .item-mail a {
  color: #F3A21D;
}
.ourteam-main .ourteam-list .list-item .item-wrapper .item-mail a:hover, .ourteam-main .ourteam-list .list-item .item-wrapper .item-mail a:focus, .ourteam-main .ourteam-list .list-item .item-wrapper .item-mail a:active {
  text-decoration: underline;
}

.contact-main {
  padding: 40px 0;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .contact-main {
    padding: 20px 0;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .contact-main {
    padding: 20px 0;
  }
}
.contact-main .contact-wrapper {
  color: #222222;
  margin-bottom: 80px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .contact-main .contact-wrapper {
    margin-bottom: 40px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .contact-main .contact-wrapper {
    margin-bottom: 40px;
  }
}
.contact-main .contact-wrapper .contact-title {
  color: #222222;
  line-height: 1.2em;
  margin-bottom: 1em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .contact-main .contact-wrapper .contact-title {
    font-size: 24px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .contact-main .contact-wrapper .contact-title {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .contact-main .contact-wrapper .contact-title {
    font-size: 18px;
  }
}
.contact-main .contact-wrapper .contact-list {
  margin-bottom: 45px;
}
.contact-main .contact-wrapper .contact-list .list-item {
  position: relative;
  margin-bottom: 0.6em;
}
.contact-main .contact-wrapper .contact-list .list-item .item-icon {
  position: absolute;
  left: 0;
  top: 0;
  width: 24px;
}
.contact-main .contact-wrapper .contact-list .list-item .item-icon svg {
  width: 100%;
  fill: #F3A21D;
}
.contact-main .contact-wrapper .contact-list .list-item .item-icon img {
  width: 100%;
}
.contact-main .contact-wrapper .contact-list .list-item .item-detail {
  color: #666666;
  padding-left: 30px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .contact-main .contact-wrapper .contact-list .list-item .item-detail {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .contact-main .contact-wrapper .contact-list .list-item .item-detail {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .contact-main .contact-wrapper .contact-list .list-item .item-detail {
    font-size: 14px;
  }
}
.contact-main .contact-wrapper .contact-list .list-item .item-detail a {
  color: #666666;
}
.contact-main .contact-wrapper .contact-list .list-item .item-detail a:hover, .contact-main .contact-wrapper .contact-list .list-item .item-detail a:focus, .contact-main .contact-wrapper .contact-list .list-item .item-detail a:active {
  color: #F3A21D;
}
.contact-main .contact-wrapper .contact-form .form-group {
  /*
  .btn-send{
  	display: inline-block;
  	max-width: 140px;
  	width: 100%;
  	padding: .5em 1.2em;
  	@include rfs(14px, 13px, 12px);
  	background-color: $Buttercup;
  	color: $White;
  	font-weight: 700;


  	.arrow{
  		float: right;
  		margin-right: 5px;
  		margin-top: .5em;
  		@include transition(.3s all);
  		@include arrow(right, 8px, 2px, $White)
  	}

  	&:hover, &:focus, &:active{
  		@include materialDesignBoxShadow(1);
  		@include translateY(-2px);
  		.arrow{
  			margin-right:0;
  		}
  	}

  }
  */
}
.contact-main .contact-wrapper .contact-form .form-group label {
  padding-top: calc(0.375rem + 1px);
  padding-bottom: calc(0.375rem + 1px);
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .contact-main .contact-wrapper .contact-form .form-group label {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .contact-main .contact-wrapper .contact-form .form-group label {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .contact-main .contact-wrapper .contact-form .form-group label {
    font-size: 13px;
  }
}
.contact-main .contact-wrapper .contact-form .form-group input,
.contact-main .contact-wrapper .contact-form .form-group textarea {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem 0.375rem 0;
  border: 0;
  border-bottom: 1px solid #CDCDCD;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .contact-main .contact-wrapper .contact-form .form-group input,
.contact-main .contact-wrapper .contact-form .form-group textarea {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .contact-main .contact-wrapper .contact-form .form-group input,
.contact-main .contact-wrapper .contact-form .form-group textarea {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .contact-main .contact-wrapper .contact-form .form-group input,
.contact-main .contact-wrapper .contact-form .form-group textarea {
    font-size: 13px;
  }
}
.contact-main .contact-wrapper .contact-form .form-group input:hover, .contact-main .contact-wrapper .contact-form .form-group input:focus, .contact-main .contact-wrapper .contact-form .form-group input:active,
.contact-main .contact-wrapper .contact-form .form-group textarea:hover,
.contact-main .contact-wrapper .contact-form .form-group textarea:focus,
.contact-main .contact-wrapper .contact-form .form-group textarea:active {
  border-bottom-color: #F3A21D;
}
.contact-main .contact-wrapper .contact-form .form-group textarea {
  height: 115px;
  resize: none;
  outline: none;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .contact-main .contact-wrapper .contact-form .form-group textarea {
    height: 60px;
  }
}
.contact-main .contact-img {
  text-align: center;
}
.contact-main .contact-img img {
  max-width: 100%;
}

.alert-main {
  text-align: center;
  padding: 120px 0;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .alert-main {
    padding: 60px 0;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .alert-main {
    padding: 30px 0;
  }
}
.alert-main .alert-title {
  color: #111111;
  line-height: 1.2em;
  text-align: center;
  text-transform: uppercase;
  margin-bottom: 1em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .alert-main .alert-title {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .alert-main .alert-title {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .alert-main .alert-title {
    font-size: 20px;
  }
}
.alert-main .alert-detail {
  color: #222222;
  margin-bottom: 1em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .alert-main .alert-detail {
    font-size: 24px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .alert-main .alert-detail {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .alert-main .alert-detail {
    font-size: 18px;
  }
}

.content-main .content-title {
  color: #111111;
  line-height: 1.2em;
  text-align: center;
  text-transform: uppercase;
  margin-bottom: 1em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .content-main .content-title {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .content-main .content-title {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .content-main .content-title {
    font-size: 20px;
  }
}
.content-main .content-detail {
  color: #222222;
  margin-bottom: 1em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .content-main .content-detail {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .content-main .content-detail {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .content-main .content-detail {
    font-size: 14px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .content-main .content-detail h1 {
    font-size: 32px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .content-main .content-detail h1 {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .content-main .content-detail h1 {
    font-size: 20px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .content-main .content-detail h2 {
    font-size: 28px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .content-main .content-detail h2 {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .content-main .content-detail h2 {
    font-size: 19px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .content-main .content-detail h3 {
    font-size: 24px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .content-main .content-detail h3 {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .content-main .content-detail h3 {
    font-size: 18px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .content-main .content-detail h4 {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .content-main .content-detail h4 {
    font-size: 18px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .content-main .content-detail h4 {
    font-size: 16px;
  }
}
.content-main .content-detail a {
  color: #F3A21D;
}
.content-main .content-detail a:hover, .content-main .content-detail a:focus, .content-main .content-detail a:active {
  text-decoration: underline;
}

.pager-list {
  text-align: center;
}
.pager-list .list-item {
  display: inline-block;
  border: 1px solid transparent;
  text-align: center;
  min-width: 22px;
  color: #222222;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .pager-list .list-item {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .pager-list .list-item {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .pager-list .list-item {
    font-size: 12px;
  }
}
.pager-list .list-item:hover, .pager-list .list-item:focus, .pager-list .list-item:active {
  border-color: #F3A21D;
}
.pager-list .list-item.active {
  background-color: #F3A21D;
  color: #ffffff;
}

.custom-checkbox .custom-control-label a,
.custom-radio .custom-control-label a {
  color: #3CC1C8;
  text-decoration: underline;
}
.custom-checkbox .custom-control-label a:hover, .custom-checkbox .custom-control-label a:focus, .custom-checkbox .custom-control-label a:active,
.custom-radio .custom-control-label a:hover,
.custom-radio .custom-control-label a:focus,
.custom-radio .custom-control-label a:active {
  text-decoration: underline;
}
.custom-checkbox .custom-control-label.blue-a a,
.custom-radio .custom-control-label.blue-a a {
  color: #258DCF;
}

.custom-control-label {
  cursor: pointer;
}
.custom-control-label:before {
  border-radius: 0 !important;
  box-shadow: none !important;
  box-shadow: none !important;
  background-color: #ffffff !important;
}
.custom-control-label:after {
  width: 1rem;
  height: 1rem;
  border: 0.2rem solid transparent;
  background-clip: padding-box;
}
.custom-control-input:checked ~ .custom-control-label:before {
  box-shadow: none !important;
  background-color: #ffffff !important;
  border: #adb5bd solid 1px;
}
.custom-control-input:checked ~ .custom-control-label:after {
  background-image: none !important;
  background-color: #8DD5E1;
  border: 0.2rem solid transparent;
}

.custom-radio .custom-control-label {
  cursor: pointer;
}
.custom-radio .custom-control-label:before {
  box-shadow: none !important;
  border-color: #666666 !important;
  background-color: #ffffff !important;
}
.custom-radio .custom-control-label:after {
  /*
  margin-top: .2rem;
  margin-left: .2rem;
  */
  /*
  @include circle(1rem);
  border:.2rem solid transparent;
  */
  width: 8px;
  height: 8px;
  border-radius: 100%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  margin-top: 4px;
  margin-left: 4px;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.custom-radio .custom-control-input:checked ~ .custom-control-label:after {
  background-image: none;
  background-color: #F3A21D;
}

.form-control-choice .form-check {
  padding-left: 1.8rem;
}
.form-control-choice .form-check .form-check-input {
  position: absolute;
  z-index: -1;
  opacity: 0;
}
.form-control-choice .form-check .form-check-label {
  position: relative;
  margin-bottom: 0;
  vertical-align: top;
}
.form-control-choice .form-check .form-check-label:before {
  position: absolute;
  top: 0.25rem;
  left: -1.5rem;
  display: block;
  width: 1rem;
  height: 1rem;
  pointer-events: none;
  content: "";
  background-color: #fff;
  border: #adb5bd solid 1px;
}
.form-control-choice .form-check .form-check-label:after {
  position: absolute;
  top: 0.25rem;
  left: -1.5rem;
  display: block;
  width: 1rem;
  height: 1rem;
  content: "";
  background: no-repeat 50%/50% 50%;
}
.form-control-choice .form-check .form-check-label a {
  color: #F3A21D;
  text-decoration: underline;
}
.form-control-choice .form-check .form-check-label a:hover, .form-control-choice .form-check .form-check-label a:focus, .form-control-choice .form-check .form-check-label a:active {
  text-decoration: none;
}
.form-control-choice.form-control-checkbox .form-check .form-check-label {
  cursor: pointer;
}
.form-control-choice.form-control-checkbox .form-check .form-check-label:before {
  border-radius: 0;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  box-shadow: none !important;
  border: #adb5bd solid 1px;
  background-color: #ffffff !important;
}
.form-control-choice.form-control-checkbox .form-check .form-check-label:after {
  /*
  margin-top: .2rem;
  margin-left: .2rem;
  @include square(.6rem);
  */
  width: 1rem;
  height: 1rem;
  border: 0.2rem solid transparent;
  background-clip: padding-box;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.form-control-choice.form-control-checkbox .form-check .form-check-input:checked ~ .form-check-label:after {
  background-image: none;
  background-color: #8DD5E1;
}
.form-control-choice.form-control-radio .form-check .form-check-label {
  cursor: pointer;
}
.form-control-choice.form-control-radio .form-check .form-check-label:before {
  border-radius: 0;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  box-shadow: none !important;
  border-color: #666666 !important;
  background-color: #ffffff !important;
}
.form-control-choice.form-control-radio .form-check .form-check-label:after {
  /*
  margin-top: .2rem;
  margin-left: .2rem;
  @include square(.6rem);
  */
  width: 1rem;
  height: 1rem;
  border-radius: 100%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  border: 0.2rem solid transparent;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.form-control-choice.form-control-radio .form-check .form-check-input:checked ~ .form-check-label:after {
  background-image: none;
  background-color: #F3A21D;
}
.form-control-choice.form-control-inline .form-check {
  display: inline-block;
  margin-right: 1rem;
}
.form-control-choice.form-control-flex {
  display: flex;
  flex-wrap: wrap;
  /*
  .form-check{
  }
  */
}

.choice-slide .swiper-container {
  height: 100%;
}
.choice-slide .swiper-container .swiper-slide {
  height: auto;
}
.choice-slide .swiper-container .swiper-slide .form-control-choice {
  padding-bottom: 0 !important;
  padding-right: 1rem !important;
}
.choice-slide .swiper-container .swiper-slide .form-control-choice .form-check {
  width: calc(50% - 1rem);
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .choice-slide .swiper-container .swiper-slide .form-control-choice .form-check {
    width: calc(100% - 1rem);
  }
}
.choice-slide .swiper-container .swiper-scrollbar {
  width: 10px;
}
.choice-slide .swiper-container .swiper-scrollbar .swiper-scrollbar-drag {
  background-color: #F3A21D;
}

.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
  display: block;
  width: 100%;
  max-width: 360px;
  height: 200px;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
    height: 180px;
  }
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img {
  width: 100%;
  height: 100%;
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img .img-bg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img .img-cover {
  position: absolute;
  left: 0;
  top: 0;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  background-image: url("../../img/common/system/media_video_cover.png");
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  opacity: 0;
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-bg {
  width: 100%;
  height: 100%;
  background-color: rgba(31, 36, 83, 0.79);
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer1 {
  -webkit-transition: 0.3s all 0.1s;
  -moz-transition: 0.3s all 0.1s;
  -ms-transition: 0.3s all 0.1s;
  -o-transition: 0.3s all 0.1s;
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer2 {
  -webkit-transition: 0.3s all 0.2s;
  -moz-transition: 0.3s all 0.2s;
  -ms-transition: 0.3s all 0.2s;
  -o-transition: 0.3s all 0.2s;
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer3 {
  -webkit-transition: 0.3s all 0.3s;
  -moz-transition: 0.3s all 0.3s;
  -ms-transition: 0.3s all 0.3s;
  -o-transition: 0.3s all 0.3s;
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer1 {
  background-image: url("../../img/common/system/media_layer1.png");
  -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -o-transform: translateX(-100%);
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer2 {
  background-image: url("../../img/common/system/media_layer2.png");
  -webkit-transform: translateX(100%);
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer3 {
  -webkit-transform: scale(1.4);
  -moz-transform: scale(1.4);
  -ms-transform: scale(1.4);
  -o-transform: scale(1.4);
  opacity: 0;
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item.item-photo .item-hover .hover-layer.hover-layer3 {
  background-image: url("../../img/common/system/media_photo_layer3.png");
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item.item-video .item-hover .hover-layer.hover-layer3 {
  background-image: url("../../img/common/system/media_video_layer3.png");
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-img .img-bg, .media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-img .img-bg, .media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-img .img-bg {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-img .img-cover, .media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-img .img-cover, .media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-img .img-cover {
  -webkit-transform: scale(1.5);
  -moz-transform: scale(1.5);
  -ms-transform: scale(1.5);
  -o-transform: scale(1.5);
  opacity: 0;
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-hover, .media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-hover, .media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-hover {
  opacity: 1;
}
.media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-hover .hover-layer, .media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-hover .hover-layer, .media-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-hover .hover-layer {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  opacity: 1;
}
.media-slide .swiper-container .swiper-pagination {
  position: relative;
  margin-top: 35px;
}
.media-slide .swiper-container .swiper-pagination .swiper-pagination-bullet {
  width: 9px;
  height: 9px;
  border-radius: 100%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  background-color: #ABABAB;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  border: 1px solid transparent;
}
.media-slide .swiper-container .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #F3A21D;
}
.media-slide .swiper-container .swiper-pagination .swiper-pagination-bullet:hover, .media-slide .swiper-container .swiper-pagination .swiper-pagination-bullet:focus, .media-slide .swiper-container .swiper-pagination .swiper-pagination-bullet:active {
  border-color: #F3A21D;
}

.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
  display: block;
  width: 100%;
  margin: 0 auto;
  position: relative;
  overflow: hidden;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
    height: 170px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
    height: 192px;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
    height: 286px;
  }
}
@media (max-width: 575px) {
  .resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
    height: calc((100vw - 30px) * 9 / 16);
  }
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img {
  width: 100%;
  height: 100%;
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img .img-bg,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img .img-bg,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img .img-bg,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img .img-bg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img .img-cover,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img .img-cover,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img .img-cover,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-img .img-cover {
  position: absolute;
  left: 0;
  top: 0;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  background-size: auto;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36.493' height='36.493' viewBox='0 0 36.493 36.493'%3E%3Cg id='Group_7462' data-name='Group 7462' transform='translate(-1121.254 -1947.616)'%3E%3Ccircle id='Ellipse_305' data-name='Ellipse 305' cx='12' cy='12' r='12' transform='translate(1128 1954)' fill='%23fff'/%3E%3Cpath id='play-button_2_' data-name='play-button (2)' d='M18.246,0A18.246,18.246,0,1,0,36.493,18.246,18.246,18.246,0,0,0,18.246,0Zm6.306,19.214-9.123,5.7a1.141,1.141,0,0,1-1.745-.967v-11.4a1.141,1.141,0,0,1,1.745-.967l9.123,5.7a1.141,1.141,0,0,1,0,1.934Z' transform='translate(1121.254 1947.616)' fill='%233cc1c8'/%3E%3C/g%3E%3C/svg%3E%0A");
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  opacity: 0;
  pointer-events: none;
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-bg,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-bg,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-bg,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-bg {
  width: 100%;
  height: 100%;
  background-color: rgba(31, 36, 83, 0.79);
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer1,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer1,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer1,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer1 {
  -webkit-transition: 0.3s all 0.1s;
  -moz-transition: 0.3s all 0.1s;
  -ms-transition: 0.3s all 0.1s;
  -o-transition: 0.3s all 0.1s;
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer2,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer2,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer2,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer2 {
  -webkit-transition: 0.3s all 0.2s;
  -moz-transition: 0.3s all 0.2s;
  -ms-transition: 0.3s all 0.2s;
  -o-transition: 0.3s all 0.2s;
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer3,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer3,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer3,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer3 {
  -webkit-transition: 0.3s all 0.3s;
  -moz-transition: 0.3s all 0.3s;
  -ms-transition: 0.3s all 0.3s;
  -o-transition: 0.3s all 0.3s;
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer1,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer1,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer1,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer1 {
  background-image: url("../../img/common/system/media_layer1.png");
  -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -o-transform: translateX(-100%);
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer2,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer2,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer2,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer2 {
  background-image: url("../../img/common/system/media_layer2.png");
  -webkit-transform: translateX(100%);
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer3,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer3,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer3,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item .item-hover .hover-layer.hover-layer3 {
  -webkit-transform: scale(1.4);
  -moz-transform: scale(1.4);
  -ms-transform: scale(1.4);
  -o-transform: scale(1.4);
  opacity: 0;
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item.item-photo .item-hover .hover-layer.hover-layer3,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item.item-photo .item-hover .hover-layer.hover-layer3,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item.item-photo .item-hover .hover-layer.hover-layer3,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item.item-photo .item-hover .hover-layer.hover-layer3 {
  background-image: url("../../img/common/system/media_photo_layer3.png");
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item.item-video .item-hover .hover-layer.hover-layer3,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item.item-video .item-hover .hover-layer.hover-layer3,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item.item-video .item-hover .hover-layer.hover-layer3,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item.item-video .item-hover .hover-layer.hover-layer3 {
  background-image: url("../../img/common/system/media_video_layer3.png");
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-img .img-bg, .resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-img .img-bg, .resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-img .img-bg,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-img .img-bg,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-img .img-bg,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-img .img-bg,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-img .img-bg,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-img .img-bg,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-img .img-bg,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-img .img-bg,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-img .img-bg,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-img .img-bg {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-img .img-cover, .resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-img .img-cover, .resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-img .img-cover,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-img .img-cover,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-img .img-cover,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-img .img-cover,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-img .img-cover,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-img .img-cover,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-img .img-cover,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-img .img-cover,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-img .img-cover,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-img .img-cover {
  -webkit-transform: scale(1.5);
  -moz-transform: scale(1.5);
  -ms-transform: scale(1.5);
  -o-transform: scale(1.5);
  opacity: 0;
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-hover, .resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-hover, .resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-hover,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-hover,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-hover,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-hover,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-hover,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-hover,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-hover,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-hover,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-hover,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-hover {
  opacity: 1;
}
.resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-hover .hover-layer, .resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-hover .hover-layer, .resource-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-hover .hover-layer,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-hover .hover-layer,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-hover .hover-layer,
.project-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-hover .hover-layer,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-hover .hover-layer,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-hover .hover-layer,
.training-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-hover .hover-layer,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:hover .item-hover .hover-layer,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:focus .item-hover .hover-layer,
.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item:active .item-hover .hover-layer {
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  opacity: 1;
}
.resource-slide .swiper-container .swiper-pagination,
.project-slide .swiper-container .swiper-pagination,
.training-slide .swiper-container .swiper-pagination,
.news-detail-slide .swiper-container .swiper-pagination {
  position: relative;
  margin-top: 5px;
}
.resource-slide .swiper-container .swiper-pagination .swiper-pagination-bullet,
.project-slide .swiper-container .swiper-pagination .swiper-pagination-bullet,
.training-slide .swiper-container .swiper-pagination .swiper-pagination-bullet,
.news-detail-slide .swiper-container .swiper-pagination .swiper-pagination-bullet {
  width: 9px;
  height: 9px;
  border-radius: 100%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  background-color: #ABABAB;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  border: 1px solid transparent;
}
.resource-slide .swiper-container .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active,
.project-slide .swiper-container .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active,
.training-slide .swiper-container .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active,
.news-detail-slide .swiper-container .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #258DCF;
}
.resource-slide .swiper-container .swiper-pagination .swiper-pagination-bullet:hover, .resource-slide .swiper-container .swiper-pagination .swiper-pagination-bullet:focus, .resource-slide .swiper-container .swiper-pagination .swiper-pagination-bullet:active,
.project-slide .swiper-container .swiper-pagination .swiper-pagination-bullet:hover,
.project-slide .swiper-container .swiper-pagination .swiper-pagination-bullet:focus,
.project-slide .swiper-container .swiper-pagination .swiper-pagination-bullet:active,
.training-slide .swiper-container .swiper-pagination .swiper-pagination-bullet:hover,
.training-slide .swiper-container .swiper-pagination .swiper-pagination-bullet:focus,
.training-slide .swiper-container .swiper-pagination .swiper-pagination-bullet:active,
.news-detail-slide .swiper-container .swiper-pagination .swiper-pagination-bullet:hover,
.news-detail-slide .swiper-container .swiper-pagination .swiper-pagination-bullet:focus,
.news-detail-slide .swiper-container .swiper-pagination .swiper-pagination-bullet:active {
  border-color: #258DCF;
}

.news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
  height: 180px;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
    height: 202px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
    height: 228px;
  }
}
@media (min-width: 576px) and (max-width: 767px) {
  .news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
    height: 340px;
  }
}
@media (max-width: 575px) {
  .news-detail-slide .swiper-container .swiper-wrapper .swiper-slide .slide-item {
    height: calc((100vw - 30px) * 2 / 3);
  }
}

.fancybox-overlay {
  background-image: none !important;
  background-color: rgba(14, 15, 21, 0.91) !important;
}

.fancybox-media {
  position: fixed !important;
}
.fancybox-media .fancybox-skin {
  box-shadow: none !important;
}
.fancybox-media .fancybox-skin .fancybox-outer .fancybox-nav {
  width: 60px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .fancybox-media .fancybox-skin .fancybox-outer .fancybox-nav {
    width: 40px;
  }
}
.fancybox-media .fancybox-skin .fancybox-outer .fancybox-nav span {
  width: 30px;
  height: 30px;
  border-top: 2px solid #ffffff;
  border-right: 2px solid #ffffff;
  margin-top: -15px;
  margin-left: -15px;
  visibility: visible;
  opacity: 0.87;
  left: 50%;
  top: 50%;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .fancybox-media .fancybox-skin .fancybox-outer .fancybox-nav span {
    width: 16px;
    height: 16px;
    margin-top: -8px;
    margin-left: -8px;
  }
}
.fancybox-media .fancybox-skin .fancybox-outer .fancybox-nav:hover span, .fancybox-media .fancybox-skin .fancybox-outer .fancybox-nav:focus span, .fancybox-media .fancybox-skin .fancybox-outer .fancybox-nav:active span {
  opacity: 1;
}
.fancybox-media .fancybox-skin .fancybox-outer .fancybox-nav.fancybox-prev {
  left: inherit;
  right: 100%;
}
.fancybox-media .fancybox-skin .fancybox-outer .fancybox-nav.fancybox-prev span {
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -ms-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
}
.fancybox-media .fancybox-skin .fancybox-outer .fancybox-nav.fancybox-next {
  right: inherit;
  left: 100%;
}
.fancybox-media .fancybox-skin .fancybox-outer .fancybox-nav.fancybox-next span {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
}
.fancybox-media .fancybox-skin .fancybox-close {
  position: absolute;
  top: inherit;
  right: inherit;
  margin-left: 17px;
  margin-bottom: 17px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .fancybox-media .fancybox-skin .fancybox-close {
    width: 22px;
    height: 22px;
    margin-left: 8px;
    margin-bottom: 8px;
  }
}

@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .fancybox-slide-img {
    top: 45px !important;
    left: 45px !important;
    width: calc(100% - 90px) !important;
  }
}
.fancybox-slide-img .fancybox-skin {
  background-color: transparent;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .fancybox-slide-img .fancybox-skin .fancybox-outer .fancybox-inner {
    width: 100% !important;
  }
}
.slide-img-popup {
  width: 100%;
  height: 100%;
}
.slide-img-popup .popup-img {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
}

.slide-video-popup {
  width: 100%;
  height: 100%;
  text-align: center;
}
.slide-video-popup video {
  outline: none;
  width: 100%;
  height: 100%;
  /*
  max-width: calc( (100vh - 140px)*16/9 );
  max-height: calc( (100vw - 140px)*9/16 );
  @media (min-width: 576px) and (max-width: 767px), (max-width: 575px){
  	max-width: calc( (100vh - 90px)*16/9 );
  	max-height: calc( (100vw - 90px)*9/16 );
  }
  */
  max-width: calc(98vw - 140px);
  max-height: calc(98vh - 140px);
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .slide-video-popup video {
    max-width: calc(90vw - 90px);
    max-height: calc(90vh - 90px);
  }
}
.slide-video-popup.video-news {
  /*
  video{
  	max-width: calc( (100vh - 140px)*16/9 * .8);
  	max-height: calc( (100vw - 140px)*9/16 * .8);
  	@media (min-width: 576px) and (max-width: 767px), (max-width: 575px){
  		max-width: calc( (100vh - 90px)*16/9 * .8);
  		max-height: calc( (100vw - 90px)*9/16 * .8);
  	}
  }
  */
}
.slide-video-popup.video-news video {
  max-width: calc(100vw - 160px);
  max-height: calc(100vh - 160px);
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .slide-video-popup.video-news video {
    max-width: calc(100vw - 160px);
    max-height: calc(100vh - 160px);
  }
}

.user-main .user-title {
  color: #3CC1C8;
  line-height: 1.2em;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 40px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .user-main .user-title {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .user-main .user-title {
    font-size: 30px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .user-main .user-title {
    font-size: 28px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .user-main .user-title {
    margin-bottom: 30px;
  }
}
.user-main .login-wrapper {
  width: 100%;
  max-width: 580px;
  background-color: #F8F8F8;
  padding: 40px 50px;
  max-width: 375px;
  text-align: center;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .user-main .login-wrapper {
    padding: 0px;
  }
}
.user-main .login-wrapper.login-cna .login-form {
  text-align: center;
}
.user-main .login-wrapper.login-cna .login-form .btn-theme {
  text-align: left;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .user-main .login-wrapper.login-enrol {
    min-height: 240px;
  }
  .user-main .login-wrapper.login-enrol .login-detail {
    height: 80px;
  }
  .user-main .login-wrapper.login-enrol .login-form {
    padding-bottom: 0;
  }
}
.user-main .login-wrapper .login-title {
  margin-bottom: 10px;
  text-align: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .user-main .login-wrapper .login-title {
    font-size: 24px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .user-main .login-wrapper .login-title {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .user-main .login-wrapper .login-title {
    font-size: 20px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .user-main .login-wrapper .login-detail {
    height: 215px;
  }
}
.user-main .login-wrapper .login-detail.member-detail {
  text-align: left;
  height: auto;
}
.user-main .login-wrapper .login-select .custom-control {
  display: inline-block;
  margin: 0 10px;
  cursor: pointer;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .user-main .login-wrapper .login-select .custom-control {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .user-main .login-wrapper .login-select .custom-control {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .user-main .login-wrapper .login-select .custom-control {
    font-size: 12px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .user-main .login-wrapper .login-select .custom-control {
    display: block;
    text-align: left;
  }
}
.user-main .login-wrapper .login-select .custom-control .custom-control-label {
  padding-top: 0.1em;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .user-main .login-wrapper .login-select .custom-control .custom-control-label {
    padding-top: 0.3em;
  }
}
.user-main .login-wrapper .login-form {
  padding: 20px 0;
  padding-bottom: 0px;
  text-align: left;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .user-main .login-wrapper .login-form .form-group {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .user-main .login-wrapper .login-form .form-group {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .user-main .login-wrapper .login-form .form-group {
    font-size: 12px;
  }
}
.user-main .login-wrapper .login-form .form-group .col-form-label span {
  color: #F3A21D;
}
.user-main .registration-wrapper {
  background-color: #F8F8F8;
  padding: 45px 60px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .user-main .registration-wrapper {
    padding: 40px 30px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .user-main .registration-wrapper {
    padding: 30px 15px;
  }
}
.user-main .edit-info-wrapper {
  padding: 0;
  max-width: 800px;
}
.user-main .registration-wrapper,
.user-main .edit-info-wrapper {
  width: 100%;
  margin: 0 auto;
}
.user-main .registration-wrapper .registration-form .form-group .col-form-label span,
.user-main .registration-wrapper .edit-info-form .form-group .col-form-label span,
.user-main .edit-info-wrapper .registration-form .form-group .col-form-label span,
.user-main .edit-info-wrapper .edit-info-form .form-group .col-form-label span {
  color: #F3A21D;
}
.user-main .project-menu {
  padding: 2em 0;
}
.user-main .project-menu .menu-item {
  display: block;
  max-width: initial;
  text-align: center;
  padding: 0.5em 0.5em;
  margin-bottom: 5px;
}

.body-login input {
  background-color: white;
  padding: 0.375rem 0.75rem;
}
.body-login input.form-control, .body-login input .form-group {
  margin-bottom: 0px;
}
.body-login input:hover, .body-login input:active, .body-login input:focus {
  background-color: white;
}
.body-login .alert.alert-danger {
  position: absolute;
}
.body-login .forget-submit-container .form-group .col {
  display: flex;
  justify-content: center;
  width: 100%;
}
.body-login .forget-submit-container .form-group .col #btn-show-login {
  text-decoration: underline;
  color: #3CC1C8;
  font-size: 14px;
}
.body-login .forget-submit-container .form-group .col #btn-show-forgot-password, .body-login .forget-submit-container .form-group .col #btn-register-now {
  text-decoration: underline;
  color: #3CC1C8;
  font-size: 14px;
  text-align: center;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-login .forget-submit-container .form-group .col #btn-show-forgot-password, .body-login .forget-submit-container .form-group .col #btn-register-now {
    display: block;
    width: 100%;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-login .forget-submit-container .form-group .col #btn-register-now {
    margin-bottom: 3px;
  }
}
.body-login .forget-submit-container .form-group .col .form-forget {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}
.body-login .forget-submit-container .form-group .col .form-forget .sep {
  height: 15px;
  margin-left: 9px;
  margin-right: 9px;
  width: 1px;
  background-color: #000000;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-login .forget-submit-container .form-group .col .form-forget .sep {
    display: none;
  }
}
.body-login #forgot-password-main {
  display: flex;
  justify-content: center;
  align-items: center;
}
.body-login #forgot-password-main .login-wrapper {
  background-color: unset;
  padding-left: 15px;
  padding-right: 15px;
}
.body-login #forgot-password-main .bubble-background {
  width: 500px;
  height: 500px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../../img/common/common-bubble.png");
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .body-login #forgot-password-main .bubble-background {
    width: 100%;
    background-image: unset;
    height: auto;
    padding-top: 35px;
    padding-bottom: 35px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .body-login .bubble-background {
    width: 500px;
    height: 500px;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    background-image: url("../../img/common/common-bubble.png");
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-login .bubble-background {
    width: 100%;
    height: auto;
    padding-top: 35px;
    padding-bottom: 35px;
    margin-bottom: 20px;
    background-color: #F8F8F8;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
.body-login #login-main {
  position: relative;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
  .body-login #login-main {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
  }
}
.body-login #login-main .login-background {
  width: 100%;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../../img/common/login-background.png");
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
  .body-login #login-main .login-background {
    display: none;
  }
}
.body-login #login-main .login-title {
  text-align: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .body-login #login-main .login-title {
    font-size: 24px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .body-login #login-main .login-title {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-login #login-main .login-title {
    font-size: 20px;
  }
}
.body-login #login-main #btn-login-submit {
  min-width: unset;
}
.body-login #login-main .vtc-login-container {
  position: absolute;
  width: 246px;
  left: 11.6%;
  top: 32.4%;
  transform: translateY(-50%);
}
.body-login #login-main .vtc-login-container .login-title {
  margin-bottom: 10px;
  text-align: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .body-login #login-main .vtc-login-container .login-title {
    font-size: 24px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .body-login #login-main .vtc-login-container .login-title {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-login #login-main .vtc-login-container .login-title {
    font-size: 23px;
  }
}
.body-login #login-main .vtc-login-container .login-detail {
  margin-bottom: 10px;
  text-align: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .body-login #login-main .vtc-login-container .login-detail {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .body-login #login-main .vtc-login-container .login-detail {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-login #login-main .vtc-login-container .login-detail {
    font-size: 14px;
  }
}
.body-login #login-main .vtc-login-container .login-detail .member-detail {
  margin-bottom: 10px;
  text-align: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .body-login #login-main .vtc-login-container .login-detail .member-detail {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .body-login #login-main .vtc-login-container .login-detail .member-detail {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-login #login-main .vtc-login-container .login-detail .member-detail {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .body-login #login-main .vtc-login-container {
    width: 200px;
    left: 12%;
    top: 32.2%;
    transform: translateY(-50%);
  }
  .body-login #login-main .vtc-login-container .form-group {
    margin-bottom: 0.5rem;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
  .body-login #login-main .vtc-login-container {
    position: unset;
    transform: unset;
    width: 80%;
  }
}
.body-login #login-main .vtc-login-container .btn-theme {
  min-width: unset;
}
.body-login #login-main .member-login-container {
  position: absolute;
  width: 330px;
  right: 7.6%;
  top: 53%;
  transform: translateY(-50%);
}
.body-login #login-main .member-login-container .login-title {
  margin-bottom: 10px;
  text-align: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .body-login #login-main .member-login-container .login-title {
    font-size: 24px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .body-login #login-main .member-login-container .login-title {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-login #login-main .member-login-container .login-title {
    font-size: 20px;
  }
}
.body-login #login-main .member-login-container .member-detail {
  margin-bottom: 10px;
  text-align: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .body-login #login-main .member-login-container .member-detail {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .body-login #login-main .member-login-container .member-detail {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-login #login-main .member-login-container .member-detail {
    font-size: 14px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .body-login #login-main .member-login-container .member-detail {
    margin-bottom: 25px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .body-login #login-main .member-login-container {
    width: 270px;
    right: 7.5%;
    top: 53%;
    transform: translateY(-50%);
  }
  .body-login #login-main .member-login-container .form-group {
    margin-bottom: 0.5rem;
  }
}
@media (min-width: 576px) and (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
  .body-login #login-main .member-login-container {
    position: unset;
    transform: unset;
    width: 60%;
  }
}
@media (max-width: 575px) {
  .body-login #login-main .member-login-container {
    position: unset;
    transform: unset;
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
  }
}
.body-login .btn-arrow {
  padding-right: 45px;
}

.tab-container {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 40px;
}
.tab-container .tab {
  width: calc(20% + 20px);
  cursor: pointer;
  color: #A3A3A3;
  padding-left: 10px;
  padding-right: 10px;
  padding-top: 17px;
  padding-bottom: 5px;
  border-bottom: 6px solid #8DD5E1;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .tab-container .tab {
    font-size: 17px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .tab-container .tab {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tab-container .tab {
    font-size: 16px;
  }
}
.tab-container .tab:hover, .tab-container .tab:focus, .tab-container .tab:active {
  border-bottom: 6px solid #258DCF;
  color: black;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tab-container .tab {
    order: 2;
    width: 33.33%;
  }
}
.tab-container .tab.active {
  border-bottom: 6px solid #258DCF;
  color: black;
}
.tab-container .add-project-button-container {
  border-bottom: 6px solid #8DD5E1;
  width: calc(40% - 60px);
  display: flex;
  justify-content: flex-end;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tab-container .add-project-button-container .btn-arrow {
    padding-top: 10px;
    padding-bottom: 10px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .tab-container .add-project-button-container {
    order: 1;
    width: 100%;
    border-bottom: unset;
    justify-content: center;
    margin-bottom: 20px;
  }
}

.project-wrapper {
  display: none;
}
.project-wrapper.active {
  display: block;
}
.project-wrapper .project-list .col-box .title {
  margin-top: 10px;
  color: #000000;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .project-wrapper .project-list .col-box .title {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .project-wrapper .project-list .col-box .title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-wrapper .project-list .col-box .title {
    font-size: 16px;
  }
}
.project-wrapper .project-list .list-item {
  display: block;
  margin-bottom: 45px;
  width: 100%;
}
.project-wrapper .project-list .list-item .item-img {
  border: 1px solid #E7E7E7;
  margin-bottom: 10px;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 100%;
}
.project-wrapper .project-list .list-item .item-img .img-bg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  -webkit-transform: scale(1);
  -moz-transform: scale(1);
  -ms-transform: scale(1);
  -o-transform: scale(1);
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.project-wrapper .project-list .list-item .item-img .img-cover {
  opacity: 0;
  background-color: rgba(37, 141, 207, 0.87);
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  height: 100%;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  text-align: center;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-wrapper .project-list .list-item .item-img .img-cover {
    background-color: transparent;
  }
}
.project-wrapper .project-list .list-item .item-img .img-cover .button-container {
  height: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  padding-top: 20px;
  padding-bottom: 20px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-wrapper .project-list .list-item .item-img .img-cover .button-container {
    padding-top: 10px;
    padding-right: 10px;
    align-items: flex-start;
    justify-content: flex-end;
    margin-right: -5px;
  }
}
.project-wrapper .project-list .list-item .item-img .img-cover .button-container .btn-size {
  width: 38px;
  height: 30px;
  display: flex;
  justify-content: center;
  min-width: unset;
  margin-left: 5px;
  margin-right: 5px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-wrapper .project-list .list-item .item-img .img-cover .button-container .btn-size {
    width: 38px;
    height: 30px;
  }
}
.project-wrapper .project-list .list-item .item-img .img-cover .button-container .preview-icon {
  width: 21px;
  height: 13px;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg id='Group_7803' data-name='Group 7803' xmlns='http://www.w3.org/2000/svg' width='21.133' height='13.661' viewBox='0 0 21.133 13.661'%3E%3Ccircle id='Ellipse_148' data-name='Ellipse 148' cx='3.253' cy='3.253' r='3.253' transform='translate(7.313 3.579)' fill='%23fff'/%3E%3Cpath id='Path_20255' data-name='Path 20255' d='M20.809,96.446c-2.5-3.022-6.286-5.931-10.242-5.931S2.824,93.426.325,96.446a1.415,1.415,0,0,0,0,1.8,21.179,21.179,0,0,0,3.7,3.506c4.431,3.226,8.634,3.233,13.075,0a21.18,21.18,0,0,0,3.7-3.506A1.415,1.415,0,0,0,20.809,96.446ZM10.567,92.792a4.555,4.555,0,1,1-4.555,4.555A4.56,4.56,0,0,1,10.567,92.792Z' transform='translate(0 -90.515)' fill='%23fff'/%3E%3C/svg%3E%0A");
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-wrapper .project-list .list-item .item-img .img-cover .button-container .preview-icon {
    width: 21px;
    height: 13px;
  }
}
.project-wrapper .project-list .list-item .item-img .img-cover .button-container .edit-icon {
  width: 17px;
  height: 17px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg id='Group_9920' data-name='Group 9920' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='19.277' height='19.183' viewBox='0 0 19.277 19.183'%3E%3Cdefs%3E%3CclipPath id='clip-path'%3E%3Crect id='Rectangle_1320' data-name='Rectangle 1320' width='19.277' height='19.183' fill='%23fff'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg id='Group_9919' data-name='Group 9919' clip-path='url(%23clip-path)'%3E%3Cpath id='Path_23264' data-name='Path 23264' d='M11.987,3.2l3.921,3.921L5.982,17.049,2.063,13.127Zm6.9-.946L17.135.507a1.735,1.735,0,0,0-2.451,0L13.008,2.182,16.93,6.1l1.954-1.954a1.337,1.337,0,0,0,0-1.894M.011,18.639a.446.446,0,0,0,.54.531l4.37-1.06L1,14.189Z' transform='translate(0 0)' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E%0A");
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-wrapper .project-list .list-item .item-img .img-cover .button-container .edit-icon {
    width: 17px;
    height: 17px;
  }
}
.project-wrapper .project-list .list-item .item-title {
  text-align: center;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .project-wrapper .project-list .list-item .item-title {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .project-wrapper .project-list .list-item .item-title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-wrapper .project-list .list-item .item-title {
    font-size: 16px;
  }
}
.project-wrapper .project-list .list-item:hover .item-img, .project-wrapper .project-list .list-item:focus .item-img, .project-wrapper .project-list .list-item:active .item-img {
  border-color: #8DD5E1;
  -webkit-transform: translateY(-4px);
  -moz-transform: translateY(-4px);
  -ms-transform: translateY(-4px);
  -o-transform: translateY(-4px);
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
}
.project-wrapper .project-list .list-item:hover .item-img .img-bg, .project-wrapper .project-list .list-item:focus .item-img .img-bg, .project-wrapper .project-list .list-item:active .item-img .img-bg {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
}
.project-wrapper .project-list .list-item:hover .item-img .img-cover, .project-wrapper .project-list .list-item:focus .item-img .img-cover, .project-wrapper .project-list .list-item:active .item-img .img-cover {
  opacity: 1;
  top: 0;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-wrapper .project-list .list-item .item-img .img-cover {
    opacity: 1;
    top: 0;
  }
}

.project-edit-wrapper {
  width: 100%;
  margin: 0 auto;
}
.project-edit-wrapper .project-edit-form .form-group .col-form-label span {
  color: #F3A21D;
}
.project-edit-wrapper .project-edit-form .form-group textarea.form-control {
  height: 90px;
  resize: none;
}
.project-edit-wrapper .project-edit-form .form-group .form-control-choice {
  padding: calc(0.55rem + 1px) 0;
}
.project-edit-wrapper .project-edit-form .form-group .upload-list {
  margin-bottom: 0.5em;
}
.project-edit-wrapper .project-edit-form .form-group .upload-list .btn-theme {
  max-width: initial;
  margin-bottom: 0.2em;
}
.project-edit-wrapper .project-edit-form .form-group .group-title {
  padding: 0.375em 0;
  text-decoration: underline;
  font-weight: 500;
}
.project-edit-wrapper .project-edit-form .form-group .group-list .list-item .btn-theme {
  text-align: center;
  display: inline-block;
}
.project-edit-wrapper .project-edit-form .form-group .group-list .list-item .btn-theme .plus {
  display: inline-block;
  display: inline-block;
  position: relative;
  width: 2px;
  height: 2px;
  -webkit-transform: translateY(-0.15em);
  -moz-transform: translateY(-0.15em);
  -ms-transform: translateY(-0.15em);
  -o-transform: translateY(-0.15em);
}
.project-edit-wrapper .project-edit-form .form-group .group-list .list-item .btn-theme .plus:before, .project-edit-wrapper .project-edit-form .form-group .group-list .list-item .btn-theme .plus:after {
  content: "";
  position: absolute;
  background-color: #ffffff;
}
.project-edit-wrapper .project-edit-form .form-group .group-list .list-item .btn-theme .plus:before {
  width: 100%;
  height: 1em;
  margin-top: calc( -1em / 2);
  left: 0;
  top: 50%;
}
.project-edit-wrapper .project-edit-form .form-group .group-list .list-item .btn-theme .plus:after {
  width: 1em;
  height: 100%;
  margin-left: calc( -1em / 2);
  left: 50%;
  top: 0;
}
.project-edit-wrapper .project-edit-form .form-group .group-list .list-item .btn-theme .cross {
  display: inline-block;
  display: inline-block;
  position: relative;
  width: 2px;
  height: 2px;
  -webkit-transform: rotate(45deg) translate(-0.1em, -0.15em);
  -moz-transform: rotate(45deg) translate(-0.1em, -0.15em);
  -ms-transform: rotate(45deg) translate(-0.1em, -0.15em);
  -o-transform: rotate(45deg) translate(-0.1em, -0.15em);
}
.project-edit-wrapper .project-edit-form .form-group .group-list .list-item .btn-theme .cross:before, .project-edit-wrapper .project-edit-form .form-group .group-list .list-item .btn-theme .cross:after {
  content: "";
  position: absolute;
  background-color: #ffffff;
}
.project-edit-wrapper .project-edit-form .form-group .group-list .list-item .btn-theme .cross:before {
  width: 100%;
  height: 1em;
  margin-top: calc( -1em / 2);
  left: 0;
  top: 50%;
}
.project-edit-wrapper .project-edit-form .form-group .group-list .list-item .btn-theme .cross:after {
  width: 1em;
  height: 100%;
  margin-left: calc( -1em / 2);
  left: 50%;
  top: 0;
}
.project-edit-wrapper .project-edit-form .form-group .preview-item .preview-item-img {
  max-width: 100%;
}
.project-edit-wrapper .project-edit-form .form-group .preview-item .preview-item-link {
  color: #258DCF;
  text-decoration: underline;
}
.project-edit-wrapper .project-edit-form .form-group .preview-item .preview-item-link:hover, .project-edit-wrapper .project-edit-form .form-group .preview-item .preview-item-link:focus, .project-edit-wrapper .project-edit-form .form-group .preview-item .preview-item-link:active {
  text-decoration: none;
}
.project-edit-wrapper .project-edit-form .form-group .upload-list .list-item .item-note {
  line-height: 1.3em;
  color: #ABABAB;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .project-edit-wrapper .project-edit-form .form-group .upload-list .list-item .item-note {
    font-size: 12px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .project-edit-wrapper .project-edit-form .form-group .upload-list .list-item .item-note {
    font-size: 12px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-edit-wrapper .project-edit-form .form-group .upload-list .list-item .item-note {
    font-size: 12px;
  }
}
.project-edit-wrapper .project-edit-form .form-group .upload-list .list-item .item-file a {
  color: #F3A21D;
  text-decoration: underline;
}
.project-edit-wrapper .project-edit-form .form-group .upload-list .list-item .item-file a:hover, .project-edit-wrapper .project-edit-form .form-group .upload-list .list-item .item-file a:focus, .project-edit-wrapper .project-edit-form .form-group .upload-list .list-item .item-file a:active {
  text-decoration: none;
}
.project-edit-wrapper .project-edit-form .custom-checkbox .custom-control-label,
.project-edit-wrapper .project-edit-form .custom-radio .custom-control-label {
  padding-top: 0.15em;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .project-edit-wrapper .project-edit-form .custom-checkbox .custom-control-label,
.project-edit-wrapper .project-edit-form .custom-radio .custom-control-label {
    padding-top: 0.2em;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .project-edit-wrapper .project-edit-form .custom-checkbox .custom-control-label,
.project-edit-wrapper .project-edit-form .custom-radio .custom-control-label {
    padding-top: 0.25em;
  }
}
.project-edit-wrapper .project-edit-form #btn-submit {
  max-width: 170px;
  white-space: nowrap;
}

.body-enrolment .responsive-spacing {
  margin-bottom: 5px;
  margin-top: 5px;
}

.body-train-event .custom-checkbox .custom-control-label:before {
  left: -2rem;
}
.body-train-event .custom-checkbox .custom-control-label:after {
  left: -2rem;
}
.body-student-project .content-in-progress .button-container .btn-theme, .body-student-project .content-wait-for-approval .button-container .btn-theme, .body-student-project .content-approved-project .button-container .btn-theme {
  max-width: 150px;
  padding: 5px 5px;
}

.body-discussion-board .title-new-button-container {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 40px;
  justify-content: space-between;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-discussion-board .title-new-button-container {
    margin-bottom: 40px;
  }
}
.body-discussion-board .title-new-button-container .user-title {
  align-self: center;
  margin-bottom: unset;
}
.body-discussion-board .title-new-button-container .btn-arrow {
  padding-top: 11px;
  padding-bottom: 11px;
}
.body-discussion-board .title-hover:hover {
  background-color: #F3F3F3;
  cursor: pointer;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .body-discussion-board .title-hover:hover {
    background-color: unset;
  }
}
.body-discussion-board .title-hover .table-mobile-spacing {
  margin-bottom: 20px;
}

.body-dashboard-topic-detail .comment-box-cantainer {
  display: flex;
  flex-wrap: wrap;
  border: 7px solid #3CC1C8;
  background-color: transparent;
  padding: 40px 70px;
  margin-bottom: 23px;
}
@media (min-width: 768px) and (max-width: 991px) {
  .body-dashboard-topic-detail .comment-box-cantainer {
    padding: 30px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-dashboard-topic-detail .comment-box-cantainer {
    padding: 15px;
  }
}
.body-dashboard-topic-detail .comment-box-cantainer .date-name-container {
  margin-bottom: 20px;
  width: 55%;
  order: 1;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-dashboard-topic-detail .comment-box-cantainer .date-name-container {
    width: 100%;
  }
}
.body-dashboard-topic-detail .comment-box-cantainer .date-name-container .item-date {
  margin-bottom: 10px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .body-dashboard-topic-detail .comment-box-cantainer .date-name-container .item-date {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .body-dashboard-topic-detail .comment-box-cantainer .date-name-container .item-date {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-dashboard-topic-detail .comment-box-cantainer .date-name-container .item-date {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-dashboard-topic-detail .comment-box-cantainer .date-name-container .item-date {
    margin-bottom: 6px;
  }
}
.body-dashboard-topic-detail .comment-box-cantainer .date-name-container .item-name {
  font-weight: 700;
  color: #3CC1C8;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .body-dashboard-topic-detail .comment-box-cantainer .date-name-container .item-name {
    font-size: 23px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .body-dashboard-topic-detail .comment-box-cantainer .date-name-container .item-name {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-dashboard-topic-detail .comment-box-cantainer .date-name-container .item-name {
    font-size: 20px;
  }
}
.body-dashboard-topic-detail .comment-box-cantainer .item-quote {
  margin-bottom: 20px;
  margin-top: 20px;
  order: 3;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-dashboard-topic-detail .comment-box-cantainer .item-quote {
    margin-top: 15px;
    margin-bottom: 15px;
  }
}
.body-dashboard-topic-detail .comment-box-cantainer .item-detail {
  width: 100%;
  order: 3;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .body-dashboard-topic-detail .comment-box-cantainer .item-detail {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .body-dashboard-topic-detail .comment-box-cantainer .item-detail {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-dashboard-topic-detail .comment-box-cantainer .item-detail {
    font-size: 16px;
  }
}
.body-dashboard-topic-detail .comment-box-cantainer .btn-container {
  width: 45%;
  order: 2;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  justify-content: flex-end;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-dashboard-topic-detail .comment-box-cantainer .btn-container {
    width: 100%;
    order: 4;
    margin-top: 20px;
  }
}
.body-dashboard-topic-detail .comment-box-cantainer .btn-container .item-btn {
  text-align: right;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-dashboard-topic-detail .comment-box-cantainer .btn-container .item-btn {
    width: 100%;
    margin-bottom: 10px;
    text-align: center;
  }
}
.body-dashboard-topic-detail .comment-box-cantainer .btn-container .item-btn:first-child {
  margin-right: 15px;
}
@media (min-width: 768px) and (max-width: 991px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .body-dashboard-topic-detail .comment-box-cantainer .btn-container .item-btn:first-child {
    margin-right: 0px;
    margin-bottom: 15px;
  }
}
.body-dashboard-topic-detail .comment-box-cantainer .item-quote {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.body-dashboard-topic-detail .comment-box-cantainer .item-quote .quote-icon {
  width: 30px;
  height: 20px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='27.922' height='19.699' viewBox='0 0 27.922 19.699'%3E%3Cg id='quote' transform='translate(27.922 19.699) rotate(180)'%3E%3Cpath id='Path_11323' data-name='Path 11323' d='M5.212,12.868A15.781,15.781,0,0,1,2.336,17.41a1.373,1.373,0,0,0-.13,1.657A1.348,1.348,0,0,0,3.36,19.7a1.136,1.136,0,0,0,.391-.056c2.736-.8,9.13-3.639,9.307-12.742A6.707,6.707,0,0,0,7.213.033,6.6,6.6,0,0,0,2.15,1.68,6.55,6.55,0,0,0,0,6.53a6.451,6.451,0,0,0,5.212,6.338Z' transform='translate(0 0)' fill='%233cc1c8'/%3E%3Cpath id='Path_11324' data-name='Path 11324' d='M7.2.033A6.523,6.523,0,0,0,0,6.53a6.451,6.451,0,0,0,5.212,6.338A15.782,15.782,0,0,1,2.336,17.41a1.373,1.373,0,0,0-.13,1.657A1.348,1.348,0,0,0,3.36,19.7a1.136,1.136,0,0,0,.391-.056c2.736-.8,9.13-3.639,9.307-12.742v-.13A6.7,6.7,0,0,0,7.2.033Z' transform='translate(14.864 0)' fill='%233cc1c8'/%3E%3C/g%3E%3C/svg%3E%0A");
}
.body-dashboard-topic-detail .comment-box-cantainer .item-quote .quote-main {
  width: 80%;
  margin-left: 20px;
  padding-left: 20px;
  padding-bottom: 20px;
  border-left: 2px solid #B3B4B4;
}
.body-dashboard-topic-detail .comment-box-cantainer .item-quote .quote-main .quote-name {
  color: #3CC1C8;
  font-weight: 700;
  margin-bottom: 20px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .body-dashboard-topic-detail .comment-box-cantainer .item-quote .quote-main .quote-name {
    font-size: 17px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .body-dashboard-topic-detail .comment-box-cantainer .item-quote .quote-main .quote-name {
    font-size: 15px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-dashboard-topic-detail .comment-box-cantainer .item-quote .quote-main .quote-name {
    font-size: 17px;
  }
}
.body-dashboard-topic-detail .comment-box-cantainer .item-quote .quote-main .quote-detail {
  color: #B3B4B4;
}
.body-dashboard-topic-detail .main-user {
  background-color: #3CC1C8 !important;
}
.body-dashboard-topic-detail .main-user .date-name-container .item-date {
  color: white;
}
.body-dashboard-topic-detail .main-user .date-name-container .item-name {
  color: white;
}
.body-dashboard-topic-detail .main-user .item-detail {
  color: white;
}
.body-dashboard-topic-detail .main-user .btn-container .item-btn .arrow {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23258DCF'/%3E%3C/svg%3E%0A");
}

.body-material-group-detail .no-data {
  margin-top: 40px;
  margin-bottom: 40px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .body-material-group-detail .no-data {
    font-size: 26px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .body-material-group-detail .no-data {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .body-material-group-detail .no-data {
    font-size: 24px;
  }
}
.body-material-group-detail .table-mobile-only .info {
  border-left: unset;
}

.staff-edit-info .form-inputbox {
  flex-wrap: wrap;
}

.student-edit-info .form-inputbox {
  flex-wrap: wrap;
}

.table-mobile-only-container {
  margin-bottom: -55px;
}

.table-mobile-only {
  display: none;
  margin-bottom: 55px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .table-mobile-only {
    display: block;
  }
  .table-mobile-only.row-table {
    display: flex;
    flex-wrap: wrap;
  }
}
.table-mobile-only .row {
  width: 100%;
}
.table-mobile-only .title {
  width: 100%;
  background-color: unset;
  padding-bottom: 5px;
  margin-bottom: 15px;
  border-bottom: 6px solid #8DD5E1;
  color: black;
}
.table-mobile-only .info {
  margin-top: 20px;
  margin-bottom: 20px;
  padding-left: 15px;
  border-left: 4px solid #8DD5E1;
}
.table-mobile-only .item-btn {
  margin-top: 25px;
}
.table-mobile-only .red {
  color: #DC3545;
}
.table-mobile-only .blue {
  color: #3CC1C8;
}

.responsive-table.common-table {
  display: table;
}
.responsive-table th.unshrink-sm, .responsive-table th.unshrink-sm, .responsive-table th.unshrink-md, .responsive-table th.unshrink-lg {
  display: none !important;
}
.responsive-table .unshrink-md {
  display: none;
}
.responsive-table .shrink-toggle.unshrink-sm, .responsive-table .shrink-toggle.unshrink-sm, .responsive-table .shrink-toggle.unshrink-md, .responsive-table .shrink-toggle.unshrink-lg {
  display: none !important;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
  .responsive-table .shrink-row .item-title {
    background-color: #F3F3F3;
  }
}
.responsive-table .shrinked-row {
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px) {
  .responsive-table .shrinked-row {
    display: none;
  }
}
.responsive-table .shrink-wrapper:hover {
  color: inherit !important;
  cursor: unset !important;
}
.responsive-table .shrink-wrapper:hover td {
  color: inherit !important;
}
.responsive-table .shrink-wrapper td {
  padding-top: 10px !important;
  padding-bottom: 25px !important;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px) {
  .responsive-table .shrink-wrapper td {
    display: none;
  }
}
.responsive-table tr.shrink-wrapper > td div.shrinked-row:not(.shrink-has-table) > div > div {
  font-weight: 400 !important;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .responsive-table tr.shrink-wrapper > td div.shrinked-row:not(.shrink-has-table) > div > div {
    padding: 2px 33px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .responsive-table tr.shrink-wrapper > td div.shrinked-row:not(.shrink-has-table) > div > div {
    padding: 2px 20px;
  }
}
.responsive-table tr.shrink-wrapper > td div.shrinked-row:not(.shrink-has-table) > div > div:first-of-type {
  font-weight: 600 !important;
}

.view-icon-col .btn-theme {
  min-width: unset;
}
.view-icon-col a {
  display: inline-block;
  padding: 15px 20px;
}

.view-icon-btn .view-icon {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 20px;
  height: 18px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='27.056' height='17.49' viewBox='0 0 27.056 17.49'%3E%3Cg id='Group_7803' data-name='Group 7803' transform='translate(0 -90.515)'%3E%3Ccircle id='Ellipse_148' data-name='Ellipse 148' cx='4.165' cy='4.165' r='4.165' transform='translate(9.363 95.097)' fill='%23fff'/%3E%3Cpath id='Path_20255' data-name='Path 20255' d='M26.641,98.108c-3.2-3.869-8.048-7.593-13.113-7.593S3.615,94.242.416,98.108a1.811,1.811,0,0,0,0,2.308A27.114,27.114,0,0,0,5.159,104.9c5.673,4.13,11.054,4.139,16.739,0a27.116,27.116,0,0,0,4.743-4.488A1.811,1.811,0,0,0,26.641,98.108ZM13.528,93.431A5.831,5.831,0,1,1,7.7,99.262,5.838,5.838,0,0,1,13.528,93.431Z' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E%0A");
}

.user-alert .alert-detail {
  padding-top: 50px;
  padding-bottom: 50px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .user-alert .alert-detail {
    font-size: 24px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .user-alert .alert-detail {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .user-alert .alert-detail {
    font-size: 18px;
  }
}
.user-alert .alert-btn {
  display: flex;
}
.user-alert .alert-btn .btn-theme {
  justify-content: center;
}

.facilities {
  padding-top: 160px;
  background-color: #F5F4F6;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .facilities {
    min-height: calc(100vh - 234px);
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .facilities {
    min-height: calc(100vh - 229px);
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .facilities {
    min-height: calc(100vh - 345px);
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities {
    padding-top: 75px;
  }
}
.facilities .facilities-wrapper {
  position: relative;
  overflow: hidden;
  padding: 50px 0;
  /*
  height: 930px;
  @media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px){
  	height: 720px;
  }

  @media (min-width: 576px) and (max-width: 767px), (max-width: 575px){
  	height: 480px;
  }
  */
}
.facilities .facilities-main {
  margin-bottom: 10px;
}
.facilities .facilities-main .main-wrapper .main-title {
  color: #F3A21D;
  margin-bottom: 10px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .facilities .facilities-main .main-wrapper .main-title {
    font-size: 28px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .facilities .facilities-main .main-wrapper .main-title {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .facilities-main .main-wrapper .main-title {
    font-size: 19px;
  }
}
.facilities .facilities-main .main-wrapper .main-detail {
  color: #7D7D7D;
  font-family: "Open Sans", "Microsoft JhengHei", "Helvetica Neue", sans-serif;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .facilities .facilities-main .main-wrapper .main-detail p {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .facilities .facilities-main .main-wrapper .main-detail p {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .facilities-main .main-wrapper .main-detail p {
    font-size: 13px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .facilities-map-wrapper {
    overflow-y: hidden;
    overflow-x: scroll;
  }
}
.facilities .facilities-map {
  position: relative;
  max-width: 1920px;
  margin: 0 auto;
  -webkit-transform: translateX(0);
  -moz-transform: translateX(0);
  -ms-transform: translateX(0);
  -o-transform: translateX(0);
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .facilities .facilities-map {
    max-width: 90%;
  }
}
.facilities .facilities-map.active .map-layer {
  opacity: 0;
}
.facilities .facilities-map.active .map-maping {
  opacity: 0;
  visibility: hidden;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px) {
  .facilities .facilities-map.area0 {
    -webkit-transform: translateX(10vw);
    -moz-transform: translateX(10vw);
    -ms-transform: translateX(10vw);
    -o-transform: translateX(10vw);
  }
  .facilities .facilities-map.area1 {
    -webkit-transform: translateX(-27vw);
    -moz-transform: translateX(-27vw);
    -ms-transform: translateX(-27vw);
    -o-transform: translateX(-27vw);
  }
  .facilities .facilities-map.area2 {
    -webkit-transform: translateX(-44vw);
    -moz-transform: translateX(-44vw);
    -ms-transform: translateX(-44vw);
    -o-transform: translateX(-44vw);
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .facilities-map {
    width: 240vw;
  }
}
.facilities .facilities-map .map-bg .bg-img {
  width: 100%;
}
@-webkit-keyframes anim-flash {
  10% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
  90% {
    opacity: 1;
  }
}
@keyframes anim-flash {
  10% {
    opacity: 1;
  }
  50% {
    opacity: 0.5;
  }
  90% {
    opacity: 1;
  }
}
.facilities .facilities-map .map-layer {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.facilities .facilities-map .map-layer .layer-img {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.facilities .facilities-map .map-layer .layer-img.hover .img-bg {
  opacity: 1;
}
.facilities .facilities-map .map-layer .layer-img.hover .img-title {
  color: #F3A21D;
}
.facilities .facilities-map .map-layer .layer-img.hover .img-title .title-icon {
  margin-top: 0;
}
.facilities .facilities-map .map-layer .layer-img .img-bg {
  -webkit-animation: anim-flash 3000ms 0 linear;
  -moz-animation: anim-flash 3000ms 0 linear;
  -ms-animation: anim-flash 3000ms 0 linear;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  -webkit-animation-direction: normal;
  -moz-animation-direction: normal;
  -ms-animation-direction: normal;
  -webkit-animation-delay: 0;
  -moz-animation-delay: 0;
  -ms-animation-delay: 0;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  width: 100%;
}
.facilities .facilities-map .map-layer .layer-img .img-title {
  position: absolute;
  left: 0;
  top: 0;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  width: 100%;
  height: 100%;
  text-align: center;
  color: #ffffff;
  font-weight: 700;
  font-size: 1.45vw;
  text-shadow: 0px 3px 16px rgba(0, 0, 0, 0.68);
}
@media (min-width: 1550px) {
  .facilities .facilities-map .map-layer .layer-img .img-title {
    font-size: 28px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .facilities-map .map-layer .layer-img .img-title {
    font-size: 14px;
  }
}
.facilities .facilities-map .map-layer .layer-img .img-title.title1 {
  width: 30.9%;
  margin-left: 11.1%;
}
.facilities .facilities-map .map-layer .layer-img .img-title.title2 {
  width: 30.9%;
  margin-left: 34.1%;
}
.facilities .facilities-map .map-layer .layer-img .img-title.title3 {
  width: 30.9%;
  margin-left: 62.1%;
}
.facilities .facilities-map .map-layer .layer-img .img-title .title-icon {
  margin: 0.75vw auto 0;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  width: 40px;
  height: 40px;
  -webkit-animation: anim-flash 3000ms 0 linear;
  -moz-animation: anim-flash 3000ms 0 linear;
  -ms-animation: anim-flash 3000ms 0 linear;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  -webkit-animation-direction: normal;
  -moz-animation-direction: normal;
  -ms-animation-direction: normal;
  -webkit-animation-delay: 0;
  -moz-animation-delay: 0;
  -ms-animation-delay: 0;
  background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='iso-8859-1'%3F%3E%3C!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) --%3E%3Csvg version='1.1' id='Layer_1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='enable-background:new 0 0 512 512;' xml:space='preserve' fill='%23fff'%3E%3Cg%3E%3Cg%3E%3Cpath d='M175.365,0c-4.564,0-8.264,3.699-8.264,8.264V41.32c0,4.565,3.7,8.264,8.264,8.264c4.564,0,8.264-3.699,8.264-8.264V8.264 C183.629,3.699,179.929,0,175.365,0z'/%3E%3C/g%3E%3C/g%3E%3Cg%3E%3Cg%3E%3Cpath d='M134.46,59.076L111.087,35.7c-3.227-3.226-8.46-3.226-11.686,0c-3.227,3.229-3.227,8.46,0,11.688l23.374,23.375 c1.613,1.614,3.729,2.421,5.843,2.421c2.115,0,4.23-0.807,5.843-2.42C137.688,67.535,137.688,62.304,134.46,59.076z'/%3E%3C/g%3E%3C/g%3E%3Cg%3E%3Cg%3E%3Cpath d='M251.331,35.701c-3.227-3.226-8.46-3.226-11.686,0l-23.374,23.375c-3.227,3.228-3.227,8.46,0,11.687 c1.613,1.613,3.728,2.42,5.843,2.42c2.114,0,4.23-0.807,5.843-2.42l23.374-23.375C254.558,44.161,254.558,38.929,251.331,35.701z' /%3E%3C/g%3E%3C/g%3E%3Cg%3E%3Cg%3E%3Cpath d='M373.701,215.414c-10.495,0-20.083,3.939-27.378,10.409c-5.854-15.714-21.006-26.937-38.734-26.937 c-10.495,0-20.083,3.939-27.378,10.409c-5.854-15.714-21.006-26.937-38.734-26.937c-9.295,0-17.881,3.086-24.792,8.287v-83.214 c0-22.784-18.536-41.32-41.32-41.32c-22.784,0-41.32,18.536-41.32,41.32V265.83c-18.837,3.839-33.056,20.533-33.056,40.488v49.584 c0,80.163,60.006,147.249,139.58,156.046c0.308,0.034,0.615,0.052,0.918,0.052c4.156,0,7.736-3.129,8.203-7.357 c0.501-4.536-2.769-8.62-7.305-9.121c-71.186-7.872-124.868-67.894-124.868-139.619v-49.584c0-10.773,6.91-19.959,16.528-23.371 v56.426c0,4.565,3.7,8.264,8.264,8.264s8.264-3.699,8.264-8.264V107.432c0-13.67,11.121-24.792,24.792-24.792 c13.671,0,24.792,11.122,24.792,24.792v165.831c0,4.565,3.7,8.264,8.264,8.264c4.564,0,8.264-3.699,8.264-8.264v-49.584 c0-13.67,11.121-24.792,24.792-24.792s24.792,11.122,24.792,24.792v49.584c0,4.565,3.7,8.264,8.264,8.264 c4.564,0,8.264-3.699,8.264-8.264v-33.056c0-13.67,11.121-24.792,24.792-24.792s24.792,11.122,24.792,24.792v33.056 c0,4.565,3.7,8.264,8.264,8.264c4.564,0,8.264-3.699,8.264-8.264v-16.528c0-13.67,11.121-24.792,24.792-24.792 s24.792,11.122,24.792,24.792v99.168c0,71.726-53.682,131.748-124.868,139.619c-4.536,0.501-7.807,4.585-7.305,9.121 c0.467,4.228,4.046,7.357,8.203,7.357c0.303,0,0.61-0.018,0.918-0.051c79.573-8.798,139.58-75.884,139.58-156.047v-99.168 C415.02,233.95,396.485,215.414,373.701,215.414z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .facilities-map .map-layer .layer-img .img-title .title-icon {
    width: 20px;
    height: 20px;
  }
}
.facilities .facilities-map .map-maping {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
}
.facilities .facilities-map .map-maping .image-map {
  opacity: 0;
  width: 100%;
}
.facilities .facilities-map .map-point-list {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
}
.facilities .facilities-map .map-point-list.active {
  opacity: 1;
  visibility: visible;
}
.facilities .facilities-map .map-point-list.active.area0 .type0 {
  opacity: 1;
  visibility: visible;
}
.facilities .facilities-map .map-point-list.active.area1 .type1 {
  opacity: 1;
  visibility: visible;
}
.facilities .facilities-map .map-point-list.active.area2 .type2 {
  opacity: 1;
  visibility: visible;
}
.facilities .facilities-map .map-point-list .list-item-btn {
  position: absolute;
  height: 32px;
  margin-left: -16px;
  margin-top: -16px;
  padding-left: 16px;
  opacity: 0;
  visibility: hidden;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .facilities-map .map-point-list .list-item-btn {
    margin-left: -8px;
    margin-top: -8px;
    padding-left: 8px;
  }
}
.facilities .facilities-map .map-point-list .list-item-btn .btn-wrapper-title {
  overflow: hidden;
  height: 100%;
  width: 0;
}
.facilities .facilities-map .map-point-list .list-item-btn .btn-wrapper-title .btn-title {
  display: inline-block;
  background-color: #031152;
  color: #ffffff;
  line-height: 32px;
  height: 100%;
  padding: 0 10px 0 30px;
  left: -100%;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -o-transform: translateX(-100%);
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .facilities .facilities-map .map-point-list .list-item-btn .btn-wrapper-title .btn-title {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .facilities .facilities-map .map-point-list .list-item-btn .btn-wrapper-title .btn-title {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .facilities-map .map-point-list .list-item-btn .btn-wrapper-title .btn-title {
    font-size: 12px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .facilities-map .map-point-list .list-item-btn .btn-wrapper-title .btn-title {
    padding-left: 15px;
  }
}
.facilities .facilities-map .map-point-list .list-item-btn .btn-icon {
  position: absolute;
  left: 0;
  top: 0;
  width: 32px;
  height: 32px;
  border-radius: 100%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  background-color: #FFAE12;
  text-align: center;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .facilities-map .map-point-list .list-item-btn .btn-icon {
    width: 16px;
    height: 16px;
  }
}
.facilities .facilities-map .map-point-list .list-item-btn .btn-icon .icon-plus {
  display: inline-block;
  position: relative;
  width: 20px;
  height: 20px;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  display: block;
  margin: 0 auto;
}
.facilities .facilities-map .map-point-list .list-item-btn .btn-icon .icon-plus:before, .facilities .facilities-map .map-point-list .list-item-btn .btn-icon .icon-plus:after {
  content: "";
  position: absolute;
  background-color: #ffffff;
}
.facilities .facilities-map .map-point-list .list-item-btn .btn-icon .icon-plus:before {
  width: 100%;
  height: 2px;
  margin-top: calc( -2px / 2);
  left: 0;
  top: 50%;
}
.facilities .facilities-map .map-point-list .list-item-btn .btn-icon .icon-plus:after {
  width: 2px;
  height: 100%;
  margin-left: calc( -2px / 2);
  left: 50%;
  top: 0;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .facilities-map .map-point-list .list-item-btn .btn-icon .icon-plus {
    width: 10px;
    height: 10px;
  }
}
.facilities .facilities-map .map-point-list .list-item-btn:hover, .facilities .facilities-map .map-point-list .list-item-btn:focus, .facilities .facilities-map .map-point-list .list-item-btn:active {
  z-index: 1;
}
.facilities .facilities-map .map-point-list .list-item-btn:hover .btn-wrapper-title, .facilities .facilities-map .map-point-list .list-item-btn:focus .btn-wrapper-title, .facilities .facilities-map .map-point-list .list-item-btn:active .btn-wrapper-title {
  width: inherit;
}
.facilities .facilities-map .map-point-list .list-item-btn:hover .btn-wrapper-title .btn-title, .facilities .facilities-map .map-point-list .list-item-btn:focus .btn-wrapper-title .btn-title, .facilities .facilities-map .map-point-list .list-item-btn:active .btn-wrapper-title .btn-title {
  -webkit-transform: translateX(0%);
  -moz-transform: translateX(0%);
  -ms-transform: translateX(0%);
  -o-transform: translateX(0%);
}
.facilities .facilities-map .map-point-list .list-item-btn:hover .btn-icon .icon-plus, .facilities .facilities-map .map-point-list .list-item-btn:focus .btn-icon .icon-plus, .facilities .facilities-map .map-point-list .list-item-btn:active .btn-icon .icon-plus {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
}
.facilities .map-popup-list {
  position: absolute;
  overflow: auto;
  right: 0;
  top: 0;
  height: 100%;
  overflow: hidden;
  color: #7D7D7D;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  padding: 50px 0;
  width: 775px;
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .facilities .map-popup-list {
    width: 600px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .facilities .map-popup-list {
    width: 450px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list {
    padding: 0 15px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .facilities .map-popup-list {
    width: 100%;
    height: 320px;
    margin-top: 30px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list {
    width: 100%;
    height: 240px;
    margin-top: 15px;
  }
}
.facilities .map-popup-list.active {
  opacity: 1;
  visibility: visible;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list.active {
    position: relative;
  }
}
.facilities .map-popup-list .popup-list-item {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  background-color: #F5F4F6;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list .popup-list-item {
    padding: 50px 0;
  }
}
.facilities .map-popup-list .popup-list-item.active {
  opacity: 1;
  visibility: visible;
}
.facilities .map-popup-list .popup-list-item:after {
  content: "";
  clear: both;
  display: block;
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map,
.facilities .map-popup-list .popup-list-item .popup-list-item-detail {
  height: 100%;
  float: left;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-map,
.facilities .map-popup-list .popup-list-item .popup-list-item-detail {
    height: auto;
    float: inherit;
  }
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map {
  width: calc(100% - 775px);
  text-align: center;
  opacity: 0;
  -webkit-transform: translateX(calc(775px - 100%));
  -moz-transform: translateX(calc(775px - 100%));
  -ms-transform: translateX(calc(775px - 100%));
  -o-transform: translateX(calc(775px - 100%));
  -webkit-transition: 0.3s all 0.3s;
  -moz-transition: 0.3s all 0.3s;
  -ms-transition: 0.3s all 0.3s;
  -o-transition: 0.3s all 0.3s;
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-map {
    width: calc(100% - 600px);
    -webkit-transform: translateX(calc(600px - 100%));
    -moz-transform: translateX(calc(600px - 100%));
    -ms-transform: translateX(calc(600px - 100%));
    -o-transform: translateX(calc(600px - 100%));
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-map {
    width: calc(100% - 450px);
    -webkit-transform: translateX(calc(450px - 100%));
    -moz-transform: translateX(calc(450px - 100%));
    -ms-transform: translateX(calc(450px - 100%));
    -o-transform: translateX(calc(450px - 100%));
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-map {
    width: 100%;
    margin-bottom: 15px;
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
  }
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper {
  display: inline-block;
  position: relative;
  width: 750px;
  height: 750px;
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper {
    width: 600px;
    height: 600px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper {
    width: 450px;
    height: 450px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper {
    width: 360px;
    height: 360px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper {
    width: 270px;
    height: 270px;
  }
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-map-bg {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn {
  position: absolute;
  height: 32px;
  margin-left: -16px;
  margin-top: -16px;
  padding-left: 16px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn {
    margin-left: -8px;
    margin-top: -8px;
    padding-left: 8px;
  }
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn .btn-wrapper-title {
  overflow: hidden;
  height: 100%;
  width: 0;
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn .btn-wrapper-title .btn-title {
  display: inline-block;
  background-color: #031152;
  color: #ffffff;
  line-height: 32px;
  height: 100%;
  padding: 0 10px 0 30px;
  left: -100%;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  -webkit-transform: translateX(-100%);
  -moz-transform: translateX(-100%);
  -ms-transform: translateX(-100%);
  -o-transform: translateX(-100%);
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn .btn-wrapper-title .btn-title {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn .btn-wrapper-title .btn-title {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn .btn-wrapper-title .btn-title {
    font-size: 12px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn .btn-wrapper-title .btn-title {
    padding-left: 15px;
  }
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn .btn-icon {
  position: absolute;
  left: 0;
  top: 0;
  width: 32px;
  height: 32px;
  border-radius: 100%;
  -moz-background-clip: padding;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  background-color: #FFAE12;
  text-align: center;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn .btn-icon {
    width: 16px;
    height: 16px;
  }
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn .btn-icon .icon-plus {
  display: inline-block;
  position: relative;
  width: 20px;
  height: 20px;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  display: block;
  margin: 0 auto;
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn .btn-icon .icon-plus:before, .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn .btn-icon .icon-plus:after {
  content: "";
  position: absolute;
  background-color: #ffffff;
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn .btn-icon .icon-plus:before {
  width: 100%;
  height: 2px;
  margin-top: calc( -2px / 2);
  left: 0;
  top: 50%;
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn .btn-icon .icon-plus:after {
  width: 2px;
  height: 100%;
  margin-left: calc( -2px / 2);
  left: 50%;
  top: 0;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn .btn-icon .icon-plus {
    width: 10px;
    height: 10px;
  }
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn:hover, .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn:focus, .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn:active {
  z-index: 1;
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn:hover .btn-wrapper-title, .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn:focus .btn-wrapper-title, .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn:active .btn-wrapper-title {
  width: inherit;
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn:hover .btn-wrapper-title .btn-title, .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn:focus .btn-wrapper-title .btn-title, .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn:active .btn-wrapper-title .btn-title {
  -webkit-transform: translateX(0%);
  -moz-transform: translateX(0%);
  -ms-transform: translateX(0%);
  -o-transform: translateX(0%);
}
.facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn:hover .btn-icon .icon-plus, .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn:focus .btn-icon .icon-plus, .facilities .map-popup-list .popup-list-item .popup-list-item-map .item-map-wrapper .item-btn:active .btn-icon .icon-plus {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
}
.facilities .map-popup-list .popup-list-item .popup-list-item-detail {
  width: 775px;
}
.facilities .map-popup-list .popup-list-item .popup-list-item-detail .container-vm-box {
  vertical-align: top;
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail {
    width: 600px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail {
    width: 450px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail {
    width: 100%;
    padding: 0 15px;
  }
}
.facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list {
  height: 460px;
  position: relative;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list {
    width: 420px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list {
    height: 320px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list {
    height: 160px;
  }
}
.facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 100%;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item.active {
  top: 0;
  opacity: 1;
  visibility: visible;
}
.facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .swiper-container {
  width: 600px;
  height: 460px;
  position: relative;
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .swiper-container {
    width: 460px;
    height: 400px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .swiper-container {
    width: 300px;
    height: 350px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .swiper-container {
    height: 300px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .swiper-container {
    width: 100%;
    height: 160px;
  }
}
.facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .swiper-container .swiper-slide {
  width: 100%;
  height: auto;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .swiper-container.swiper-container-vertical > .swiper-scrollbar {
    height: 100%;
  }
}
.facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .slide-item {
  padding-right: 15px;
}
.facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .slide-item .item-title {
  color: #F3A21D;
  margin-bottom: 0.6em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .slide-item .item-title {
    font-size: 28px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .slide-item .item-title {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .slide-item .item-title {
    font-size: 19px;
  }
}
.facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .slide-item .item-detail {
  font-family: "Open Sans", "Microsoft JhengHei", "Helvetica Neue", sans-serif;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .slide-item .item-detail p {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .slide-item .item-detail p {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .slide-item .item-detail p {
    font-size: 13px;
  }
}
.facilities .map-popup-list .popup-list-item .popup-list-item-detail .detail-list .detail-list-item .detail-slide .slide-item .item-img img {
  max-width: 100%;
}
.facilities .map-popup-list .map-popup-list-close {
  position: absolute;
  left: 15px;
  top: 15px;
}
.facilities .map-popup-list .map-popup-list-close span {
  display: inline-block;
  position: relative;
  width: 28px;
  height: 28px;
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.facilities .map-popup-list .map-popup-list-close span:before, .facilities .map-popup-list .map-popup-list-close span:after {
  content: "";
  position: absolute;
  background-color: #7D7D7D;
}
.facilities .map-popup-list .map-popup-list-close span:before {
  width: 100%;
  height: 2px;
  margin-top: calc( -2px / 2);
  left: 0;
  top: 50%;
}
.facilities .map-popup-list .map-popup-list-close span:after {
  width: 2px;
  height: 100%;
  margin-left: calc( -2px / 2);
  left: 50%;
  top: 0;
}
.facilities .map-popup-list .map-popup-list-close:hover span, .facilities .map-popup-list .map-popup-list-close:focus span, .facilities .map-popup-list .map-popup-list-close:active span {
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -o-transform: rotate(135deg);
}

.lmask {
  position: fixed;
  height: 100%;
  width: 100%;
  background-color: #ffffff;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  z-index: 9999;
  opacity: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .lmask {
    display: none !important;
  }
}
.lmask img {
  display: none;
}
.lmask.done {
  opacity: 0;
}
.lmask.fixed {
  position: fixed;
}

.home {
  background-color: #f2f7f7;
  overflow-x: hidden;
}
.home header {
  width: 100%;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10;
}
.home footer {
  display: none;
}
.home .map-wrapper {
  max-width: 1920px;
  max-height: 1080px;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  position: absolute;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
}
.home .map-wrapper .btn-container {
  display: inline-flex;
  flex-wrap: wrap;
  position: absolute;
  z-index: 9999;
  top: 35px;
  right: 20px;
}
.home .map-wrapper .btn-container .member-btn {
  width: 50px;
  height: 50px;
  background-color: #258DCF;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21.355' height='24.914' viewBox='0 0 21.355 24.914'%3E%3Cg id='Group_7462' data-name='Group 7462' transform='translate(0 -1)'%3E%3Ccircle id='Ellipse_147' data-name='Ellipse 147' cx='6' cy='6' r='6' transform='translate(5 1)' fill='%23fff'/%3E%3Cpath id='Path_7076' data-name='Path 7076' d='M15.72,13H5.635A5.642,5.642,0,0,0,0,18.635v4.152a.89.89,0,0,0,.89.89H20.465a.89.89,0,0,0,.89-.89V18.635A5.642,5.642,0,0,0,15.72,13Z' transform='translate(0 2.237)' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E%0A");
  background-position: center;
  background-size: 21px;
  background-repeat: no-repeat;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  cursor: pointer;
}
.home .map-wrapper .btn-container .member-btn:hover {
  background-color: #8DD5E1;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home .map-wrapper .btn-container .member-btn {
    width: 35px;
    height: 35px;
    background-size: 18px;
  }
}
.home .map-wrapper .btn-container .menu-btn {
  width: 50px;
  height: 50px;
  margin-left: 15px;
  background-color: #258DCF;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29.328' height='23.992' viewBox='0 0 29.328 23.992'%3E%3Cg id='Group_7463' data-name='Group 7463' transform='translate(-1846.775 -42.759)'%3E%3Crect id='Rectangle_70' data-name='Rectangle 70' width='29.329' height='3.583' transform='translate(1846.775 42.759)' fill='%23fff'/%3E%3Crect id='Rectangle_71' data-name='Rectangle 71' width='29.329' height='3.583' transform='translate(1846.775 52.984)' fill='%23fff'/%3E%3Crect id='Rectangle_72' data-name='Rectangle 72' width='29.329' height='3.583' transform='translate(1846.775 63.168)' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E%0A");
  background-position: center;
  background-size: 21px;
  background-repeat: no-repeat;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  cursor: pointer;
}
.home .map-wrapper .btn-container .menu-btn:hover {
  background-color: #8DD5E1;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .home .map-wrapper .btn-container .menu-btn {
    width: 35px;
    height: 35px;
    background-size: 18px;
    margin-left: 12px;
  }
}
.home .map-container {
  width: 1920px;
  height: 1080px;
  position: relative;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  transform-origin: center center;
  overflow: hidden;
}
.home .map-container .edge-shadow {
  position: absolute;
  width: calc(100% + 4px);
  height: calc(100% + 4px);
  box-shadow: inset 0px 0px 16px 16px rgb(242, 247, 247);
  z-index: 9994;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  pointer-events: none;
}
.home .map-container .edge-shadow.active {
  display: block;
}
.home .map-container .logo-container {
  z-index: 9999;
  position: absolute;
  top: 15px;
  left: 30px;
  width: 105.27px;
  height: 92.49px;
}
.home .map-container .logo-container img {
  width: 105.27px;
  height: 92.49px;
}
.home .map-container .bg {
  position: relative;
  z-index: -9999;
  top: 50%;
  left: 50%;
  width: 1920px;
  height: 1080px;
  transform: translate(-50%, -50%);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 100%;
  background-image: url("../../img/common/home/map/background.jpg");
}
.home .map-container .building1, .home .map-container .building2, .home .map-container .building3, .home .map-container .building4, .home .map-container .building5, .home .map-container .building7, .home .map-container .building8, .home .map-container .building10, .home .map-container .building11, .home .map-container .building12, .home .map-container .building13 {
  position: relative;
  cursor: default !important;
}
.home .map-container .building1 .desc, .home .map-container .building2 .desc, .home .map-container .building3 .desc, .home .map-container .building4 .desc, .home .map-container .building5 .desc, .home .map-container .building7 .desc, .home .map-container .building8 .desc, .home .map-container .building10 .desc, .home .map-container .building11 .desc, .home .map-container .building12 .desc, .home .map-container .building13 .desc {
  position: absolute;
  left: 50%;
  top: 0;
  font-size: 23px;
  font-weight: 600;
  white-space: nowrap;
  z-index: 9999;
  color: #FFFFFF;
  pointer-events: none;
  opacity: 0;
  background-color: #3CC1C8;
  border-radius: 7px;
  padding: 8px 20px;
  -webkit-transition: 0.2s all;
  -moz-transition: 0.2s all;
  -ms-transition: 0.2s all;
  -o-transition: 0.2s all;
}
.home .map-container .building1 .desc.project, .home .map-container .building2 .desc.project, .home .map-container .building3 .desc.project, .home .map-container .building4 .desc.project, .home .map-container .building5 .desc.project, .home .map-container .building7 .desc.project, .home .map-container .building8 .desc.project, .home .map-container .building10 .desc.project, .home .map-container .building11 .desc.project, .home .map-container .building12 .desc.project, .home .map-container .building13 .desc.project {
  transform: translate(-50%, -55px);
}
.home .map-container .building1 .desc.partner, .home .map-container .building2 .desc.partner, .home .map-container .building3 .desc.partner, .home .map-container .building4 .desc.partner, .home .map-container .building5 .desc.partner, .home .map-container .building7 .desc.partner, .home .map-container .building8 .desc.partner, .home .map-container .building10 .desc.partner, .home .map-container .building11 .desc.partner, .home .map-container .building12 .desc.partner, .home .map-container .building13 .desc.partner {
  transform: translate(calc(-50% + 16px), -45px);
}
.home .map-container .building1 .desc.explore, .home .map-container .building2 .desc.explore, .home .map-container .building3 .desc.explore, .home .map-container .building4 .desc.explore, .home .map-container .building5 .desc.explore, .home .map-container .building7 .desc.explore, .home .map-container .building8 .desc.explore, .home .map-container .building10 .desc.explore, .home .map-container .building11 .desc.explore, .home .map-container .building12 .desc.explore, .home .map-container .building13 .desc.explore {
  transform: translate(-50%, -97px);
}
.home .map-container .building1 .desc.event, .home .map-container .building2 .desc.event, .home .map-container .building3 .desc.event, .home .map-container .building4 .desc.event, .home .map-container .building5 .desc.event, .home .map-container .building7 .desc.event, .home .map-container .building8 .desc.event, .home .map-container .building10 .desc.event, .home .map-container .building11 .desc.event, .home .map-container .building12 .desc.event, .home .map-container .building13 .desc.event {
  transform: translate(-50%, -155px);
}
.home .map-container .building1 .desc.about-us, .home .map-container .building2 .desc.about-us, .home .map-container .building3 .desc.about-us, .home .map-container .building4 .desc.about-us, .home .map-container .building5 .desc.about-us, .home .map-container .building7 .desc.about-us, .home .map-container .building8 .desc.about-us, .home .map-container .building10 .desc.about-us, .home .map-container .building11 .desc.about-us, .home .map-container .building12 .desc.about-us, .home .map-container .building13 .desc.about-us {
  transform: translate(-50%, -55px);
}
.home .map-container .building1 .desc.news, .home .map-container .building2 .desc.news, .home .map-container .building3 .desc.news, .home .map-container .building4 .desc.news, .home .map-container .building5 .desc.news, .home .map-container .building7 .desc.news, .home .map-container .building8 .desc.news, .home .map-container .building10 .desc.news, .home .map-container .building11 .desc.news, .home .map-container .building12 .desc.news, .home .map-container .building13 .desc.news {
  transform: translate(-50%, -25px);
}
.home .map-container .building1 .layer1, .home .map-container .building2 .layer1, .home .map-container .building3 .layer1, .home .map-container .building4 .layer1, .home .map-container .building5 .layer1, .home .map-container .building7 .layer1, .home .map-container .building8 .layer1, .home .map-container .building10 .layer1, .home .map-container .building11 .layer1, .home .map-container .building12 .layer1, .home .map-container .building13 .layer1 {
  -webkit-animation: float 2s ease-in-out infinite;
          animation: float 2s ease-in-out infinite;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  position: relative;
}
.home .map-container .building1 .layer1:hover, .home .map-container .building2 .layer1:hover, .home .map-container .building3 .layer1:hover, .home .map-container .building4 .layer1:hover, .home .map-container .building5 .layer1:hover, .home .map-container .building7 .layer1:hover, .home .map-container .building8 .layer1:hover, .home .map-container .building10 .layer1:hover, .home .map-container .building11 .layer1:hover, .home .map-container .building12 .layer1:hover, .home .map-container .building13 .layer1:hover {
  filter: drop-shadow(0 2px 4px #656565);
}
.home .map-container .building1 .layer2, .home .map-container .building2 .layer2, .home .map-container .building3 .layer2, .home .map-container .building4 .layer2, .home .map-container .building5 .layer2, .home .map-container .building7 .layer2, .home .map-container .building8 .layer2, .home .map-container .building10 .layer2, .home .map-container .building11 .layer2, .home .map-container .building12 .layer2, .home .map-container .building13 .layer2 {
  pointer-events: none;
  cursor: unset;
}
.home .map-container .bubble-link {
  cursor: pointer !important;
}
.home .map-container .bubble-link .building1, .home .map-container .bubble-link .building2, .home .map-container .bubble-link .building3, .home .map-container .bubble-link .building4, .home .map-container .bubble-link .building5, .home .map-container .bubble-link .building7, .home .map-container .bubble-link .building8, .home .map-container .bubble-link .building10, .home .map-container .bubble-link .building11, .home .map-container .bubble-link .building12, .home .map-container .bubble-link .building13 {
  cursor: pointer !important;
}
.home .map-container .bubble-link .building1:hover .desc, .home .map-container .bubble-link .building2:hover .desc, .home .map-container .bubble-link .building3:hover .desc, .home .map-container .bubble-link .building4:hover .desc, .home .map-container .bubble-link .building5:hover .desc, .home .map-container .bubble-link .building7:hover .desc, .home .map-container .bubble-link .building8:hover .desc, .home .map-container .bubble-link .building10:hover .desc, .home .map-container .bubble-link .building11:hover .desc, .home .map-container .bubble-link .building12:hover .desc, .home .map-container .bubble-link .building13:hover .desc {
  opacity: 0.9;
}
.home .map-container .building1 .layer1 {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s;
}
.home .map-container .building2 .layer1 {
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}
.home .map-container .building3 .layer1 {
  -webkit-animation-delay: 0.5s;
          animation-delay: 0.5s;
}
.home .map-container .building4 .layer1 {
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}
.home .map-container .building5 .layer1 {
  -webkit-animation-delay: 0.6s;
          animation-delay: 0.6s;
}
.home .map-container .building7 .layer1 {
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}
.home .map-container .building8 .layer1 {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s;
}
.home .map-container .building10 .layer1 {
  -webkit-animation-delay: 0.4s;
          animation-delay: 0.4s;
}
.home .map-container .building11 .layer1 {
  -webkit-animation-delay: 0.1s;
          animation-delay: 0.1s;
}
.home .map-container .building12 .layer1 {
  -webkit-animation-delay: 0.8s;
          animation-delay: 0.8s;
}
.home .map-container .building13 .layer1 {
  -webkit-animation-delay: 0.3s;
          animation-delay: 0.3s;
}
.home .map-container .cloud1 {
  z-index: 5000;
  pointer-events: none;
  position: absolute;
  width: 186px;
  height: 118px;
  opacity: 0.8;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../../img/common/home/map/cloud/cloud5.png");
}
.home .map-container .cloud2 {
  z-index: 5000;
  pointer-events: none;
  position: absolute;
  width: 64px;
  height: 58px;
  opacity: 0.8;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../../img/common/home/map/cloud/cloud6.png");
}
.home .map-container .building1 {
  z-index: 9998;
  width: 156.53px;
  height: 408.2px;
  position: absolute;
  top: 736px;
  left: 489px;
  transform: translate(-50%, -50%);
}
.home .map-container .building1 .layer1 {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 141px;
  height: 141px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building1/layer1.png");
}
.home .map-container .building1 .layer2 {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 156.53px;
  height: 343.93px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building1/layer2.png");
}
.home .map-container .building2 {
  z-index: 9997;
  width: 134.01px;
  height: 363.4px;
  position: absolute;
  top: 696px;
  left: 719px;
  transform: translate(-50%, -50%);
}
.home .map-container .building2 .layer1 {
  position: absolute;
  z-index: 2;
  top: 0px;
  left: 74px;
  transform: translateX(-50%);
  width: 114px;
  height: 114px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building2/layer1.png");
}
.home .map-container .building2 .layer2 {
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 134.01px;
  height: 290.8px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building2/layer2.png");
}
.home .map-container .building3 {
  z-index: 9996;
  width: 168.95px;
  height: 346.65px;
  position: absolute;
  top: 610px;
  left: 310px;
  transform: translate(-50%, -50%);
}
.home .map-container .building3 .layer1 {
  position: absolute;
  z-index: 2;
  top: -35px;
  left: calc(50% + 6px);
  transform: translateX(-50%);
  width: 109px;
  height: 126px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building3/layer1.png");
}
.home .map-container .building3 .layer2 {
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 168.95px;
  height: 278.65px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building3/layer2.png");
}
.home .map-container .building4 {
  z-index: 9995;
  width: 168.95px;
  height: 346.65px;
  position: absolute;
  top: 531px;
  left: 440px;
  transform: translate(-50%, -50%);
}
.home .map-container .building4 .layer1 {
  position: absolute;
  z-index: 2;
  top: -114px;
  left: calc(50% + 0px);
  transform: translateX(-50%);
  width: 114px;
  height: 114px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building4/layer1.png");
}
.home .map-container .building4 .layer2 {
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 157px;
  height: 403px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building4/layer2.png");
}
.home .map-container .train {
  z-index: 9994;
  width: 354.98px;
  height: 211.65px;
  position: absolute;
  top: 144px;
  left: -180px;
  transform: translate(-50%, -50%);
  -webkit-animation: train 15s infinite;
          animation: train 15s infinite;
  pointer-events: none;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.home .map-container .train .layer1 {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 355px;
  height: 212px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/train/layer1.png");
}
.home .map-container .railway {
  z-index: 9993;
  width: 1511.26px;
  height: 911.71px;
  position: absolute;
  top: 674px;
  left: 734px;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.home .map-container .railway .layer1 {
  position: absolute;
  z-index: 2;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  width: 1511.26px;
  height: 911.71px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/railway.png");
}
.home .map-container .car1 {
  z-index: -9998;
  width: 84.66px;
  height: 61.22px;
  position: absolute;
  top: 379px;
  left: 1962px;
  transform: translate(-50%, -50%);
  -webkit-animation: car1 28s infinite, a-opacity 28s infinite;
          animation: car1 28s infinite, a-opacity 28s infinite;
  pointer-events: none;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-delay: 2s;
          animation-delay: 2s;
}
.home .map-container .car1 .layer1 {
  position: absolute;
  z-index: 1;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  width: 84.66px;
  height: 61.22px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/car/car1.png");
}
.home .map-container .car2 {
  z-index: -9998;
  width: 45.75px;
  height: 48.81px;
  position: absolute;
  top: 375px;
  left: 1950px;
  transform: translate(-50%, -50%);
  -webkit-animation: car2 28s infinite, a-opacity 28s infinite;
          animation: car2 28s infinite, a-opacity 28s infinite;
  pointer-events: none;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  -webkit-animation-delay: 7s;
          animation-delay: 7s;
}
.home .map-container .car2 .layer1 {
  position: absolute;
  z-index: 1;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  width: 45.75px;
  height: 48.81px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/car/car2.png");
}
.home .map-container .car3 {
  z-index: -9998;
  width: 83.62px;
  height: 61.63px;
  position: absolute;
  top: -30px;
  left: 373px;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.home .map-container .car3.run-animation {
  -webkit-animation: car3 11s linear, a-opacity 20s infinite;
          animation: car3 11s linear, a-opacity 20s infinite;
}
.home .map-container .car3 .layer1 {
  position: absolute;
  z-index: 1;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  width: 84.66px;
  height: 61.22px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/car/car3.png");
}
.home .map-container .car4 {
  z-index: -9998;
  width: 84.66px;
  height: 61.22px;
  position: absolute;
  top: 412px;
  left: 1072px;
  transform: translate(-50%, -50%);
  pointer-events: none;
}
.home .map-container .car4.run-animation {
  -webkit-animation: car4 15s linear, a-opacity 20s infinite;
          animation: car4 15s linear, a-opacity 20s infinite;
}
.home .map-container .car4 .layer1 {
  position: absolute;
  z-index: 1;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  width: 84.66px;
  height: 61.22px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/car/car1.png");
}
.home .map-container .building5 {
  z-index: 9993;
  width: 278.69px;
  height: 413.13px;
  position: absolute;
  top: 1082px;
  left: 1401px;
  transform: translate(-50%, -50%);
}
.home .map-container .building5 .layer1 {
  position: absolute;
  z-index: 2;
  top: -288px;
  left: calc(50% + 46px);
  transform: translateX(-50%);
  width: 114px;
  height: 114px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building5/layer1.png");
}
.home .map-container .building5 .layer2 {
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 298px;
  height: 956px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building5/layer2.png");
}
.home .map-container .building6 {
  pointer-events: none;
  z-index: 9992;
  width: 196.65px;
  height: 257.57px;
  position: absolute;
  top: 748px;
  left: 1648px;
  transform: translate(-50%, -50%);
}
.home .map-container .building6 .layer1 {
  position: absolute;
  z-index: 2;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  width: 196.65px;
  height: 257.57px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building6/layer1.png");
}
.home .map-container .building6 .layer2 {
  position: absolute;
  z-index: 2;
  width: 137.56px;
  height: 312.94px;
  top: -38px;
  left: 23px;
  overflow: hidden;
}
.home .map-container .building6 .layer2 .inner-bg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 1000px;
  height: 1000px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building6/layer2.png");
  -webkit-animation: inno 30s infinite;
          animation: inno 30s infinite;
  pointer-events: none;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
}
.home .map-container .building7 {
  z-index: 9992;
  width: 335.29px;
  height: 577.16px;
  position: absolute;
  top: 463px;
  left: 1087px;
  transform: translate(-50%, -50%);
}
.home .map-container .building7 .layer1 {
  position: absolute;
  z-index: 3;
  top: -1px;
  left: calc(50% + 2px);
  transform: translateX(-50%);
  width: 128.09px;
  height: 147.68px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building7/layer1.png");
}
.home .map-container .building7 .layer2 {
  position: absolute;
  z-index: 1;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 326.96px;
  height: 504.22px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building7/layer2.png");
}
.home .map-container .building7 .layer3 {
  position: absolute;
  z-index: 2;
  bottom: 58px;
  left: 114px;
  transform: translateX(-50%);
  width: 249.06px;
  height: 300.75px;
  pointer-events: none;
}
.home .map-container .building7 .layer3 .inner-bg {
  width: 100%;
  height: 100%;
  width: 249.06px;
  height: 187.75px;
  position: absolute;
  top: 150px;
  left: 0px;
  transform: translateY(-50%);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building7/layer3.png");
  -webkit-animation: smartcity-logo 1.8s ease-in-out infinite;
          animation: smartcity-logo 1.8s ease-in-out infinite;
  -webkit-animation-timing-function: linear;
          animation-timing-function: linear;
  animation-direction: alternate-reverse;
}
.home .map-container .building8 {
  z-index: 9991;
  width: 173.7px;
  height: 355.82px;
  position: absolute;
  top: 339px;
  left: 753px;
  transform: translate(-50%, -50%);
}
.home .map-container .building8 .layer1 {
  z-index: 2;
  position: absolute;
  top: 8px;
  left: 56%;
  transform: translateX(-50%);
  width: 121.81px;
  height: 121.81px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building8/layer1.png");
}
.home .map-container .building8 .layer2 {
  z-index: 1;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 173.7px;
  height: 264.94px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building8/layer2.png");
}
.home .map-container .building9 {
  pointer-events: none;
  z-index: 9990;
  width: 95.59px;
  height: 259.14px;
  position: absolute;
  top: 220px;
  left: 665px;
  transform: translate(-50%, -50%);
}
.home .map-container .building9 .layer1 {
  z-index: 2;
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 95.59px;
  height: 259.14px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building9/layer1.png");
}
.home .map-container .building10 {
  z-index: 9990;
  width: 210.27px;
  height: 341.62px;
  position: absolute;
  top: 594px;
  left: 1784px;
  transform: translate(-50%, -50%);
}
.home .map-container .building10 .layer1 {
  z-index: 2;
  position: absolute;
  top: 20px;
  left: 50%;
  transform: translateX(-50%);
  width: 115.92px;
  height: 115.92px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building10/layer1.png");
}
.home .map-container .building10 .layer2 {
  z-index: 1;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 210.27px;
  height: 247.96px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building10/layer2.png");
}
.home .map-container .building11 {
  z-index: 9989;
  width: 148.47px;
  height: 506.25px;
  position: absolute;
  top: 291px;
  left: 1517px;
  transform: translate(-50%, -50%);
}
.home .map-container .building11 .layer1 {
  z-index: 2;
  position: absolute;
  top: -10px;
  left: 51px;
  transform: translateX(-50%);
  width: 113.88px;
  height: 113.88px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building11/layer1.png");
}
.home .map-container .building11 .layer2 {
  z-index: 1;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 138.93px;
  height: 483.99px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building11/layer2.png");
}
.home .map-container .building12 {
  z-index: 9988;
  width: 234.39px;
  height: 403.72px;
  position: absolute;
  top: 234px;
  left: 1301px;
  transform: translate(-50%, -50%);
}
.home .map-container .building12 .layer1 {
  z-index: 2;
  position: absolute;
  top: 0px;
  left: 93px;
  transform: translateX(-50%);
  width: 113.88px;
  height: 113.88px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building12/layer1.png");
}
.home .map-container .building12 .layer2 {
  z-index: 1;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 234.39px;
  height: 380.41px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building12/layer2.png");
}
.home .map-container .building13 {
  z-index: 9987;
  width: 265.2px;
  height: 268.09px;
  position: absolute;
  top: 157px;
  left: 989px;
  transform: translate(-50%, -50%);
}
.home .map-container .building13 .layer1 {
  z-index: 2;
  position: absolute;
  top: -4px;
  left: 56%;
  transform: translateX(-50%);
  width: 81.23px;
  height: 93.65px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building13/layer1.png");
}
.home .map-container .building13 .layer2 {
  z-index: 1;
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 265.2px;
  height: 237.74px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("../../img/common/home/map/building13/layer2.png");
}

@-webkit-keyframes popup {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}

@keyframes popup {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes smartcity-logo {
  0% {
    transform: translate(27px, calc(-50% + 11px));
  }
  100% {
    transform: translate(-22px, calc(-50% - 16px));
  }
}
@keyframes smartcity-logo {
  0% {
    transform: translate(27px, calc(-50% + 11px));
  }
  100% {
    transform: translate(-22px, calc(-50% - 16px));
  }
}
@-webkit-keyframes inno {
  0% {
    transform: translate(calc(-50% + 575px), calc(-50% + 328px));
  }
  25% {
    transform: translate(-50, -50%);
  }
  75% {
    transform: translate(-50, -50%);
  }
  100% {
    transform: translate(calc(-50% - 600px), calc(-50% - 346px));
  }
}
@keyframes inno {
  0% {
    transform: translate(calc(-50% + 575px), calc(-50% + 328px));
  }
  25% {
    transform: translate(-50, -50%);
  }
  75% {
    transform: translate(-50, -50%);
  }
  100% {
    transform: translate(calc(-50% - 600px), calc(-50% - 346px));
  }
}
@-webkit-keyframes a-opacity {
  0% {
    opacity: 0;
  }
  5% {
    opacity: 1;
  }
  95% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@keyframes a-opacity {
  0% {
    opacity: 0;
  }
  5% {
    opacity: 1;
  }
  95% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@-webkit-keyframes car1 {
  0% {
    transform: translate(-50, -50%);
  }
  10% {
    transform: translate(-50, -50%);
  }
  50% {
    transform: translate(calc(-50% - 1240px), calc(-50% + 731px));
  }
  100% {
    transform: translate(calc(-50% - 1240px), calc(-50% + 731px));
  }
}
@keyframes car1 {
  0% {
    transform: translate(-50, -50%);
  }
  10% {
    transform: translate(-50, -50%);
  }
  50% {
    transform: translate(calc(-50% - 1240px), calc(-50% + 731px));
  }
  100% {
    transform: translate(calc(-50% - 1240px), calc(-50% + 731px));
  }
}
@-webkit-keyframes car2 {
  0% {
    transform: translate(-50, -50%);
  }
  10% {
    transform: translate(-50, -50%);
  }
  50% {
    transform: translate(calc(-50% - 1240px), calc(-50% + 731px));
  }
  100% {
    transform: translate(calc(-50% - 1240px), calc(-50% + 731px));
  }
}
@keyframes car2 {
  0% {
    transform: translate(-50, -50%);
  }
  10% {
    transform: translate(-50, -50%);
  }
  50% {
    transform: translate(calc(-50% - 1240px), calc(-50% + 731px));
  }
  100% {
    transform: translate(calc(-50% - 1240px), calc(-50% + 731px));
  }
}
@-webkit-keyframes car3 {
  0% {
    transform: translate(-50, -50%);
  }
  100% {
    transform: translate(calc(-50% + 707px), calc(-50% + 420px));
  }
}
@keyframes car3 {
  0% {
    transform: translate(-50, -50%);
  }
  100% {
    transform: translate(calc(-50% + 707px), calc(-50% + 420px));
  }
}
@-webkit-keyframes car4 {
  0% {
    transform: translate(-50, -50%);
  }
  100% {
    transform: translate(calc(-50% - 1120px), calc(-50% + 651px));
  }
}
@keyframes car4 {
  0% {
    transform: translate(-50, -50%);
  }
  100% {
    transform: translate(calc(-50% - 1120px), calc(-50% + 651px));
  }
}
@-webkit-keyframes train {
  0% {
    transform: translate(-50, -50%);
  }
  10% {
    transform: translate(-50, -50%);
  }
  50% {
    transform: translate(calc(-50% + 1807px), calc(-50% + 1043px));
  }
  100% {
    transform: translate(calc(-50% + 1807px), calc(-50% + 1043px));
  }
}
@keyframes train {
  0% {
    transform: translate(-50, -50%);
  }
  10% {
    transform: translate(-50, -50%);
  }
  50% {
    transform: translate(calc(-50% + 1807px), calc(-50% + 1043px));
  }
  100% {
    transform: translate(calc(-50% + 1807px), calc(-50% + 1043px));
  }
}
@-webkit-keyframes float {
  0% {
    transform: translate(-50%, 0px);
  }
  50% {
    transform: translate(-50%, -15px);
  }
  100% {
    transform: translate(-50%, 0px);
  }
}
@keyframes float {
  0% {
    transform: translate(-50%, 0px);
  }
  50% {
    transform: translate(-50%, -15px);
  }
  100% {
    transform: translate(-50%, 0px);
  }
}
.home header {
  pointer-events: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
}
.home header.scrolled {
  background-color: #ffffff;
  z-index: 2;
}
.home header .login-btn, .home header .menu-btn, .home header .left-col {
  pointer-events: auto;
}

header {
  height: 130px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding-left: 35px;
  padding-right: 35px;
  background-color: transparent;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  header {
    height: 100px;
    padding-left: 20px;
    padding-right: 15px;
  }
}
header .left-col {
  width: 172px;
  display: flex;
  align-items: center;
}
header .left-col img {
  height: 92.49px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  header .left-col img {
    height: 72px;
    width: unset;
  }
}
header .right-col {
  width: calc(100% - 172px);
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}
header .right-col .member-btn {
  width: 40px;
  height: 40px;
  margin-right: 15px;
  background-color: #258DCF;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21.355' height='24.914' viewBox='0 0 21.355 24.914'%3E%3Cg id='Group_7462' data-name='Group 7462' transform='translate(0 -1)'%3E%3Ccircle id='Ellipse_147' data-name='Ellipse 147' cx='6' cy='6' r='6' transform='translate(5 1)' fill='%23fff'/%3E%3Cpath id='Path_7076' data-name='Path 7076' d='M15.72,13H5.635A5.642,5.642,0,0,0,0,18.635v4.152a.89.89,0,0,0,.89.89H20.465a.89.89,0,0,0,.89-.89V18.635A5.642,5.642,0,0,0,15.72,13Z' transform='translate(0 2.237)' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E%0A");
  background-position: center;
  background-size: 18px;
  background-repeat: no-repeat;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  cursor: pointer;
}
header .right-col .member-btn:hover {
  background-color: #8DD5E1;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  header .right-col .member-btn {
    width: 35px;
    height: 35px;
    background-size: 18px;
  }
}
header .right-col .login-btn {
  width: 40px;
  height: 40px;
  background-color: #258DCF;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='21.355' height='24.914' viewBox='0 0 21.355 24.914'%3E%3Cg id='Group_7462' data-name='Group 7462' transform='translate(0 -1)'%3E%3Ccircle id='Ellipse_147' data-name='Ellipse 147' cx='6' cy='6' r='6' transform='translate(5 1)' fill='%23fff'/%3E%3Cpath id='Path_7076' data-name='Path 7076' d='M15.72,13H5.635A5.642,5.642,0,0,0,0,18.635v4.152a.89.89,0,0,0,.89.89H20.465a.89.89,0,0,0,.89-.89V18.635A5.642,5.642,0,0,0,15.72,13Z' transform='translate(0 2.237)' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E%0A");
  background-position: center;
  background-size: 18px;
  background-repeat: no-repeat;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  cursor: pointer;
}
header .right-col .login-btn:hover {
  background-color: #8DD5E1;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  header .right-col .login-btn {
    width: 35px;
    height: 35px;
    background-size: 18px;
  }
}
header .right-col .logout-btn {
  width: 40px;
  height: 40px;
  background-color: #258DCF;
  background-image: url("data:image/svg+xml,%3Csvg id='Group_9923' data-name='Group 9923' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='29.347' height='29.348' viewBox='0 0 29.347 29.348'%3E%3Cdefs%3E%3CclipPath id='clip-path'%3E%3Crect id='Rectangle_1321' data-name='Rectangle 1321' width='29.347' height='29.348' fill='%23fff'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg id='Group_9922' data-name='Group 9922' clip-path='url(%23clip-path)'%3E%3Cpath id='Path_23265' data-name='Path 23265' d='M310.8,153.763a1.237,1.237,0,0,0-.265-.4l-3.667-3.667a1.223,1.223,0,0,0-1.729,1.729l1.581,1.581h-6.831a1.223,1.223,0,0,0,0,2.446h6.831l-1.581,1.581a1.223,1.223,0,1,0,1.729,1.729l3.667-3.667a1.211,1.211,0,0,0,.265-.4,1.224,1.224,0,0,0,0-.934' transform='translate(-281.546 -140.779)' fill='%23fff'/%3E%3Cpath id='Path_23266' data-name='Path 23266' d='M20.788,17.12a1.222,1.222,0,0,0-1.223,1.223v6.114H14.674V4.891A1.224,1.224,0,0,0,13.8,3.72L9.555,2.446h10.01V8.56a1.223,1.223,0,1,0,2.446,0V1.223A1.223,1.223,0,0,0,20.788,0H1.223A1.09,1.09,0,0,0,1.1.023,1.208,1.208,0,0,0,.578.2C.552.221.519.223.493.242.483.249.479.263.47.27A1.212,1.212,0,0,0,.144.657a1,1,0,0,0-.034.1,1.16,1.16,0,0,0-.1.286.761.761,0,0,0,0,.106C.016,1.176,0,1.2,0,1.223V25.68a1.222,1.222,0,0,0,.983,1.2l12.228,2.446a1.138,1.138,0,0,0,.24.024,1.224,1.224,0,0,0,1.223-1.223V26.9h6.114a1.222,1.222,0,0,0,1.223-1.223V18.343a1.222,1.222,0,0,0-1.223-1.223' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E%0A");
  background-position: center;
  background-size: 20px;
  background-repeat: no-repeat;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  cursor: pointer;
}
header .right-col .logout-btn:hover {
  background-color: #8DD5E1;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  header .right-col .logout-btn {
    width: 35px;
    height: 35px;
    background-size: 18px;
  }
}
header .right-col .menu-btn {
  width: 40px;
  height: 40px;
  margin-left: 15px;
  background-color: #258DCF;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29.328' height='23.992' viewBox='0 0 29.328 23.992'%3E%3Cg id='Group_7463' data-name='Group 7463' transform='translate(-1846.775 -42.759)'%3E%3Crect id='Rectangle_70' data-name='Rectangle 70' width='29.329' height='3.583' transform='translate(1846.775 42.759)' fill='%23fff'/%3E%3Crect id='Rectangle_71' data-name='Rectangle 71' width='29.329' height='3.583' transform='translate(1846.775 52.984)' fill='%23fff'/%3E%3Crect id='Rectangle_72' data-name='Rectangle 72' width='29.329' height='3.583' transform='translate(1846.775 63.168)' fill='%23fff'/%3E%3C/g%3E%3C/svg%3E%0A");
  background-position: center;
  background-size: 18px;
  background-repeat: no-repeat;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  cursor: pointer;
}
header .right-col .menu-btn:hover {
  background-color: #8DD5E1;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  header .right-col .menu-btn {
    width: 35px;
    height: 35px;
    background-size: 18px;
    margin-left: 12px;
  }
}

.footer {
  width: 100%;
  height: 55px;
  display: flex;
  flex-wrap: wrap;
  background-color: #258DCF;
  align-items: center;
  padding-left: 35px;
  padding-right: 35px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .footer {
    height: auto;
  }
}
.footer .left-col {
  width: calc(100% - 150px);
  color: #ffffff;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .footer .left-col {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .footer .left-col {
    font-size: 15px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .footer .left-col {
    font-size: 13px;
  }
}
.footer .left-col br {
  display: none;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .footer .left-col {
    width: 100%;
    padding-bottom: 13px;
    text-align: center;
    order: 2;
  }
  .footer .left-col br {
    display: block;
  }
}
.footer .right-col {
  width: 150px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .footer .right-col {
    justify-content: center;
    width: 100%;
    order: 1;
    padding-top: 13px;
    padding-bottom: 10px;
  }
}
.footer .right-col a {
  color: #ffffff;
  margin-right: 15px;
}
.footer .right-col a:last-child {
  margin-right: 0px;
}

.common-background {
  width: 100%;
  background-size: cover;
  background-position: top;
  background-repeat: repeat-y;
  background-image: url("../../img/common/common-background.jpg");
}

.common-page-top-part {
  padding-bottom: 60px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-page-top-part {
    padding-bottom: 50px;
  }
}
.common-page-top-part .container {
  display: flex;
  flex-wrap: wrap;
}
.common-page-top-part .left-col {
  width: calc(100% - 512px);
  padding-top: 75px;
  padding-right: 35px;
}
.common-page-top-part.common-page-school-part .left-col{
	padding-top: 0;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-page-top-part .left-col {
    width: 100%;
    padding-right: 0px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-page-top-part .left-col {
    padding-top: 35px;
  }
}
.common-page-top-part .left-col .title {
  color: #258DCF;
  font-weight: 700;
  letter-spacing: 0.08em;
  margin-bottom: 25px;
  max-width: 450px;
  margin-top: 15px;
  line-height: 1.3em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .common-page-top-part .left-col .title {
    font-size: 55px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .common-page-top-part .left-col .title {
    font-size: 45px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-page-top-part .left-col .title {
    font-size: 35px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-page-top-part .left-col .title {
    max-width: 100%;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-page-top-part .left-col .title {
    margin-bottom: 20px;
  }
}
.common-page-top-part .left-col .responsive-img {
  margin-top: 15px;
  margin-bottom: 35px;
  display: none;
  max-width: 100%;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-page-top-part .left-col .responsive-img {
    display: block;
  }
}
.common-page-top-part .left-col .desc {
  letter-spacing: 0.07em;
  max-width: 520px;
  line-height: 1.7em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .common-page-top-part .left-col .desc {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .common-page-top-part .left-col .desc {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-page-top-part .left-col .desc {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-page-top-part .left-col .desc {
    max-width: 100%;
  }
}
.common-page-top-part .right-col {
  width: 512px;
  text-align: right;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-page-top-part .right-col {
    display: none;
  }
}
.common-page-top-part .right-col img {
  max-width: 100%;
}

.common-breadcrumb a, .common-breadcrumb span {
  font-weight: 700;
  color: #8DD5E1;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .common-breadcrumb a, .common-breadcrumb span {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .common-breadcrumb a, .common-breadcrumb span {
    font-size: 18px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-breadcrumb a, .common-breadcrumb span {
    font-size: 16px;
  }
}
.common-breadcrumb a:hover, .common-breadcrumb span:hover {
  text-decoration: none;
}
.common-breadcrumb a:after, .common-breadcrumb span:after {
  content: ">";
  margin-left: 10px;
  margin-right: 10px;
  position: relative;
  top: -1px;
}
.common-breadcrumb a:last-child, .common-breadcrumb span:last-child {
  color: #8DD5E1;
}
.common-breadcrumb a:last-child:after, .common-breadcrumb span:last-child:after {
  display: none;
}
.common-padding {
  padding-top: 80px;
  padding-bottom: 80px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .common-padding {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-padding {
    padding-top: 40px;
    padding-bottom: 40px;
  }
}

.common-table {
  width: 100%;
  margin-bottom: 40px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-table {
    display: none;
  }
}
.common-table .type-1-col {
  width: 100px;
}
.common-table .type-2-col {
  width: 120px;
}
.common-table .type-3-col {
  width: 200px;
}
.common-table thead {
  background-color: #3CC1C8;
  color: white;
  font-weight: 700;
}
.common-table thead th {
  padding-top: 15px;
  padding-bottom: 15px;
  padding-left: 15px;
  padding-right: 15px;
}
.common-table thead .empty-header {
  width: 65px;
}
.common-table.sub-table thead {
  background-color: unset;
  border-bottom: 6px solid #8DD5E1;
  color: black;
}
.common-table.sub-table thead th {
  padding-bottom: 10px;
}
.common-table tbody tr {
  border-bottom: 1px solid #D7D7D7;
}
.common-table tbody td {
  padding-top: 22px;
  padding-bottom: 22px;
  padding-left: 15px;
  padding-right: 15px;
  vertical-align: middle;
}
.common-table .red {
  color: #DC3545;
}
.common-table .blue {
  color: #3CC1C8;
}

.form-btn-back-wrapper {
  display: flex;
  justify-content: flex-start;
}

.form-btn-submit-wrapper {
  display: flex;
  justify-content: flex-end;
}

.about-us .about-us-section1 {
  background-image: url("../../img/common/system/common_bg1.jpg");
  width: 100%;
  background-size: 100% 100%;
  background-position: top center;
  background-repeat: no-repeat;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .about-us .about-us-section1 {
    background-image: none;
  }
}
.about-us .about-us-section1 .icon1 {
  display: inline-block;
  position: absolute;
  bottom: 0px;
  right: 115px;
  transform: translateY(240px);
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .about-us .about-us-section1 .icon1 img {
    width: 240px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-us .about-us-section1 .icon1 {
    display: none;
  }
}
.about-us .about-us-section1 .icon2 {
  display: inline-block;
  position: absolute;
  bottom: 0px;
  left: 115px;
  transform: translateY(240px);
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .about-us .about-us-section1 .icon2 img {
    width: 240px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-us .about-us-section1 .icon2 {
    display: none;
  }
}
.about-us .about-us-section1 .icon3 {
  display: inline-block;
  position: absolute;
  bottom: 0px;
  right: 115px;
  transform: translateY(240px);
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .about-us .about-us-section1 .icon3 img {
    width: 240px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-us .about-us-section1 .icon3 {
    display: none;
  }
}
.about-us .about-us-section1 .row1, .about-us .about-us-section1 .row2, .about-us .about-us-section1 .row3 {
  margin-bottom: 250px;
  display: flex;
  flex-wrap: wrap;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .about-us .about-us-section1 .row1, .about-us .about-us-section1 .row2, .about-us .about-us-section1 .row3 {
    margin-bottom: 120px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .about-us .about-us-section1 .row1, .about-us .about-us-section1 .row2, .about-us .about-us-section1 .row3 {
    margin-bottom: 120px;
  }
}
.about-us .about-us-section1 .row1 .left-col, .about-us .about-us-section1 .row2 .left-col, .about-us .about-us-section1 .row3 .left-col {
  width: 40%;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .about-us .about-us-section1 .row1 .left-col, .about-us .about-us-section1 .row2 .left-col, .about-us .about-us-section1 .row3 .left-col {
    width: 100%;
  }
}
.about-us .about-us-section1 .row1 .left-col .img-container, .about-us .about-us-section1 .row2 .left-col .img-container, .about-us .about-us-section1 .row3 .left-col .img-container {
  position: relative;
}
.about-us .about-us-section1 .row1 .left-col .img-container img, .about-us .about-us-section1 .row2 .left-col .img-container img, .about-us .about-us-section1 .row3 .left-col .img-container img {
  width: calc(100% - 30px);
  height: calc(100% - 30px);
  position: absolute;
  top: 0;
  left: 0;
  position: absolute;
  z-index: 2;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .about-us .about-us-section1 .row1 .left-col .img-container img, .about-us .about-us-section1 .row2 .left-col .img-container img, .about-us .about-us-section1 .row3 .left-col .img-container img {
    width: 100%;
  }
}
.about-us .about-us-section1 .row1 .left-col .img-container .layer, .about-us .about-us-section1 .row2 .left-col .img-container .layer, .about-us .about-us-section1 .row3 .left-col .img-container .layer {
  right: 0;
  bottom: 0;
  width: calc(100% - 30px);
  position: absolute;
  height: calc(100% - 30px);
  background-color: #D0EDEF;
  z-index: 1;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-us .about-us-section1 .row1 .left-col .img-container .layer, .about-us .about-us-section1 .row2 .left-col .img-container .layer, .about-us .about-us-section1 .row3 .left-col .img-container .layer {
    display: none;
  }
}
.about-us .about-us-section1 .row1 .left-col .img-container .square, .about-us .about-us-section1 .row2 .left-col .img-container .square, .about-us .about-us-section1 .row3 .left-col .img-container .square {
  background-color: #8DD5E1;
  width: 192px;
  height: 192px;
  position: absolute;
  bottom: 0;
  right: 0;
  transform: translate(50%, 50%);
}
.about-us .about-us-section1 .row1 .left-col .img-container .square:before, .about-us .about-us-section1 .row2 .left-col .img-container .square:before, .about-us .about-us-section1 .row3 .left-col .img-container .square:before {
  content: "";
  width: 97px;
  height: 97px;
  background-color: transparent;
  border: 1px solid #8DD5E1;
  position: absolute;
  bottom: 0;
  right: 0;
  transform: translate(50%, 50%);
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-us .about-us-section1 .row1 .left-col .img-container .square, .about-us .about-us-section1 .row2 .left-col .img-container .square, .about-us .about-us-section1 .row3 .left-col .img-container .square {
    display: none;
  }
}
.about-us .about-us-section1 .row1 .left-col .img-container .dot, .about-us .about-us-section1 .row2 .left-col .img-container .dot, .about-us .about-us-section1 .row3 .left-col .img-container .dot {
  width: 36px;
  height: 171px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../../img/common/about_us/dot.png");
  position: absolute;
  right: -55px;
  bottom: 110px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-us .about-us-section1 .row1 .left-col .img-container .dot, .about-us .about-us-section1 .row2 .left-col .img-container .dot, .about-us .about-us-section1 .row3 .left-col .img-container .dot {
    display: none;
  }
}
.about-us .about-us-section1 .row1 .right-col, .about-us .about-us-section1 .row2 .right-col, .about-us .about-us-section1 .row3 .right-col {
  width: 60%;
  padding-left: 130px;
  padding-top: 65px;
  position: relative;
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .about-us .about-us-section1 .row1 .right-col, .about-us .about-us-section1 .row2 .right-col, .about-us .about-us-section1 .row3 .right-col {
    padding-top: 45px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-us .about-us-section1 .row1 .right-col, .about-us .about-us-section1 .row2 .right-col, .about-us .about-us-section1 .row3 .right-col {
    padding-top: 15px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .about-us .about-us-section1 .row1 .right-col, .about-us .about-us-section1 .row2 .right-col, .about-us .about-us-section1 .row3 .right-col {
    width: 100%;
    padding-left: 15px;
    padding-right: 15px;
    padding-top: 0px;
  }
}
.about-us .about-us-section1 .row1 .right-col .title, .about-us .about-us-section1 .row2 .right-col .title, .about-us .about-us-section1 .row3 .right-col .title {
  color: #3CC1C8;
  margin-bottom: 17px;
  letter-spacing: 0.08em;
  padding-left: 0px;
  padding-right: 15px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .about-us .about-us-section1 .row1 .right-col .title, .about-us .about-us-section1 .row2 .right-col .title, .about-us .about-us-section1 .row3 .right-col .title {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .about-us .about-us-section1 .row1 .right-col .title, .about-us .about-us-section1 .row2 .right-col .title, .about-us .about-us-section1 .row3 .right-col .title {
    font-size: 30px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-us .about-us-section1 .row1 .right-col .title, .about-us .about-us-section1 .row2 .right-col .title, .about-us .about-us-section1 .row3 .right-col .title {
    font-size: 25px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .about-us .about-us-section1 .row1 .right-col .title, .about-us .about-us-section1 .row2 .right-col .title, .about-us .about-us-section1 .row3 .right-col .title {
    padding-left: 15px;
    padding-right: 15px;
  }
}
.about-us .about-us-section1 .row1 .right-col .desc, .about-us .about-us-section1 .row2 .right-col .desc, .about-us .about-us-section1 .row3 .right-col .desc {
  width: 100%;
  max-width: 630px;
  line-height: 1.8em;
  padding-left: 0px;
  padding-right: 15px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .about-us .about-us-section1 .row1 .right-col .desc, .about-us .about-us-section1 .row2 .right-col .desc, .about-us .about-us-section1 .row3 .right-col .desc {
    padding-left: 15px;
    padding-right: 15px;
  }
}
.about-us .about-us-section1 .row2 .left-col {
  order: 2;
  position: relative;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .about-us .about-us-section1 .row2 .left-col {
    order: 1;
  }
}
.about-us .about-us-section1 .row2 .left-col img {
  width: calc(100% - 30px);
  height: calc(100% - 30px);
  position: absolute;
  top: 0;
  right: 0;
  left: unset !important;
  position: absolute;
  z-index: 2;
}
.about-us .about-us-section1 .row2 .left-col .layer {
  left: 0;
  bottom: 0;
  width: calc(100% - 30px);
  position: absolute;
  height: calc(100% - 30px);
  background-color: #D0EDEF;
  z-index: 1;
}
.about-us .about-us-section1 .row2 .left-col .square {
  background-color: #8DD5E1;
  width: 192px;
  height: 192px;
  position: absolute;
  bottom: 0;
  left: 0;
  right: unset !important;
  transform: translate(-50%, 50%) !important;
}
.about-us .about-us-section1 .row2 .left-col .square:before {
  content: "";
  width: 97px;
  height: 97px;
  background-color: transparent;
  border: 1px solid #8DD5E1;
  position: absolute;
  bottom: 0;
  left: 0;
  right: unset !important;
  transform: translate(-50%, 50%) !important;
}
.about-us .about-us-section1 .row2 .left-col .dot {
  width: 36px;
  height: 171px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("../../img/common/about_us/dot.png");
  position: absolute;
  right: unset !important;
  left: -55px;
  bottom: 110px;
}
.about-us .about-us-section1 .row2 .right-col {
  order: 1;
  padding-right: 130px;
  padding-left: 0px;
  text-align: right;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .about-us .about-us-section1 .row2 .right-col {
    order: 2;
    padding-right: 0px;
    text-align: left;
  }
}
.about-us .about-us-section1 .row2 .right-col .title {
  padding-left: 15px;
  padding-right: 0px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .about-us .about-us-section1 .row2 .right-col .title {
    padding-left: 15px;
    padding-right: 15px;
  }
}
.about-us .about-us-section1 .row2 .right-col .desc {
  padding-left: 15px;
  padding-right: 0px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .about-us .about-us-section1 .row2 .right-col .desc {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .about-us .about-us-section1 .row3 {
    margin-bottom: 30px;
  }
}

.news-and-media .news-and-media-section1 {
  width: 100%;
  background-size: 100% 100%;
  background-position: top center;
  background-repeat: no-repeat;
}
.news-and-media .news-and-media-section1 .container {
  display: flex;
  flex-wrap: wrap;
}
.news-and-media .news-and-media-section1 .container .btn-container {
  margin-bottom: 40px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .news-and-media .news-and-media-section1 .container .btn-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}
.news-and-media .news-and-media-section1 .container .btn-container .news-media-btn {
  margin-right: 20px;
  color: #636363;
  background-color: #F3F3F3;
  padding-top: 10px;
  padding-bottom: 10px;
  min-width: 165px;
  font-weight: 600;
  text-align: center;
  display: inline-block;
}
.news-and-media .news-and-media-section1 .container .btn-container .news-media-btn.active, .news-and-media .news-and-media-section1 .container .btn-container .news-media-btn:hover {
  background-color: #3CC1C8;
  color: #ffffff;
}
.news-and-media .news-and-media-section1 .container .btn-container .news-media-btn:last-child {
  margin-right: 0px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .news-and-media .news-and-media-section1 .container .btn-container .news-media-btn {
    min-width: unset;
    width: 45%;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 15px;
  }
}
.news-and-media .news-and-media-section1 .container .left-col {
  width: calc(100% - 445px);
}
@media (min-width: 992px) and (max-width: 1199px) {
  .news-and-media .news-and-media-section1 .container .left-col {
    width: calc(100% - 380px);
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .news-and-media .news-and-media-section1 .container .left-col {
    width: calc(100% - 300px);
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .news-and-media .news-and-media-section1 .container .left-col {
    width: 100%;
  }
}
.news-and-media .news-and-media-section1 .container .left-col .cal-btn {
  display: none;
  padding-left: 15px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 55px;
  background-color: #3CC1C8;
  color: #ffffff;
  width: 100%;
  margin-top: 15px;
  margin-bottom: 35px;
  position: relative;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  position: relative;
  font-weight: 600;
  top: 0px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-and-media .news-and-media-section1 .container .left-col .cal-btn {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-and-media .news-and-media-section1 .container .left-col .cal-btn {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-and-media .news-and-media-section1 .container .left-col .cal-btn {
    font-size: 14px;
  }
}
.news-and-media .news-and-media-section1 .container .left-col .cal-btn:hover {
  position: relative;
  top: -3px;
}
.news-and-media .news-and-media-section1 .container .left-col .cal-btn:after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23fff'/%3E%3C/svg%3E%0A");
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .news-and-media .news-and-media-section1 .container .left-col .cal-btn {
    display: block;
  }
}
.news-and-media .news-and-media-section1 .container .left-col .box-container {
  margin-bottom: -50px;
}
.news-and-media .news-and-media-section1 .container .left-col .box-container .box {
  margin-bottom: 50px;
}
.news-and-media .news-and-media-section1 .container .left-col .box-container .box a:hover .bg {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.news-and-media .news-and-media-section1 .container .left-col .box-container .box .img {
  position: relative;
  overflow: hidden;
}
.news-and-media .news-and-media-section1 .container .left-col .box-container .box .img .bg {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  position: absolute;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.news-and-media .news-and-media-section1 .container .left-col .box-container .box .date {
  margin-top: 10px;
  color: #464646;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-and-media .news-and-media-section1 .container .left-col .box-container .box .date {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-and-media .news-and-media-section1 .container .left-col .box-container .box .date {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-and-media .news-and-media-section1 .container .left-col .box-container .box .date {
    font-size: 14px;
  }
}
.news-and-media .news-and-media-section1 .container .left-col .box-container .box .title {
  margin-top: 2px;
  font-weight: 600;
  color: #464646;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-and-media .news-and-media-section1 .container .left-col .box-container .box .title {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-and-media .news-and-media-section1 .container .left-col .box-container .box .title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-and-media .news-and-media-section1 .container .left-col .box-container .box .title {
    font-size: 16px;
  }
}
.news-and-media .news-and-media-section1 .container .right-col {
  width: 445px;
  padding-left: 50px;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .news-and-media .news-and-media-section1 .container .right-col {
    width: 380px;
    padding-left: 30px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .news-and-media .news-and-media-section1 .container .right-col {
    width: 300px;
    padding-left: 30px;
  }
}
.news-and-media .news-and-media-section1 .container .right-col .close-btn {
  position: absolute;
  display: none;
  top: 28px;
  right: 32px;
  width: 25px;
  height: 25px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25.414' height='25.414' viewBox='0 0 25.414 25.414'%3E%3Cg id='Group_57' data-name='Group 57' transform='translate(-182.05 -806.05)'%3E%3Cline id='Line_83' data-name='Line 83' x2='33.941' transform='translate(182.757 806.757) rotate(45)' fill='none' stroke='%23525050' stroke-width='2'/%3E%3Cline id='Line_84' data-name='Line 84' x2='33.941' transform='translate(206.757 806.757) rotate(135)' fill='none' stroke='%23525050' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E%0A");
  cursor: pointer;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .news-and-media .news-and-media-section1 .container .right-col .close-btn {
    display: block;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .news-and-media .news-and-media-section1 .container .right-col {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: #ffffff;
    padding-left: 35px;
    padding-right: 35px;
    padding-top: 70px;
    padding-bottom: 35px;
    z-index: 2;
    transform: translateX(-100%);
    pointer-events: none;
    -webkit-transition: 0.3s all;
    -moz-transition: 0.3s all;
    -ms-transition: 0.3s all;
    -o-transition: 0.3s all;
    overflow-y: auto;
  }
  .news-and-media .news-and-media-section1 .container .right-col.active {
    transform: translateX(0%);
    pointer-events: auto;
  }
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  padding: 35px;
  background-color: #F3F3F3;
  border-radius: 5px;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box .zabuto_calendar {
  margin-bottom: 15px;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box div.zabuto_calendar .table tr td.event div.day, .news-and-media .news-and-media-section1 .container .right-col .filter-box div.zabuto_calendar ul.legend li.event {
  background-color: #8DD5E1;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box .calendar-dow {
  background-color: transparent;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box div.zabuto_calendar .table tr th, .news-and-media .news-and-media-section1 .container .right-col .filter-box div.zabuto_calendar .table tr td {
  background-color: transparent;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box .table td, .news-and-media .news-and-media-section1 .container .right-col .filter-box .table th {
  border-top: 0px solid #dee2e6;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box div.zabuto_calendar .table tr:last-child {
  border-bottom: 0px solid #ddd;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box .fa-chevron-left {
  width: 12px;
  height: 12px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_37' data-name='Polygon 37' d='M6,0l6,11H0Z' transform='translate(0 12) rotate(-90)' fill='%23258dcf'/%3E%3C/svg%3E%0A");
  position: relative;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box .fa-chevron-left:before {
  display: none;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box .fa-chevron-right {
  width: 12px;
  height: 12px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23258dcf'/%3E%3C/svg%3E%0A");
  position: relative;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box .fa-chevron-right:before {
  display: none;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box div.zabuto_calendar .table tr.calendar-month-header th span {
  padding-bottom: 0px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-and-media .news-and-media-section1 .container .right-col .filter-box div.zabuto_calendar .table tr.calendar-month-header th span {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-and-media .news-and-media-section1 .container .right-col .filter-box div.zabuto_calendar .table tr.calendar-month-header th span {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-and-media .news-and-media-section1 .container .right-col .filter-box div.zabuto_calendar .table tr.calendar-month-header th span {
    font-size: 16px;
  }
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box .calendar-month-header th {
  padding-bottom: 25px;
  padding-top: 0px;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box .calendar-dow-header {
  border-bottom: 2px solid;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box div.zabuto_calendar div.calendar-month-navigation {
  padding-top: 0px;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box div.zabuto_calendar .table tr td.event div.day, .news-and-media .news-and-media-section1 .container .right-col .filter-box .news-and-media .news-and-media-section1 .container .right-col .calendar-box div.zabuto_calendar ul.legend li.event {
  background-color: #8DD5E1;
  width: 35px;
  height: 35px;
  left: 50%;
  position: relative;
  transform: translateX(-50%);
  border-radius: 50%;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box .calendar-dow td:first-child .day {
  color: #FF0000;
}
.news-and-media .news-and-media-section1 .container .right-col .filter-box div.zabuto_calendar .table tr td div.day {
  margin: 0;
  padding-top: 5px;
  padding-bottom: 5px;
}
.news-and-media .news-and-media-section1 .container .right-col .category-title {
  margin-bottom: 15px;
  margin-top: 50px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-and-media .news-and-media-section1 .container .right-col .category-title {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-and-media .news-and-media-section1 .container .right-col .category-title {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-and-media .news-and-media-section1 .container .right-col .category-title {
    font-size: 20px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .news-and-media .news-and-media-section1 .container .right-col .category-title {
    margin-top: 50px;
  }
}
.news-and-media .news-and-media-section1 .container .right-col .category-link {
  margin-bottom: 5px;
}
.news-and-media .news-and-media-section1 .container .right-col .category-link a {
  color: #353636;
}
.news-and-media .news-and-media-section1 .container .right-col .category-link a.active {
  font-weight: 600;
  color: #258DCF;
}

.showcases .showcases-section1 {
  width: 100%;
  background-size: 100% 100%;
  background-position: top center;
  background-repeat: no-repeat;
}
.showcases .showcases-section1 .container {
  display: flex;
  flex-wrap: wrap;
}
.showcases .showcases-section1 .container .left-col {
  width: 375px;
  padding-right: 65px;
}
.showcases .showcases-section1 .container .left-col .close-btn {
  position: absolute;
  display: none;
  top: 23px;
  right: 35px;
  width: 25px;
  height: 25px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25.414' height='25.414' viewBox='0 0 25.414 25.414'%3E%3Cg id='Group_57' data-name='Group 57' transform='translate(-182.05 -806.05)'%3E%3Cline id='Line_83' data-name='Line 83' x2='33.941' transform='translate(182.757 806.757) rotate(45)' fill='none' stroke='%23525050' stroke-width='2'/%3E%3Cline id='Line_84' data-name='Line 84' x2='33.941' transform='translate(206.757 806.757) rotate(135)' fill='none' stroke='%23525050' stroke-width='2'/%3E%3C/g%3E%3C/svg%3E%0A");
  cursor: pointer;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .showcases .showcases-section1 .container .left-col .close-btn {
    display: block;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .showcases.showcases-1 .showcases-section1 .container .left-col {
    width: 300px;
    padding-left: 50px;
  }
  .showcases .showcases-section1 .container .left-col {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .showcases.showcases-1 .showcases-section1 .container .left-col {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: #ffffff;
    padding-left: 35px;
    padding-right: 35px;
    padding-top: 70px;
    padding-bottom: 35px;
    z-index: 2;
    transform: translateX(-100%);
    pointer-events: none;
    -webkit-transition: 0.3s all;
    -moz-transition: 0.3s all;
    -ms-transition: 0.3s all;
    -o-transition: 0.3s all;
    overflow-y: auto;
  }
  .showcases .showcases-section1 .container .left-col.active {
    transform: translateX(0%);
    pointer-events: auto;
  }
  .showcases .showcases-section1 .container .left-col {
    width: 100%;
    padding-left: 0;
    padding-right: 0;
  }
}
.showcases.showcases-1 .showcases-section1 .container .left-col .filter-box {
  border-top: 6px solid #3CC1C8;
  margin-bottom: 30px;
  padding-bottom: 20px;
}

.showcases.showcases-1 .showcases-section1 .container .left-col .filter-box .title {
  padding-left: 15px;
  padding-right: 40px;
  padding-top: 6px;
  padding-bottom: 12px;
  background-color: #3CC1C8;
  color: white;
  position: relative;
}

.showcases .showcases-section1 .container .left-col .filter-box:last-child {
  margin-bottom: 0px;
}

.showcases .showcases-section1 .container .left-col .filter-box .title.first{
	padding-top: 12px;
}

.showcases .showcases-section1 .container .left-col .filter-box .title.selected{
	background-color: #3CC1C8;
	color: white;
}

.showcases .showcases-section1 .container .left-col .filter-box .title {
  padding-left: 15px;
  padding-right: 40px;
  padding-top: 6px;
  padding-bottom: 12px;
  position: relative;
  color: #353636;
  font-weight: 600;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .showcases .showcases-section1 .container .left-col .filter-box .title {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .showcases .showcases-section1 .container .left-col .filter-box .title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .showcases .showcases-section1 .container .left-col .filter-box .title {
    font-size: 16px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .showcases .showcases-section1 .container .left-col .filter-box .title {
    padding-left: 30px;
  }
}
.showcases .showcases-section1 .container .left-col .filter-box .title.filter-options {
  padding-right: 95px;
}
.showcases .showcases-section1 .container .left-col .filter-box .title:before {
  width: 10px;
  height: 10px;
  background-color: white;
  position: absolute;
  top: calc(50% - 3px);
  left: 20px;
  transform: translateY(-50%);
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .showcases .showcases-section1 .container .left-col .filter-box .title:before {
    left: 10px;
  }
}
.showcases .showcases-section1 .container .left-col .filter-box .title .clear-all-btn {
  cursor: pointer;
  display: inline-block;
  color: white;
  font-size: 12px;
  padding-right: 40px;
  position: absolute;
  top: calc(50% - 1px);
  transform: translateY(-50%);
  right: 0;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .showcases .showcases-section1 .container .left-col .filter-box .title .clear-all-btn {
    padding-right: 28px;
  }
}
.showcases .showcases-section1 .container .left-col .filter-box .title .clear-all-btn:after {
  content: "";
  width: 9px;
  height: 9px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 20px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='7.222' height='7.071' viewBox='0 0 7.222 7.071'%3E%3Cg id='Group_7465' data-name='Group 7465' transform='translate(-560.439 -763.793)'%3E%3Cline id='Line_19' data-name='Line 19' x2='9' transform='translate(560.793 764.146) rotate(45)' fill='none' stroke='%23fff' stroke-width='1'/%3E%3Cline id='Line_20' data-name='Line 20' x1='6.53' y2='6.01' transform='translate(560.793 764.323)' fill='none' stroke='%23fff' stroke-width='1'/%3E%3C/g%3E%3C/svg%3E%0A");
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .showcases .showcases-section1 .container .left-col .filter-box .title .clear-all-btn:after {
    right: 10px;
  }
}
.showcases .showcases-section1 .container .left-col .filter-box .filter-list-container {
  padding-left: 12px;
  padding-right: 12px;
}
.showcases .showcases-section1 .container .left-col .filter-box .filter-list-container .green-common-btn {
  position: relative;
  left: 50%;
  transform: translate(-50%, 0px);
}
.showcases .showcases-section1 .container .left-col .filter-box .filter-list-container .green-common-btn:hover {
  transform: translate(-50%, -3px);
}
.showcases .showcases-section1 .container .left-col .filter-box .accordion-container:nth-child(2) .accordion-btn {
  border-top: 1px solid #D1CFCF;
}
.showcases .showcases-section1 .container .left-col .filter-box .accordion-container .accordion-btn {
  cursor: pointer;
  padding-top: 15px;
  padding-bottom: 15px;
  position: relative;
  font-weight: 600;
}
.showcases.showcases-1 .showcases-section1 .container .left-col .filter-box .accordion-container .accordion-btn:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_32' data-name='Polygon 32' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23258dcf'/%3E%3C/svg%3E%0A");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 12px;
  height: 12px;
  transform: translateY(-50%) rotate(90deg);
  -webkit-transition: 0.2s all;
  -moz-transition: 0.2s all;
  -ms-transition: 0.2s all;
  -o-transition: 0.2s all;
}
.showcases .showcases-section1 .container .left-col .filter-box .accordion-container .accordion-btn.collapsed:after {
  transform: translateY(-50%) rotate(0deg);
}
.showcases .showcases-section1 .container .left-col .filter-box .accordion-container .accordion-content .content-wrapper {
  padding-bottom: 15px;
}
.showcases .showcases-section1 .container .left-col .filter-box .accordion-container .accordion-content .content-wrapper label {
  font-size: 15px;
}
.showcases .showcases-section1 .container .left-col .filter-box .accordion-container .accordion-content .content-wrapper label:before {
  top: 0.15rem;
}
.showcases .showcases-section1 .container .left-col .filter-box .accordion-container .accordion-content .content-wrapper label:after {
  top: 0.15rem;
}
.showcases .showcases-section1 .container .left-col .filter-box .search-btn-container {
  border-top: 1px solid #D1CFCF;
  padding-top: 20px;
}
.showcases .showcases-section1 .container .left-col .filter-box .search-btn-container .search-btn {
  display: inline-block;
  padding-left: 15px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 85px;
  background-color: #3CC1C8;
  color: #ffffff;
  position: relative;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  position: relative;
  top: 0px;
  outline: none;
  border-color: transparent;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .showcases .showcases-section1 .container .left-col .filter-box .search-btn-container .search-btn {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .showcases .showcases-section1 .container .left-col .filter-box .search-btn-container .search-btn {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .showcases .showcases-section1 .container .left-col .filter-box .search-btn-container .search-btn {
    font-size: 14px;
  }
}
.showcases .showcases-section1 .container .left-col .filter-box .search-btn-container .search-btn:hover {
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  position: relative;
  top: -3px;
}
.showcases .showcases-section1 .container .left-col .filter-box .search-btn-container .search-btn:after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23fff'/%3E%3C/svg%3E%0A");
}
.showcases .showcases-section1 .container .left-col .filter-box .textbox-container {
  padding-left: 20px;
  padding-right: 20px;
  margin-top: 20px;
  position: relative;
}
.showcases .showcases-section1 .container .left-col .filter-box .textbox-container input {
  width: 100%;
  border: 0px solid transparent;
  border: 1px solid #D1CFCF;
  padding-left: 10px;
  padding-right: 30px;
  padding-top: 10px;
  padding-bottom: 10px;
}
.showcases .showcases-section1 .container .left-col .filter-box .textbox-container input::-moz-placeholder {
  color: #D1CFCF;
}
.showcases .showcases-section1 .container .left-col .filter-box .textbox-container input::placeholder {
  color: #D1CFCF;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .showcases .showcases-section1 .container .left-col .filter-box .textbox-container input::-moz-placeholder {
    font-size: 16px;
  }
  .showcases .showcases-section1 .container .left-col .filter-box .textbox-container input::placeholder {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .showcases .showcases-section1 .container .left-col .filter-box .textbox-container input::-moz-placeholder {
    font-size: 16px;
  }
  .showcases .showcases-section1 .container .left-col .filter-box .textbox-container input::placeholder {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .showcases .showcases-section1 .container .left-col .filter-box .textbox-container input::-moz-placeholder {
    font-size: 16px;
  }
  .showcases .showcases-section1 .container .left-col .filter-box .textbox-container input::placeholder {
    font-size: 16px;
  }
}
.showcases .showcases-section1 .container .left-col .filter-box .textbox-container button {
  width: 22px;
  height: 22px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 33px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17.897' height='17.655' viewBox='0 0 17.897 17.655'%3E%3Cg id='magnifying-glass_7_' data-name='magnifying-glass (7)' transform='translate(0 -0.802)'%3E%3Cpath id='Path_11325' data-name='Path 11325' d='M17.473,15.988l-4.115-4.115a7.234,7.234,0,1,0-2,2.095l4.066,4.066a1.446,1.446,0,1,0,2.045-2.046ZM7.231,12.922a4.888,4.888,0,1,1,4.888-4.888A4.888,4.888,0,0,1,7.231,12.922Z' transform='translate(0)' fill='%23258dcf'/%3E%3C/g%3E%3C/svg%3E%0A");
  outline: none;
  background-color: transparent;
  border-color: transparent;
}
.showcases .showcases-section1 .container .right-col {
  order: 0;
  width: calc(100% - 375px);
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .showcases .showcases-section1 .container .right-col {
    width: calc(100% - 300px);
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .showcases .showcases-section1 .container .right-col {
    width: 100%;
  }
}
.showcases .showcases-section1 .container .right-col .filter-btn {
  display: none;
  padding-left: 15px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 55px;
  background-color: #3CC1C8;
  color: #ffffff;
  margin-bottom: 35px;
  position: relative;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  position: relative;
  font-weight: 600;
  top: 0px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .showcases .showcases-section1 .container .right-col .filter-btn {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .showcases .showcases-section1 .container .right-col .filter-btn {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .showcases .showcases-section1 .container .right-col .filter-btn {
    font-size: 14px;
  }
}
.showcases .showcases-section1 .container .right-col .filter-btn:hover {
  position: relative;
  top: -3px;
}
.showcases .showcases-section1 .container .right-col .filter-btn:after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23fff'/%3E%3C/svg%3E%0A");
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .showcases .showcases-section1 .container .right-col .filter-btn {
    display: block;
  }
}
.showcases .showcases-section1 .container .right-col .box-container {
  margin-bottom: -50px;
}
.showcases .showcases-section1 .container .right-col .box-container .box {
  margin-bottom: 50px;
}
.showcases .showcases-section1 .container .right-col .box-container .box a:hover .bg {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.showcases .showcases-section1 .container .right-col .box-container .box .img {
  position: relative;
  overflow: hidden;
}
.showcases .showcases-section1 .container .right-col .box-container .box .img .bg {
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  width: 100%;
  height: 100%;
  position: absolute;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.showcases .showcases-section1 .container .right-col .box-container .box .title {
  margin-top: 10px;
  color: #000000;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .showcases .showcases-section1 .container .right-col .box-container .box .title {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .showcases .showcases-section1 .container .right-col .box-container .box .title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .showcases .showcases-section1 .container .right-col .box-container .box .title {
    font-size: 16px;
  }
}
.showcases .showcases-section1 .container .right-col .box-container .box .tags {
  margin-top: 5px;
}
.showcases .showcases-section1 .container .right-col .box-container .box .tags span {
  display: inline-block;
  padding: 2px 5px 1px;
  background-color: #3CC1C8;
  color: #fff;
  margin-bottom: 4px;
}
.showcases .showcases-section1 .container .right-col .box-container .no-results {
  margin-top: 20px;
  margin-bottom: 20px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .showcases .showcases-section1 .container .right-col .box-container .no-results {
    font-size: 28px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .showcases .showcases-section1 .container .right-col .box-container .no-results {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .showcases .showcases-section1 .container .right-col .box-container .no-results {
    font-size: 24px;
  }
}

.news-detail .fancybox-type-iframe .fancybox-inner {
  padding-top: 56.2%; /* (9/16 * 100%) -- your aspect ratio in percents */
  height: 0 !important;
}
.news-detail .fancybox-type-iframe .fancybox-inner .fancybox-iframe {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
.news-detail .common-background {
  bottom: -590px;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .news-detail .common-background {
    bottom: -600px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .news-detail .common-background {
    bottom: -710px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-detail .common-background {
    bottom: -940px;
  }
}
.news-detail .showcases-detail-section1 {
  width: 100%;
  background-size: 100% 100%;
  background-position: top center;
  background-repeat: no-repeat;
}
.news-detail .showcases-detail-section1 .section-title {
  font-weight: 700;
  color: #3CC1C8;
  margin-bottom: 15px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-detail .showcases-detail-section1 .section-title {
    font-size: 25px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-detail .showcases-detail-section1 .section-title {
    font-size: 25px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-detail .showcases-detail-section1 .section-title {
    font-size: 20px;
  }
}
.news-detail .showcases-detail-section1 .addthis_inline_share_toolbox {
  text-align: right;
}
.news-detail .showcases-detail-section1 .addthis_inline_share_toolbox {
  margin-bottom: 35px;
}
.news-detail .showcases-detail-section1 .box-container {
  display: flex;
  flex-wrap: wrap;
}
.news-detail .showcases-detail-section1 .box-container .left-col {
  width: 65%;
  padding-right: 30px;
}
@media (min-width: 768px) and (max-width: 991px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .news-detail .showcases-detail-section1 .box-container .left-col {
    width: 100%;
    padding-right: 0px;
    order: 2;
    margin-top: 25px;
  }
}
.news-detail .showcases-detail-section1 .box-container .left-col table {
  width: 100%;
  margin-bottom: 45px;
}
.news-detail .showcases-detail-section1 .box-container .left-col table tr td {
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  border: 1px solid #EAEAEA;
  vertical-align: top;
}
.news-detail .showcases-detail-section1 .box-container .left-col table tr td:first-child {
  background-color: #8DD5E1;
  width: 150px;
  color: #ffffff;
}
.news-detail .showcases-detail-section1 .box-container .right-col {
  width: 35%;
}
@media (min-width: 768px) and (max-width: 991px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .news-detail .showcases-detail-section1 .box-container .right-col {
    width: 100%;
    order: 1;
  }
}
.news-detail .showcases-detail-section1 .box-container .right-col img {
  max-width: 100%;
}
@media (min-width: 768px) and (max-width: 991px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .news-detail .showcases-detail-section1 .box-container .right-col img {
    width: 100%;
  }
}
.news-detail .showcases-detail-section1 .content-container {
  display: flex;
  flex-wrap: wrap;
}
.news-detail .showcases-detail-section1 .content-container .left-col {
  width: 250px;
  padding-right: 45px;
}
.news-detail .showcases-detail-section1 .content-container .left-col a {
  margin-bottom: 12px;
  display: block;
  width: 100%;
  color: #353636;
  position: relative;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-detail .showcases-detail-section1 .content-container .left-col a {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-detail .showcases-detail-section1 .content-container .left-col a {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-detail .showcases-detail-section1 .content-container .left-col a {
    font-size: 16px;
  }
}
.news-detail .showcases-detail-section1 .content-container .left-col a:hover {
  color: #258DCF;
}
.news-detail .showcases-detail-section1 .content-container .left-col a:last-child {
  margin-bottom: 0px;
}
.news-detail .showcases-detail-section1 .content-container .left-col a.active {
  color: #258DCF;
}
.news-detail .showcases-detail-section1 .content-container .left-col a.active:after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0;
  width: 12px;
  height: 12px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23258dcf'/%3E%3C/svg%3E%0A");
}
.news-detail .showcases-detail-section1 .content-container .content-col {
  width: 100%;
}
.news-detail .showcases-detail-section1 .content-container .content-col .content {
  display: none;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-detail .showcases-detail-section1 .content-container .content-col .content {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-detail .showcases-detail-section1 .content-container .content-col .content {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-detail .showcases-detail-section1 .content-container .content-col .content {
    font-size: 16px;
  }
}
.news-detail .showcases-detail-section1 .content-container .content-col .content.active {
  display: block;
}
.news-detail .showcases-detail-section1 .slider-container {
  margin-top: 85px;
  margin-bottom: 60px;
  padding-left: 35px;
  padding-right: 35px;
  position: relative;
}
.news-detail .showcases-detail-section1 .slider-container.no-arrow {
  padding-left: 0px;
  padding-right: 0px;
}
.news-detail .showcases-detail-section1 .slider-container .swiper-slide {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  overflow: hidden;
}
.news-detail .showcases-detail-section1 .slider-container .swiper-slide.youtube:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36.493' height='36.493' viewBox='0 0 36.493 36.493'%3E%3Cg id='Group_7462' data-name='Group 7462' transform='translate(-1121.254 -1947.616)'%3E%3Ccircle id='Ellipse_305' data-name='Ellipse 305' cx='12' cy='12' r='12' transform='translate(1128 1954)' fill='%23fff'/%3E%3Cpath id='play-button_2_' data-name='play-button (2)' d='M18.246,0A18.246,18.246,0,1,0,36.493,18.246,18.246,18.246,0,0,0,18.246,0Zm6.306,19.214-9.123,5.7a1.141,1.141,0,0,1-1.745-.967v-11.4a1.141,1.141,0,0,1,1.745-.967l9.123,5.7a1.141,1.141,0,0,1,0,1.934Z' transform='translate(1121.254 1947.616)' fill='%233cc1c8'/%3E%3C/g%3E%3C/svg%3E%0A");
  width: 36px;
  height: 36px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 1;
  -webkit-transition: 0.2s all;
  -moz-transition: 0.2s all;
  -ms-transition: 0.2s all;
  -o-transition: 0.2s all;
  z-index: 2;
  pointer-events: none;
}
.news-detail .showcases-detail-section1 .slider-container .swiper-slide .bg {
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  cursor: pointer;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.news-detail .showcases-detail-section1 .slider-container .swiper-slide .bg:hover {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.news-detail .showcases-detail-section1 .slider-container .swiper-slide.youtube .bg {
  position: relative;
}
.news-detail .showcases-detail-section1 .slider-container .swiper-button-next {
  width: 12px;
  height: 12px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23258dcf'/%3E%3C/svg%3E%0A");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-top: unset;
  transform: translateY(-50%);
  right: 0;
}
.news-detail .showcases-detail-section1 .slider-container .swiper-button-next:after {
  display: none;
}
.news-detail .showcases-detail-section1 .slider-container .swiper-button-prev {
  width: 12px;
  height: 12px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15.892' height='15.526' viewBox='0 0 15.892 15.526'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(5.5) rotate(30)' fill='%23258dcf'/%3E%3C/svg%3E%0A");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-top: unset;
  transform: translateY(-50%);
  left: 0;
}
.news-detail .showcases-detail-section1 .slider-container .swiper-button-prev:after {
  display: none;
}
.news-detail .showcases-detail-section1 .back-btn {
  margin-top: 75px;
  display: inline-block;
  padding-left: 25px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 25px;
  background-color: #3CC1C8;
  color: #ffffff;
  position: relative;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  position: relative;
  font-weight: 600;
  top: 0px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .news-detail .showcases-detail-section1 .back-btn {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .news-detail .showcases-detail-section1 .back-btn {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .news-detail .showcases-detail-section1 .back-btn {
    font-size: 14px;
  }
}
.news-detail .showcases-detail-section1 .back-btn:hover {
  position: relative;
  top: -3px;
}

.showcases-detail .showcases-detail-section1 {
  width: 100%;
  background-size: 100% 100%;
  background-position: top center;
  background-repeat: no-repeat;
}
.showcases-detail .showcases-detail-section1 .section-title {
  font-weight: 700;
  color: #3CC1C8;
  margin-bottom: 25px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .showcases-detail .showcases-detail-section1 .section-title {
    font-size: 25px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .showcases-detail .showcases-detail-section1 .section-title {
    font-size: 25px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .showcases-detail .showcases-detail-section1 .section-title {
    font-size: 20px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .showcases-detail .showcases-detail-section1 .section-title {
    margin-bottom: 15px;
  }
}
.showcases-detail .showcases-detail-section1 .box-container {
  display: flex;
  flex-wrap: wrap;
}
.showcases-detail .showcases-detail-section1 .box-container .left-col {
  width: calc(100% - 423px);
  padding-right: 30px;
}
@media (min-width: 768px) and (max-width: 991px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .showcases-detail .showcases-detail-section1 .box-container .left-col {
    width: 100%;
    padding-right: 0px;
    order: 2;
    margin-top: 25px;
  }
}
.showcases-detail .showcases-detail-section1 .box-container .left-col table, .stem-events-detail .container .basic-content table{
  width: 100%;
}
.showcases-detail .showcases-detail-section1 .box-container .left-col table tr td, .stem-events-detail .container .basic-content table tr td {
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  border: 1px solid #EAEAEA;
  vertical-align: top;
  background-color: #ffffff;
}
.showcases-detail .showcases-detail-section1 .box-container .left-col table tr td:first-child, .stem-events-detail .container .basic-content table tr td:first-child {
  background-color: #8DD5E1;
  color: #ffffff;
}
.showcases-detail .showcases-detail-section1 .box-container .right-col {
  width: 423px;
}
@media (min-width: 768px) and (max-width: 991px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .showcases-detail .showcases-detail-section1 .box-container .right-col {
    width: 100%;
    order: 1;
  }
}
.showcases-detail .showcases-detail-section1 .box-container .right-col img {
  max-width: 100%;
}
@media (min-width: 768px) and (max-width: 991px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .showcases-detail .showcases-detail-section1 .box-container .right-col img {
    width: 100%;
  }
}
.showcases-detail .showcases-detail-section1 .common-btn-container {
  margin-top: 55px;
}
.showcases-detail .showcases-detail-section1 .content-container {
  display: flex;
  flex-wrap: wrap;
  margin-top: 80px;
  margin-bottom: 80px;
}
.showcases-detail .showcases-detail-section1 .content-container .left-col {
  width: 250px;
  padding-right: 45px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .showcases-detail .showcases-detail-section1 .content-container .left-col {
    width: 100%;
    padding-right: 0px;
    margin-bottom: 25px;
  }
}
.showcases-detail .showcases-detail-section1 .content-container .left-col a {
  padding: 10px 20px;
  padding-right: 40px;
  display: block;
  width: 100%;
  color: #353636;
  position: relative;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .showcases-detail .showcases-detail-section1 .content-container .left-col a {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .showcases-detail .showcases-detail-section1 .content-container .left-col a {
    font-size: 15px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .showcases-detail .showcases-detail-section1 .content-container .left-col a {
    font-size: 15px;
  }
}
.showcases-detail .showcases-detail-section1 .content-container .left-col a:hover {
  color: #258DCF;
}
.showcases-detail .showcases-detail-section1 .content-container .left-col a:last-child {
  margin-bottom: 0px;
}
.showcases-detail .showcases-detail-section1 .content-container .left-col a.active {
  color: #258DCF;
  background-color: #f0f0f0;
}
.showcases-detail .showcases-detail-section1 .content-container .left-col a.active:after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 15px;
  width: 12px;
  height: 12px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23258dcf'/%3E%3C/svg%3E%0A");
}
.showcases-detail .showcases-detail-section1 .content-container .right-col {
  width: calc(100% - 250px);
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .showcases-detail .showcases-detail-section1 .content-container .right-col {
    width: 100%;
  }
}
.showcases-detail .showcases-detail-section1 .content-container .right-col .content {
  display: none;
  padding-top: 9px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .showcases-detail .showcases-detail-section1 .content-container .right-col .content {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .showcases-detail .showcases-detail-section1 .content-container .right-col .content {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .showcases-detail .showcases-detail-section1 .content-container .right-col .content {
    font-size: 16px;
  }
}
.showcases-detail .showcases-detail-section1 .content-container .right-col .content.active {
  display: block;
}
.showcases-detail .showcases-detail-section1 .project-slide {
  overflow: hidden;
}
.showcases-detail .showcases-detail-section1 .slider-container {
  margin-top: 85px;
  padding-left: 35px;
  padding-right: 35px;
  position: relative;
}
.showcases-detail .showcases-detail-section1 .slider-container .swiper-slide {
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  overflow: hidden;
}
.showcases-detail .showcases-detail-section1 .slider-container .swiper-slide.youtube:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36.493' height='36.493' viewBox='0 0 36.493 36.493'%3E%3Cg id='Group_7462' data-name='Group 7462' transform='translate(-1121.254 -1947.616)'%3E%3Ccircle id='Ellipse_305' data-name='Ellipse 305' cx='12' cy='12' r='12' transform='translate(1128 1954)' fill='%23fff'/%3E%3Cpath id='play-button_2_' data-name='play-button (2)' d='M18.246,0A18.246,18.246,0,1,0,36.493,18.246,18.246,18.246,0,0,0,18.246,0Zm6.306,19.214-9.123,5.7a1.141,1.141,0,0,1-1.745-.967v-11.4a1.141,1.141,0,0,1,1.745-.967l9.123,5.7a1.141,1.141,0,0,1,0,1.934Z' transform='translate(1121.254 1947.616)' fill='%233cc1c8'/%3E%3C/g%3E%3C/svg%3E%0A");
  width: 36px;
  height: 36px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 1;
  -webkit-transition: 0.2s all;
  -moz-transition: 0.2s all;
  -ms-transition: 0.2s all;
  -o-transition: 0.2s all;
  z-index: 2;
  pointer-events: none;
}
.showcases-detail .showcases-detail-section1 .slider-container .swiper-slide .bg {
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  cursor: pointer;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.showcases-detail .showcases-detail-section1 .slider-container .swiper-slide .bg:hover {
  -webkit-transform: scale(1.1);
  -moz-transform: scale(1.1);
  -ms-transform: scale(1.1);
  -o-transform: scale(1.1);
}
.showcases-detail .showcases-detail-section1 .slider-container .swiper-slide.youtube .bg {
  position: relative;
}
.showcases-detail .showcases-detail-section1 .slider-container .swiper-button-next {
  width: 12px;
  height: 12px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23258dcf'/%3E%3C/svg%3E%0A");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-top: unset;
  transform: translateY(-50%);
  right: 0;
}
.showcases-detail .showcases-detail-section1 .slider-container .swiper-button-next:after {
  display: none;
}
.showcases-detail .showcases-detail-section1 .slider-container .swiper-button-prev {
  width: 12px;
  height: 12px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15.892' height='15.526' viewBox='0 0 15.892 15.526'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(5.5) rotate(30)' fill='%23258dcf'/%3E%3C/svg%3E%0A");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  margin-top: unset;
  transform: translateY(-50%);
  left: 0;
}
.showcases-detail .showcases-detail-section1 .slider-container .swiper-button-prev:after {
  display: none;
}
.showcases-detail .showcases-detail-section1 .contact-btn {
  margin-top: 75px;
  margin-bottom: 20px;
  display: inline-block;
  padding-left: 15px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 55px;
  background-color: #3CC1C8;
  color: #ffffff;
  position: relative;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  position: relative;
  font-weight: 600;
  top: 0px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .showcases-detail .showcases-detail-section1 .contact-btn {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .showcases-detail .showcases-detail-section1 .contact-btn {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .showcases-detail .showcases-detail-section1 .contact-btn {
    font-size: 14px;
  }
}
.showcases-detail .showcases-detail-section1 .contact-btn:hover {
  position: relative;
  top: -3px;
}
.showcases-detail .showcases-detail-section1 .contact-btn:after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23fff'/%3E%3C/svg%3E%0A");
}

.partners .partners-section1 {
  width: 100%;
  background-size: 100% 100%;
  background-position: top center;
  background-repeat: no-repeat;
}

.partners .partners-section1.partners-section-school.common-padding{
	padding-top: 0;
}

.partners .partners-section1 .box-container {
  display: flex;
  flex-wrap: wrap;
  margin-left: -15px;
  margin-right: -15px;
  margin-bottom: -40px;
}
.partners .partners-section1 .box-container a:hover {
  color: #8DD5E1;
}
.partners .partners-section1 .box-container .box {
  padding-left: 15px;
  padding-right: 15px;
  width: 20%;
  margin-bottom: 40px;
  color: #000000;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .partners .partners-section1 .box-container .box {
    width: 33.33%;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .partners .partners-section1 .box-container .box {
    width: 50%;
  }
}
.partners .partners-section1 .box-container .box .logo {
  border: 1px solid #D9E2E1;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}
.partners .partners-section1 .box-container .box .title {
  margin-top: 10px;
  text-align: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .partners .partners-section1 .box-container .box .title {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .partners .partners-section1 .box-container .box .title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .partners .partners-section1 .box-container .box .title {
    font-size: 16px;
  }
}

.paging {
  margin-top: 90px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
}
.paging .left-arrow {
  width: 12px;
  height: 12px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_37' data-name='Polygon 37' d='M6,0l6,11H0Z' transform='translate(0 12) rotate(-90)' fill='%233191DB'/%3E%3C/svg%3E%0A");
  margin-right: 12px;
  position: relative;
  top: -1px;
}
.paging .right-arrow {
  width: 12px;
  height: 12px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%233191DB'/%3E%3C/svg%3E%0A");
  margin-left: 12px;
  position: relative;
  top: -1px;
}
.paging .page-number {
  color: #353636;
  padding-left: 8px;
  padding-right: 8px;
  padding-top: 5px;
  padding-bottom: 5px;
  margin-left: 2.5px;
  margin-right: 2.5px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .paging .page-number {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .paging .page-number {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .paging .page-number {
    font-size: 16px;
  }
}
.paging .page-number:hover {
  background-color: #3191DB;
  color: #ffffff;
}
.paging .page-number.active {
  background-color: #3191DB;
  color: #ffffff;
}

.stem-body header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
}
.stem-body section:first-child {
  margin-top: 128px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-body section:first-child {
    margin-top: 100px;
  }
}
.stem-body .footer {
  height: 225px;
  background-image: url("../../img/common/system/footer_bg.png");
  background-size: 100% 100%;
  background-position: top center;
  background-repeat: no-repeat;
  background-color: unset;
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  padding-left: 35px;
  padding-right: 35px;
  padding-bottom: 10px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px), (min-width: 768px) and (max-width: 991px) {
  .stem-body .footer {
    align-content: end;
    height: 180px;
  }
}
.stem-body .footer .left-col {
  color: black;
  width: 50%;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-body .footer .left-col {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-body .footer .left-col {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-body .footer .left-col {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px), (min-width: 768px) and (max-width: 991px) {
  .stem-body .footer .left-col {
    width: 100%;
    text-align: center;
    margin-bottom: 14px;
    order: 2;
    margin-bottom: 0px;
    margin-top: 10px;
  }
}
.stem-body .footer .right-col {
  width: 50%;
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-body .footer .right-col {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-body .footer .right-col {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-body .footer .right-col {
    font-size: 12px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px), (min-width: 768px) and (max-width: 991px) {
  .stem-body .footer .right-col {
    width: 100%;
    justify-content: center;
    padding-bottom: 0px;
    order: 1;
  }
}
.stem-body .footer .right-col a {
  color: black;
}

.stem-events .steam-introduction {
  margin-top: 50px;
  width: 100%;
  display: flex;
  justify-content: center;
}
.stem-events .steam-introduction .title {
  text-align: center;
  color: #258DCF;
  font-weight: 700;
  letter-spacing: 0.08em;
  margin-bottom: 35px;
  max-width: 550px;
  width: 100%;
  line-height: 1.3em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-events .steam-introduction .title {
    font-size: 55px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-events .steam-introduction .title {
    font-size: 45px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events .steam-introduction .title {
    font-size: 35px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events .steam-introduction .title {
    max-width: 100%;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events .steam-introduction .title {
    margin-bottom: 20px;
  }
}
.stem-events .steam-content-container .stem-at-vtc-main-img-wrapper {
  text-align: center;
  margin-top: 25px;
  margin-bottom: 120px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events .steam-content-container .stem-at-vtc-main-img-wrapper {
    margin-top: 100px;
    margin-bottom: 110px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-events .steam-content-container .stem-at-vtc-main-img-wrapper {
    margin-bottom: 120px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events .steam-content-container .stem-at-vtc-main-img-wrapper .stem-at-vtc-main-img {
    width: 100%;
  }
}
.stem-events .steam-content-container .stem-at-vtc-icon-list {
  position: relative;
  text-align: center;
  /*padding-bottom: 90px;*/
  margin-top: 50px;
  margin-bottom: 110px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list {
    margin-top: 10px;
    margin-bottom: 20px;
  }
}
.stem-events .steam-content-container .stem-at-vtc-icon-list .list-item {
  display: inline-block;
  position: relative;
  width: 290px;
  vertical-align: top;
  cursor: pointer;
}
.stem-events .steam-content-container .stem-at-vtc-icon-list .list-item .item-img {
  width: 100%;
  padding: 10%;
}
.stem-events .steam-content-container .stem-at-vtc-icon-list .list-item .item-title {
  position: absolute;
  widtH: 100%;
  font-size: 17px;
  font-weight: 700;
  padding: 10px 0;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list .list-item .item-title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list .list-item .item-title {
    font-size: 14px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list .list-item .item-title {
    padding: 15px 0;
  }
}
.stem-events .steam-content-container .stem-at-vtc-icon-list .list-item .item-hex {
  display: inline-block;
  width: 28px;
  height: 28px;
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  margin-top: -19px;
  margin-left: -10px;
  position: absolute;
  -webkit-animation: anim-rotate 6000ms 0 linear;
  -moz-animation: anim-rotate 6000ms 0 linear;
  -ms-animation: anim-rotate 6000ms 0 linear;
  -webkit-animation-iteration-count: infinite;
  -moz-animation-iteration-count: infinite;
  -ms-animation-iteration-count: infinite;
  -webkit-animation-direction: normal;
  -moz-animation-direction: normal;
  -ms-animation-direction: normal;
}
@media (min-width: 1200px) and (max-width: 1549px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list .list-item .item-hex {
    margin-left: -68px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px), (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list .list-item .item-hex {
    width: 20px;
    height: 20px;
    margin-top: -10px;
    margin-left: -44px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list .list-item .item-hex {
    margin-top: -5px;
    margin-left: -10px;
  }
}
.stem-events .steam-content-container .stem-at-vtc-icon-list .list-item.style1 .item-title {
  color: #0091DB;
}
.stem-events .steam-content-container .stem-at-vtc-icon-list .list-item.style2 .item-title {
  color: #E95098;
}
.stem-events .steam-content-container .stem-at-vtc-icon-list .list-item.style3 .item-title {
  color: #FFA312;
}
.stem-events .steam-content-container .stem-at-vtc-icon-list .list-item.style4 .item-title {
  color: #7d1aa9;
}
.stem-events .steam-content-container .stem-at-vtc-icon-list .list-item.style5 .item-title {
  color: #B7D200;
}

.stem-events .steam-content-container .stem-at-vtc-icon-list .icon-wrapper.stem-set{
	
}

.stem-events .steam-content-container .icon-wrapper.stem-set, 
.stem-events .steam-content-container .detail-wrapper.stem-set
{
	opacity: 0;
	max-height: 0;
	overflow: hidden;
	padding: 0;
	margin: 0;
	transition: all 0.4s ease;
	display: none;
}
.stem-events .steam-content-container .icon-wrapper.stem-set.stem-visible, 
.stem-events .steam-content-container .detail-wrapper.stem-set.stem-visible
{
	display: block;
	opacity: 1;
	max-height: 1000px;
	padding: 10px;
	margin-bottom: 10px;
}
@media (min-width: 1550px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item {
    margin: 0 -20px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item1 .item-title {
    /*width: 50%;
    left: 86%;
    top: -19%;*/
	width: 80%;
	font-size: 14px;
	margin: 0 10%;
	display: flex;
	justify-content: center;
	align-items: center;
	height: 75px;
	letter-spacing: 1.5px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item1 .item-hex {
    /*top: 0%;
    left: 82%;*/
	top: 1.75em;
	left: 77%;
	width: 20px;
	height: 20px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list .list-item.style1 .item-title{
	border: 1px solid #0091DB;
	background-color: #E7F7FF;
	color: #0091DB;
	font-weight: 600;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list .list-item.style2 .item-title{
	border: 1px solid #E95098;
	background-color: #E95098;
	color: #FFFFFF;
	font-weight: 600;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list .list-item.style3 .item-title{
	border: 1px solid #FFA312;
	background-color: #FFA312;
	color: #FFFFFF;
	font-weight: 600;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list .list-item.style4 .item-title{
	border: 1px solid #7D1AA9;
	background-color: #7D1AA9;
	color: #FFFFFF;
	font-weight: 600;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list .list-item.style5 .item-title{
	border: 1px solid #B7D200;
	background-color: #B7D200;
	color: #FFFFFF;
	font-weight: 600;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item2 {
    margin-top: 178px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item2 .item-title {
    width: 50%;
    bottom: -35%;
    left: -130px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item2 .item-hex {
    top: 98%;
    left: 10%;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item3 .item-title {
    bottom: 94%;
    left: 195px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item3 .item-hex {
    top: 0%;
    right: 10%;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item4 {
    margin-top: 178px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item4 .item-title {
    width: 50%;
    bottom: -17%;
    left: -130px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item4 .item-hex {
    top: 100%;
    left: 11%;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item5 .item-title {
    bottom: 94%;
    left: 204px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item5 .item-hex {
    top: 0%;
    right: 11%;
  }
}
@media (min-width: 1200px) and (max-width: 1549px), (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item {
    width: 250px;
    margin: 0 -15px;
  }
}
@media (min-width: 1200px) and (max-width: 1549px) and (min-width: 1200px) and (max-width: 1549px), (min-width: 768px) and (max-width: 991px) and (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px) and (min-width: 1200px) and (max-width: 1549px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item {
    width: 370px;
  }
}
@media (min-width: 1200px) and (max-width: 1549px) and (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) and (min-width: 992px) and (max-width: 1199px), (min-width: 992px) and (max-width: 1199px) and (min-width: 992px) and (max-width: 1199px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item {
    width: 310px;
  }
}
@media (min-width: 1200px) and (max-width: 1549px), (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item:nth-child(odd) {
    margin-right: 35px;
    margin-bottom: 95px;
  }
}
@media (min-width: 1200px) and (max-width: 1549px) and (min-width: 1200px) and (max-width: 1549px), (min-width: 768px) and (max-width: 991px) and (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px) and (min-width: 1200px) and (max-width: 1549px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item:nth-child(odd) {
    margin-right: 50px;
  }
}
@media (min-width: 1200px) and (max-width: 1549px) and (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) and (min-width: 992px) and (max-width: 1199px), (min-width: 992px) and (max-width: 1199px) and (min-width: 992px) and (max-width: 1199px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item:nth-child(odd) {
    margin-right: 55px;
  }
}
@media (min-width: 1200px) and (max-width: 1549px), (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item1 .item-title {
    top: 100%;
    margin-top: 5px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item1 .item-hex {
    top: 0%;
    right: 12%;
  }
}
@media (min-width: 1200px) and (max-width: 1549px), (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item2 {
    margin-top: 0px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item2 .item-title {
    margin-top: 5px;
    top: 100%;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item2 .item-hex {
    top: 0%;
    right: 12%;
  }
}
@media (min-width: 1200px) and (max-width: 1549px), (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item3 .item-title {
    margin-top: 5px;
    top: 100%;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item3 .item-hex {
    top: 0%;
    right: 12%;
  }
}
@media (min-width: 1200px) and (max-width: 1549px), (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item4 .item-title {
    margin-top: 5px;
    top: 100%;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item4 .item-hex {
    top: 0%;
    right: 10%;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item {
    width: 200px;
    margin: 20px 10px 25px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item .item-title {
    font-size: 15px;
    position: relative;
  }
}
.stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item {
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item:hover {
  transform: scale(1.1);
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item {
    margin: 0 -20px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item.item1 .item-title {
    width: 50%;
    left: -40%;
    bottom: 94%;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item.item1 .item-hex {
    top: 0%;
    left: 11%;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item.item2 {
    margin-top: 178px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item.item2 .item-title {
    bottom: 93%;
    text-align: right;
    right: -25%;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item.item2 .item-hex {
    top: 0%;
    right: 9%;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item {
    width: 250px;
    margin: 0 -15px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item.item1 .item-title {
    width: 60%;
    left: 20%;
    top: 100%;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item.item1 .item-hex {
    top: 0%;
    left: 13%;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item.item2 {
    margin-top: 89px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item.item2 .item-title {
    bottom: 100%;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item.item2 .item-hex {
    top: 0%;
    right: 11%;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item {
    width: 200px;
    margin: 0 10px 25px;
  }
  .stem-events .steam-content-container .stem-at-vtc-icon-list.train-list .list-item .item-title {
    position: relative;
  }
}
.stem-events .steam-content-container .stem-at-vtc-main-list-wrapper {
  padding-left: 45px;
  padding-right: 45px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events .steam-content-container .stem-at-vtc-main-list-wrapper {
    padding-left: 15px;
    padding-right: 15px;
  }
}
.stem-events .steam-content-container .icon-wrapper {
  display: inline-block;
  width: 95px;
  height: 95px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  vertical-align: top;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events .steam-content-container .icon-wrapper {
    display: block;
    width: 100%;
    margin-bottom: 30px;
  }
}
.stem-events .steam-content-container .detail-wrapper {
  display: inline-block;
  width: calc(100% - 100px);
  padding-left: 60px;
  margin-bottom: 80px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events .steam-content-container .detail-wrapper {
    width: 100%;
    display: block;
    padding-left: 0px;
  }
}
@media (min-width: 992px){
	.stem-events .steam-content-container .stem-at-vtc-icon-list .stem-set{
		display: none !important;
	}
}
@media (max-width: 991px){
	.stem-events .steam-content-container .stem-at-vtc-main-list-wrapper .stem-set{
		display: none !important;
	}
}
.stem-events .steam-content-container .detail-wrapper .stem-at-vtc-list-title {
  padding-bottom: 20px;
  text-align: left;
}
.stem-events .steam-content-container .detail-wrapper .stem-at-vtc-list-title.style1 {
  color: #0091DB;
  font-size: 22px;
  font-weight: 500;
}
.stem-events .steam-content-container .detail-wrapper .stem-at-vtc-list-title.style2 {
  color: #E95098;
  font-size: 22px;
  font-weight: 500;
}
.stem-events .steam-content-container .detail-wrapper .stem-at-vtc-list-title.style3 {
  color: #FFA312;
  font-size: 22px;
  font-weight: 500;
}
.stem-events .steam-content-container .detail-wrapper .stem-at-vtc-list-title.style4 {
  color: #B7D200;
  font-size: 22px;
  font-weight: 500;
}
.stem-events .steam-content-container .detail-wrapper .stem-at-vtc-list-title.style5 {
  color: #7d1aa9;
  font-size: 22px;
  font-weight: 500;
}
.stem-events .steam-content-container .detail-wrapper .stem-at-vtc-list-content {
  font-size: 17px;
  color: #4F4F4F;
  text-align: left;
}
.stem-events .stem-events-section1 {
  padding-top: 0px;
}
.stem-events .stem-events-section1 .btn-container {
  margin-bottom: 45px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events .stem-events-section1 .btn-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
}
.stem-events .stem-events-section1 .btn-container .news-media-btn {
  margin-right: 20px;
  color: #636363;
  background-color: #F3F3F3;
  padding-top: 10px;
  padding-bottom: 10px;
  min-width: 165px;
  font-weight: 600;
  text-align: center;
  display: inline-block;
}
.stem-events .stem-events-section1 .btn-container .news-media-btn.active, .stem-events .stem-events-section1 .btn-container .news-media-btn:hover {
  background-color: #3CC1C8;
  color: #ffffff;
}
.stem-events .stem-events-section1 .btn-container .news-media-btn:last-child {
  margin-right: 0px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events .stem-events-section1 .btn-container .news-media-btn {
    min-width: unset;
    width: 45%;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 15px;
  }
}
.stem-events .stem-events-section1 .box-container {
  margin-bottom: -80px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events .stem-events-section1 .box-container {
    margin-top: 20px;
  }
}
.stem-events .stem-events-section1 .box-container .col-box {
  margin-bottom: 50px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events .stem-events-section1 .box-container .col-box {
    margin-bottom: 35px;
  }
}
.stem-events .stem-events-section1 .box-container .col-box a {
  color: black;
}
.stem-events .stem-events-section1 .box-container .col-box a:hover .bg {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
}
.stem-events .stem-events-section1 .box-container .col-box .box {
  border-radius: 10px;
  height: 100%;
}
.stem-events .stem-events-section1 .box-container .col-box .box .img {
  margin-bottom: 10px;
  overflow: hidden;
}
.stem-events .stem-events-section1 .box-container .col-box .box .img .bg {
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.stem-events .stem-events-section1 .box-container .col-box .box .content .title {
  margin-bottom: 10px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-events .stem-events-section1 .box-container .col-box .box .content .title {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-events .stem-events-section1 .box-container .col-box .box .content .title {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events .stem-events-section1 .box-container .col-box .box .content .title {
    font-size: 14px;
  }
}
.stem-events .stem-events-section1 .box-container .col-box .box .content .date {
  margin-bottom: 5px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-events .stem-events-section1 .box-container .col-box .box .content .date {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-events .stem-events-section1 .box-container .col-box .box .content .date {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events .stem-events-section1 .box-container .col-box .box .content .date {
    font-size: 14px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events .stem-events-section1 .box-container .col-box .box .content .date {
    margin-bottom: 8px;
  }
}
.stem-events .stem-events-section1 .box-container .col-box .box .content .type {
  margin-bottom: 15px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-events .stem-events-section1 .box-container .col-box .box .content .type {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-events .stem-events-section1 .box-container .col-box .box .content .type {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events .stem-events-section1 .box-container .col-box .box .content .type {
    font-size: 14px;
  }
}
.stem-events .stem-events-section1 .box-container .col-box .box .content .btn-container {
  width: 100%;
  display: flex;
  justify-content: flex-end;
}

.stem-events-detail #login-main {
  position: relative;
}
.stem-events-detail #login-main .login-background {
  margin-bottom: 200px;
  width: 100%;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../../img/common/event-enrol-background.png");
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail #login-main .login-background {
    display: none;
  }
}
.stem-events-detail #login-main .login-wrapper {
  background-color: unset;
}
.stem-events-detail #login-main .select-bubble-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  position: absolute;
  bottom: -180px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail #login-main .select-bubble-container {
    position: unset;
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
.stem-events-detail #login-main .select-bubble-container .btn-arrow {
  padding: 5px 30px;
  padding-right: 40px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail #login-main .select-bubble-container .btn-arrow {
    padding: 10px 30px;
    padding-right: 40px;
  }
}
.stem-events-detail #login-main .select-bubble-container .bubble-background1 {
  width: 37.3%;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../../img/common/bubble1.png");
  display: flex;
  justify-content: center;
  margin-right: 50px;
}
@media (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail #login-main .select-bubble-container .bubble-background1 {
    margin-right: 40px;
    width: 100%;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events-detail #login-main .select-bubble-container .bubble-background1 {
    background-image: unset;
    margin-right: unset;
    width: 100%;
    align-items: center;
    background-color: #F8F8F8;
    margin-bottom: 40px;
  }
}
.stem-events-detail #login-main .select-bubble-container .bubble-background2 {
  width: 38.35%;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("../../img/common/bubble2.png");
  display: flex;
  justify-content: center;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail #login-main .select-bubble-container .bubble-background2 {
    width: 100%;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events-detail #login-main .select-bubble-container .bubble-background2 {
    background-image: unset;
    width: 100%;
    align-items: center;
    background-color: #F8F8F8;
  }
}
.stem-events-detail #login-main .select-bubble-container .bubble-background2 .login-enrol {
  padding-right: 60px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events-detail #login-main .select-bubble-container .bubble-background2 .login-enrol {
    padding-right: unset;
  }
}
.stem-events-detail #login-main .select-bubble-container .login-title {
  margin-bottom: unset;
  margin-top: 40px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-events-detail #login-main .select-bubble-container .login-title {
    font-size: 22px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail #login-main .select-bubble-container .login-title {
    font-size: 18px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail #login-main .select-bubble-container .login-title {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .stem-events-detail #login-main .select-bubble-container .login-title {
    margin-top: 20px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail #login-main .select-bubble-container .login-title {
    margin-top: 110px;
    font-size: 28px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events-detail #login-main .select-bubble-container .login-title {
    margin-top: unset;
    align-items: center;
  }
}
.stem-events-detail #login-main .select-bubble-container .login-detail {
  height: unset;
  margin-top: 15px;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .stem-events-detail #login-main .select-bubble-container .login-detail {
    margin-top: 10px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail #login-main .select-bubble-container .login-detail {
    margin-top: 30px;
    font-size: 20px;
  }
}
.stem-events-detail #login-main .select-bubble-container .login-form {
  padding-top: unset;
  margin-top: 20px;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .stem-events-detail #login-main .select-bubble-container .login-form {
    margin-top: 15px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail #login-main .select-bubble-container .login-form {
    margin-top: 30px;
  }
}
.stem-events-detail .guest-custom-control-label::before {
  left: -2rem;
}
.stem-events-detail .guest-custom-control-label::after {
  left: -2rem;
  margin-top: unset;
}
.stem-events-detail .disabled {
  opacity: 0.4;
  cursor: default;
}
.stem-events-detail .disabled + .shrink-wrapper {
  opacity: 0.4;
}
.stem-events-detail .training-form tbody tr {
  cursor: pointer;
}
.stem-events-detail .training-main .custom-checkbox {
  padding-left: 2rem;
}
.stem-events-detail .training-main .custom-checkbox .custom-control-label::before {
  margin: unset;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail .training-event-login {
    position: unset;
  }
}
.stem-events-detail .training-event-login.mobile-show {
  display: none;
  padding-bottom: unset;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail .training-event-login.mobile-show {
    display: block;
  }
}
.stem-events-detail .training-event-login .container {
  display: block;
}
.stem-events-detail .training-event-login .title {
  color: #258DCF;
  letter-spacing: 0.08em;
  margin-bottom: 20px;
  max-width: 520px;
  margin-top: 15px;
  line-height: 1.4em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-events-detail .training-event-login .title {
    font-size: 55px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail .training-event-login .title {
    font-size: 45px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail .training-event-login .title {
    font-size: 35px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail .training-event-login .title {
    max-width: 100%;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail .training-event-login .title {
    margin-bottom: 20px;
  }
}
.stem-events-detail .training-event-login .desc {
  letter-spacing: 0.07em;
  max-width: 520px;
  line-height: 1.7em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-events-detail .training-event-login .desc {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail .training-event-login .desc {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail .training-event-login .desc {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px) {
  .stem-events-detail .training-event-login .desc {
    max-width: 50%;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail .training-event-login .desc {
    max-width: 100%;
  }
}
.stem-events-detail .login-background {
  position: relative;
}
.stem-events-detail .login-background .training-event-login {
  position: absolute;
}
.stem-events-detail #login-main .btn-container {
  display: flex;
  justify-content: center;
}
.stem-events-detail #login-main .btn-theme {
  justify-content: center;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events-detail .head-bar-container {
    height: 230px;
  }
}
.stem-events-detail .head-bar-container .stem-news-and-events-header {
  display: flex;
  align-items: center;
}
.stem-events-detail .stem-events-detail-section1 .title {
  color: #3CC1C8;
  font-weight: 700;
  margin-bottom: 25px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-events-detail .stem-events-detail-section1 .title {
    font-size: 25px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail .stem-events-detail-section1 .title {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail .stem-events-detail-section1 .title {
    font-size: 22px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events-detail .stem-events-detail-section1 .title {
    margin-bottom: 15px;
  }
}
.stem-events-detail .stem-events-detail-section1 .common-btn-container {
  margin-top: 55px;
}
.stem-events-detail .stem-events-detail-section1 .box-container {
  display: flex;
  flex-wrap: wrap;
}
.stem-events-detail .stem-events-detail-section1 .box-container .left-col {
  width: 65%;
  padding-right: 60px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col {
    padding-right: 45px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col {
    width: 100%;
    order: 2;
    padding-right: 0px;
  }
}
.stem-events-detail .stem-events-detail-section1 .box-container .left-col table {
  width: 100%;
}
.stem-events-detail .stem-events-detail-section1 .box-container .left-col table tr td {
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 10px;
  padding-bottom: 10px;
  background-color: #ffffff;
  border: 1px solid #EAEAEA;
  vertical-align: top;
  color: #343434;
}
.stem-events-detail .stem-events-detail-section1 .box-container .left-col table tr td:first-child {
  background-color: #8DD5E1;
  width: 150px;
  color: #ffffff;
}
.stem-events-detail .stem-events-detail-section1 .box-container .left-col .basic-content {
  margin-bottom: 35px;
}
.stem-events-detail .stem-events-detail-section1 .box-container .left-col .basic-content .date {
  margin-bottom: 5px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .basic-content .date {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .basic-content .date {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .basic-content .date {
    font-size: 16px;
  }
}
.stem-events-detail .stem-events-detail-section1 .box-container .left-col .basic-content .type {
  margin-bottom: 5px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .basic-content .type {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .basic-content .type {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .basic-content .type {
    font-size: 16px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .basic-content .language {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .basic-content .language {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .basic-content .language {
    font-size: 16px;
  }
}
.stem-events-detail .stem-events-detail-section1 .box-container .left-col .content-row {
  margin-bottom: 35px;
}
.stem-events-detail .stem-events-detail-section1 .box-container .left-col .content-row .inline-title {
  display: inline-block;
  font-weight: 600;
  text-decoration: underline;
}
.stem-events-detail .stem-events-detail-section1 .box-container .left-col .content-row .inline-content {
  display: inline-block;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .content-row .inline-content {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .content-row .inline-content {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .content-row .inline-content {
    font-size: 16px;
  }
}
.stem-events-detail .stem-events-detail-section1 .box-container .left-col .content-row .block-title {
  display: block;
  font-weight: 600;
  text-decoration: underline;
  margin-bottom: 20px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .content-row .block-title {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .content-row .block-title {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .content-row .block-title {
    font-size: 16px;
  }
}
.stem-events-detail .stem-events-detail-section1 .box-container .left-col .content-row .block-content {
  display: block;
  line-height: 1.6em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .content-row .block-content {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .content-row .block-content {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .left-col .content-row .block-content {
    font-size: 16px;
  }
}
.stem-events-detail .stem-events-detail-section1 .box-container .right-col {
  width: 35%;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-events-detail .stem-events-detail-section1 .box-container .right-col {
    width: 100%;
    order: 1;
    margin-bottom: 50px;
  }
}
.stem-events-detail .stem-events-detail-section1 .box-container .right-col img {
  width: 100%;
  max-width: 100%;
}
.stem-events-detail .stem-events-detail-section1 .ck-box a {
  color: #3CC1C8;
  text-decoration: underline;
}
.stem-events-detail .stem-events-detail-section1 .ck-box a:hover {
  color: #3CC1C8;
}

.stem-news-and-events-header .event-select-period {
  margin-bottom: 35px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-news-and-events-header .event-select-period {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-bottom: 10px;
  }
}
.stem-news-and-events-header .event-select-period .events-btn {
  background-color: #EFEFEF;
  color: #353636;
  font-weight: 600;
  text-align: center;
  padding: 10px 25px;
  min-width: 185px;
  justify-content: center;
  align-items: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-news-and-events-header .event-select-period .events-btn {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-news-and-events-header .event-select-period .events-btn {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-news-and-events-header .event-select-period .events-btn {
    font-size: 14px;
  }
}
.stem-news-and-events-header .event-select-period .events-btn.active, .stem-news-and-events-header .event-select-period .events-btn:hover {
  background-color: #3CC1C8;
  color: #ffffff;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-news-and-events-header .event-select-period .events-btn {
    min-width: unset;
    width: 45%;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 15px;
  }
}
.stem-news-and-events-header .event-select-period .events-btn:first-child {
  margin-right: 20px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-news-and-events-header .event-select-period .events-btn:first-child {
    margin-right: 0px;
  }
}

.stem-play-back-of-webinars {
  background-image: url("../../img/common/system/common_bg2.jpg");
  background-size: 100%;
  background-position: top center;
  background-repeat: no-repeat;
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 .webinars-img {
  width: 95px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  margin-right: 15px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 .webinars-img {
    margin-bottom: 5px;
  }
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table th.unshrink-sm, .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table th.unshrink-sm, .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table th.unshrink-md, .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table th.unshrink-lg {
  display: none !important;
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table .shrink-toggle.unshrink-sm, .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table .shrink-toggle.unshrink-sm, .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table .shrink-toggle.unshrink-md, .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table .shrink-toggle.unshrink-lg {
  display: none !important;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table .shrinked-row {
    display: none;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table .shrink-row {
    background-color: #f4f4f4;
    border-top: 1px solid #c6c3c3;
  }
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table .shrink-wrapper:hover {
  color: inherit !important;
  cursor: unset !important;
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table .shrink-wrapper:hover td {
  color: inherit !important;
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table .shrink-wrapper td {
  background-color: #ffffff;
  padding-top: 0px !important;
  padding-bottom: 0px !important;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table .shrink-wrapper td {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
  }
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table tr.shrink-wrapper > td div.shrinked-row:not(.shrink-has-table) > div > div {
  font-weight: 400 !important;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table tr.shrink-wrapper > td div.shrinked-row:not(.shrink-has-table) > div > div {
    padding: 8px 33px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table tr.shrink-wrapper > td div.shrinked-row:not(.shrink-has-table) > div > div {
    padding: 8px 20px;
  }
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table tr.shrink-wrapper > td div.shrinked-row:not(.shrink-has-table) > div > div:first-of-type {
  font-weight: 600 !important;
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table {
  width: 100%;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table {
    font-size: 15px;
  }
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table th {
  background-color: #BDD92E;
  color: #ffffff;
  padding: 12px 25px;
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table th:first-child {
  border-top-left-radius: 25px;
  border-bottom-left-radius: 25px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table th:first-child {
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
  }
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table th:last-child, .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table th.th-status {
  border-top-right-radius: 25px;
  border-bottom-right-radius: 25px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table th:last-child, .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table th.th-status {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
  }
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table td {
  padding: 18px 25px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table .th-webinars {
    width: 110px;
  }
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table .th-status {
  width: 145px;
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table td {
  border-bottom: 1px solid #D8D2D2;
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table .td-webinars {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.stem-play-back-of-webinars .stem-play-back-of-webinars-section1 table .common-btn {
  width: 145px;
  padding-left: 15px;
  padding-right: 15px;
  text-align: center;
}

.parallax-background {
  background-position: 50% 0;
  background-repeat: no-repeat !important;
}

.stem-bulletin-board {
  background-image: url("../../img/common/system/common_bg2.jpg");
}
.stem-bulletin-board .header-bar {
  width: 100%;
  background-color: #258DCF;
  padding: 25px 15px;
}
.stem-bulletin-board .header-bar .row1 {
  text-align: center;
  color: #F8B52B;
  margin-bottom: 3px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-bulletin-board .header-bar .row1 {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-bulletin-board .header-bar .row1 {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .header-bar .row1 {
    font-size: 18px;
  }
}
.stem-bulletin-board .header-bar .row2 {
  text-align: center;
  color: #ffffff;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-bulletin-board .header-bar .row2 {
    font-size: 35px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-bulletin-board .header-bar .row2 {
    font-size: 35px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .header-bar .row2 {
    font-size: 30px;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 {
  padding-top: 0px;
}
.stem-bulletin-board .stem-bulletin-board-section1 .bulletin-title {
  font-weight: 600;
  line-height: 1.4em;
  text-align: center;
  margin-top: 40px;
  margin-bottom: 45px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .bulletin-title {
    font-size: 38px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .bulletin-title {
    font-size: 35px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .bulletin-title {
    font-size: 30px;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container {
  margin-bottom: -25px;
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box {
  margin-bottom: 25px;
  border-radius: 25px;
  padding: 35px;
  background-color: #ffffff;
  display: flex;
  flex-wrap: wrap;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box {
    padding: 30px;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box:nth-child(4n+1) {
  border: 6px solid #F6D067;
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box:nth-child(4n+1) .from {
  color: #F6D067;
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box:nth-child(4n+1) .quote-from {
  color: #B7D22C;
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box:nth-child(4n+2) {
  border: 6px solid #F890C6;
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box:nth-child(4n+2) .from {
  color: #F890C6;
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box:nth-child(4n+2) .quote-from {
  color: #67C8FC;
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box:nth-child(4n+3) {
  border: 6px solid #B7D22C;
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box:nth-child(4n+3) .from {
  color: #B7D22C;
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box:nth-child(4n+3) .quote-from {
  color: #F6D067;
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box:nth-child(4n+4) {
  border: 6px solid #67C8FC;
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box:nth-child(4n+4) .from {
  color: #F890C6;
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .left-col {
  width: 70px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .left-col {
    width: 50px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .left-col {
    display: none;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .left-col .icon {
  width: 70px;
  height: 70px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .left-col .icon {
    width: 50px;
    height: 50px;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col {
  width: calc(100% - 70px);
  padding-left: 40px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col {
    width: calc(100% - 50px);
    padding-left: 30px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col {
    padding-left: 0px;
    width: 100%;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 22px;
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-left-col {
  width: calc(100% - 300px);
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-left-col {
    width: 100%;
    order: 2;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-left-col .date {
  font-weight: 500;
  margin-bottom: 10px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-left-col .date {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-left-col .date {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-left-col .date {
    font-size: 14p;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-left-col .from {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-left-col .from {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-left-col .from {
    font-size: 25px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-left-col .from {
    font-size: 24px;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-left-col .from .mobile-icon {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 40px;
  height: 40px;
  margin-right: 10px;
  display: none;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-left-col .from .mobile-icon {
    display: block;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-right-col {
  width: 300px;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: flex-start;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-right-col {
    width: 100%;
    justify-content: center;
    order: 1;
    margin-bottom: 15px;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-right-col a {
  margin-right: 15px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-right-col a {
    width: 100%;
    margin-left: 0px;
    margin-right: 0px;
    margin-bottom: 10px;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row1 .inner-right-col a:last-child {
  margin-right: 0px;
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .quote-box {
  display: flex;
  flex-wrap: wrap;
  padding-left: 80px;
  position: relative;
  margin-bottom: 28px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .quote-box {
    padding-left: 60px;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .quote-box:before {
  content: "";
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='21.166' viewBox='0 0 30 21.166'%3E%3Cg id='quote' transform='translate(31 26.58) rotate(180)'%3E%3Cpath id='Path_11323' data-name='Path 11323' d='M6.6,19.24a16.956,16.956,0,0,1-3.09,4.88,1.475,1.475,0,0,0-.14,1.78,1.448,1.448,0,0,0,1.24.68,1.22,1.22,0,0,0,.42-.06c2.94-.86,9.81-3.91,10-13.69A7.206,7.206,0,0,0,8.75,5.45,7.01,7.01,0,0,0,1,12.43a6.931,6.931,0,0,0,5.6,6.81Z' fill='%23081e63'/%3E%3Cpath id='Path_11324' data-name='Path 11324' d='M24.71,5.45a7.009,7.009,0,0,0-7.74,6.98,6.931,6.931,0,0,0,5.6,6.81,16.957,16.957,0,0,1-3.09,4.88,1.475,1.475,0,0,0-.14,1.78,1.448,1.448,0,0,0,1.24.68,1.22,1.22,0,0,0,.42-.06c2.94-.86,9.81-3.91,10-13.69v-.14a7.2,7.2,0,0,0-6.29-7.24Z' fill='%23081e63'/%3E%3C/g%3E%3C/svg%3E%0A");
  position: absolute;
  top: 0;
  left: 0;
  width: 30px;
  height: 21px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .quote-box:before {
    width: 25px;
    height: 15px;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .quote-box:after {
  content: "";
  position: absolute;
  width: 2px;
  height: 100%;
  background-color: #B3B4B4;
  top: 0;
  left: 53px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .quote-box:after {
    width: 1px;
    left: 40px;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .quote-box .quote-from {
  margin-bottom: 5px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .quote-box .quote-from {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .quote-box .quote-from {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .quote-box .quote-from {
    font-size: 18px;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .quote-box .quote-content {
  font-weight: 500;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .quote-box .quote-content {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .quote-box .quote-content {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .quote-box .quote-content {
    font-size: 14px;
  }
}
.stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .content {
  font-weight: 500;
  line-height: 1.6em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .content {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .content {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-bulletin-board .stem-bulletin-board-section1 .box-container .box .right-col .row2 .content {
    font-size: 16px;
  }
}

.course-header-bar {
  width: 100%;
  background-color: #258DCF;
  padding-top: 25px;
  padding-bottom: 25px;
}
.course-header-bar .container {
  display: flex;
  flex-wrap: wrap;
}
.course-header-bar .left-col {
  width: calc(100% - 320px);
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-header-bar .left-col {
    width: 100%;
    margin-bottom: 25px;
    text-align: center;
  }
}
.course-header-bar .left-col .row1 {
  color: #8DD5E1;
  margin-bottom: 3px;
  font-weight: 700;
  width: 100%;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .course-header-bar .left-col .row1 {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .course-header-bar .left-col .row1 {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-header-bar .left-col .row1 {
    font-size: 18px;
  }
}
.course-header-bar .left-col .row2 {
  color: #ffffff;
  font-weight: 700;
  width: 100%;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .course-header-bar .left-col .row2 {
    font-size: 35px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .course-header-bar .left-col .row2 {
    font-size: 35px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-header-bar .left-col .row2 {
    font-size: 30px;
  }
}
.course-header-bar .right-col {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  width: 320px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-header-bar .right-col {
    width: 100%;
    justify-content: center;
  }
}
.course-header-bar .right-col .course-header-btn {
  margin-left: 30px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-header-bar .right-col .course-header-btn {
    margin-left: 12px;
    margin-right: 12px;
  }
}
.course-header-bar .right-col .course-header-btn.active .icon, .course-header-bar .right-col .course-header-btn:hover .icon {
  background-color: #8DD5E1;
  border: 2px solid #8DD5E1;
}
.course-header-bar .right-col .course-header-btn.active .title, .course-header-bar .right-col .course-header-btn:hover .title {
  color: #8DD5E1;
}
.course-header-bar .right-col .course-header-btn:first-child {
  margin-left: 0px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-header-bar .right-col .course-header-btn:first-child {
    margin-left: 12px;
    margin-right: 12px;
  }
}
.course-header-bar .right-col .course-header-btn .btn-container {
  max-width: 85px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.course-header-bar .right-col .course-header-btn .icon {
  background-size: 22px;
  background-position: center;
  background-repeat: no-repeat;
  width: 62px;
  height: 62px;
  border: 2px solid #ffffff;
  border-radius: 50%;
  margin-bottom: 7px;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  color: white;
  font-size: 30px;
  position: relative;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-header-bar .right-col .course-header-btn .icon {
    width: 60px;
    height: 60px;
  }
}
.course-header-bar .right-col .course-header-btn .icon.fa-home {
  font-size: 35px;
}
.course-header-bar .right-col .course-header-btn .icon:before {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.course-header-bar .right-col .course-header-btn .title {
  width: 100%;
  color: #ffffff;
  text-align: center;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .course-header-bar .right-col .course-header-btn .title {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .course-header-bar .right-col .course-header-btn .title {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-header-bar .right-col .course-header-btn .title {
    font-size: 14px;
  }
}

.section-online-learning .border-color {
  border: 7px solid #8DD5E1;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .section-online-learning .border-color {
    border: 5px solid #8DD5E1;
  }
}
.section-online-learning .border-color.no-border {
  border: 0px;
}
.section-online-learning .header-title-course {
  line-height: 1.2em;
  font-weight: 700;
  margin-bottom: 40px;
  color: #3CC1C8;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .section-online-learning .header-title-course {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .section-online-learning .header-title-course {
    font-size: 25px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .section-online-learning .header-title-course {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .section-online-learning .header-title-course {
    margin-bottom: 30px;
  }
}
.section-online-learning .online-learning-detail #form-bookmark {
  justify-content: flex-end;
  display: flex;
}
.section-online-learning .online-learning-detail #form-bookmark a .stem-bookmark {
  display: inline-block;
  width: 60px;
  height: 60px;
  background-repeat: no-repeat;
  background-position: center;
  background-color: white;
  background-size: 22px;
  border: 2px solid #CDCDCD;
  border-radius: 50%;
  margin-bottom: 7px;
  transition: 0.3s all;
  color: #CDCDCD;
  font-size: 30px;
  position: relative;
}
.section-online-learning .online-learning-detail #form-bookmark a .stem-bookmark:before {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.section-online-learning .online-learning-detail #form-bookmark a .stem-bookmark:hover {
  transform: translateY(-4px);
}
.section-online-learning .online-learning-detail #form-bookmark a.active .stem-bookmark {
  display: inline-block;
  width: 60px;
  height: 60px;
  background-repeat: no-repeat;
  background-position: center;
  background-color: #3CC1C8;
  background-size: 22px;
  border: 2px solid #3CC1C8;
  border-radius: 50%;
  margin-bottom: 7px;
  transition: 0.3s all;
  color: white;
  font-size: 30px;
  position: relative;
}
.section-online-learning .online-learning-detail #form-bookmark a.active .stem-bookmark:before {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.section-online-learning .online-learning-detail #form-bookmark a.active .stem-bookmark:hover {
  transform: translateY(-4px);
}
.section-online-learning .online-learning-detail .course-detail-list .course-detail-item {
  position: relative;
  margin-bottom: 10px;
}
.section-online-learning .online-learning-detail .course-detail-list .course-detail-item .course-detail-icon {
  position: absolute;
  left: 0;
  top: 50%;
  padding-right: 12px;
  transform: translateY(-50%);
}
.section-online-learning .online-learning-detail .course-detail-list .course-detail-item .course-detail-icon .course-detail-squre {
  font-size: 20px;
  color: white;
  height: 40px;
  width: 40px;
  display: flex;
  background-color: #3CC1C8;
  justify-content: center;
  align-items: center;
}
.section-online-learning .online-learning-detail .course-detail-list .course-detail-item .course-detail-title {
  padding-left: 65px;
  font-weight: 700;
  min-height: 48px;
  display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
}
.section-online-learning .online-learning-detail .course-detail-list .course-detail-item .title-hightlight {
  color: #3CC1C8;
}
.section-online-learning .online-learning-detail .course-detail-list .course-detail-item .title-hightlight a {
  color: #3CC1C8;
}
.section-online-learning .online-learning-detail .stem-img {
  margin-bottom: 30px;
}
.section-online-learning .online-learning-detail .stem-img img {
  height: initial !important;
  max-width: 100%;
}
.section-online-learning .online-learning-detail .stem-detail {
  margin-bottom: 35px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .section-online-learning .online-learning-detail .stem-detail {
    margin-bottom: 30px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .section-online-learning .online-learning-detail .stem-detail {
    margin-bottom: 45px;
  }
}
.section-online-learning .online-learning-detail .stem-video-title {
  font-weight: 700;
  margin-bottom: 20px;
  display: flex;
  flex-wrap: wrap;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .section-online-learning .online-learning-detail .stem-video-title {
    font-size: 28px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .section-online-learning .online-learning-detail .stem-video-title {
    font-size: 25px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .section-online-learning .online-learning-detail .stem-video-title {
    font-size: 22px;
  }
}
.section-online-learning .online-learning-detail .stem-video-title .title-main {
  margin-right: 20px;
}
.section-online-learning .online-learning-detail .stem-video {
  margin-bottom: 20px;
}

.section-online-learning-course .lesson-select-container {
  display: flex;
  flex-wrap: wrap;
}
.section-online-learning-course .lesson-select-container .left-container {
  width: 250px;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .section-online-learning-course .lesson-select-container .left-container {
    width: 200px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px), (min-width: 768px) and (max-width: 991px) {
  .section-online-learning-course .lesson-select-container .left-container {
    width: 100%;
    margin-bottom: 25px;
  }
}
.section-online-learning-course .lesson-select-container .left-container .online-learning-tab-menu {
  margin-right: 40px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px), (min-width: 768px) and (max-width: 991px) {
  .section-online-learning-course .lesson-select-container .left-container .online-learning-tab-menu {
    margin-right: unset;
  }
}
.section-online-learning-course .lesson-select-container .left-container .online-learning-tab-menu a {
  display: block;
}
.section-online-learning-course .lesson-select-container .left-container .online-learning-tab-menu .menu-item {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  padding-left: 0.8rem;
  padding-right: 0.8rem;
  margin-bottom: 10px;
  background-color: #F3F3F3;
  color: #343434;
}
.section-online-learning-course .lesson-select-container .left-container .online-learning-tab-menu .menu-item.intro {
  background-color: #3CC1C8;
  color: white;
}
.section-online-learning-course .lesson-select-container .left-container .online-learning-tab-menu .menu-item.intro:before {
  border: 3px solid #3CC1C8;
}
.section-online-learning-course .lesson-select-container .left-container .online-learning-tab-menu .active {
  background-color: #3CC1C8;
  color: white;
}
.section-online-learning-course .lesson-select-container .right-container {
  width: calc(100% - 250px);
}
@media (min-width: 992px) and (max-width: 1199px) {
  .section-online-learning-course .lesson-select-container .right-container {
    width: calc(100% - 200px);
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px), (min-width: 768px) and (max-width: 991px) {
  .section-online-learning-course .lesson-select-container .right-container {
    width: 100%;
  }
}
.section-online-learning-course .text-md-right {
  display: flex;
  justify-content: flex-end;
}
.section-online-learning-course .lessons-container .header-main {
  background-color: #8DD5E1;
  padding: 10px 15px 11px;
  font-weight: 700;
  color: white;
}

.course-bookmark .course-list {
  margin-bottom: -60px;
}
.course-bookmark .col-box {
  margin-bottom: 60px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-bookmark .col-box {
    margin-bottom: 35px;
  }
}
.course-bookmark .col-box .list-item {
  display: block;
}
.course-bookmark .col-box .boxs:hover .img-bg {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
}
.course-bookmark .col-box .boxs .box1 {
  background-color: #ffffff;
  height: 100%;
  position: relative;
  overflow: hidden;
}
.course-bookmark .col-box .boxs .box1:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 7px;
  background-color: #3CC1C8;
  top: 0;
  left: 0;
  z-index: 2;
}
.course-bookmark .col-box .boxs .box1 .img-title {
  position: absolute;
  top: 17px;
  left: 13px;
  text-align: center;
  color: #ffffff;
  width: 90px;
  background-clip: padding-box;
  background-color: #F9C01F;
  font-weight: 700;
  padding: 8px 5px;
}
.course-bookmark .col-box .boxs .box1 .img-title:hover {
  background-color: #F3BE2C;
  color: #ffffff;
}
.course-bookmark .col-box .boxs .box1 .img {
  position: relative;
  margin-bottom: 25px;
}
.course-bookmark .col-box .boxs .box1 .img .bg {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 10px;
}
.course-bookmark .col-box .boxs .box1 .img-bg {
  overflow: hidden;
  background-clip: padding-box;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.course-bookmark .col-box .boxs .box2 .content {
  color: #343434;
  padding-top: 10px;
}
.course-bookmark .col-box .boxs .box2 .content .title {
  margin-bottom: 10px;
  line-height: 1.2em;
  font-weight: 700;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .course-bookmark .col-box .boxs .box2 .content .title {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .course-bookmark .col-box .boxs .box2 .content .title {
    font-size: 18px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-bookmark .col-box .boxs .box2 .content .title {
    font-size: 18px;
  }
}
.course-bookmark .col-box .boxs .box2 .content .desc {
  line-height: 1.4em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .course-bookmark .col-box .boxs .box2 .content .desc {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .course-bookmark .col-box .boxs .box2 .content .desc {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-bookmark .col-box .boxs .box2 .content .desc {
    font-size: 16px;
  }
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .course-bookmark .no-results {
    font-size: 28px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .course-bookmark .no-results {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-bookmark .no-results {
    font-size: 24px;
  }
}

.stem-previous-webinars {
  background-size: 100%;
  background-position: top center;
  background-repeat: no-repeat;
}
.stem-previous-webinars .online-learning-header .row1, .stem-previous-webinars .online-learning-header .row2 {
  font-weight: 700;
}
.stem-previous-webinars .stem-previous-webinars-section1 {
  padding-bottom: 0px;
}
.stem-previous-webinars .stem-previous-webinars-section1 .search-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin-bottom: 40px;
}
.stem-previous-webinars .stem-previous-webinars-section1 .search-container .textbox-container {
  width: 250px;
  max-width: 100%;
  height: 38px;
  margin-left: 7.5px;
  margin-right: 7.5px;
  position: relative;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-previous-webinars .stem-previous-webinars-section1 .search-container .textbox-container {
    width: 100%;
    margin-bottom: 15px;
  }
}
.stem-previous-webinars .stem-previous-webinars-section1 .search-container .textbox-container button {
  position: absolute;
  top: 0;
  right: 5px;
  width: 45px;
  height: 38px;
  background-size: 18px;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18.072' height='18.076' viewBox='0 0 18.072 18.076'%3E%3Cg id='_x32_-Magnifying_Glass' transform='translate(-7.129 -7.125)'%3E%3Cpath id='Path_7081' data-name='Path 7081' d='M24.887,23.373,21.413,19.9A7.978,7.978,0,1,0,19.9,21.413l3.474,3.474a1.071,1.071,0,1,0,1.515-1.515ZM10.971,19.2a5.817,5.817,0,1,1,4.113,1.7A5.824,5.824,0,0,1,10.971,19.2Z' fill='%23258DCF'/%3E%3C/g%3E%3C/svg%3E%0A");
  background-color: transparent;
  border: 0px;
  outline: none;
}
.stem-previous-webinars .stem-previous-webinars-section1 .search-container .textbox-container input {
  width: 250px;
  max-width: 100%;
  height: 38px;
  border: 1px solid #C1C1C1;
  padding: 15px 20px;
  padding-right: 50px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-previous-webinars .stem-previous-webinars-section1 .search-container .textbox-container input {
    width: 100%;
  }
}
.stem-previous-webinars .stem-previous-webinars-section1 .search-container .textbox-container input::-moz-placeholder {
  color: #C1C1C1;
  font-size: 14px;
}
.stem-previous-webinars .stem-previous-webinars-section1 .search-container .textbox-container input::placeholder {
  color: #C1C1C1;
  font-size: 14px;
}
.stem-previous-webinars .stem-previous-webinars-section1 .search-container .selectbox-container {
  width: 250px;
  max-width: 100%;
  height: 38px;
  margin-left: 7.5px;
  margin-right: 7.5px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-previous-webinars .stem-previous-webinars-section1 .search-container .selectbox-container {
    width: 100%;
  }
}
.stem-previous-webinars .stem-previous-webinars-section1 .search-container .selectbox-container select {
  width: 250px;
  max-width: 100%;
  height: 38px;
  background-color: white;
  border: 1px solid #C1C1C1;
  padding-left: 20px;
  padding-right: 50px;
  -moz-appearance: none;
  -webkit-appearance: none;
  font-size: 14px;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='19.258' height='20.356' viewBox='0 0 19.258 20.356'%3E%3Cpath id='Polygon_1' data-name='Polygon 1' d='M6.3,2.768a2,2,0,0,1,3.407,0l4.421,7.184A2,2,0,0,1,12.421,13H3.579a2,2,0,0,1-1.7-3.048Z' transform='translate(0 13.856) rotate(-60)' fill='%23258DCF'/%3E%3C/svg%3E%0A");
  background-repeat: no-repeat, repeat;
  background-position: right 15px top 35%, 0 0;
  background-size: 20px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-previous-webinars .stem-previous-webinars-section1 .search-container .selectbox-container select {
    width: 100%;
  }
}
.stem-previous-webinars .stem-previous-webinars-section1 .search-container .selectbox-container select:focus-visible {
  outline: none;
}
.stem-previous-webinars .stem-previous-webinars-section1 .search-container .selectbox-container select::-ms-expand {
  display: none;
}
.stem-previous-webinars .stem-previous-webinars-section1 .tag-container {
  width: calc(100% - 150px);
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  margin-bottom: 40px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-previous-webinars .stem-previous-webinars-section1 .tag-container {
    width: calc(100% - 50px);
  }
}
.stem-previous-webinars .stem-previous-webinars-section1 .tag-container .tag {
  background-color: #ffffff;
  font-weight: 500;
  color: #8DD5E1;
  margin-left: 15px;
  margin-right: 15px;
  margin-bottom: 15px;
  padding: 7px 35px;
  border: 1px solid #8DD5E1;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-previous-webinars .stem-previous-webinars-section1 .tag-container .tag {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-previous-webinars .stem-previous-webinars-section1 .tag-container .tag {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-previous-webinars .stem-previous-webinars-section1 .tag-container .tag {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-previous-webinars .stem-previous-webinars-section1 .tag-container .tag {
    width: 100%;
    text-align: center;
    padding: 7px 15px;
    margin-left: 5px;
    margin-right: 5px;
  }
}
.stem-previous-webinars .stem-previous-webinars-section1 .tag-container .tag:hover, .stem-previous-webinars .stem-previous-webinars-section1 .tag-container .tag.active {
  background-color: #8DD5E1;
  color: #ffffff;
}
.stem-previous-webinars .stem-previous-webinars-section1 .slider-container {
  width: calc(100% - 150px);
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-previous-webinars .stem-previous-webinars-section1 .slider-container {
    width: calc(100% - 80px);
  }
}
.stem-previous-webinars .stem-previous-webinars-section1 .whole-slider-container {
  display: flex;
  justify-content: center;
  position: relative;
}
.stem-previous-webinars .stem-previous-webinars-section1 .whole-slider-container .swiper-button-next {
  top: 50%;
  transform: translateY(-50%);
  margin-top: 0px;
  width: 42px;
  height: 42px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='42' viewBox='0 0 36 42'%3E%3Cpath id='Polygon_5' data-name='Polygon 5' d='M19.272,2.962a2,2,0,0,1,3.455,0L40.245,32.992A2,2,0,0,1,38.518,36H3.482a2,2,0,0,1-1.728-3.008Z' transform='translate(36) rotate(90)' fill='%23258DCF'/%3E%3C/svg%3E%0A");
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-previous-webinars .stem-previous-webinars-section1 .whole-slider-container .swiper-button-next {
    width: 25px;
    height: 25px;
  }
}
.stem-previous-webinars .stem-previous-webinars-section1 .whole-slider-container .swiper-button-next:after {
  display: none;
}
.stem-previous-webinars .stem-previous-webinars-section1 .whole-slider-container .swiper-button-prev {
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  margin-top: 0px;
  width: 42px;
  height: 42px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='36' height='42' viewBox='0 0 36 42'%3E%3Cpath id='Polygon_6' data-name='Polygon 6' d='M19.272,2.962a2,2,0,0,1,3.455,0L40.245,32.992A2,2,0,0,1,38.518,36H3.482a2,2,0,0,1-1.728-3.008Z' transform='translate(0 42) rotate(-90)' fill='%23258DCF'/%3E%3C/svg%3E%0A");
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-previous-webinars .stem-previous-webinars-section1 .whole-slider-container .swiper-button-prev {
    width: 25px;
    height: 25px;
  }
}
.stem-previous-webinars .stem-previous-webinars-section1 .whole-slider-container .swiper-button-prev:after {
  display: none;
}
.stem-previous-webinars .stem-previous-webinars-section1 .swiper {
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
}
.stem-previous-webinars .stem-previous-webinars-section1 .swiper-slide {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.stem-previous-webinars .stem-previous-webinars-section2 .box-container {
  margin-top: 80px;
  margin-bottom: -60px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-previous-webinars .stem-previous-webinars-section2 .box-container {
    margin-bottom: -35px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-previous-webinars .stem-previous-webinars-section2 .box-container {
    margin-top: 70px;
  }
}
.stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box {
  margin-bottom: 60px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box {
    margin-bottom: 35px;
  }
}
.stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .list-item {
  display: block;
}
.stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs:hover .img-bg {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
}
.stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box1 {
  background-color: #ffffff;
  height: 100%;
  position: relative;
  overflow: hidden;
}
.stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box1:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 7px;
  background-color: #3CC1C8;
  top: 0;
  left: 0;
  z-index: 2;
}
.stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box1 .img-title {
  position: absolute;
  top: 17px;
  left: 13px;
  text-align: center;
  color: #ffffff;
  width: 90px;
  background-clip: padding-box;
  background-color: #F9C01F;
  font-weight: 700;
  padding: 8px 5px;
}
.stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box1 .img-title:hover {
  background-color: #F3BE2C;
  color: #ffffff;
}
.stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box1 .img {
  position: relative;
  margin-bottom: 25px;
}
.stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box1 .img .bg {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 10px;
}
.stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box1 .img-bg {
  overflow: hidden;
  background-clip: padding-box;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box2 .content {
  color: #343434;
  padding-top: 10px;
}
.stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box2 .content .title {
  margin-bottom: 10px;
  line-height: 1.2em;
  font-weight: 700;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box2 .content .title {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box2 .content .title {
    font-size: 18px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box2 .content .title {
    font-size: 18px;
  }
}
.stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box2 .content .desc {
  line-height: 1.4em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box2 .content .desc {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box2 .content .desc {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-previous-webinars .stem-previous-webinars-section2 .box-container .col-box .boxs .box2 .content .desc {
    font-size: 16px;
  }
}
.my-lesson .item-title {
  display: none;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .my-lesson .item-title {
    display: block;
  }
}
.my-lesson .item-btn {
  display: flex;
  justify-content: center;
}
.my-lesson .item-btn .btn-theme {
  justify-content: center;
}
.my-lesson .item-btn .finish {
  background-color: #F3F3F3;
  color: #343434;
}
.my-lesson .lessons-container td {
  padding-top: 20px;
  padding-bottom: 20px;
  vertical-align: middle;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
  .my-lesson .lessons-container .course-title {
    background-color: #F3F3F3;
  }
}
.my-lesson .lessons-container .item-detail {
  display: flex;
  flex-wrap: wrap;
}
.my-lesson .lessons-container .item-detail .item-img {
  width: 93px;
  height: 62px;
  display: inline-block;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  vertical-align: top;
  margin-right: 15px;
}
.my-lesson .lessons-container .item-detail .item-img-title {
  align-self: center;
  width: calc(100% - 93px - 15px);
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
  .my-lesson .lessons-container .item-detail {
    justify-content: center;
  }
}

.my-lessons-course-intro .online-learning-detail {
  padding: 30px;
}
.my-lessons-course-intro .intro-btn {
  max-width: 145px;
  margin-bottom: 40px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px), (min-width: 768px) and (max-width: 991px) {
  .my-lessons-course-intro .intro-btn {
    margin-bottom: 20px;
  }
}
.my-lessons-course-intro .stem-feedback #form_msg {
  margin-bottom: 25px;
  height: 10em;
}

.course-detail .online-learning-detail {
  padding: 30px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .course-detail .online-learning-detail {
    padding: 30px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .course-detail .online-learning-detail {
    padding: 15px;
  }
}
.course-detail .course-list-title {
  line-height: 1.2em;
  font-weight: 700;
  margin-bottom: 40px;
  color: #3CC1C8;
  margin-top: 60px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .course-detail .course-list-title {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .course-detail .course-list-title {
    font-size: 25px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-detail .course-list-title {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-detail .course-list {
    margin-bottom: -35px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-detail .course-list .col-box {
    margin-bottom: 35px;
  }
}
.course-detail .course-list .col-box .list-item {
  display: block;
}
.course-detail .course-list .col-box .boxs:hover .img-bg {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
}
.course-detail .course-list .col-box .boxs .box1 {
  background-color: #ffffff;
  height: 100%;
  position: relative;
  overflow: hidden;
}
.course-detail .course-list .col-box .boxs .box1:before {
  content: "";
  position: absolute;
  width: 100%;
  height: 7px;
  background-color: #3CC1C8;
  top: 0;
  left: 0;
  z-index: 2;
}
.course-detail .course-list .col-box .boxs .box1 .img-title {
  position: absolute;
  top: 17px;
  left: 13px;
  text-align: center;
  color: #ffffff;
  width: 90px;
  background-clip: padding-box;
  background-color: #F9C01F;
  font-weight: 700;
  padding: 8px 5px;
}
.course-detail .course-list .col-box .boxs .box1 .img-title:hover {
  background-color: #F3BE2C;
  color: #ffffff;
}
.course-detail .course-list .col-box .boxs .box1 .img {
  position: relative;
  margin-bottom: 25px;
}
.course-detail .course-list .col-box .boxs .box1 .img .bg {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  border-radius: 10px;
}
.course-detail .course-list .col-box .boxs .box1 .img-bg {
  overflow: hidden;
  background-clip: padding-box;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  width: 100%;
  height: 100%;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.course-detail .course-list .col-box .boxs .box2 .content {
  color: #343434;
  padding-top: 10px;
}
.course-detail .course-list .col-box .boxs .box2 .content .title {
  margin-bottom: 10px;
  line-height: 1.2em;
  font-weight: 700;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .course-detail .course-list .col-box .boxs .box2 .content .title {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .course-detail .course-list .col-box .boxs .box2 .content .title {
    font-size: 18px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-detail .course-list .col-box .boxs .box2 .content .title {
    font-size: 18px;
  }
}
.course-detail .course-list .col-box .boxs .box2 .content .desc {
  line-height: 1.4em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .course-detail .course-list .col-box .boxs .box2 .content .desc {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .course-detail .course-list .col-box .boxs .box2 .content .desc {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .course-detail .course-list .col-box .boxs .box2 .content .desc {
    font-size: 16px;
  }
}
.stem-homepage {
  background-image: url("../../img/common/system/common_bg2.jpg");
  background-size: 100%;
  background-position: top center;
  background-repeat: no-repeat;
}
.stem-homepage .container {
  max-width: 1250px !important;
}
.stem-homepage .homepage-banner {
  background-image: url("../../img/common/stem_homepage/banner.png");
  background-size: cover;
  background-position: center;
  margin-top: 0px !important;
  background-repeat: no-repeat;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .homepage-banner {
    margin-top: 100px !important;
  }
}
.stem-homepage .about-us {
  position: relative;
}
.stem-homepage .about-us:after {
  position: absolute;
  content: "";
  background-color: #EAEAEA;
  width: 100%;
  height: 300px;
  bottom: 44px;
  z-index: -1;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .about-us:after {
    display: none;
  }
}
.stem-homepage .about-us .title1 {
  text-align: center;
  color: #F8B52B;
  margin-bottom: 8px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .about-us .title1 {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .about-us .title1 {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .about-us .title1 {
    font-size: 18px;
  }
}
.stem-homepage .about-us .title2 {
  text-align: center;
  color: #061D58;
  margin-bottom: 25px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .about-us .title2 {
    font-size: 35px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .about-us .title2 {
    font-size: 35px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .about-us .title2 {
    font-size: 30px;
  }
}
.stem-homepage .about-us .desc {
  position: relative;
  left: 50%;
  transform: translateX(-50%);
  width: 100%;
  max-width: 1000px;
  text-align: center;
  line-height: 2em;
  margin-bottom: 100px;
}
.stem-homepage .about-us .box-row {
  margin-left: -15px;
  margin-right: -15px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-homepage .about-us .box-row {
    margin-left: -15px;
    margin-right: -15px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .about-us .box-row {
    margin-bottom: -40px;
    margin-left: -15px;
    margin-right: -15px;
  }
}
.stem-homepage .about-us .col-box {
  padding-left: 15px;
  padding-right: 15px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .stem-homepage .about-us .col-box {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .about-us .col-box {
    margin-bottom: 45px;
    padding-left: 15px;
    padding-right: 15px;
  }
}
.stem-homepage .about-us .col-box .box .row1 {
  text-align: center;
  margin-bottom: 4px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .about-us .col-box .box .row1 {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .about-us .col-box .box .row1 {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .about-us .col-box .box .row1 {
    font-size: 18px;
  }
}
.stem-homepage .about-us .col-box .box .row2 {
  text-align: center;
  margin-bottom: 20px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .about-us .col-box .box .row2 {
    font-size: 35px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .about-us .col-box .box .row2 {
    font-size: 35px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .about-us .col-box .box .row2 {
    font-size: 30px;
  }
}
.stem-homepage .about-us .col-box .box .row2 span {
  position: relative;
  top: -4px;
}
.stem-homepage .about-us .col-box .box .icon {
  border-radius: 50%;
  background-size: 50%;
  background-position: center;
  background-repeat: no-repeat;
  width: 80%;
  position: relative;
  transform: translateX(-50%);
  left: 50%;
}
.stem-homepage .about-us .col-box .box .icon.icon1 {
  background-color: #B7D22C;
}
.stem-homepage .about-us .col-box .box .icon.icon2 {
  background-color: #F8B52B;
}
.stem-homepage .about-us .col-box .box .icon.icon3 {
  background-color: #3191DB;
}
.stem-homepage .about-us .col-box .box .icon.icon4 {
  background-color: #E9589C;
}
.stem-homepage .about-us .col-box .box .box-desc {
  padding-top: 30px;
  text-align: center;
  line-height: 1.8em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .about-us .col-box .box .box-desc {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .about-us .col-box .box .box-desc {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .about-us .col-box .box .box-desc {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .about-us .col-box .box .box-desc {
    line-height: 1.5em;
  }
}
.stem-homepage .about-us .col-box .box.green .row1, .stem-homepage .about-us .col-box .box.green .row2 {
  color: #B7D22C;
}
.stem-homepage .about-us .col-box .box.orange .row1, .stem-homepage .about-us .col-box .box.orange .row2 {
  color: #F8B52B;
}
.stem-homepage .about-us .col-box .box.blue .row1, .stem-homepage .about-us .col-box .box.blue .row2 {
  color: #3191DB;
}
.stem-homepage .about-us .col-box .box.pink .row1, .stem-homepage .about-us .col-box .box.pink .row2 {
  color: #E9589C;
}
.stem-homepage .technology .container {
  display: flex;
  flex-wrap: wrap;
}
.stem-homepage .technology .container .left-col {
  width: 50%;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .technology .container .left-col {
    width: 100%;
    margin-bottom: 50px;
  }
}
.stem-homepage .technology .container .left-col .img {
  background-image: url("../../img/common/stem_homepage/img1.png");
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
.stem-homepage .technology .container .right-col {
  width: 50%;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding-left: 100px;
  align-content: center;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .technology .container .right-col {
    padding-left: 0px;
    width: 100%;
  }
}
.stem-homepage .technology .container .right-col .title {
  color: #E95098;
  margin-bottom: 20px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .technology .container .right-col .title {
    font-size: 40px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .technology .container .right-col .title {
    font-size: 35px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .technology .container .right-col .title {
    font-size: 30px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .technology .container .right-col .title {
    text-align: center;
    width: 100%;
  }
}
.stem-homepage .technology .container .right-col .desc {
  line-height: 2em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .technology .container .right-col .desc {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .technology .container .right-col .desc {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .technology .container .right-col .desc {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .technology .container .right-col .desc {
    text-align: center;
    width: 100%;
  }
}
.stem-homepage .learning-facilities .title1 {
  color: #061D58;
  margin-bottom: 12px;
  text-align: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .learning-facilities .title1 {
    font-size: 50px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .learning-facilities .title1 {
    font-size: 40px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .learning-facilities .title1 {
    font-size: 35px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .learning-facilities .title1 {
    margin-bottom: 20px;
  }
}
.stem-homepage .learning-facilities .title2 {
  text-align: center;
  margin-bottom: 70px;
  line-height: 1.8em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .learning-facilities .title2 {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .learning-facilities .title2 {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .learning-facilities .title2 {
    font-size: 16px;
  }
}
.stem-homepage .learning-facilities .col-row {
  margin-bottom: -15px;
  margin-left: -7.5px;
  margin-right: -7.5px;
}
.stem-homepage .learning-facilities .col-row .col-box {
  margin-bottom: 15px;
  position: relative;
  padding-left: 7.5px;
  padding-right: 7.5px;
}
.stem-homepage .learning-facilities .col-row .col-box .box {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.stem-homepage .learning-facilities .col-row .col-box .bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.stem-homepage .learning-facilities .col-row .col-box .bg.bg1 {
  background-image: url("../../img/common/stem_homepage/bg1.jpg");
}
.stem-homepage .learning-facilities .col-row .col-box .bg.bg2 {
  background-image: url("../../img/common/stem_homepage/bg2.jpg");
}
.stem-homepage .learning-facilities .col-row .col-box .bg.bg3 {
  background-image: url("../../img/common/stem_homepage/bg3.jpg");
}
.stem-homepage .learning-facilities .col-row .col-box .bg.bg4 {
  background-image: url("../../img/common/stem_homepage/bg4.jpg");
}
.stem-homepage .learning-facilities .col-row .col-box .border-bg {
  position: absolute;
  bottom: -162px;
  left: 0;
  height: 100%;
  width: 100%;
  background-size: 100%;
  background-position: top center;
  background-repeat: no-repeat;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .learning-facilities .col-row .col-box .border-bg {
    bottom: 0;
  }
  .stem-homepage .learning-facilities .col-row .col-box .border-bg .content-container {
    bottom: 15px !important;
  }
}
.stem-homepage .learning-facilities .col-row .col-box .border-bg .content-container {
  position: absolute;
  bottom: 112px;
  width: 100%;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.stem-homepage .learning-facilities .col-row .col-box .border-bg .content-container .title {
  color: #ffffff;
  padding-left: 20px;
  padding-right: 20px;
  margin-bottom: 10px;
  text-align: right;
  width: 100%;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .learning-facilities .col-row .col-box .border-bg .content-container .title {
    font-size: 21px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .learning-facilities .col-row .col-box .border-bg .content-container .title {
    font-size: 19px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .learning-facilities .col-row .col-box .border-bg .content-container .title {
    font-size: 16px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .learning-facilities .col-row .col-box .border-bg .content-container .title {
    padding-left: 10px;
    padding-right: 10px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .learning-facilities .col-row .col-box .border-bg .content-container .title {
    text-align: left;
  }
}
.stem-homepage .learning-facilities .col-row .col-box .border-bg .content-container .content {
  color: #ffffff;
  padding-left: 20px;
  padding-right: 20px;
  text-align: right;
  width: 100%;
  min-height: 48px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .learning-facilities .col-row .col-box .border-bg .content-container .content {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .learning-facilities .col-row .col-box .border-bg .content-container .content {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .learning-facilities .col-row .col-box .border-bg .content-container .content {
    font-size: 14px;
  }
}
@media (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .learning-facilities .col-row .col-box .border-bg .content-container .content {
    font-size: 12px !important;
    padding-left: 10px;
    padding-right: 10px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .learning-facilities .col-row .col-box .border-bg .content-container .content {
    text-align: left;
    min-height: unset;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .learning-facilities .col-row .col-box .border-bg {
    padding-bottom: 3px;
  }
}
.stem-homepage .learning-facilities .col-row .col-box .border-bg.green {
  background-image: url("../../img/common/stem_homepage/border_bg1.png");
}
.stem-homepage .learning-facilities .col-row .col-box .border-bg.pink {
  background-image: url("../../img/common/stem_homepage/border_bg2.png");
}
.stem-homepage .learning-facilities .col-row .col-box .border-bg.blue {
  background-image: url("../../img/common/stem_homepage/border_bg3.png");
}
.stem-homepage .learning-facilities .col-row .col-box .border-bg.orange {
  background-image: url("../../img/common/stem_homepage/border_bg4.png");
}
.stem-homepage .learning-facilities .col-row .col-box:hover .bg {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -ms-transform: scale(1.05);
  -o-transform: scale(1.05);
}
.stem-homepage .learning-facilities .col-row .col-box:hover .border-bg {
  bottom: 0;
}
.stem-homepage .learning-facilities .col-row .col-box:hover .border-bg .content-container {
  bottom: 15px;
}
.stem-homepage .learning-facilities .col-row .col-box:nth-child(odd) .border-bg {
  text-align: left;
}
.stem-homepage .learning-facilities .col-row .col-box:nth-child(even) .border-bg {
  text-align: right;
}
.stem-homepage .get-in-touch .title1 {
  color: #061D58;
  margin-bottom: 12px;
  text-align: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .get-in-touch .title1 {
    font-size: 50px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .get-in-touch .title1 {
    font-size: 40px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .get-in-touch .title1 {
    font-size: 35px;
  }
}
.stem-homepage .get-in-touch .title2 {
  text-align: center;
  margin-bottom: 30px;
  line-height: 1.8em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .get-in-touch .title2 {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .get-in-touch .title2 {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .get-in-touch .title2 {
    font-size: 16px;
  }
}
.stem-homepage .get-in-touch .matterport-video {
  display: flex;
  justify-content: center;
  margin-bottom: 45px;
}
.stem-homepage .get-in-touch .matterport-video iframe {
  aspect-ratio: 16/9;
  width: 700px;
  max-width: 100%;
}
.stem-homepage .get-in-touch .about-stem-tab-container {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 0px;
}
.stem-homepage .get-in-touch .about-stem-tab-container .tab {
  color: #061D58;
  margin-right: 5px;
  padding: 20px 35px;
  background-color: #F8F8F8;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  cursor: pointer;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .get-in-touch .about-stem-tab-container .tab {
    font-size: 21px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .get-in-touch .about-stem-tab-container .tab {
    font-size: 21px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .get-in-touch .about-stem-tab-container .tab {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .get-in-touch .about-stem-tab-container .tab {
    width: calc(20% + 50px);
    padding: 20px 30px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-homepage .get-in-touch .about-stem-tab-container .tab {
    border-radius: 15px;
    margin-right: 0px;
    width: 100%;
    margin-bottom: 10px;
    padding: 15px 25px;
  }
}
.stem-homepage .get-in-touch .about-stem-tab-container .tab.active {
  color: #ffffff;
}
.stem-homepage .get-in-touch .about-stem-tab-container .tab.active.pink {
  background-color: #3cc1c8;
}
.stem-homepage .get-in-touch .about-stem-tab-container .tab.active.blue {
  background-color: #8dd5e1;
}
.stem-homepage .get-in-touch .about-stem-tab-container .tab.active.orange {
  background-color: #459dd7;
}
.stem-homepage .get-in-touch .about-stem-tab-container .tab.active.green {
  background-color: #b7d200;
}
.stem-homepage .get-in-touch .address-container .address-box {
  border-bottom-left-radius: 15px;
  border-bottom-right-radius: 15px;
  padding: 30px;
  width: 100%;
  display: none;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-homepage .get-in-touch .address-container .address-box {
    border-radius: 15px;
    margin-top: 10px;
    padding: 25px;
  }
}
.stem-homepage .get-in-touch .address-container .address-box.active {
  display: block;
}
.stem-homepage .get-in-touch .address-container .address-box.pink {
  background-color: #3cc1c8;
}
.stem-homepage .get-in-touch .address-container .address-box.blue {
  background-color: #8dd5e1;
}
.stem-homepage .get-in-touch .address-container .address-box.orange {
  background-color: #459dd7;
}
.stem-homepage .get-in-touch .address-container .address-box.green {
  background-color: #b7d200;
}
.stem-homepage .get-in-touch .address-container .address-box .map1 {
  width: 100%;
  max-width: 100%;
  margin-bottom: 30px;
}
.stem-homepage .get-in-touch .address-container .address-box .box-container {
  display: flex;
  flex-wrap: wrap;
  color: #ffffff;
}
.stem-homepage .get-in-touch .address-container .address-box .box-container .left-col {
  width: 50%;
  padding-right: 85px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .get-in-touch .address-container .address-box .box-container .left-col {
    padding-right: 45px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-homepage .get-in-touch .address-container .address-box .box-container .left-col {
    width: 100%;
    padding-right: 0px;
  }
}
.stem-homepage .get-in-touch .address-container .address-box .box-container .left-col .title {
  margin-bottom: 15px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .get-in-touch .address-container .address-box .box-container .left-col .title {
    font-size: 45px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .get-in-touch .address-container .address-box .box-container .left-col .title {
    font-size: 35px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .get-in-touch .address-container .address-box .box-container .left-col .title {
    font-size: 32px;
  }
}
.stem-homepage .get-in-touch .address-container .address-box .box-container .left-col .desc {
  font-weight: 600;
  margin-bottom: 28px;
  line-height: 1.6em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-homepage .get-in-touch .address-container .address-box .box-container .left-col .desc {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-homepage .get-in-touch .address-container .address-box .box-container .left-col .desc {
    font-size: 18px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-homepage .get-in-touch .address-container .address-box .box-container .left-col .desc {
    font-size: 16px;
  }
}
.stem-homepage .get-in-touch .address-container .address-box .box-container .right-col {
  width: 50%;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-homepage .get-in-touch .address-container .address-box .box-container .right-col {
    width: 100%;
    display: none;
  }
}
.stem-homepage .get-in-touch .address-container .address-box .box-container .right-col .address-img1 {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
  background-image: url("../../img/common/stem_homepage/address1.jpg");
}
.stem-homepage .get-in-touch .address-container .address-box .box-container .right-col .address-img2 {
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
  background-image: url("../../img/common/stem_homepage/address2.jpg");
}

.stem-footer {
  height: 225px;
  background-image: url("../../img/common/system/footer_bg.png");
  background-size: 100% 100%;
  background-position: top center;
  background-repeat: no-repeat;
  display: flex;
  align-items: flex-end;
  flex-wrap: wrap;
  padding-left: 35px;
  padding-right: 35px;
  padding-bottom: 10px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px), (min-width: 768px) and (max-width: 991px) {
  .stem-footer {
    align-content: end;
    height: 180px;
  }
}
.stem-footer .left-col {
  width: 50%;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-footer .left-col {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-footer .left-col {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-footer .left-col {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px), (min-width: 768px) and (max-width: 991px) {
  .stem-footer .left-col {
    width: 100%;
    text-align: center;
    margin-bottom: 14px;
    order: 2;
    margin-bottom: 0px;
    margin-top: 10px;
  }
}
.stem-footer .right-col {
  width: 50%;
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .stem-footer .right-col {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .stem-footer .right-col {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .stem-footer .right-col {
    font-size: 12px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px), (min-width: 768px) and (max-width: 991px) {
  .stem-footer .right-col {
    width: 100%;
    justify-content: center;
    padding-bottom: 0px;
    order: 1;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-footer .right-col .social-media-container {
    order: 1;
  }
}
.stem-footer .right-col .menu-container {
  margin-right: 45px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px), (min-width: 768px) and (max-width: 991px) {
  .stem-footer .right-col .menu-container {
    margin-right: 0px;
    width: 100%;
    display: flex;
    justify-content: center;
    margin-bottom: 15px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .stem-footer .right-col .menu-container {
    order: 2;
    margin-bottom: 3px;
    margin-top: 12px;
  }
}
.stem-footer .right-col .menu-container .menu-item {
  color: #353636;
  margin-right: 18px;
  position: relative;
}
.stem-footer .right-col .menu-container .menu-item:after {
  content: "";
  position: absolute;
  top: 50%;
  right: -11px;
  transform: translateY(-50%);
  width: 1px;
  height: 80%;
  background-color: #353636;
}
.stem-footer .right-col .menu-container .menu-item:last-child {
  margin-right: 0px;
}
.stem-footer .right-col .menu-container .menu-item:last-child:after {
  display: none;
}
.stem-footer .right-col .social-media {
  color: #3191DB;
  margin-right: 8px;
  font-size: 15px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px), (min-width: 768px) and (max-width: 991px) {
  .stem-footer .right-col .social-media {
    width: 100%;
  }
}
.stem-footer .right-col .social-media:last-child {
  margin-right: 0px;
}

.common-btn {
  display: inline-block;
  text-align: center;
  background-color: #F3BE2C;
  border: 2px solid #F3BE2C;
  border-radius: 25px;
  padding: 7px 35px;
  font-weight: 600;
  color: #ffffff;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .common-btn {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .common-btn {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-btn {
    font-size: 16px;
  }
}
.common-btn:hover {
  border: 2px solid #F3BE2C;
  background-color: #ffffff;
  color: #F3BE2C;
}
.common-btn.grey {
  background-color: #D8D2D2;
  border: 2px solid #D8D2D2;
}
.common-btn.grey:hover {
  background-color: #D8D2D2;
  color: #ffffff;
}
.common-btn.arrow {
  padding-right: 40px;
  padding-left: 25px;
  position: relative;
}
.common-btn.arrow:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 10px;
  transform: translateY(-50%);
  width: 14px;
  height: 14px;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='14' viewBox='0 0 12 14'%3E%3Cpath id='Polygon_39' data-name='Polygon 39' d='M5.272,2.962a2,2,0,0,1,3.455,0l3.518,6.031A2,2,0,0,1,10.518,12H3.482A2,2,0,0,1,1.755,8.992Z' transform='translate(12) rotate(90)' fill='%23fff'/%3E%3C/svg%3E%0A");
}
.common-btn.arrow:hover:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='14' viewBox='0 0 12 14'%3E%3Cpath id='Polygon_39' data-name='Polygon 39' d='M5.272,2.962a2,2,0,0,1,3.455,0l3.518,6.031A2,2,0,0,1,10.518,12H3.482A2,2,0,0,1,1.755,8.992Z' transform='translate(12) rotate(90)' fill='%23F3BE2C'/%3E%3C/svg%3E%0A");
}

.fancybox-close {
  top: -17px;
  right: -17px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  width: 32px;
  height: 32px;
}

.fancybox-skin {
  border-radius: 0px !important;
}

.popup-agree-contact .content {
  padding: 70px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .popup-agree-contact .content {
    padding: 45px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .popup-agree-contact .content {
    padding: 25px;
  }
}
.popup-agree-contact .content .row1 {
  text-align: center;
  margin-bottom: 25px;
  width: 690px;
  max-width: 100%;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.9em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .popup-agree-contact .content .row1 {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .popup-agree-contact .content .row1 {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .popup-agree-contact .content .row1 {
    font-size: 16px;
  }
}
.popup-agree-contact .content .agree {
  text-align: center;
  margin-bottom: 35px;
  font-weight: 500;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .popup-agree-contact .content .agree {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .popup-agree-contact .content .agree {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .popup-agree-contact .content .agree {
    font-size: 13px;
  }
}
.popup-agree-contact .content .agree a {
  text-decoration: underline;
  color: #3CC1C8;
}
.popup-agree-contact .content .btn-container {
  display: flex;
  justify-content: center;
}
.popup-agree-contact .content .contact-btn {
  display: inline-block;
  padding-left: 15px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 55px;
  background-color: #3CC1C8;
  color: #ffffff;
  position: relative;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  position: relative;
  font-weight: 600;
  top: 0px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .popup-agree-contact .content .contact-btn {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .popup-agree-contact .content .contact-btn {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .popup-agree-contact .content .contact-btn {
    font-size: 14px;
  }
}
.popup-agree-contact .content .contact-btn:hover {
  position: relative;
  top: -3px;
}
.popup-agree-contact .content .contact-btn:after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23fff'/%3E%3C/svg%3E%0A");
}

.popup-announcement .content {
  padding: 40px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .popup-announcement .content {
    padding: 25px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .popup-announcement .content {
    padding: 25px;
  }
}
.popup-announcement .content .row1 {
  text-align: center;
  width: 690px;
  max-width: 100%;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
  font-weight: 600;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .popup-announcement .content .row1 {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .popup-announcement .content .row1 {
    font-size: 18px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .popup-announcement .content .row1 {
    font-size: 18px;
  }
}
.popup-announcement .content .row2 {
  text-align: center;
  font-weight: 500;
  line-height: 1.9em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .popup-announcement .content .row2 {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .popup-announcement .content .row2 {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .popup-announcement .content .row2 {
    font-size: 16px;
  }
}
.popup-announcement .content .row2 a {
  text-decoration: underline;
  color: #258DCF;
}
.popup-announcement .content .btn-container {
  display: flex;
  justify-content: center;
}
.popup-announcement .content .contact-btn {
  display: inline-block;
  padding-left: 15px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 55px;
  background-color: #3CC1C8;
  color: #ffffff;
  position: relative;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  position: relative;
  font-weight: 600;
  top: 0px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .popup-announcement .content .contact-btn {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .popup-announcement .content .contact-btn {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .popup-announcement .content .contact-btn {
    font-size: 14px;
  }
}
.popup-announcement .content .contact-btn:hover {
  position: relative;
  top: -3px;
}
.popup-announcement .content .contact-btn:after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23fff'/%3E%3C/svg%3E%0A");
}

.popup-contact .content {
  padding: 70px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .popup-contact .content {
    padding: 45px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .popup-contact .content {
    padding: 25px;
  }
}
.popup-contact .content .row1 {
  text-align: center;
  width: 690px;
  max-width: 100%;
  margin-bottom: 10px;
  margin-left: auto;
  margin-right: auto;
  font-weight: 600;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .popup-contact .content .row1 {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .popup-contact .content .row1 {
    font-size: 18px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .popup-contact .content .row1 {
    font-size: 18px;
  }
}
.popup-contact .content .row2 {
  text-align: center;
  margin-bottom: 35px;
  font-weight: 500;
  line-height: 1.9em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .popup-contact .content .row2 {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .popup-contact .content .row2 {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .popup-contact .content .row2 {
    font-size: 16px;
  }
}
.popup-contact .content .row2 a {
  text-decoration: underline;
  color: #258DCF;
}
.popup-contact .content .btn-container {
  display: flex;
  justify-content: center;
}
.popup-contact .content .contact-btn {
  display: inline-block;
  padding-left: 15px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-right: 55px;
  background-color: #3CC1C8;
  color: #ffffff;
  position: relative;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  position: relative;
  font-weight: 600;
  top: 0px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .popup-contact .content .contact-btn {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .popup-contact .content .contact-btn {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .popup-contact .content .contact-btn {
    font-size: 14px;
  }
}
.popup-contact .content .contact-btn:hover {
  position: relative;
  top: -3px;
}
.popup-contact .content .contact-btn:after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23fff'/%3E%3C/svg%3E%0A");
}

.menu-toggle-layer {
  opacity: 0;
  position: fixed;
  height: 100%;
  width: 100%;
  background-color: rgba(60, 193, 200, 0);
  z-index: 11;
  top: 0;
  pointer-events: none;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.menu-toggle-layer.active {
  background-color: rgba(0, 0, 0, 0.77);
  opacity: 1;
  pointer-events: auto;
}

.responsive-menu {
  height: 100%;
  width: 100%;
  max-width: 420px;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 9999;
  transform: translateX(100%);
  background-color: #ffffff;
  padding: 150px 50px;
}
.responsive-menu.ready {
  -webkit-transition: 0.2s all;
  -moz-transition: 0.2s all;
  -ms-transition: 0.2s all;
  -o-transition: 0.2s all;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .responsive-menu {
    width: 100%;
    max-width: 100%;
    padding: 100px 23px;
    overflow-y: scroll;
  }
}
.responsive-menu.active {
  transform: translateX(0%);
}
.responsive-menu .close-btn {
  width: 40px;
  height: 40px;
  background-color: #258DCF;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='23.272' height='23.272' viewBox='0 0 23.272 23.272'%3E%3Crect id='Rectangle_805' data-name='Rectangle 805' width='29.329' height='3.583' transform='translate(2.534) rotate(45)' fill='%23fff'/%3E%3Crect id='Rectangle_806' data-name='Rectangle 806' width='29.329' height='3.583' transform='translate(23.272 2.534) rotate(135)' fill='%23fff'/%3E%3C/svg%3E%0A");
  background-position: center;
  background-size: 18px;
  background-repeat: no-repeat;
  position: absolute;
  top: 44px;
  right: 37px;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  cursor: pointer;
}
.responsive-menu .close-btn:hover {
  background-color: #f8b500;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .responsive-menu .close-btn {
    width: 35px;
    height: 35px;
    background-size: 18px;
    top: 31px;
    right: 15px;
  }
}
.responsive-menu .menu-container {
  padding-bottom: 45px;
}
.responsive-menu .menu-container .menu-item {
  margin-bottom: 28px;
}
.responsive-menu .menu-container .menu-item:last-child {
  margin-bottom: 0px;
}
.responsive-menu .menu-container .menu-item a {
  color: #459DD7;
  font-weight: 600;
  letter-spacing: 0.09em;
  position: relative;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .responsive-menu .menu-container .menu-item a {
    font-size: 23px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .responsive-menu .menu-container .menu-item a {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .responsive-menu .menu-container .menu-item a {
    font-size: 18px;
  }
}
.responsive-menu .menu-container .menu-item a:after {
  content: "";
  position: absolute;
  right: -40px;
  top: 50%;
  transform: translate(-10px, -50%);
  width: 30px;
  height: 16px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='29.793' height='15.827' viewBox='0 0 29.793 15.827'%3E%3Cpath id='Path_19995' data-name='Path 19995' d='M1576.137,1725.751h-22.672v-3.709h22.672l-3.426-3.426,2.633-2.633,7.914,7.913-7.914,7.914-2.633-2.633Z' transform='translate(-1553.465 -1715.983)' fill='%23f8b500' fill-rule='evenodd'/%3E%3C/svg%3E%0A");
  opacity: 0;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
.responsive-menu .menu-container .menu-item a:hover {
  color: #f8b500;
}
.responsive-menu .menu-container .menu-item a:hover:after {
  opacity: 0;
  transform: translate(0px, -50%);
}
.responsive-menu .menu-container .menu-item .inner-menu-item-container {
  margin-top: 12px;
}
.responsive-menu .menu-container .menu-item .inner-menu-item-container .inner-menu-item {
  font-weight: 600;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .responsive-menu .menu-container .menu-item .inner-menu-item-container .inner-menu-item {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .responsive-menu .menu-container .menu-item .inner-menu-item-container .inner-menu-item {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .responsive-menu .menu-container .menu-item .inner-menu-item-container .inner-menu-item {
    font-size: 16px;
  }
}
.responsive-menu .menu-container .menu-item .inner-menu-item-container .inner-menu-item:after {
  width: 18px;
  right: -32px;
  transform: translate(-10px, -50%);
}
.responsive-menu .lang-container {
  margin-bottom: 20px;
}
.responsive-menu .lang-container a {
  font-weight: 600;
  color: #459DD7;
  margin-right: 15px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .responsive-menu .lang-container a {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .responsive-menu .lang-container a {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .responsive-menu .lang-container a {
    font-size: 18px;
  }
}
.responsive-menu .lang-container a:hover, .responsive-menu .lang-container a.active {
  color: #f8b500;
}
.responsive-menu .social-media-container a {
  color: #459DD7;
  margin-right: 15px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .responsive-menu .social-media-container a {
    font-size: 26px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .responsive-menu .social-media-container a {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .responsive-menu .social-media-container a {
    font-size: 20px;
  }
}
.responsive-menu .social-media-container a:hover {
  color: #f8b500;
}
.responsive-menu .footer-menu {
  position: absolute;
  bottom: 15px;
  right: 5px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .responsive-menu .footer-menu {
    position: relative;
    width: 100%;
    left: 0;
    right: 0;
    text-align: right;
    top: 0;
    bottom: 0;
    margin-top: 35px;
  }
}
.responsive-menu .footer-menu a {
  font-weight: 300;
  color: #459DD7;
  position: relative;
  padding-left: 10px;
  padding-right: 10px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .responsive-menu .footer-menu a {
    font-size: 12px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .responsive-menu .footer-menu a {
    font-size: 12px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .responsive-menu .footer-menu a {
    font-size: 12px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .responsive-menu .footer-menu a {
    padding-left: 5px;
    padding-right: 5px;
  }
}
.responsive-menu .footer-menu a:after {
  content: "";
  width: 1px;
  height: 80%;
  top: 50%;
  transform: translateY(-50%);
  background-color: #459DD7;
  position: absolute;
  right: -2px;
}
.responsive-menu .footer-menu a:last-child:after {
  display: none;
}
.responsive-menu .footer-menu a:hover {
  color: #3CC1C8;
}
.responsive-menu .copyright {
  display: none;
  font-weight: 300;
  color: #459DD7;
  position: relative;
  padding-left: 10px;
  padding-right: 0px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .responsive-menu .copyright {
    font-size: 12px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .responsive-menu .copyright {
    font-size: 12px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .responsive-menu .copyright {
    font-size: 12px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .responsive-menu .copyright {
    position: relative;
    width: 100%;
    left: 0;
    right: 0;
    text-align: right;
    top: 0;
    bottom: 0;
  }
}

.map .contact-us-and-subscribe {
  margin-top: 150px;
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}

.map.home .contact-us-and-subscribe {
  margin-top: 350px;
}

@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .map .contact-us-and-subscribe {
    padding-top: 25px !important;
    padding-bottom: 25px !important;
  }
}
.map .contact-us-and-subscribe .footer-wrapper {
  padding-left: 80px;
  padding-right: 80px;
  background-color: #f2f7f7;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .map .contact-us-and-subscribe .footer-wrapper {
    padding-left: 15px;
    padding-right: 15px;
  }
}
.map .responsive-menu .footer-menu {
  position: absolute;
  bottom: 50px;
  right: 8px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .map .responsive-menu .footer-menu {
    position: relative;
    width: 100%;
    left: 0;
    right: 0;
    text-align: right;
    top: 0;
    bottom: 0;
    margin-top: 35px;
  }
}
.map .responsive-menu .copyright {
  display: block;
  position: absolute;
  bottom: 15px;
  right: 15px;
  text-align: right;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .map .responsive-menu .copyright {
    position: relative;
    width: 100%;
    left: 0;
    right: 0;
    text-align: right;
    top: 0;
    bottom: 0;
    margin-top: 5px;
  }
}

.map {
  -webkit-transition: 0.3s background-color;
  -moz-transition: 0.3s background-color;
  -ms-transition: 0.3s background-color;
  -o-transition: 0.3s background-color;
}
.map .member-btn, .map .menu-btn, .map .logout-btn, .map .login-btn {
  position: relative;
  top: -2px;
}
.map .close-btn {
  top: 29px;
}

.responsive-menu.active {
  box-shadow: 0 19px 38px rgba(0, 0, 0, 0.3), 0 15px 12px rgba(0, 0, 0, 0.22);
}

.sponsor-container {
  position: absolute;
  top: 100vh;
  width: 100%;
  height: 149px;
  background-color: #ffffff;
  overflow: hidden;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding-top: 15px;
  padding-bottom: 15px;
}

.sponsor-container.sponsor-list2{
	top: 116vh;
}

.sponsor-container .marquee {
  width: 100%;
}
.sponsor-container .marquee .swiper-container {
  width: 100%;
}
.sponsor-container .marquee .swiper-wrapper {
  transition-timing-function: linear !important;
}
.sponsor-container .marquee .swiper-slide {
  display: flex;
  align-items: center;
  justify-content: center;
}
.sponsor-container .marquee .swiper-slide .logo-div {
  height: 55px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

.contact-us-and-subscribe .container {
  padding-left: 15px;
  padding-right: 15px;
}
.contact-us-and-subscribe .footer-wrapper {
  padding-left: 80px;
  padding-right: 80px;
  background-color: #F3F3F3;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .contact-us-and-subscribe .footer-wrapper {
    padding-left: 40px;
    padding-right: 40px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .contact-us-and-subscribe .footer-wrapper {
    padding-left: 25px;
    padding-right: 25px;
  }
}
.contact-us-and-subscribe .footer-wrapper #btn-subscribe {
  width: 155px;
  height: 42px;
}
.contact-us-and-subscribe .content-container {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  padding-top: 35px;
  padding-bottom: 35px;
}
.contact-us-and-subscribe .content-container .left-col {
  width: 50%;
  padding-right: 45px;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .contact-us-and-subscribe .content-container .left-col {
    padding-right: 35px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .contact-us-and-subscribe .content-container .left-col {
    width: 100%;
    margin-bottom: 35px;
    padding-right: 0px;
  }
}
.contact-us-and-subscribe .content-container .left-col .information-container .box-row {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.contact-us-and-subscribe .content-container .left-col .information-container .box-row:last-child {
  margin-bottom: 0px;
}
.contact-us-and-subscribe .content-container .left-col .information-container .box-row .box-left-col {
  width: 22px;
  padding-top: 3px;
  color: #3CC1C8;
  font-size: 21px;
  display: flex;
  align-items: flex-start;
}
.contact-us-and-subscribe .content-container .left-col .information-container .box-row .box-right-col {
  line-height: 1.6em;
  width: calc(100% - 22px);
  padding-left: 15px;
  font-weight: 500;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .contact-us-and-subscribe .content-container .left-col .information-container .box-row .box-right-col {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .contact-us-and-subscribe .content-container .left-col .information-container .box-row .box-right-col {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .contact-us-and-subscribe .content-container .left-col .information-container .box-row .box-right-col {
    font-size: 16px;
  }
}
.contact-us-and-subscribe .content-container .left-col .information-container .box-row .box-right-col a {
  color: inherit;
}
.contact-us-and-subscribe .content-container .left-col .information-container .box-row .box-right-col a:hover {
  text-decoration: none;
}
.contact-us-and-subscribe .content-container .right-col {
  padding-left: 45px;
  width: 50%;
}
@media (min-width: 992px) and (max-width: 1199px) {
  .contact-us-and-subscribe .content-container .right-col {
    padding-left: 35px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .contact-us-and-subscribe .content-container .right-col {
    width: 100%;
    padding-left: 0px;
  }
}
.contact-us-and-subscribe .content-container .right-col .line1, .contact-us-and-subscribe .content-container .right-col .line2 {
  font-weight: 500;
  margin-bottom: 15px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .contact-us-and-subscribe .content-container .right-col .line1, .contact-us-and-subscribe .content-container .right-col .line2 {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .contact-us-and-subscribe .content-container .right-col .line1, .contact-us-and-subscribe .content-container .right-col .line2 {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .contact-us-and-subscribe .content-container .right-col .line1, .contact-us-and-subscribe .content-container .right-col .line2 {
    font-size: 16px;
  }
}
.contact-us-and-subscribe .content-container .right-col .subscribe-textbox-container {
  display: flex;
  flex-wrap: wrap;
}
.contact-us-and-subscribe .content-container .right-col .subscribe-textbox-container .subscribe-left-col {
  width: calc(100% - 155px);
  padding-right: 15px;
  display: flex;
  align-items: center;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .contact-us-and-subscribe .content-container .right-col .subscribe-textbox-container .subscribe-left-col {
    width: 100%;
    margin-bottom: 15px;
    padding-right: 0px;
  }
}
.contact-us-and-subscribe .content-container .right-col .subscribe-textbox-container .subscribe-left-col input {
  width: 100%;
  border: 1px solid #D1CFCF;
  background-color: #FFFFFF;
  height: 42px;
  padding-left: 15px;
  padding-right: 15px;
  font-family: "ITC Avant Garde Gothic Std", "Noto Sans TC", "Noto Sans SC", "Microsoft JhengHei";
  color: #353636;
}
.contact-us-and-subscribe .content-container .right-col .subscribe-textbox-container .subscribe-left-col #input-subscribe-email {
  margin-bottom: unset;
}
.contact-us-and-subscribe .content-container .box-section-title {
  letter-spacing: 0.08em;
  margin-bottom: 18px;
  font-weight: 600;
  color: #258DCF;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .contact-us-and-subscribe .content-container .box-section-title {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .contact-us-and-subscribe .content-container .box-section-title {
    font-size: 25px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .contact-us-and-subscribe .content-container .box-section-title {
    font-size: 22px;
  }
}
.contact-us-and-subscribe .btn-arrow {
  padding: 5px 25px;
  padding-right: 45px;
}

.breadcrumb-arrow {
  position: relative;
  top: -2px;
  color: #8DD5E1;
}

.video-loading {
  width: 100vw;
  height: 100vh;
  position: fixed;
  background-color: #ffffff;
  z-index: 9999;
  opacity: 0;
  pointer-events: none;
  -webkit-transition: 1s all;
  -moz-transition: 1s all;
  -ms-transition: 1s all;
  -o-transition: 1s all;
}
.video-loading.active {
  opacity: 1;
  pointer-events: auto;
}
.video-loading video {
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  z-index: -1000;
  overflow: hidden;
  -webkit-transition: 0.5s all;
  -moz-transition: 0.5s all;
  -ms-transition: 0.5s all;
  -o-transition: 0.5s all;
}
.video-loading video.active {
  opacity: 1;
}

/* new css */
.login-label-text {
  margin-bottom: 4px;
  font-size: 14px !important;
}

.green-common-btn {
  display: inline-block;
  align-items: center;
  min-width: 150px;
  text-align: center;
  padding: 10px 17px;
  background-color: #3CC1C8;
  color: #ffffff;
  font-weight: 600;
  border-radius: 0px;
  position: relative;
  border: 0px;
  outline: 0;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
  white-space: nowrap;
  cursor: pointer;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .green-common-btn {
    font-size: 14px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .green-common-btn {
    font-size: 14px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .green-common-btn {
    font-size: 14px;
  }
}
.green-common-btn:hover, .green-common-btn:focus, .green-common-btn:active {
  color: #ffffff;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
}
.green-common-btn:hover .arrow-left, .green-common-btn:focus .arrow-left, .green-common-btn:active .arrow-left {
  margin-left: 0;
}
.green-common-btn:hover .arrow, .green-common-btn:focus .arrow, .green-common-btn:active .arrow {
  margin-right: 0;
}
.green-common-btn.right-arrow {
  padding-left: 15px;
  padding-right: 40px;
  text-align: left;
  position: relative;
}
.green-common-btn.right-arrow:after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  right: 12.5px;
  top: 50%;
  transform: translateY(-50%);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23fff'/%3E%3C/svg%3E%0A");
}
.green-common-btn.left-arrow {
  padding-left: 40px;
  padding-right: 15px;
  text-align: right;
  position: relative;
}
.green-common-btn.left-arrow:before {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  left: 12.5px;
  top: 50%;
  transform: translateY(-50%) rotate(180deg);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%23fff'/%3E%3C/svg%3E%0A");
}
.green-common-btn.fit-content {
  min-width: unset;
}
.green-common-btn.grey {
  background-color: #E7E7E7;
  color: #7D7D7D;
}
.green-common-btn.white-btn {
  background-color: #ffffff;
  color: #3CC1C8;
}
.green-common-btn.white-btn.left-arrow:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%233CC1C8'/%3E%3C/svg%3E%0A");
}
.green-common-btn.white-btn.right-arrow:after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='12' viewBox='0 0 11 12'%3E%3Cpath id='Polygon_36' data-name='Polygon 36' d='M6,0l6,11H0Z' transform='translate(11) rotate(90)' fill='%233CC1C8'/%3E%3C/svg%3E%0A");
}

.common-btn-container {
  display: flex;
  flex-wrap: wrap;
}
.common-btn-container .left-col {
  width: 50%;
  order: 2;
  display: flex;
  justify-content: flex-end;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-btn-container .left-col {
    width: 100%;
    order: 1;
    margin-bottom: 7.5px;
    justify-content: center;
  }
}
.common-btn-container .right-col {
  width: 50%;
  display: flex;
  justify-content: flex-start;
  order: 1;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-btn-container .right-col {
    margin-top: 7.5px;
    width: 100%;
    order: 2;
    justify-content: center;
  }
}
.common-btn-container.enrol-form {
  margin-top: 45px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-btn-container.enrol-form {
    margin-top: 35px;
  }
}

.view-icon-col {
  text-align: center;
  font-size: 0px;
}

.enrol-login-section .col-box {
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px), (min-width: 768px) and (max-width: 991px) {
  .enrol-login-section .col-box {
    margin-bottom: 70px;
  }
}
.enrol-login-section .login-box1 {
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url(../../img/common/bubble1.png);
  display: flex;
  justify-content: center;
  width: 450px;
  max-width: 100%;
}
.enrol-login-section .login-box2 {
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  background-image: url(../../img/common/bubble2.png);
  display: flex;
  justify-content: center;
  width: 450px;
}
.enrol-login-section .login-box {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  text-align: center;
}
.enrol-login-section .login-box .login-wrapper {
  padding-top: 17.7%;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .enrol-login-section .login-box .login-wrapper .login-title {
    font-size: 22px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .enrol-login-section .login-box .login-wrapper .login-title {
    font-size: 18px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .enrol-login-section .login-box .login-wrapper .login-title {
    font-size: 20px;
  }
}
.enrol-login-section .login-box .login-wrapper .login-detail {
  margin-top: 15px;
}
.enrol-login-section .login-box .login-wrapper .btn-container {
  margin-top: 25px;
}

.float-label {
  margin-top: 5px;
  margin-bottom: 5px;
}

.margin-bottom-1em {
  margin-bottom: 1em;
}

@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .margin-bottom-1em-mobile {
    margin-bottom: 1em;
  }
}

@media (max-width: 575px) {
  .margin-bottom-1em-xs {
    margin-bottom: 1em;
  }
}

textarea::-moz-placeholder {
  color: rgb(163, 163, 163) !important;
}

textarea::placeholder {
  color: rgb(163, 163, 163) !important;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  textarea::-moz-placeholder {
    font-size: 15px;
  }
  textarea::placeholder {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  textarea::-moz-placeholder {
    font-size: 15px;
  }
  textarea::placeholder {
    font-size: 15px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  textarea::-moz-placeholder {
    font-size: 15px;
  }
  textarea::placeholder {
    font-size: 15px;
  }
}

input::-moz-placeholder {
  color: rgb(163, 163, 163) !important;
}

input::placeholder {
  color: rgb(163, 163, 163) !important;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  input::-moz-placeholder {
    font-size: 15px;
  }
  input::placeholder {
    font-size: 15px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  input::-moz-placeholder {
    font-size: 15px;
  }
  input::placeholder {
    font-size: 15px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  input::-moz-placeholder {
    font-size: 15px;
  }
  input::placeholder {
    font-size: 15px;
  }
}

.common-single-btn-container {
  display: flex;
  justify-content: flex-end;
  margin-top: 35px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-single-btn-container {
    justify-content: center;
  }
}

.popup-agree-contact .custom-control-label::before {
  top: 0.1rem;
}
.popup-agree-contact .custom-control-label::after {
  top: 0.1rem;
}

.md-sm-xs-show {
  display: none;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .md-sm-xs-show {
    display: block;
  }
}

.show-xs-sm {
  display: none;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .show-xs-sm {
    display: block;
  }
}

.material-group-mobile-col-box {
  margin-bottom: 55px;
}

.material-group-mobile-table {
  margin-bottom: -55px;
}

.common-no-result {
  margin-top: 60px;
  margin-bottom: 60px;
  text-align: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .common-no-result {
    font-size: 24px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .common-no-result {
    font-size: 20px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-no-result {
    font-size: 22px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .common-no-result {
    margin-top: 40px;
    margin-bottom: 40px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .common-no-result {
    margin-top: 35px;
    margin-bottom: 35px;
  }
}

.webinar-enrolment-form-title {
  color: #3CC1C8;
  line-height: 1.2em;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 1.3em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .webinar-enrolment-form-title {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .webinar-enrolment-form-title {
    font-size: 30px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .webinar-enrolment-form-title {
    font-size: 28px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .webinar-enrolment-form-title {
    margin-bottom: 28px;
  }
}

.form-btn-container {
  display: flex;
  justify-content: flex-end;
  margin-top: 35px;
}
@media (max-width: 575px) {
  .form-btn-container {
    justify-content: center;
  }
}

.fancybox-close {
  background: #fff;
  background: rgba(255, 255, 255, 0.6);
  background-image: url(../../vendor/lightboxed/controls.png) !important;
  background-repeat: no-repeat;
  background-size: auto 100% !important;
  background-position: 100%;
  width: 30px !important;
  height: 30px !important;
  border-radius: 100%;
  cursor: pointer;
  position: fixed !important;
  top: 10px !important;
  right: 27px !important;
}

.fancybox-media .fancybox-skin .fancybox-outer .fancybox-nav.fancybox-next span {
  transform: rotate(0deg) !important;
  background: #fff;
  background: rgba(255, 255, 255, 0.6);
  background-image: url(../../vendor/lightboxed/controls.png) !important;
  background-repeat: no-repeat;
  background-size: auto 100%;
  background-position: 50%;
  width: 30px !important;
  height: 30px !important;
  border-radius: 100%;
  cursor: pointer;
  border-top: 0px solid #ffffff !important;
  border-right: 0px solid #ffffff !important;
  right: 0px !important;
  left: unset !important;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .fancybox-media .fancybox-skin .fancybox-outer .fancybox-nav.fancybox-next span {
    right: 15px !important;
  }
}

.fancybox-media .fancybox-skin .fancybox-outer .fancybox-nav.fancybox-prev span {
  transform: rotate(0deg) !important;
  background: #fff;
  background: rgba(255, 255, 255, 0.6);
  background-image: url(../../vendor/lightboxed/controls.png) !important;
  background-repeat: no-repeat;
  background-size: auto 100%;
  background-position: 0%;
  width: 30px !important;
  height: 30px !important;
  border-radius: 100%;
  cursor: pointer;
  border-top: 0px solid #ffffff !important;
  border-right: 0px solid #ffffff !important;
  left: 0px !important;
  right: unset !important;
  margin-left: 0px !important;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .fancybox-media .fancybox-skin .fancybox-outer .fancybox-nav.fancybox-prev span {
    left: 15px !important;
  }
}

.map .fancybox-close {
  top: -17px !important;
  right: -17px !important;
  background-image: url("../../img/common/system/fancybox_close.png") !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  width: 32px !important;
  height: 32px !important;
  position: absolute !important;
}
.map .fancybox-overlay {
  background: rgba(242, 247, 247, 0.8) !important;
}
.map .fancybox-opened .fancybox-skin {
  box-shadow: none;
}
.map .fancybox-skin {
  background-color: transparent;
}
.map .popup-building .content {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
.map .popup-building .content .left-col {
  width: 33.3%;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
  .map .popup-building .content .left-col {
    width: 100%;
  }
}
.map .popup-building .content .left-col img {
  width: 175px;
  max-width: 100%;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .map .popup-building .content .left-col img {
    width: 150px;
  }
}
.map .popup-building .content .right-col {
  width: 66.6%;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px), (min-width: 768px) and (max-width: 991px) {
  .map .popup-building .content .right-col {
    width: 100%;
    margin-top: 35px;
  }
}
.map .popup-building .content .right-col .box {
  width: 100%;
  border: 10px solid #7accda;
  background-color: #FFFFFF;
  padding: 30px;
  padding-left: 32px;
  padding-right: 32px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .map .popup-building .content .right-col .box {
    padding: 20px;
  }
}
.map .popup-building .content .right-col .box .box-title {
  color: #258dcf;
  font-weight: 600;
  display: flex;
  align-items: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .map .popup-building .content .right-col .box .box-title {
    font-size: 36px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .map .popup-building .content .right-col .box .box-title {
    font-size: 32px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .map .popup-building .content .right-col .box .box-title {
    font-size: 25px;
  }
}
.map .popup-building .content .right-col .box .box-title img {
  width: 60px;
  margin-right: 17px;
}
.map .popup-building .content .right-col .box .box-content {
  margin-top: 20px;
  color: #353636;
  font-weight: 300;
  line-height: 1.75;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .map .popup-building .content .right-col .box .box-content {
    font-size: 16px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .map .popup-building .content .right-col .box .box-content {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .map .popup-building .content .right-col .box .box-content {
    font-size: 16px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .map .popup-building .content .right-col .box .box-content {
    margin-top: 15px;
  }
}

.about-stem-4-type .about-icon-list {
  position: relative;
  height: 607px;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-stem-4-type .about-icon-list {
    height: 202px;
  }
}
.about-stem-4-type .about-icon-list .list-item {
  display: inline-block;
  width: 208px;
  height: 183px;
  margin-left: -104px;
  margin-top: -91px;
  position: absolute;
  z-index: 0;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-stem-4-type .about-icon-list .list-item {
    width: 104px;
    height: 91px;
    margin-left: -52px;
    margin-top: -45px;
  }
}
.about-stem-4-type .about-icon-list .list-item.item1 {
  left: 87.7%;
  top: 76.7%;
  background-image: url("../../img/common/stem_homepage/icon1.png");
}
.about-stem-4-type .about-icon-list .list-item.item2 {
  left: 23.6%;
  top: 85.3%;
  background-image: url("../../img/common/stem_homepage/icon2.png");
}
.about-stem-4-type .about-icon-list .list-item.item3 {
  left: 16%;
  top: 23.8%;
  background-image: url("../../img/common/stem_homepage/icon3.png");
}
.about-stem-4-type .about-icon-list .list-item.item4 {
  left: 79%;
  top: 15.6%;
  background-image: url("../../img/common/stem_homepage/icon4.png");
}
.about-stem-4-type .about-icon-list .list-item.item5 {
  left: 16%;
  top: 23.8%;
  background-image: url("../../img/common/stem_homepage/icon5.png");
}
.about-stem-4-type .about-icon-list .list-item .icon-inner-wrapper {
  width: 90%;
  height: 100%;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
}
.about-stem-4-type .about-icon-list .list-item.active {
  z-index: 1;
  width: 497px;
  height: 444px;
  margin-left: -248px;
  margin-top: -222px;
  left: 54.8%;
  top: 54.3%;
  pointer-events: none;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .about-stem-4-type .about-icon-list .list-item.active {
    width: 331px;
    height: 296px;
    margin-left: -165px;
    margin-top: -148px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-stem-4-type .about-icon-list .list-item.active {
    width: 165px;
    height: 148px;
    margin-left: -82px;
    margin-top: -74px;
  }
}
.about-stem-4-type .about-icon-list .list-item.effect {
  -webkit-transform: translateY(-4px);
  -moz-transform: translateY(-4px);
  -ms-transform: translateY(-4px);
  -o-transform: translateY(-4px);
  z-index: 3;
}
.about-stem-4-type .about-icon-swiper {
  margin-top: 180px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .about-stem-4-type .about-icon-swiper {
    margin-top: 90px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-stem-4-type .about-icon-swiper {
    margin-top: 45px;
  }
}
.about-stem-4-type .about-icon-swiper .swiper-item .item-title {
  font-weight: 700;
  margin-bottom: 15px;
  text-transform: uppercase;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .about-stem-4-type .about-icon-swiper .swiper-item .item-title {
    font-size: 36px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .about-stem-4-type .about-icon-swiper .swiper-item .item-title {
    font-size: 32px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-stem-4-type .about-icon-swiper .swiper-item .item-title {
    font-size: 28px;
  }
}
.about-stem-4-type .about-icon-swiper .swiper-item .item-title.style1 {
  color: #75cedb;
}
.about-stem-4-type .about-icon-swiper .swiper-item .item-title.style2 {
  color: #2093cd;
}
.about-stem-4-type .about-icon-swiper .swiper-item .item-title.style3 {
  color: #f8b500;
}
.about-stem-4-type .about-icon-swiper .swiper-item .item-title.style4 {
  color: #00b8bf;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .about-stem-4-type .about-icon-swiper .swiper-item .item-detail {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .about-stem-4-type .about-icon-swiper .swiper-item .item-detail {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-stem-4-type .about-icon-swiper .swiper-item .item-detail {
    font-size: 16px;
  }
}
.about-stem-4-type .about-icon-swiper-control {
  position: relative;
  padding: 40px 150px 40px 50px;
  margin-top: 60px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .about-stem-4-type .about-icon-swiper-control {
    margin-top: 30px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-stem-4-type .about-icon-swiper-control {
    margin-top: 15px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-stem-4-type .about-icon-swiper-control {
    padding: 15px 60px;
  }
}
.about-stem-4-type .swiper-pagination {
  position: relative;
  height: 9px;
}
.about-stem-4-type .swiper-pagination.swiper-pagination-progressbar {
  background-color: red;
}
.about-stem-4-type .swiper-pagination .swiper-pagination-progressbar-fill {
  background-color: blue;
}
.about-stem-4-type .swiper-button-next,
.about-stem-4-type .swiper-button-prev {
  width: 60px;
  height: 54px;
  outline: 0;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .about-stem-4-type .swiper-button-next,
.about-stem-4-type .swiper-button-prev {
    width: 40px;
    height: 36px;
    top: 50%;
    margin-top: -18px;
  }
}
.about-stem-4-type .swiper-button-next {
  background-image: url("../../img/common/stem_homepage/next.png");
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .about-stem-4-type .swiper-button-next {
    right: 15px;
    top: 55px;
  }
}
.about-stem-4-type .swiper-button-next:after {
  display: none;
}
.about-stem-4-type .swiper-button-prev {
  background-image: url("../../img/common/stem_homepage/prev.png");
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .about-stem-4-type .swiper-button-prev {
    left: inherit;
    top: 10px;
    right: 65px;
  }
}
.about-stem-4-type .swiper-button-prev:after {
  display: none;
}

@media (min-width: 1550px) {
  .challenge-cup-2023 .container {
    max-width: 1230px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-banner {
  padding-top: 50px;
  padding-bottom: 70px;
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: top center;
  background-image: url("../../img/common/challenge_cup_2023/bg1.jpg");
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-banner {
    background-image: none;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-banner {
    padding-bottom: 60px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-banner {
    padding-bottom: 35px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-banner img {
  width: 100%;
  max-width: 100%;
}
.challenge-cup-2023 .challenge-cup-2023-section1 {
  padding-top: 110px;
  padding-bottom: 110px;
  background-repeat: no-repeat;
  background-position: top center;
  background-image: url("../../img/common/challenge_cup_2023/bg2.jpg");
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section1 {
    background-image: none;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section1 {
    padding-top: 90px;
    padding-bottom: 90px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section1 {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}
@media (min-width: 1550px) {
  .challenge-cup-2023 .challenge-cup-2023-section1 .container {
    max-width: 1080px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section1 .rainbow-seperator .pink, .challenge-cup-2023 .challenge-cup-2023-section1 .rainbow-seperator .blue, .challenge-cup-2023 .challenge-cup-2023-section1 .rainbow-seperator .green, .challenge-cup-2023 .challenge-cup-2023-section1 .rainbow-seperator .orange {
  height: 7px;
  width: 100%;
}
.challenge-cup-2023 .challenge-cup-2023-section1 .rainbow-seperator .pink {
  background-color: #EA5297;
}
.challenge-cup-2023 .challenge-cup-2023-section1 .rainbow-seperator .blue {
  background-color: #0090D7;
}
.challenge-cup-2023 .challenge-cup-2023-section1 .rainbow-seperator .orange {
  background-color: #F9B000;
}
.challenge-cup-2023 .challenge-cup-2023-section1 .rainbow-seperator .green {
  background-color: #BCCF00;
}
.challenge-cup-2023 .challenge-cup-2023-section1 .challenge-cup-2023-section-title {
  margin-bottom: 35px;
}
.challenge-cup-2023 .challenge-cup-2023-section1 .content {
  margin-top: 45px;
  text-align: center;
  max-width: 1020px;
  margin-left: auto;
  margin-right: auto;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section1 .content {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section1 .content {
    font-size: 18px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section1 .content {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section1 .content {
    margin-top: 35px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section1 .content {
    margin-top: 25px;
  }
}
.challenge-cup-2023 .bg3 {
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 100%;
  background-image: url("../../img/common/challenge_cup_2023/bg3.jpg");
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .bg3 {
    background-image: none;
  }
}
.challenge-cup-2023 .common-padding-cup-2023 {
  padding-top: 100px;
  padding-bottom: 100px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .common-padding-cup-2023 {
    padding-top: 80px;
    padding-bottom: 80px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .common-padding-cup-2023 {
    padding-top: 60px;
    padding-bottom: 60px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section2 .row {
  margin-left: -23px;
  margin-right: -23px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .row {
    margin-left: -15px;
    margin-right: -15px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section2 .col-box {
  padding-left: 23px;
  padding-right: 23px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .col-box {
    padding-left: 15px;
    padding-right: 15px;
  }
  .challenge-cup-2023 .challenge-cup-2023-section2 .col-box:first-child {
    margin-bottom: 25px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .top-col {
  padding-top: 50px;
  padding-left: 15px;
  padding-right: 15px;
  padding-bottom: 30px;
  background-color: #F8F8F8;
}
.challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .top-col .img {
  text-align: center;
}
.challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .top-col .img img {
  height: 210px;
  margin-bottom: 40px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .top-col .img img {
    height: 150px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .top-col .img img {
    height: 150px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .top-col .desc {
  margin-top: 5px;
  text-align: center;
  color: #464646;
  font-weight: 800;
  line-height: 1.25em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .top-col .desc {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .top-col .desc {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .top-col .desc {
    font-size: 22px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .bottom-col {
  padding: 43px 15px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .bottom-col {
    padding: 25px 15px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .bottom-col.green {
  background-color: #32B5BD;
}
.challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .bottom-col.orange {
  background-color: #F9B000;
}
.challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .bottom-col .join-us-now-btn {
  position: relative;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  display: inline-block;
  padding: 14px 15px;
  min-width: 315px;
  text-align: center;
  color: #212121;
  font-weight: 600;
  text-decoration: none;
  background-color: #FFFFFF;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .bottom-col .join-us-now-btn {
    font-size: 22px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .bottom-col .join-us-now-btn {
    font-size: 18px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .bottom-col .join-us-now-btn {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .bottom-col .join-us-now-btn {
    min-width: 250px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section2 .col-box .box .bottom-col .join-us-now-btn:hover {
  top: -5px;
}
.challenge-cup-2023 .challenge-cup-2023-section2 .content {
  margin-top: 78px;
  max-width: 1000px;
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  font-weight: 500;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .content {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .content {
    font-size: 18px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .content {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .content {
    margin-top: 45px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .content {
    margin-top: 45px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section2 .content li {
  margin-bottom: 30px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .content li {
    margin-bottom: 25px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section2 .content li {
    margin-bottom: 20px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section2 .content li:last-child {
  margin-bottom: 0px;
}
.challenge-cup-2023 .challenge-cup-2023-section2 .content ul {
  margin-bottom: 0px;
  list-style: none;
}
.challenge-cup-2023 .challenge-cup-2023-section2 .content li {
  position: relative;
}
.challenge-cup-2023 .challenge-cup-2023-section2 .content ul li::before {
  position: absolute;
  top: 9px;
  left: -25px;
  content: "";
  font-size: 20px;
  font-weight: bold;
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background-color: #F8B41E;
}
.challenge-cup-2023 .challenge-cup-2023-section3 .challenge-cup-2023-section-title {
  margin-bottom: 80px;
}
.challenge-cup-2023 .challenge-cup-2023-section3 .desktop-img {
  width: 100%;
  max-width: 100%;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section3 .desktop-img {
    display: none;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section3 .mobile-img {
  width: 100%;
  max-width: 100%;
  display: none;
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section3 .mobile-img {
    display: block;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section4 .challenge-cup-2023-section-title {
  margin-bottom: 60px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .challenge-cup-2023-section-title {
    margin-bottom: 35px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row {
  margin-left: -7.5px;
  margin-right: -7.5px;
}
@media (min-width: 768px) and (max-width: 991px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row {
    margin-left: -15px;
    margin-right: -15px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box {
  padding-left: 7.5px;
  padding-right: 7.5px;
}
@media (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box:first-child {
    margin-bottom: 25px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box:first-child {
    margin-bottom: 15px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box {
    padding-left: 15px;
    padding-right: 15px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box {
  display: flex;
  flex-wrap: wrap;
  align-content: flex-start;
  height: 100%;
  background-color: #F8F8F8;
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .top-col {
  width: 100%;
  padding: 15px 15px;
  text-align: center;
  color: #FFFFFF;
  font-weight: 600;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .top-col {
    font-size: 23px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .top-col {
    font-size: 23px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .top-col {
    font-size: 21px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .top-col.green {
  background-color: #BCCF00;
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .top-col.pink {
  background-color: #EA5297;
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col {
  color: #121212;
  width: 100%;
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col .bottom-col-top-col, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col .bottom-col-bottom-col {
  padding: 50px 55px;
  line-height: 1.7em;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col .bottom-col-top-col, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col .bottom-col-bottom-col {
    padding: 40px 45px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col .bottom-col-top-col, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col .bottom-col-bottom-col {
    padding: 25px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col .bottom-col-top-col {
  background-color: #F4F4F4;
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col .bottom-col-bottom-col {
  background-color: #F8F8F8;
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col {
  display: flex;
  flex-wrap: wrap;
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .left-col, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .left-col {
  width: 108px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .left-col, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .left-col {
    width: 100%;
    text-align: center;
    margin-bottom: 28px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .left-col img, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .left-col img {
  width: 100%;
  max-width: 100%;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .left-col img, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .left-col img {
    width: unset;
    height: 100px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .left-col .img-desc, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .left-col .img-desc {
  text-align: center;
  margin-top: 15px;
  font-weight: 800;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .left-col .img-desc, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .left-col .img-desc {
    font-size: 22px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .left-col .img-desc, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .left-col .img-desc {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .left-col .img-desc, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .left-col .img-desc {
    font-size: 20px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .right-col {
  width: calc(100% - 108px);
  padding-left: 42px;
  font-weight: 500;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .right-col {
    font-size: 17px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .right-col {
    font-size: 17px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .right-col {
    font-size: 16px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .right-col {
    padding-left: 0px;
    width: 100%;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col .p-header, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .right-col .p-header {
  font-weight: 800;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col .p-header, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .right-col .p-header {
    font-size: 22px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col .p-header, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .right-col .p-header {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col .p-header, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .right-col .p-header {
    font-size: 22px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col .p-header, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .right-col .p-header {
    text-align: center;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col p, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .right-col p {
  margin-bottom: 20px;
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col p:last-child, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .right-col p:last-child {
  margin-bottom: 0px;
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col ol, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .right-col ol {
  list-style-type: none;
  counter-reset: elementcounter;
  padding-left: 0;
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col li:before, .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-bottom-col .right-col li:before {
  content: counter(elementcounter) ") ";
  counter-increment: elementcounter;
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col {
  display: flex;
  align-items: center;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round1 .bottom-col-top-col .right-col {
    text-align: center;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round2 .bottom-col-bottom-col .img-container {
  margin-bottom: 25px;
  text-align: center;
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round2 .bottom-col-bottom-col .img-container img {
  height: 101.5px;
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round2 .bottom-col-bottom-col .img-title {
  font-weight: 600;
  text-align: center;
  margin-bottom: 30px;
  line-height: 1.5em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round2 .bottom-col-bottom-col .img-title {
    font-size: 22px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round2 .bottom-col-bottom-col .img-title {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round2 .bottom-col-bottom-col .img-title {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round2 .bottom-col-bottom-col .img-title br {
    display: none;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round2 .bottom-col-bottom-col p {
  margin-bottom: 30px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round2 .bottom-col-bottom-col p {
    font-size: 17px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round2 .bottom-col-bottom-col p {
    font-size: 17px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round2 .bottom-col-bottom-col p {
    font-size: 16px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round2 .bottom-col-bottom-col p span {
  font-weight: 600;
}
.challenge-cup-2023 .challenge-cup-2023-section4 .row .col-box .box .bottom-col.round2 .bottom-col-bottom-col p:last-child {
  margin-bottom: 0px;
}
.challenge-cup-2023 .challenge-cup-2023-section4 .remark-box {
  margin-top: 15px;
  background-color: #3CC1C8;
  padding: 40px 15px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .remark-box {
    padding: 30px 15px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .remark-box {
    padding: 15px 15px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section4 .remark-box div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 970px;
  color: #FFFFFF;
  text-align: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .remark-box div {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .remark-box div {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section4 .remark-box div {
    font-size: 16px;
  }
}
@media (min-width: 1550px) {
  .challenge-cup-2023 .challenge-cup-2023-section5 .container {
    max-width: 1120px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section5 .box .pink-bar, .challenge-cup-2023 .challenge-cup-2023-section5 .box .blue-bar, .challenge-cup-2023 .challenge-cup-2023-section5 .box .green-bar, .challenge-cup-2023 .challenge-cup-2023-section5 .box .orange-bar {
  height: 7px;
  width: 100%;
}
.challenge-cup-2023 .challenge-cup-2023-section5 .box .pink-bar {
  background-color: #EA5297;
}
.challenge-cup-2023 .challenge-cup-2023-section5 .box .blue-bar {
  background-color: #0090D7;
}
.challenge-cup-2023 .challenge-cup-2023-section5 .box .orange-bar {
  background-color: #F9B000;
}
.challenge-cup-2023 .challenge-cup-2023-section5 .box .green-bar {
  background-color: #BCCF00;
}
.challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col {
  display: flex;
  flex-wrap: wrap;
}
.challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .left-col {
  width: 300px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #EFEFEF;
  padding: 15px;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .left-col {
    width: 200px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .left-col {
    width: 100%;
    padding: 20px 15px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .left-col img {
  width: 200px;
  max-width: 100%;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .left-col img {
    width: 115px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .left-col img {
    width: 100px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .right-col {
  width: calc(100% - 300px);
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .right-col {
    width: calc(100% - 200px);
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .right-col {
    width: 100%;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .right-col .line {
  display: flex;
  flex-wrap: wrap;
}
.challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .right-col .line .inner-left-col {
  width: calc(100% - 230px);
  padding-top: 18px;
  padding-bottom: 18px;
  padding-left: 35px;
  padding-right: 35px;
  display: flex;
  align-items: center;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .right-col .line .inner-left-col {
    width: calc(100% - 150px);
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .right-col .line .inner-left-col {
    width: calc(100% - 105px);
    padding-left: 15px;
    padding-right: 15px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .right-col .line .inner-right-col {
  width: 230px;
  padding-top: 18px;
  padding-bottom: 18px;
  padding-left: 35px;
  padding-right: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .right-col .line .inner-right-col {
    width: 150px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .right-col .line .inner-right-col {
    width: 105px;
    padding-left: 15px;
    padding-right: 15px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .line {
  font-weight: 600;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .line {
    font-size: 23px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .line {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .line {
    font-size: 18px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .line:nth-child(odd) .inner-left-col, .challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .line:nth-child(odd) .inner-right-col {
  background-color: #F8F8F8;
}
.challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .line:nth-child(even) .inner-left-col, .challenge-cup-2023 .challenge-cup-2023-section5 .box .content-col .line:nth-child(even) .inner-right-col {
  background-color: #FFFFFF;
}
.challenge-cup-2023 .challenge-cup-2023-section6 .challenge-cup-2023-section-title {
  margin-bottom: 100px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .challenge-cup-2023-section-title {
    margin-bottom: 60px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section6 .img-container {
  display: flex;
  flex-wrap: wrap;
}
.challenge-cup-2023 .challenge-cup-2023-section6 .img-container .left-col, .challenge-cup-2023 .challenge-cup-2023-section6 .img-container .right-col {
  width: 50%;
  text-align: center;
  padding-bottom: 65px;
}
.challenge-cup-2023 .challenge-cup-2023-section6 .img-container .left-col img, .challenge-cup-2023 .challenge-cup-2023-section6 .img-container .right-col img {
  height: 250px;
  max-width: 100%;
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .img-container .left-col img, .challenge-cup-2023 .challenge-cup-2023-section6 .img-container .right-col img {
    height: 160px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .img-container .left-col img, .challenge-cup-2023 .challenge-cup-2023-section6 .img-container .right-col img {
    height: 100px;
  }
}
@media (min-width: 768px) and (max-width: 991px), (min-width: 992px) and (max-width: 1199px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .img-container .left-col, .challenge-cup-2023 .challenge-cup-2023-section6 .img-container .right-col {
    padding-bottom: 55px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .img-container .left-col, .challenge-cup-2023 .challenge-cup-2023-section6 .img-container .right-col {
    padding-bottom: 25px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section6 .box-header {
  display: flex;
  flex-wrap: wrap;
}
.challenge-cup-2023 .challenge-cup-2023-section6 .box-header .left-col, .challenge-cup-2023 .challenge-cup-2023-section6 .box-header .right-col {
  padding: 15px 15px;
  text-align: center;
  color: #FFFFFF;
  font-weight: 600;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .box-header .left-col, .challenge-cup-2023 .challenge-cup-2023-section6 .box-header .right-col {
    font-size: 23px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .box-header .left-col, .challenge-cup-2023 .challenge-cup-2023-section6 .box-header .right-col {
    font-size: 21px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .box-header .left-col, .challenge-cup-2023 .challenge-cup-2023-section6 .box-header .right-col {
    font-size: 18px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section6 .box-header .left-col {
  width: 50%;
  background-color: #BCCF00;
}
.challenge-cup-2023 .challenge-cup-2023-section6 .box-header .right-col {
  width: 50%;
  background-color: #EA5297;
}
.challenge-cup-2023 .challenge-cup-2023-section6 .box .line {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.challenge-cup-2023 .challenge-cup-2023-section6 .box .line:nth-child(odd) .left-col, .challenge-cup-2023 .challenge-cup-2023-section6 .box .line:nth-child(odd) .right-col {
  background-color: #FFFFFF;
}
.challenge-cup-2023 .challenge-cup-2023-section6 .box .line:nth-child(even) .left-col, .challenge-cup-2023 .challenge-cup-2023-section6 .box .line:nth-child(even) .right-col {
  background-color: #F8F8F8;
}
.challenge-cup-2023 .challenge-cup-2023-section6 .box .left-col, .challenge-cup-2023 .challenge-cup-2023-section6 .box .right-col {
  padding: 17px 15px;
  text-align: center;
  color: #212121;
  font-weight: 600;
  padding-left: 35px;
  padding-right: 15px;
  display: flex;
  align-items: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .box .left-col, .challenge-cup-2023 .challenge-cup-2023-section6 .box .right-col {
    font-size: 23px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .box .left-col, .challenge-cup-2023 .challenge-cup-2023-section6 .box .right-col {
    font-size: 22px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .box .left-col, .challenge-cup-2023 .challenge-cup-2023-section6 .box .right-col {
    font-size: 18px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .box .left-col, .challenge-cup-2023 .challenge-cup-2023-section6 .box .right-col {
    padding-left: 15px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section6 .box .left-col {
  width: 50%;
  text-align: left;
}
.challenge-cup-2023 .challenge-cup-2023-section6 .box .right-col {
  width: 50%;
  text-align: center;
  justify-content: center;
}
.challenge-cup-2023 .challenge-cup-2023-section6 .remark-box {
  margin-top: 15px;
  background-color: #3CC1C8;
  padding: 40px 15px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .remark-box {
    padding: 30px 15px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .remark-box {
    padding: 15px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section6 .remark-box div {
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  max-width: 970px;
  color: #FFFFFF;
  text-align: center;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .remark-box div {
    font-size: 18px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .remark-box div {
    font-size: 16px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section6 .remark-box div {
    font-size: 16px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section7 .challenge-cup-2023-section-title {
  margin-bottom: 75px;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section7 .challenge-cup-2023-section-title {
    margin-bottom: 50px;
  }
}
@media (min-width: 1550px) {
  .challenge-cup-2023 .challenge-cup-2023-section7 .container {
    max-width: 850px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section7 .box {
  display: flex;
  flex-wrap: wrap;
}
.challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col, .challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col {
  width: 50%;
  display: flex;
  flex-wrap: wrap;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col, .challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col {
    width: 100%;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col .box-left-col, .challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col .box-left-col {
  width: 68px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col .box-left-col, .challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col .box-left-col {
    width: 55px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col .box-left-col, .challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col .box-left-col {
    width: 45px;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col .box-left-col img, .challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col .box-left-col img {
  width: 100%;
  max-width: 100%;
}
.challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col .box-right-col, .challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col .box-right-col {
  width: calc(100% - 68px);
  padding-left: 30px;
  display: flex;
  align-items: center;
  font-weight: 600;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col .box-right-col, .challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col .box-right-col {
    font-size: 28px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col .box-right-col, .challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col .box-right-col {
    font-size: 24px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col .box-right-col, .challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col .box-right-col {
    font-size: 20px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col .box-right-col, .challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col .box-right-col {
    width: calc(100% - 55px);
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col .box-right-col, .challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col .box-right-col {
    width: unset;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col .box-right-col a, .challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col .box-right-col a {
  text-decoration: none;
  color: #212121;
}
.challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col {
  padding-right: 70px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col {
    padding-right: 30px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section7 .box .left-col {
    padding-right: 0px;
    margin-bottom: 30px;
    justify-content: center;
  }
}
.challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col {
  padding-left: 70px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col {
    padding-left: 30px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023 .challenge-cup-2023-section7 .box .right-col {
    padding-left: 0px;
    justify-content: center;
  }
}

.challenge-cup-2023-section-title {
  text-align: center;
  color: #464646;
  font-weight: 800;
  margin-bottom: 65px;
  line-height: 1.2em;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023-section-title {
    font-size: 53px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023-section-title {
    font-size: 45px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023-section-title {
    font-size: 30px;
  }
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023-section-title {
    margin-bottom: 35px;
  }
}
.challenge-cup-2023-section-title .line1 {
  display: flex;
  justify-content: center;
}
.challenge-cup-2023-section-title .line1 .content-container {
  padding-left: 80px;
  padding-right: 80px;
  position: relative;
}
.challenge-cup-2023-section-title .line1 .content-container .stem-s {
  color: #EA5297;
}
.challenge-cup-2023-section-title .line1 .content-container .stem-t {
  color: #0090D7;
}
.challenge-cup-2023-section-title .line1 .content-container .stem-e {
  color: #F9B000;
}
.challenge-cup-2023-section-title .line1 .content-container .stem-m {
  color: #BCCF00;
}
.challenge-cup-2023-section-title .line1 .content-container:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 62px;
  height: 11px;
  background-image: url("../../img/common/challenge_cup_2023/title_left.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.challenge-cup-2023-section-title .line1 .content-container:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  transform: translateY(-50%);
  width: 62px;
  height: 11px;
  background-image: url("../../img/common/challenge_cup_2023/title_right.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023-section-title .line1 .content-container:after {
    width: 53px;
    height: 10px;
  }
}
.challenge-cup-2023-section-title .line3 {
  color: #F9B000;
  margin-top: 15px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .challenge-cup-2023-section-title .line3 {
    font-size: 48px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .challenge-cup-2023-section-title .line3 {
    font-size: 35px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .challenge-cup-2023-section-title .line3 {
    font-size: 22px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px), (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .challenge-cup-2023-section-title .line3 {
    margin-top: 10px;
  }
}

@media (min-width: 576px) and (max-width: 767px), (max-width: 575px), (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .show-xl-xxl {
    display: none !important;
  }
}

.tc .course-header-bar .right-col, .sc .course-header-bar .right-col {
  width: 335px;
}
.tc .course-header-bar .left-col, .sc .course-header-bar .left-col {
  width: calc(100% - 335px);
}
.tc .course-header-bar .right-col .course-header-btn .btn-container, .sc .course-header-bar .right-col .course-header-btn .btn-container {
  max-width: 100px;
}
.tc .course-header-bar .right-col .course-header-btn, .sc .course-header-bar .right-col .course-header-btn {
  margin-left: 15px;
}

.checkbox-group .form-control {
  background-color: transparent;
  border: 0px;
}
.visit-form-section .user-title {
  color: #3CC1C8;
  line-height: 1.2em;
  font-weight: 700;
  text-transform: uppercase;
  margin-bottom: 25px;
  margin-top: 25px;
}
@media (min-width: 1550px), (min-width: 1200px) and (max-width: 1549px) {
  .visit-form-section .user-title {
    font-size: 30px;
  }
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .visit-form-section .user-title {
    font-size: 30px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .visit-form-section .user-title {
    font-size: 28px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .visit-form-section .user-title {
    margin-bottom: 25px;
  }
}
.visit-form-section form {
  background-color: #F8F8F8;
  padding: 45px 55px;
}
@media (min-width: 992px) and (max-width: 1199px), (min-width: 768px) and (max-width: 991px) {
  .visit-form-section form {
    padding: 40px 30px;
  }
}
@media (min-width: 576px) and (max-width: 767px), (max-width: 575px) {
  .visit-form-section form {
    padding: 30px 15px;
  }
}
.visit-form-section .custom-control-label::before {
  top: calc(0.25rem - 2px);
}
.visit-form-section .custom-control-label::after {
  top: calc(0.25rem - 2px);
}

.visit-form-section input.form-control:-moz-read-only, .visit-form-section textarea.form-control:-moz-read-only {
  background-color: #FFFFFF !important;
}

.visit-form-section input.form-control:read-only, .visit-form-section textarea.form-control:read-only {
  background-color: #FFFFFF !important;
}

.to-top {
  width: 40px;
  height: 40px;
  position: fixed;
  right: 25px;
  bottom: 45px;
  cursor: pointer;
  opacity: 0;
  pointer-events: none;
  z-index: 2;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #258DCF;
  border: 1px solid #258DCF;
  color: #FFFFFF;
  font-size: 20px;
  -webkit-transition: 0.3s all;
  -moz-transition: 0.3s all;
  -ms-transition: 0.3s all;
  -o-transition: 0.3s all;
}
@media (max-width: 575px), (min-width: 576px) and (max-width: 767px) {
  .to-top {
    bottom: 25px;
    right: 15px;
  }
}
.to-top.active {
  cursor: pointer;
  opacity: 1;
  pointer-events: auto;
}
.to-top:hover {
  background-color: #FFFFFF;
  color: #258DCF;
}

body.map.tc .building1 .partner, body.map.tc .building2 .partner, body.map.tc .building3 .partner, body.map.tc .building4 .partner, body.map.tc .building5 .partner, body.map.tc .building7 .partner, body.map.tc .building8 .partner, body.map.tc .building10 .partner, body.map.tc .building11 .partner, body.map.tc .building12 .partner, body.map.tc .building13 .partner, body.map.sc .building1 .partner, body.map.sc .building2 .partner, body.map.sc .building3 .partner, body.map.sc .building4 .partner, body.map.sc .building5 .partner, body.map.sc .building7 .partner, body.map.sc .building8 .partner, body.map.sc .building10 .partner, body.map.sc .building11 .partner, body.map.sc .building12 .partner, body.map.sc .building13 .partner {
  transform: translate(calc(-50% + 9px), -45px) !important;
}

@media (min-width: 1550px) {
  body.tc.stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item2 .item-title, body.sc.stem-events .steam-content-container .stem-at-vtc-icon-list.student-list .list-item.item2 .item-title {
    width: 50%;
    bottom: -26%;
    left: -130px;
  }
}
/*# sourceMappingURL=ui.css.map */

html[lang="sc"] body{
	font-family: 'ITC Avant Garde Gothic Std', "Noto Sans SC",'Microsoft JhengHei';
}