@charset "utf-8";
/* CSS Document */

html,body { 

   font-weight:300; font-size: 16px ;
  -webkit-text-size-adjust: 100%;
  -moz-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  background-color: #EDEDED;
}

:root { 
	--main-color:#1e3f67; /*深藍1*/
	--main2-color:#ed3242; /*紅色*/
	--main3-color:#969696; /*橙色*/
	--main4-color:#f5f9ff; /*淺色*/
	
	
}

.editingAdd{ position: absolute;top: -40px; }
#page .editingAdd{top: -20px;  right: 0;}
.view-header { margin: 0}
.home-add{ top: 35px !important; z-index: 2;}
#add_normal{ position: relative;top: 0; padding:10px; }

.editingAdd a{ background-color: #ffd800; padding:3px 15px ; border-radius:15px; color:#000;}
.editingAdd a:hover{ background-color: #cbff0f;color:#000;}

.view-content{ clear:both}

.swiper-slide .editing a{ display:block  !important;}
#banner_editing{ position:absolute; top:6px; left:45px; z-index:2 }
.editing{
  position: absolute;
  z-index: 2;
  top: 5px;
  left: 5px;
}
.editing a{ 
  /* Override the .focusable height: auto */
  width: 30px !important; font-size: 0 ;  border-radius: 50%;
  /* Override the .focusable height: auto */
  height: 30px !important;
	background-color: #ffd800;
  text-indent: -9999px;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16'%3e%3cg%3e%3cpath fill='%23000000' d='M14.545 3.042l-1.586-1.585c-.389-.389-1.025-.389-1.414 0l-1.293 1.293 3 3 1.293-1.293c.389-.389.389-1.026 0-1.415z'/%3e%3crect fill='%23000000' x='5.129' y='3.8' transform='matrix(-.707 -.707 .707 -.707 6.189 20.064)' width='4.243' height='9.899'/%3e%3cpath fill='%23000000' d='M.908 14.775c-.087.262.055.397.316.312l2.001-.667-1.65-1.646-.667 2.001z'/%3e%3c/g%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: 20px 20px ;
}
.editing a:hover{ background-color: #cbff0f;}
li .editing a{ display:none !important;}
li:hover .editing a{ display:block  !important;}
.slick-slide:hover .editing a{ display:block  !important;}

a:link { text-decoration: none;}

#main_content a:link {color: #00266e; text-decoration: none;}
#main_content a:hover {color: var(--main-color); ; text-decoration: underline; }

.clear{clear:both}
img {border:0;}
div, ul li{ margin:0px auto; padding:0px;}


#page-wrapper{ }
#page img{ max-width:100% }
#page { }

#page .term-tree-list { position: relative; margin-top:15px; }
#page .term-tree-list .term{ list-style:none; margin: 0; padding: 5px 0 5px 30px;}
#page .term-tree-list .term::before{ content: ""; position: absolute; left: 0; top: 12px; 	
	background-color: var(--main-color);
    -webkit-mask-image: url(../images/tag1.svg) ; 
    mask-image: url(../images/tag1.svg) ; 	
	background-size: cover; width: 20px; height: 26px; } 
#page .term-tree-list .selected { font-weight: normal; text-decoration: underline}
#Inner_Type_C li .right_desc a, #Inner_Type_C2 li .right_desc a { color:#fff }
#Inner_Type_C li .right_desc a:hover, #Inner_Type_C2 li .right_desc a:hover { color:var(--main-color); }


.screen{ position:relative; padding: 0 20px;  max-width: 1900px;  margin: 0 auto;}
.container{max-width:100%  }
.wide-content { width:auto; margin:0}

.breadcrumb{ position:relative;}

.node__content{font-size: 20px;
line-height: 40px;}

.node__content a { color:#003887; text-decoration: underline}

.node__content a:hover { color:var(--main3-color); text-decoration: none}

.block-views-blockslideshow-block-1{ position: relative;} 

h1, h2, h3 { font-weight: 600; margin: 0;}
h4, h5, h6 { font-weight: 400; margin: 0;}

h1{ font-size:42px; line-height:50px; margin-bottom:20px; color:var(--main-color); text-transform:uppercase; }
h2{ font-size:38px; line-height:42px;margin-bottom:20px; color:var(--main2-color); }

h3 , .boxing .title{ font-size:30px; line-height:36px; margin-bottom:15px;color:var(--main-color); padding:15px 0px ;  display: block; position: relative;text-transform: uppercase;  }
h3::before , .boxing .title::before  { content: ''; position: absolute;width: 100%;  height: 2px;  background: linear-gradient(90deg, rgba(237,50,66,1) 20%, rgba(231,233,238,1) 20%); bottom: 0;}

h4{ font-size:27px; margin:0px; color:var(--main2-color); line-height:38px; margin-bottom:10px}
h5{ font-size:27px; margin:0px; color:var(--main-color);  line-height:38px; margin-bottom:10px}

h6{ font-size: 20px;  margin: 0 20px 20px 0px;
  line-height: 33px;  background: #ed3242;  display: inline-block;
  border-radius: 50px; position: relative;box-shadow: -4px -3px 0px 0px #003888;}
h6 a { color: #fff !important;text-decoration:none !important;   padding: 8px 20px;
  display: block; box-shadow:none !important}
h6::before {content: '';width: 90%;  height: 50%;  position: absolute;  border-top: 1px solid #003888;  border-top-left-radius: 50px;  top: -8px;  left: -8px;  z-index: -1;  border-left: 1px solid #003888;}
h6::after { content: '';width: 80%;  height: 50%;  position: absolute;  border-bottom: 1px solid #fff;
  border-bottom-right-radius: 50px;  bottom: 6px;  right: 5px;
  z-index: 1;  border-right: 1px solid #fff;pointer-events: none;}
h6 a:hover{box-shadow: none !important; }
h6:hover {box-shadow: none;}
h6:hover::before {top: -4px;  left: -4px;}


#full_area { margin:0 auto; width:85%}

.menu_arrow ul::before {  
background-color: white; /* Desired color */
-webkit-mask: url(../images/triangle-up.svg) no-repeat center;
mask: url(../images/triangle-up.svg) no-repeat center;
mask-size: cover;
background-size: cover;
content: "";
position: absolute;
pointer-events: none;
width: 50px;
height: 15px;
top: -7px;
z-index: 111;
 left: 50%; transform: translate(-50%, -50%);}
 
.menu_arrow ul li ul::before { display:none }  

p{ margin:0px; padding:0px}
.blocktitle  { text-align: left; font-size: 40px;
margin-bottom: 30px; color:var(--main2-color); line-height:2em; text-transform: uppercase; font-weight: 400;}
.block__title {}

.region--secondary-menu , .region--secondary-menu{ margin:0;}
.menu--sidebar  .is-active , #block-olivero-main-menu   .is-active{ font-weight:600;color:var(--main-color) !important}
#header { position: absolute;width: 100%;  z-index: 2;background: linear-gradient(0deg, rgba(13,52,108,0) 0%, rgba(13,52,108,0.7971521372220763) 40%, rgba(13,52,108,1) 100%);
  min-height: 170px;}
#header_top{position: absolute;  right: 0;  float: right;  margin: 0;  padding: 0;  top: 0;}

#header .screen { display: flex;padding: 0;align-items: center;}
#header .logo { margin-left:0}

.sticky { z-index:10; -webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; opacity: 1; }
.sticky #header{ position:fixed; top:0px; z-index:10; width:100%;  box-shadow:  0 0 3px rgba(0,0,0,.2) ;  min-height: auto;  background:#003888;   } 

.sticky  .region--secondary-menu { top: -50px; }

.site-branding__logo img ,.sticky .right_top , .top_area ul li a , a {-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; opacity: 1; }

.sticky .site-branding__logo img { max-height:75px }
.sticky .right_top { margin-top:0;}

.region--secondary-menu{ position:absolute; right:0; top:0; z-index:11; -webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; opacity: 1; }

.site-branding { margin-left:0;padding: 0; width:30%}
.right_top{display: inline-flex;
margin-right: 0;
margin-left: 2%;
margin-top: 30px;
width: 68%;}

#lang { margin: 10px 0; padding: 0; float: right }
#lang ul { list-style: none; display:  flex;  margin: 0; padding: 0;}
#lang ul li { margin: auto 5px;} 
#lang ul li a{ background: #ddd; color: #000; padding: 5px 10px; border-radius: 12px; font-size: .9em; }
#lang ul li a:hover{ background: var(--main2-color); color: #fff; }
#lang ul li a.is-active{ background: var(--main-color); color: #fff; }

.top_area { float: left;padding: 5px 0; }
.top_area ul { list-style: none ; margin: 0; padding: 0}
.top_area ul li { float: left; margin-right: 20px;position: relative;}

.top_area ul li  a { padding:8px 5px 8px 40px; color: #fff; display: block;}

.top_area ul li span {width: 30px;  height: 30px;  position: absolute; left: 5px;
  top: 0;
  bottom: 0;
  margin: auto;background-size: contain !important;}

#t_135 span{ background: url(../images/135_Anniversity.png) no-repeat;}
#t_facebook span{ background: url(../images/facebook.png) no-repeat; }
#t_ig span{ background: url(../images/instagram.png) no-repeat; }
#t_eclass span{ background: url(../images/eclass.png) no-repeat; }

.top_area ul li  a:hover{background: #e02838; border-radius: 50px}

.region--secondary-menu {display: flex;  align-items: center;  justify-content: center;}




.language-link { display:block; position: relative; }
#lang ul li a {  background: none;	padding: 5px 5px 5px 45px;color: #fff; border-radius: 50px}
#lang ul li a:hover {background: #094bb1;}
.is-active { display: none ;}
.language-link::before { content: ''; position: absolute; background: url(../images/language.png) no-repeat;width: 30px;
  height: 30px;  left: 5px;top: 0;
  bottom: 0;
  margin: auto;background-size: contain !important;
}

#page-wrapper{ position:relative; }
#page img{ max-width:100% }

.home_zoneA{ position: relative}
.home_zoneB{ background:#f3f4f6;display: flow-root;clip-path: polygon(0 10%, 100% 0%, 100% 90%, 0% 100%);
  padding: 70px 0;}
.home_zoneC{ position: relative;background: linear-gradient(to bottom,#fff 50% , #f3f4f6);}
/*.home_zoneC::after{ content: '';  background:url(../images/history_blue.png) no-repeat left bottom;  position: absolute;
  width: 50%;  height: 100%;  top: 0;  right: 0;}
.home_zoneC::before{ content: '';background: url(../images/history_red.png) no-repeat right bottom;position: absolute;
  width: 50%;  height: 100%;  top: 0;  left: 0;}*/


.home_zoneD{ background: #f3f4f6;padding: 30px 0;clear: both;}

.view-more , .view-more2{ margin: 0 auto; padding: 50px 0 0 0; text-align:  center;}


.more-link { position: relative; }
.more-link a{ font-size: 1.1em; line-height: 1.2em; padding: 10px 20px; }


.view-more a { color: #132b58;font-size: 20px; line-height:32px; padding:5px 60px 5px 15px;  text-transform: uppercase; background: url(../images/more.png) no-repeat; background-position: 95% 50%;  }

.view-more a:hover { padding:5px 55px 5px 15px; background-position: 75% 50%; color:#d10212;  }



.view-more2 a {
  position: relative; display: inline-block; padding: 10px 35px;
}

.view-more2 a::before, .view-more2 a::after {
  content: ''; 
  position: absolute; 
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-style: solid; border-radius: 8px;
  border-color: var(--main3-color); 
  transition: transform 0.3s ease;
}

.view-more2 a::before {
  border-width: 2px 0 2px 0;
  transform: scaleX(0);
}

.view-more2 a::after {
  border-width: 0 2px 0 2px;
  transform: scaleY(0);
}

.view-more2 a:hover::before, .view-more2 a:hover::after {
  transform: scale(1, 1);
}


.shortcut-wrapper{ display: flex}
.news_tag { position: absolute; left: -5px; top: -5px; background-image: url(../images/icon/i_news.png); width: 90px; height: 44px; background-size: cover; z-index: 1; pointer-events: none;  }
.news_tag2 { position: absolute; left: 0; top: 0; background-image: url(../images/icon/i_news2.png); width: 90px; height: 28px; background-size: cover; z-index: 1; pointer-events: none;  }

#logo {  margin: 0 0 0 20px;}

.node__content{ clear:both; padding: 50px 0}
.node__content time{ display: block !important; margin-bottom:10px;}


#banner_title::before{background:url(../images/inner_top.png) no-repeat center bottom; content:""; height: 87px; width: 100%; background-size: auto 100%; pointer-events: none;
position: absolute; bottom: 0; z-index: 1;}

#banner_title, .banner_title , #nonbanner_title { background-image: url(../images/inner_banner.jpg); background-repeat: no-repeat; background-position: top center; background-size: cover ; position:relative; point-events:none;
clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%);}
#banner_title h1, .banner_title h1, #nonbanner_title h1{ color:#fff;  text-shadow:  0px 1px 3px rgba(0, 0, 0, 0.4); padding:420px 0 90px 5% ; margin:0; z-index:1 ; position: relative; display:block } 
#nonbanner_title h1{ padding:220px 0 60px 5% ; } 
#banner_title::after,   .banner_title::after , #nonbanner_title::after{ pointer-events: none;  content:"";background: url(../images/sub_title.png) no-repeat right top; position: absolute;
bottom: 0;
left: 0;
width: 40%;
height: 70%;
z-index: 0;
background-size: cover;}




#block_latest-news{ padding:50px 0;display: flow-root;width: 90%;
  margin: auto; position: relative;z-index: 2;}
#block_latest-awards{ padding:3em 0  ; border-top: 1px solid #c7ced3 }
#block_latest-activity{ padding:3em 0 }


.video_theme{ max-width:80%; margin:50px auto ;}

.slider-slogan{ position: absolute; bottom: 0; }
.slider-slogan .slogan_text{   color: #fff;position: relative;
  width: 630px; background: url(../images/slogan.png) no-repeat top right;
  background-size: cover; padding:30px 0;}

.slider-slogan .slogan_text p { z-index: 1;
  position: relative;
  font-size: 2em;
  padding: 2em 1em 1em 1em;
  line-height: 2em;}

.container2 ul {
    display: flex;
    flex-wrap: wrap; /* 允许换行 */
    justify-content: center; /* 水平居中 */
    padding: 0;
    margin: 0 auto;
    list-style: none;
}

	  
	  
.Xslogan_cover {background: url(../images/right_triangle.png) no-repeat top left;
  position: absolute;
  width: 20%;  height: 100%;  right: 0;  top: 0;background-size: cover;}	  

.homebanner { bottom:20px; top:auto;} 	  

.slogan_left{ left:0;}
.slogan_right{ right:0;}
.view-empty{ clear:both}

footer{background: #fff;  color: #000; padding: 3em 0 }
footer .text-content, footer a{ color: #000; font-size: 0.8rem;} 
 
footer .power { float:right;  }
footer .copyright { float:left}
footer .copyright a , footer .power a { color:#000; text-decoration: underline}

#main_content{ float:right; width:75%; min-height: 500px; }
#sidebar-nav{float:left; width:22%; margin-top:90px }


.useful-links ul{
  display: grid; list-style:none; padding:0; margin:0;
  grid-template-columns: repeat(3, 1fr); column-gap:
  gap: 10px;
} 

.useful-links ul li{ 
  width:calc(100% - 10px) ; position:relative;  box-shadow: none;
}


#ctd-fliters .form--inline .form-actions { margin:auto }

#ctd-fliters {
 text-align:  right; float:right; margin: 30px 0 30px 0
}

.contextual-region .view-header{
margin-block-end: var(--sp1) !important;
}


/* Table */
#content table{border-collapse: collapse; width:100%;  line-height:33px;margin-top: 30px;  }
#content tr:nth-child(even) td { background:#eee; color:#003888; padding:10px; border-bottom: 1px solid #003888;}
#content tr:nth-child(odd) td { background:#eee; color:#003888; padding:10px;border-bottom: 1px solid #003888; }
#content table ul, table ol{ margin:0; }
#content tr th { background:var(--main-color); color:#fff; padding:5px; }
.red_left_tt{ background: #f2f2f2 !important; color:var(--main2-color)!important}
.red_left_tt2{ background: #fff !important; color:var(--main2-color)!important}

.location {
  width: 100%;
  margin: 20px 0;
  box-shadow: 0 0 3px rgba(0,0,0,.2);
}
iframe{ width:100%; min-height: 350px;}

/* Template */
.tpl-info time, .block-info time, .node__content time{ position: relative; display: inline-block; padding: 0px 0 0px 30px ;color: #333;}
.news-card time::before{  background-color: #fff !important}

.index_block { background: none}
.index_block b { display: block}
#page time::before{ content: ""; position: absolute; left: 0; top: -3px; 	
background: url(../images/date.png) no-repeat;	background-size: cover; width: 19px; height: 19px;bottom: 0;
  margin: auto; }

	
.block-info{ list-style: none; margin: 0; padding: 0 ; background:  none}
.block-info li{position: relative;}


.tpl-info{ list-style: none; margin: 0; padding: 0;}
.tpl-info li{position: relative;  }
.tpl-info li:hover{ }
.tpl-info li a{ color: #333; display: block; width: 100%}
.tpl-info li a:hover{ color: #333;}
.tpl-info li b, .block-info li b{ display: block ;  font-weight:600  }

.templatenewsD b { font-size:23px; line-height:34px; margin-bottom:5px;}
.templatenewsD img, .templatenewsD ul li{-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; opacity: 1; }
.templatenewsD ul li a::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 2px;
  background: #0d234d;
  bottom: -2px;
  left: 0;transform: scaleX(0.1);
  transform-origin: bottom left;;
  transition: transform 0.45s ease-out;
}
.templatenewsD ul li a:hover::before {   transform: scaleX(1); transform-origin: bottom left;}
.templatenewsD ul li a:hover img{ opacity:.7}
.templatenewsD ul li:hover { background:#f6f8f8;}


.tpl-info figure img , .block-info figure img {
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
	opacity:1;
}
.tpl-info  figure:hover img ,.block-info  figure:hover img {
	-webkit-transform: scale(1.2);
	transform: scale(1.2);
	opacity:.8;
}
.tpl-info figure  ,.block-info figure {
	width: auto;
	height: auto;
	margin: 0;
	padding: 0;
	background: #fff;
	overflow: hidden;
}



.template-A2 ul{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
} 

.template-A2 ul li{ 
  width:calc(100% - 30px) ; 
  padding:15px;display: flex;
  align-items: center;
	text-align: center;position: relative;
}

.template-A ul{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
} 

.template-A ul li{ 
  width:calc(100% - 30px) ; 
  padding:15px;display: flex;
  align-items: center;
	text-align: center;position: relative;
}

.template-B ul{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
} 

.template-B ul li{ 
  width:calc(100% - 30px) ; 
  padding:15px;display: flex;
  align-items: center;
	text-align: center;
}

.template-C ul{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
} 

.template-C ul li{ 
  width:calc(100% - 30px) ; 
  padding:15px;display: flex;
  align-items: center;
	text-align: center;
}


.Block_A ul{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2.5%;
} 
.Block_A ul li{ position:relative; width: 100%;}

.Block_B ul{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2.5%;
} 
.Block_B ul li{ position:relative; width: 100%; background: #fff;}

.news-card {
  border: 0px solid aqua;
  margin: 1px;
  position: relative;
  overflow: hidden;
  border-radius: 0.5rem;
  flex: 1;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
}
.news-card::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(0, 0, 0, 0) linear-gradient(to bottom, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0.7) 80%);;
      z-index: 0;
    }
.news-card__image img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    transition: transform 1s ease;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    position: relative;
    z-index: -1;
  }

.news-card__text-wrapper {
    position: absolute;
    bottom: 0rem;
    padding: 5px 10px 15px 10px; width:calc(100%);
color: #fff;
  transition: background-color 1.5s ease;
  background: #ed3242db;
  }
.news-card__title {
    transition: color 1s ease;
    margin-bottom: .5rem;
  }
.news-card__details-wrapper {
    max-height: 0;
    opacity: 0;
    transition: max-height 1.5s ease, opacity 1s ease;
  }


.news-card__text-wrapper time{position: relative;padding: 0 0 0 25px;}
.news-card__text-wrapper b {  float: left;clear: both;font-size: 1.2em;text-align: left;}
.news-card__details-wrapper  {  float: left;clear: both;}

.time {float: left;  padding: 0 0 0 20px;}
.start_date {float: left;position: relative;margin: 0 10px 0 0px;}
.end_date  {float: left;position: relative}
.end_date  time {margin:0 0px 0 10px;}
.end_date  time::before { display: none}


.end_date  time {padding:0}
  
  @media (min-width: 900px) {
    .news-card:hover .news-card__details-wrapper {
      max-height: 20rem;
      opacity: 1;
    }
    .news-card:hover .news-card__text-wrapper {
      background-color: #ed3242db;
    }
    .news-card:hover .news-card__title {
      color: yellow;
    }

  }


.articles{ padding:1em;}
.articles:hover:before {
  width: 100%;
}
.articles::before {
  content: "";
  position: absolute;
  bottom: 0px;
  height: 2px;
  width: 0%;
  background: var(--main-color);
  right: 0px;
  transition: width 0.4s; 
}



/* End Template */

/* Category */
.category {
float: left;
 background:#ebeff2;
padding: 8px 10px;
border-radius: 8px;
margin:50px 0 0px 0; z-index: 1;
position: relative;}

.category ul {  list-style: none; margin:0; padding:0}
.category ul li {  display: inline-block;}
.category ul li a {
  display: block;
  padding: 5px 20px; font-size:1.3em;
  text-decoration: none;
  color: #333333;
  font-weight: 400;
  margin: 0 10px;
}
.category ul li+li  { border-left:1px dotted #666;}
	
.category ul li a,
.category ul li a:after,
.category ul li a:before {  transition: all .5s;}
.category ul li a:hover {  color: var(--main-color);}



/* stroke */
.category.stroke ul li a,
.category.fill ul li a {  position: relative;}
.category.stroke ul li a:after,
.category.fill ul li a:after {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 0%;
  content: '.';
  color: transparent;
  background: var(--main-color);;
  height: 2px;
}
.category.stroke ul li a:hover:after {
  width: 100%;
}

.category.fill ul li a {  transition: all 2s;}
.category.fill ul li a:after {
  text-align: left;
  content: '.';
  margin: 0;
  opacity: 0;
}
.category.fill ul li a:hover {
  color: #fff;
  z-index: 1;
}
.category.fill ul li a:hover:after {
  z-index: -10;
  animation: fill 1s forwards;
  -webkit-animation: fill 1s forwards;
  -moz-animation: fill 1s forwards;
  opacity: 1;
}

/* SHIFT */
.category.shift ul li a {
  position:relative;
  z-index: 1;
}
.category.shift ul li a:hover {
  color: #91640F;
}
.category.shift ul li a:after {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  margin: auto;
  width: 100%;
  height: 1px;
  content: '.';
  color: transparent;
  background: var(--main-color);
  visibility: none;
  opacity: 0;
  z-index: -1;
}
.category.shift ul li a:hover:after {
  opacity: 1;
  visibility: visible;
  height: 100%;
}


.category .current a , .category .current a:hover {
  color: #fff; 
  background: var(--main-color);
}


/* Keyframes */
@-webkit-keyframes fill {
  0% {
    width: 0%;
    height: 1px;
  }
  50% {
    width: 100%;
    height: 1px;
  }
  100% {
    width: 100%;
    height: 100%;
    background: var(--main-color);;
  }
}

/* Keyframes */
@-webkit-keyframes circle {
  0% {
    width: 1px;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    height: 1px;
    z-index: -1;
    background: var(--main-color);;
    border-radius: 100%;
  }
  100% {
    background: var(--main-color);;
    height: 1000%;
    width: 1000%;
    z-index: -1;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    border-radius: 0;
  }
}
/* End Category */

.sitemap-item {  margin: 0px auto;  padding: 0 20px;}

.sitemap-item ul {
display: grid;
grid-template-columns: repeat(5, 1fr);
gap: 15px;
list-style-type: none;    padding: 0;    margin: 0;
}
.sitemap-item ul ul{grid-template-columns: repeat(1, 1fr); gap: 5px; margin:10px; padding:0 25px; list-style-type: initial;  }
.sitemap-item ul li { width:100%; margin:0 ; padding:0 }

.sitemap-item ul li a, .sitemap-item ul li span { font-size:1.3em; font-weight:400 ; 
    padding: 10px 15px ; display:block;
    border-bottom: 1px solid #ddd;
    transition: background 0.3s ease; background:#fff; }

.sitemap-item ul li a {  color: var(--main-color);}
.sitemap-item ul li span{     color: #555; }

.sitemap-item ul li a:hover {
    background: var(--main2-color) ; color:#fff; 
}

.sitemap-item ul li ul li a , .sitemap-item ul li ul li span {
	padding: 5px 0 5px 0px ; display:block; border-bottom:0; font-size:1em; font-weight:300
}
.sitemap-item ul li ul li a:hover { background:none; color:var(--main2-color) }

.sidebar-nav ul {
    padding: 0;
    margin: 0;
    list-style: none;
}

.sidebar-nav ul li ul {
    padding: 	15px 15px 30px 15px; background:#f6f8f8; 
}

.sidebar-nav .metismenu {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.sidebar-nav .metismenu a.current { color:var(--main-color);  }

.sidebar-nav .metismenu li + li {
  margin-top: 5px;
}
.sidebar-nav .metismenu li:first-child {
  margin-top: 5px;
}
.sidebar-nav .metismenu li:last-child {
  margin-bottom: 5px;
}
.sidebar-nav .metismenu > li {
    /*-webkit-box-flex: 1;
    -ms-flex: 1 1 0%;
    flex: 1 1 0%;*/
	width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    position: relative;
}
.sidebar-nav .metismenu a {
    position: relative;
    display: block;
    padding: 15px 35px 15px 15px;
	font-size:20.5px; line-height:30px; font-weight:600;
	border-bottom: 2px solid #e7e9ee; position: relative
    color: #0d234d;
    outline-width: 0;
    transition: all .3s ease-out;
}

.sidebar-nav .metismenu ul a {
    padding: 12px 15px 12px 15px; position:relative;
	font-size:19px; line-height:23px; font-weight:400;
}
.sidebar-nav .metismenu ul li a::before {
  content: '';
  position: absolute;
  width: 100%;
  height: 2px;
  background: #ed3141;
  bottom: -2px;
  left: 0;transform: scaleX(0.1);
  transform-origin: bottom left;;
  transition: transform 0.45s ease-out;
}
.sidebar-nav .metismenu ul li a:hover::before {   transform: scaleX(1); transform-origin: bottom left;}

.sidebar-nav .metismenu ul a:hove ,
.sidebar-nav .metismenu ul a:focus ,
.sidebar-nav .metismenu ul a:active
{ color:#ed3141 !important;  }

.sidebar-nav .metismenu ul ul a {
    padding: 5px 35px 5px 45px;
}
.sidebar-nav .mm-active { color: var(--main-color);  !important; }
.sidebar-nav .metismenu a:hover,
.sidebar-nav .metismenu a:focus,
.sidebar-nav .metismenu a:active,
.sidebar-nav .metismenu .mm-active > a {
    color:#ed3141; 
    text-decoration: none;
}




.subjectlists {
	position: relative;
	margin: 0 auto;
	padding: 0 !important;
	max-width: 1000px;
	list-style: none;
	text-align: center;
}

.subjectlists figure figcaption {
	padding: 2em;
	color: #fff;
	text-transform: uppercase;
	font-size: 1.25em;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
.subjectlists figure figcaption::before,
.subjectlists figure figcaption::after {
	pointer-events: none;
}
.subjectlists figure figcaption,
.subjectlists figure figcaption > a {
	position: absolute; background:#0c335b38;
	top: 0;	left: 0; width: 100%; height: 100%;
}
/* Anchor will cover the whole item by default */
/* For some effects it will show as a button */
.subjectlists figure figcaption > a {
	z-index: 1;
	text-indent: 200%;
	white-space: nowrap;
	font-size: 0;
	opacity: 0;
}


.subjectlists figure h2,
.subjectlists figure p {
	margin: 0;
}
.subjectlists figure p {
	letter-spacing: 1px;
	font-size: 68.5%;
}
figure.effect-honey {
	background: #4a3753; min-height: 180px;
}
figure.effect-honey img {
	opacity: 0.9; max-width:125%:
	-webkit-transition: opacity 0.35s;
	transition: opacity 0.35s;	
	transition: all 0.3s ease-in-out; opacity: 1;
}

figure.effect-honey:hover img {
	opacity: 0.5;
}
figure.effect-honey figcaption::before {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 10px;
	background: var(--main2-color);
	content: '';
	-webkit-transform: translate3d(0,10px,0);
	transform: translate3d(0,10px,0);
}
figure.effect-honey h2 {
	position: absolute; font-style: normal;
	bottom: 0;
	left: 0;
	padding: 0.5em 1.5em; color: #fff; text-shadow: 0 0 8px #000000a1;
	width: 100%;
	text-align: left;
	-webkit-transform: translate3d(0,-30px,0);
	transform: translate3d(0,-30px,0);
}
 

figure.effect-honey figcaption::before,
figure.effect-honey h2 {
	-webkit-transition: -webkit-transform 0.35s;
	transition: transform 0.35s;
}

figure.effect-honey:hover figcaption::before,
figure.effect-honey:hover h2,
figure.effect-honey:hover h2 i {
	opacity: 1; 
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
}

#block-sidebar-nav { background: var(--main4-color); }
#block-sidebar-nav h2{ padding: 30px 0;
  background: var(--main-color); 
  color: #fff; margin:0;
  text-align: center;}
#block-sidebar-nav ul { list-style:  none; margin: 0; padding: 15px; }
#block-sidebar-nav ul li{ float: none; border-bottom: 1px solid #ddd; position:  relative}
#block-sidebar-nav ul li a{ padding:15px; display:  block; }
	
.subjectlist ul{ list-style:  none; margin: 0; padding: 15px; }
.subjectlist ul li{ float: none;  border-bottom: 1px solid var(--main3-color); position:  relative}
.subjectlist ul li a{ padding:15px 15px 15px 30px; display:  block; font-size: 21px; line-height: 27px;  }

.subjectlist ul li a::before {
  content: "\2022";
  font-family: Arial;
  position: absolute;
  color: var(--main2-color);
  left: 0;
  top: 19px;
  font-size: 50px;
  font-weight: 400;
}


.swiper-slide {clip-path: polygon(0 0, 100% 0, 100% 90%, 0% 100%);}






/*new*/
#latest-news { clear: both}
#block_latest-news .blocktitle{float: left; position: relative}
#block_latest-news .blocktitle::after { content: ''; position: absolute; float: right;background: url(../images/triangle_blue.png) no-repeat;width: 45px;  height: 56px;  bottom: 20px;  right: -60px;background-size: contain;	-webkit-animation: scale-down-center 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s reverse both; animation: scale-down-center 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) 0.5s reverse both;}
#latest-news ul {display: block;  }


.one-time .box::after {   transition: background 0.5s ease;
    background-size: 200% 100%;background-position: 80% 0; 
    background-image: linear-gradient(to right, #ed3242 50%, #e7e9ee 50%); content:""; height:2px; width:100%; position:absolute; bottom:0; left:0; }
	
	
.one-time .box:hover::after {background-position: 0% 0; }
	
.one-time  .box:first-child {width: calc(48% - 40px);  float: left;  margin-right: 40px;}

.one-time  .box:first-child .news { width:100% ; margin-top:20px; margin-bottom:10px; }

.one-time  .box{-webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; opacity: 1; }


.one-time  .box:hover img { opacity:.7 }
.one-time  .box:hover  { background:#f2f0e6}

.one-time  .box{padding: 10px;  margin-bottom: 15px; position: relative;background: rgba(100%,100%,100%,.5); margin-right: 0;  width: calc(50%);float: left;	}
.one-time  .box a {display: flow-root;}



.one-time  .box:first-child .cover  { width: 100%}
.one-time  .box .cover { float: left;  width:40%}
#latest-news .cover img { width: 100%}
.one-time  .box  .news-card__text-wrapper { float: left;  width: 60%;position: relative;
  padding: 5px 10px 0px 10px;}

#latest-news  .title  { font-size: 23px; padding: 10px 0;}

.Album img{ margin: 0 auto}


#block_latest-news::before , .video_area::before   { content: '';  position: absolute;  background: url(../images/triangle_point.png) no-repeat;
  top: 0;  right: -90px;  width: 80px;  height: 120px;	-webkit-animation: scale-down-center 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s reverse both;
	        animation: scale-down-center 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) 1s reverse both;}


#latest-news ul li + li .arrow {background: url(../images/more.png) no-repeat;position: absolute;
  width: 28px;
  height: 10px;
  right: 0;bottom: 0;}
.highlight { background: #ed3242;color: #fff;  float: left;  padding: 5px 20px; }
.view-more, .view-more2 {position: absolute;  top: 0;  right: 0;}

.home_zoneA::after { content: '';  position: absolute;  background: url(../images/triangle_red.png) no-repeat;
  top:50px;  right: 0;  width: 299px;  height: 345px; pointer-events:none;
	-webkit-animation: scale-down-center 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
	        animation: scale-down-center 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
}

.video_area::before   { top: 50px}

.video_area::after { content: '';  position: absolute;  background: url(../images/triangle_red.png) no-repeat;
  top:0px;  right: 0;  width: 150px;  height: 260px; pointer-events:none;
	-webkit-animation: scale-down-center 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
	        animation: scale-down-center 1s cubic-bezier(0.250, 0.460, 0.450, 0.940) reverse both;
	z-index: -1;
}


#block_index_button  {  width: 80%; margin: auto}
#block_index_button .index_block { }
#block_index_button .index_block ul { list-style: none; margin: 0; padding: 0}
#block_index_button .index_block ul li { float: left; width: 23%;
  margin: 0 1%;}
#block_index_button  .cover img{ width: 100%;	}

#block_index_button  img {-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;}
	
#block_index_button  a:hover img{-webkit-transform: scale(1.0);
  transform: scale(1.0);
	opacity: 1;}


 #block_index_button .index_block li {
    opacity: 0;
            transform: translateY(100%);
      transition: transform 0.5s, opacity 0.5s;
        }
    #block_index_button    .index_block li.visible {
                      opacity: 1;
            transform: translateY(0);
        }


.clip_path{position: relative;    display: inline-block;    clip-path:polygon(0 10%, 100% 0%, 100% 90%, 0% 100%); widows: 100%
}

.clip_path:hover {  clip-path: polygon(0 10%, 100% 0%, 100% 90%, 0% 100%)}

#block_index_button .info { position: absolute;bottom: 0;  width: 100%;  padding: 0 0 70px 0;  text-align: center;  -webkit-transition: all 0.3s ease-in-out;-moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; -ms-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out; opacity: 1; }

#block_index_button .title {    word-wrap: break-word;  overflow-wrap: break-word;  white-space: normal;
  font-size: 23.5px;  color: #fff;padding: 0 10px;}
  
#block_index_button .index_block li:hover .info { padding:180px 0 90px 0; }
	  
#block_index_button .icon img{ margin: auto}

#block_index_button .index_block ul li:nth-child(odd) .info  { background: linear-gradient(#01439c00, #01439c);}
#block_index_button .index_block ul li:nth-child(even) .info  { background: linear-gradient(#eb324200, #eb3242);}



.region--content-below {display: flex;  align-items: center;  justify-content: center; padding: 0 }
.sch_info ul { list-style: none; margin: 0; padding: 0;display: flex;  align-items: center;  justify-content: center; 
            justify-content: space-between;}
.sch_info ul li { float: left; position: relative;margin-right: 10px; flex:1}
.sch_info ul li +li {padding: 0 0 0 35px;}

.sch_info ul li span{width: 26px;  height: 26px;  position: absolute;  background-size: contain !important;  top: 0;  bottom: 0;  margin: auto;  left: 0;}

.sch_info ul li p { float: left; color: #c1001d;padding: 0 10px 0 0px;}

#i_map span {background: url(../images/i_map.png) no-repeat;}
#i_tel span {background: url(../images/i_tel.png) no-repeat;}
#i_fax span {background: url(../images/i_fax.png) no-repeat;}

.view-id-usefullinks { float: right}
#block-olivero-views-block-usefullinks-block-1 {float: right;  width: auto;  flex-grow: 0;}





.history_red { background: url(../images/history_red.png) no-repeat; }

.history_blue { background: url(../images/history_blue.png) no-repeat; }

.history_timeline {clear: both;  position: relative;padding:210px 0 243px 0;  overflow: hidden; margin: -80px 0 0 0 
}

.home_zoneC .block__title {  color: var(--main-color);	padding: 40px 0 80px 0;width: 50%; text-align: center;
  margin: auto; }

.history_timeline .more  { float: left;margin-top: 30px;}
.history_timeline .more a {background: url(../images/more_bg.png) no-repeat; padding: 5px 15px;
  font-size: 0.8em;color: #fff;}




.history_timeline::after{ content: '';  background:url(../images/history_blue.png) no-repeat left top;  position: absolute;
  width: 50%;  height: 100%;  top: 0;
  right: 0;
  background-size: cover;
  margin: -70px 0 0 0;   }

.history_timeline::before{ content: '';background: url(../images/history_red.png) no-repeat right top;position: absolute;
  width: 50%;  height: 100%;  top: 0px;
  left: 1px;
  background-size: cover;
  margin: -70px 0 0 0;  	}


/*timeline*/ 
.history_timeline::before,
  .history_timeline::after {

    transition: transform 1s ease, opacity 1s ease;
  }
  .history_timeline::before {
    top: 70px;
    transform: translateY(-100%);
  }
  .history_timeline::after {
    bottom: 0;top: auto;
    transform: translateY(100%);
  }
  .timeline,
  .content_timeline {
    opacity: 0;
    transform: scale(0.5);
    transition: opacity 0.5s ease, transform 0.5s ease;
  }
  .history_timeline.active::before {
    transform: translateY(0);
    opacity: 1;
  }
  .history_timeline.active::after {
    transform: translateY(0);
    opacity: 1;
  }
  .history_timeline.active .timeline,
  .history_timeline.active .content_timeline {
    opacity: 1;
    transform: scale(1);
  }


/*timeline*/ 
.boxing  { padding: 0px;margin: 35px 0;}

#blue_box { background: var(--main-color);; color: #FFF;}
#blue_box .title { color: #fff}

#red_box { background: var(--main2-color);}
#red_box .title { color: #fff}








/*
.region--highlighted {top: -120px;
  position: relative;

  max-width: 1600px;
  padding: 0;}



*/


.publication-list img { width: auto; margin: auto}
.tabs-wrapper {  position: absolute;  right: 0; top: 0;z-index: 1;
  width:fit-content;
  margin: auto;
  left: 0;}

.anniversary_tel,.anniversary_address { position: relative;padding: 0 0 0 25px;  margin: 0;  text-align: left;}



.anniversary_tel {padding: 0 0 0 25px;}
.anniversary_tel img {position: absolute;  top: 0;  bottom: 0;  margin: auto;  left: 0;}
.anniversary_address img {position: absolute;  top: 0;  bottom: 0;  margin: auto;  left: 0;}





.cover img { width: 100%}
.cover figure {width: 100%;  margin: 0;}

.messages-list { margin: 0}


.stakeholders ul li:last-child .dropdown-content {float: right;
  right: 0;}

.dropdown-content {
  display: none;
  position: absolute; 
  background-color: #f9f9f9;
  min-width: 170px;
  box-shadow: 0px 4px 8px 0px rgba(0,0,0,0.2);
  padding: 0px 0px;
  z-index: 99; text-align: center
}
.dropdown-content ul li { float: none; width:100% ; border-bottom:1px solid #ddd;}
.dropdown-content ul li a{ padding:8px; background:#fff; color:#333; display:block ; text-align:left; font-size:15px; line-height:19px; }
.dropdown-content ul li a:hover {background: #e13040;
  color: #fff;
  border-radius: 0; }



.dropdown:hover .dropdown-content {
  display: block;
}


.news {float: left;  width: 60%;  padding: 0 0 0 20px;}
.news time::before{ content: ""; position: absolute; left: 0; top: -3px; 	
background: url(../images/date.png) no-repeat;	background-size: cover; width: 19px; height: 19px;bottom: 0;
  margin: auto; }

   .hidden_background {
            background: none !important;
        }


.contextual-region .view-header {margin-block-end:0 !important}

@-webkit-keyframes scale-down-center {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
}
@keyframes scale-down-center {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  100% {
    -webkit-transform: scale(0);
            transform: scale(0);
  }
}




@-webkit-keyframes slide-top {
  0% {
    -webkit-transform: translateY(-100px);
            transform: translateY(-100px);
  }
  100% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}
@keyframes slide-top {
  0% {
    -webkit-transform: translateY(-100px);
            transform: translateY(-100px);
  }
  100% {
    -webkit-transform: translateY(0px);
            transform: translateY(0px);
  }
}

.publication-list{ padding:50px 0;}

.cd-top {
  display: inline-block;  position: fixed;  opacity: 0; box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
  height: 50px;  width: 50px;  bottom: 50px;  right: 50px; z-index:10; border-radius:50%;
  overflow: hidden;  text-indent: 100%;  white-space: nowrap; border:1px solid #fff; box-shadow:0px 0px 5px #999;
  background: #e0ce91 url(../images/cd-top-arrow.svg) no-repeat center center;

}
.cd-top:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;-moz-transition: opacity .3s 0s, visibility 0s 0s;transition: opacity .3s 0s, visibility 0s 0s;
  background: #d6010d  url(../images/cd-top-arrow.svg) no-repeat center center;
}
.cd-top.cd-is-visible { visibility: visible; opacity: 1;}
.cd-top.cd-fade-out { opacity: .9;}
.no-touch .cd-top:hover { background-color: #40498a; opacity: 1;} 

/* Effect 2: 3D rolling links, idea from http://hakim.se/thoughts/rolling-links */
.cl-effect-2 ul { list-style:none ; margin:0  ;  padding:0}
.cl-effect-2 ul li { float: left; width:20%; margin:30px 2.5%}
.cl-effect-2 a {
	line-height: 44px; font-size:20.5px; 
	-webkit-perspective: 1000px; text-align: center;
	-moz-perspective: 1000px;
	perspective: 1000px; color:#fff; 
	display: block;
}

.cl-effect-2 a span {
	position: relative; 
	display: block;
	padding: 0 30px; color:#fff;
	background: #183864;
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transform-origin: 50% 0;
	-moz-transform-origin: 50% 0;
	transform-origin: 50% 0;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.cl-effect-2 a span::before {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	height: 100%;
	background: #d33334;
	content: attr(data-hover);
	-webkit-transition: background 0.3s;
	-moz-transition: background 0.3s;
	transition: background 0.3s;
	-webkit-transform: rotateX(-90deg);
	-moz-transform: rotateX(-90deg);
	transform: rotateX(-90deg);
	-webkit-transform-origin: 50% 0;
	-moz-transform-origin: 50% 0;
	transform-origin: 50% 0;
}

.cl-effect-2 a:hover span,
.cl-effect-2 a:focus span {
	-webkit-transform: rotateX(90deg) translateY(-22px);
	-moz-transform: rotateX(90deg) translateY(-22px);
	transform: rotateX(90deg) translateY(-22px);
}

.cl-effect-2 a:hover span::before,
.cl-effect-2 a:focus span::before {
	background: #d33334; color:#fff;	
}

.publication-list a { display: inline-flex !important }
.publication-list .content{
display: flex;
justify-content: center;
align-items: center;
}
.book_flips{ float: left; text-align: center; width:25%;  position:relative; z-index:0}
.book_flips span{ font-size:15px; display: inline-block; text-align: center; padding-top:15px;}
.book_flips .book a, .book_flips  .book{ margin:0px auto !important; } 
.book img { margin-left:-9px;}

.book{padding:15px 0 0;margin:auto}

.book,.contact-detail address,.contact-detail p{ }.book ul,.home-wrapper-alt,.video-btn i{vertical-align:middle}
.back-to-top i{color:#fff;font-size:22px;display:block;line-height:30px}
.book,.book img,.book::after,.book::before{border-top-right-radius:5px;border-bottom-right-radius:5px}
.book ul{display:table-cell}.list-inline{padding-left:0;list-style:none}
.list-inline>li{display:inline-block;margin-left:3em;padding-left:0!important}
.book,.book a{margin:0;padding:0;display:block}.list-inline>li:first-child{margin-left:0}
.book{height:auto !important;cursor:pointer;position:relative;background:#fff;z-index:1;box-shadow:0 2px 4px 0 rgba(0,0,0,.1),0 9px 20px 0 rgba(0,0,0,.25);-webkit-transition:box-shadow .3s linear;transition:box-shadow .3s linear}
.book::after,.book::before,.glow::after{content:'';position:absolute}
.book img{width:inherit;height:inherit;-webkit-transform-origin:0 50%;transform-origin:0 50%;-webkit-transform:rotateY(0);transform:rotateY(0);-webkit-transition:all .45s ease;transition:all .45s ease}
.book:hover{box-shadow:0 2px 4px 0 rgba(0,0,0,.25),0 9px 20px 0 rgba(0,0,0,.45)}.book:hover img{-webkit-transform:rotateY(-25deg);transform:rotateY(-25deg);box-shadow:1px 1px 5px 5px rgba(0,0,0,.2)}
.book::after,.book::before{display:block;width:inherit;height:inherit;z-index:-1;top:0;background:#fff;border:1px solid #d9d9d9}.book::before{left:-3px}.book::after{left:-6px}
.glow::after{background-image:-webkit-linear-gradient(right,transparent 4%,hsla(0,0%,100%,.4) 61%,hsla(0,0%,100%,.4) 85%,hsla(0,0%,74%,0) 96%);background-image:linear-gradient(-90deg,transparent 4%,hsla(0,0%,100%,.3) 61%,hsla(0,0%,100%,.5) 85%,hsla(0,0%,74%,0) 96%);bottom:0;height:100%;left:0;opacity:.77;pointer-events:none;-webkit-transition:opacity .15s;transition:opacity .15s;width:100%}

.publication-list img { width:240px;}
@media screen and (max-width: 1400px) {.publication-list img { width:150px;}}

@media screen and (max-width: 1024px) {.book_flips{  width:33%; }}
@media screen and (max-width: 820px) {.book_flips{  width:50%; }}
@media screen and (max-width: 420px) {.book_flips{  width:100%; }}

.templatenewsD{}
.templatenewsD ul { 
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 50px;
}
.templatenewsD ul li { 
    display: flex;
    justify-content: center;
    align-items: stretch;

}
.templatenewsD ul  li img{ 
clip-path: polygon(0 5%, 100% 0%, 100% 95%, 0% 100%);
}
.templatenewsD ul li .cover{ 
	flex: 1;
    display: flex; 
    justify-content: center; 
    align-items: center; position: relative;
}
.templatenewsD ul li .content{ 
	 padding: 15px;
    text-align: left; 
}
.cat_icon{ position:absolute; right:0; bottom:0; background:#ed3242; font-size:14px; color: #fff; padding:5px 10px; z-index:1 }


.suject {}
.suject ul { list-style: none;  margin: 0;  padding: 0;}
.suject ul ul  { width: 100%;position: relative; background: #01439c;  color: #fff;  border-radius: 16px;}
.suject ul li+li ul {border-top-right-radius: 0;}


.suject ul ul li{width: 90%;  float: right;  display: flex;}
.suject ul li{width: 100%;  float: left;  display: flex; font-weight: 500}
.suject ul li+li { margin-bottom: 20px}
.suject ul li + li ul li {margin-bottom: 0px;border-bottom: 1px solid #fff; padding: 5px 0}
.suject ul li + li ul li:last-child {border-bottom:none}
.suject #suject_main,.suject #suject ,.suject #p1,.suject #p2,.suject #p3,.suject #p4,.suject #p5, .suject #p6,#no_information{float: left;text-align: center; width: 14.29%;  margin: 0;  padding: 0;  display: flex;
  align-items: center;
  justify-content: center;}
.suject #suject_main {float: left;  width: 10%;position: absolute;  top: 50%;  left: 0;  transform: translate(0%, -52%);}
.suject ul ul  #p2,.suject ul ul  #p3, .suject ul ul  #p4, .suject ul ul  #p5, .suject ul ul  #p6 {border-left: 1px solid #ffffff29;}

#suject_title {width: 90%;  float: right; margin-bottom: 0}
#suject_title #p1 {background: #cd2c2f;  color: #fff;  border-top-left-radius: 16px;}
#suject_title #p2,#suject_title #p3,#suject_title #p4  ,#suject_title #p5 {background: #cd2c2f;  color: #fff;border-top-left-radius: 0px;}
#suject_title #p6 {border-top-right-radius: 16px;background: #cd2c2f;  color: #fff;}


.content_box { display: inline-block;  margin: 0 20px 0 0px;   }



.red {}
#red {background: #ea3034;}

.orange  #p1 ,.orange  #p2,.orange  #p3,.orange  #p4,.orange  #p5,.orange  #p6{background: #ee7000 !important;}
#orange {background: #ff9537;}

.yellow   #p1 ,.yellow   #p2,.yellow   #p3,.yellow   #p4,.yellow   #p5,.yellow   #p6{background: #f4b700 !important;}
#yellow {background: #f7c221;}


.green  #p1 ,.green  #p2,.green  #p3,.green  #p4,.green  #p5,.green  #p6{background: #a0bd16 !important;}
#green {background: #b8d13f;}


.blue  #p1 ,.blue  #p2,.blue  #p3,.blue  #p4,.blue  #p5,.blue  #p6{background: #01439c !important;}
#blue {background: #145fc4;}


.light_blue  #p1 ,.light_blue  #p2,.light_blue  #p3,.light_blue  #p4,.light_blue  #p5,.light_blue  #p6{background: #179ff0 !important;}
#light_blue {background: #50b9f7;}

.purple   #p1 ,.purple   #p2,.purple   #p3,.purple   #p4,.purple   #p5,.purple   #p6{background: #a42ca8 !important;}
#purple  {background: #b658ba;}